Trello Board Mystic by skykristal

/* ==UserStyle==
@name         Trello Dark Mode
@version      20220618.11.52
@namespace    userstyles.world/user/skykristal
@description  A dark theme for the trello board!
@author       skykristal
@license      No License
==/UserStyle== */

@-moz-document url-prefix("https://trello.com/b/"), url-prefix("https://trello.com/c/") {
@import url('https://fonts.googleapis.com/css?family=Kalam:wght@300&display=swap');

/* Remove this if you wanna set your own background via trello settings as usual*/
#trello-root, edg edg-102 windows body-custom-board-background body-dark-board-background body-board-view{
    background-image:url(https://i.ibb.co/4NR3ZgW/ep-naturalblack.png)!important;
    background-size:200px;
}
/*-----*/

.checklist-progress-bar {
    background: rgb(49 55 64 / 62%);
}

.css-180f5r3, textarea.mod-card-back-title.is-editing, textarea.mod-card-back-title:focus, textarea:focus , .comment-frame{
    background-color: #292929!important;
    box-shadow:none;
   
}

.editable .description-content .description-edit .description:focus, .editable .description-content .description-edit .description, .comment-box-input, input{
       background-color: #292929!important;
    box-shadow:none!important;
    color:white;
}

.list{
    background-color:rgba(0,0,0,0.8);
    box-shadow:0 0 4px black;
    border-radius:20px;
}

.attachment-image-preview{
    border:none;
}

.vhkqoV2Gu547hB{
    min-height:0px;
}

.tabbed-pane-header, .tabbed-pane-main-col, .tabbed-pane-nav, .boards-page-layout-topbar {
    background-color: transparent;
    border:0px;
}

button, a, .card-detail-window, .window-overlay > .window, .list-card-operation{
    border-radius:20px!important;
}

.board-menu-tab-content{
    background:rgba(0, 0, 0, .81);
}

.board-menu, ._3zctNirPs14qIa, ._3dxyC2YsNcjdjw{
    background:transparent;
}

body, button, textarea, select{
    color:white;
    font-family: 'Kalam', cursive;
}

body{
    font-family: 'Kalam', cursive;
}

.board-header-btn:not(.no-edit):not(.board-header-filter-btn-active), .ZOUktZwsING7-0{
    background:rgba(0, 0, 0, .66);
        
}

.list-card, .list-wrapper.mod-add.is-idle{
background:rgba(0, 0, 0, .51);
}

.list-card:hover{
background:rgba(32, 68, 100, .21);
}


.list-card-cover.js-card-cover, .window-cover.js-card-cover-box.js-stickers-area.js-open-card-cover-in-viewer.card-cover-light.is-covered.has-attachment-cover{
    background-color:rgba(0, 0, 0, .21)!important;
}

.full-cover-list-card:not(.color-card-cover){
    box-shadow:3px 3px 1px #1d6e8e;
}

.list-card-title, .card-composer-container .icon-template-card, .open-card-composer .icon-add, ._3Qtx4lodxp9J0E{
    color:white;
}

.window, .V3fHnoowyJQnrV._2VA_NQ_fjk0B8s.ldah9MHp8xTLnM, ._1U-iTQCPXafQbO.ldah9MHp8xTLnM, .TioRi3eD-PPhIY{
    background-color:rgba(0, 0, 0, .84);
}

.badge, .tabbed-pane-nav-item-button.active, .tabbed-pane-nav-item-button.active:active, .tabbed-pane-nav-item-button.active:hover, .tabbed-pane-nav-item-button, a, ._3TTqkG5muwOzqZ, ._3bp5vhCxI46owV, ._2Lvd0nzFwDImN5._3bizXMd0yFcPYh, ._10A11gjLNdEncG{
    background:black;
    color:white;
    outline:0px;
    border:0px;
    box-shadow:none;
}

.cqFRKQ, .gdpr-cookie-consent-dialog .gdpr-dialog, ._2l_sC71_-yvcPV, .body-board-view ._2jrXk1mCSW89B1, ._3_D1qFyb0UiX3f, ._2LXN4ZTSOnbY6m, .theme-dark ._2GE_sqFRVzPvQy, ._3T2HVoRLE4XDEy, ._1uwC1pZb8teBWi._3_c0zHw6-SHzql ._3gaeGQ9nTgmVu1, ._1uwC1pZb8teBWi ._3gaeGQ9nTgmVu1{
  background-image: linear-gradient(rgb(0 0 0), rgb(50 51 66));
 border-radius:20px;
    border:0px;
}


._2LXN4ZTSOnbY6m  a, ._3T2HVoRLE4XDEy a,  ._3T2HVoRLE4XDEy button{
    background:transparent;
}

.gdpr-cookie-consent-dialog .gdpr-dialog .gdpr-header, ._2_vEx2LvsRHrTa, ._2zwhaXlMejz3on{
    border:none;
}

body, .nehg66KhRQH-Bt, .list-card-operation, .cCx0l2KxifLXGh{
    background-color: rgb(50 51 66);
    border:0px;
}

a, ._3TTqkG5muwOzqZ, ._1bZdq1bpCIkL0h, ._1XEJl6lhVif5nk, ._3dwvp4Y0puwFKY, ._3T2HVoRLE4XDEy, ._3T2HVoRLE4XDEy, ._1zqoWY4UC6h3Qn ._3RFe7fNm6rfi1f, ._3r_PwGzSZB28ug ._2NtujweYB_yQrC, ._1z-vHq9IzL7phS, .FFke7ylmpAZ-ps, ._1uwC1pZb8teBWi ._3gaeGQ9nTgmVu1, ._33op4AAMdFvbsV ._3HKqkuvErl_hdD{
    color:white!important;
}

.ifeHxY, .icon-sm, .jKipYA, .icon-lg, .icon-md, .window-sidebar h3, .card-detail-item-header, .quiet, textarea.mod-card-back-title:disabled, ._3yIvZPGjT6wzCx, .P4jJSkzQD7kCeZ{
    color:white!important;
}

textarea.mod-card-back-title:disabled{
    -webkit-text-fill-color: #fff;
}

.bbacTD, ._2E737THHnWdYhg{
    background:transparent;
}

.pop-over{
    background:rgba(0, 0, 0, .96);
    box-shadow: 2px 2px 0px #00a2ff;
}

textarea.mod-list-name:disabled {
    -webkit-text-fill-color: #ffffff;
    color: #ffffff;
}

.board-header-btn-invite{
    display:none;
}

._2s3Vz4L97mQr9C {
    background-color: #131313;
    display:none;
}

.window-cover.js-card-cover-box.js-stickers-area.js-open-card-cover-in-viewer.card-cover-dark.is-covered.has-attachment-cover{
    background-color:#000000b8!important;
}


/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #34aeff26;
    border-radius:10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #00b9ff;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #000;
}
}