/* MX1 Workspace DARK THEME - only loaded in dark mode */

/* === MX1 GLOBAL ROUNDCUBE DARK THEME === */

/* === MX1 GLOBAL ROUNDCUBE DARK THEME === */

:root {
    --mx-global-bg: #061827;
    --mx-global-bg-deep: #041421;
    --mx-global-panel: #082033;
    --mx-global-panel-2: #0a263a;
    --mx-global-panel-3: #0c2c42;

    --mx-global-line: rgba(123, 181, 216, .16);
    --mx-global-line-soft: rgba(123, 181, 216, .09);

    --mx-global-text: #edf7fd;
    --mx-global-muted: #8faec0;

    --mx-global-blue: #0d8fe8;
    --mx-global-blue-hover: #117bc1;
    --mx-global-blue-soft: rgba(13, 143, 232, .16);
}


/* ---------------------------------------------------------
   Ana gövde
   --------------------------------------------------------- */

html,
body {
    background: var(--mx-global-bg-deep) !important;
    color: var(--mx-global-text) !important;
}


/* ---------------------------------------------------------
   Roundcube ana layout
   --------------------------------------------------------- */

#layout,
#layout > div,
.layout,
.layout-content,
#layout-content,
#layout-list,
#layout-sidebar {
    background-color: var(--mx-global-bg) !important;
}


/* ---------------------------------------------------------
   Sol ana task menu
   --------------------------------------------------------- */

#taskmenu {
    background:
        linear-gradient(
            180deg,
            #051726 0%,
            #041522 100%
        ) !important;

    border-right: 1px solid var(--mx-global-line) !important;
}

#taskmenu a {
    color: #d6e9f4 !important;
}

#taskmenu a:hover {
    background: var(--mx-global-blue-soft) !important;
    color: #ffffff !important;
}

#taskmenu a.selected,
#taskmenu a.button-selected,
#taskmenu a.active {
    background:
        linear-gradient(
            90deg,
            rgba(13, 143, 232, .26),
            rgba(13, 143, 232, .10)
        ) !important;

    color: #ffffff !important;
}

#taskmenu a .button-inner:before {
    color: #a9d8f3 !important;
}


/* ---------------------------------------------------------
   Sol klasör / kişiler / ayarlar paneli
   --------------------------------------------------------- */

#layout-sidebar,
.sidebar,
.listbox {
    background:
        linear-gradient(
            180deg,
            #082033 0%,
            #071d2e 100%
        ) !important;

    border-color: var(--mx-global-line) !important;
}


/* ---------------------------------------------------------
   Klasör listeleri
   --------------------------------------------------------- */

.folderlist li,
.folderlist li a,
.treelist li,
.treelist li a {
    color: #e0eef6 !important;
}

.folderlist li a:hover,
.treelist li a:hover {
    background: rgba(13, 143, 232, .10) !important;
}

.folderlist li.selected > a,
.treelist li.selected > a,
.folderlist li.active > a {
    background: rgba(13, 143, 232, .19) !important;
    color: #ffffff !important;
}


/* ---------------------------------------------------------
   Liste paneli
   --------------------------------------------------------- */

#layout-list,
.messagelist,
.listing,
.listing tbody,
.listing table {
    background: #071d2e !important;
    color: var(--mx-global-text) !important;
}

#messagelist,
#messagelist tbody {
    background: #071d2e !important;
}

#messagelist tr {
    background: #071d2e !important;
    color: #dcebf4 !important;

    border-color: var(--mx-global-line-soft) !important;
}

#messagelist tr:hover {
    background: #0a263a !important;
}

#messagelist tr.selected td,
#messagelist tr.selected {
    background:
        linear-gradient(
            90deg,
            #0b4f7e,
            #093b5e
        ) !important;

    color: #ffffff !important;
}

#messagelist td,
.listing td,
.listing th {
    border-color: var(--mx-global-line-soft) !important;
}

#messagelist .subject,
#messagelist .fromto,
#messagelist .date {
    color: inherit !important;
}


/* ---------------------------------------------------------
   Okuma paneli
   --------------------------------------------------------- */

#layout-content {
    background:
        linear-gradient(
            180deg,
            #061827 0%,
            #051724 100%
        ) !important;
}

#message-header,
.message-header {
    background: #071c2b !important;
    color: var(--mx-global-text) !important;

    border-color: var(--mx-global-line) !important;
}

#message-content,
.message-part,
.messagebody,
#messagebody {
    background: #061827 !important;
    color: #e4f1f8 !important;
}


/* ---------------------------------------------------------
   Toolbar
   --------------------------------------------------------- */

.toolbar,
#toolbar-menu,
#messagetoolbar,
.menu.toolbar {
    background: #071c2b !important;

    border-color: var(--mx-global-line) !important;
}

.toolbar a,
.toolbar button {
    color: #c9e3f2 !important;
}

.toolbar a:hover,
.toolbar button:hover {
    background: rgba(13, 143, 232, .13) !important;
    color: #fff !important;
}


/* ---------------------------------------------------------
   Üst başlıklar
   --------------------------------------------------------- */

.header,
.content-head,
.listing-info,
#layout-list > .header,
#layout-content > .header {
    background: #071c2b !important;

    color: #e9f7ff !important;

    border-color: var(--mx-global-line) !important;
}


/* ---------------------------------------------------------
   Arama kutuları
   --------------------------------------------------------- */

.searchbar,
.searchbox,
#searchbar {
    background: #071d2e !important;
}

input[type="text"],
input[type="search"],
input[type="email"],
input[type="password"],
input[type="number"],
textarea,
select,
.form-control {
    background: #092235 !important;

    color: #edf7fd !important;

    border-color: rgba(127, 185, 219, .25) !important;
}

input::placeholder,
textarea::placeholder {
    color: #7795a7 !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--mx-global-blue) !important;

    box-shadow:
        0 0 0 2px rgba(13, 143, 232, .13) !important;
}


/* ---------------------------------------------------------
   Butonlar
   --------------------------------------------------------- */

.btn-primary,
button.btn-primary,
input.btn-primary {
    background:
        linear-gradient(
            180deg,
            #1497ed,
            #087bc7
        ) !important;

    border-color: #1599ed !important;

    color: #fff !important;
}

.btn-primary:hover,
button.btn-primary:hover {
    background:
        linear-gradient(
            180deg,
            #19a1f6,
            #0b87d6
        ) !important;
}


/* ---------------------------------------------------------
   Genel buton / kontrol
   --------------------------------------------------------- */

.btn-secondary,
button.btn-secondary,
.btn-light {
    background: #0b293d !important;

    border-color: var(--mx-global-line) !important;

    color: #dcecf5 !important;
}


/* ---------------------------------------------------------
   Dropdown menüler
   --------------------------------------------------------- */

.dropdown-menu,
.popupmenu,
.popup,
.menu,
ul.popupmenu {
    background: #092235 !important;

    color: #e8f5fc !important;

    border-color: rgba(123, 181, 216, .23) !important;

    box-shadow:
        0 12px 32px rgba(0, 0, 0, .38) !important;
}

.dropdown-menu a,
.popupmenu a,
.menu a {
    color: #dbeef8 !important;
}

.dropdown-menu a:hover,
.popupmenu a:hover,
.menu a:hover {
    background: rgba(13, 143, 232, .15) !important;
    color: #ffffff !important;
}


/* ---------------------------------------------------------
   Modal / dialog
   --------------------------------------------------------- */

.modal-content,
.ui-dialog,
.ui-widget-content {
    background: #082033 !important;

    color: #edf7fd !important;

    border-color: var(--mx-global-line) !important;
}

.modal-header,
.modal-footer,
.ui-dialog-titlebar {
    background: #071c2b !important;

    color: #ffffff !important;

    border-color: var(--mx-global-line) !important;
}


/* ---------------------------------------------------------
   Ayarlar ekranları
   --------------------------------------------------------- */

.preferences-box,
.propform,
.boxcontent,
.boxfooter,
.boxheader,
fieldset {
    background: #071d2e !important;

    color: #e4f1f8 !important;

    border-color: var(--mx-global-line) !important;
}

fieldset legend,
.boxheader {
    color: #ffffff !important;
}


/* ---------------------------------------------------------
   Kişiler
   --------------------------------------------------------- */

#contacts-table,
#contacts-table tbody,
#contacts-table tr,
.contactlist,
.contactlist li {
    background: #071d2e !important;

    color: #e3f0f7 !important;

    border-color: var(--mx-global-line-soft) !important;
}

#contacts-table tr:hover,
.contactlist li:hover {
    background: #0a263a !important;
}


/* ---------------------------------------------------------
   Linkler
   --------------------------------------------------------- */

a {
    color: #42b8ff;
}

a:hover {
    color: #76ccff;
}


/* ---------------------------------------------------------
   Kaydırma çubukları
   --------------------------------------------------------- */

* {
    scrollbar-color:
        rgba(110, 165, 196, .35)
        rgba(4, 20, 33, .30);
}

*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

*::-webkit-scrollbar-track {
    background: rgba(4, 20, 33, .30);
}

*::-webkit-scrollbar-thumb {
    background: rgba(110, 165, 196, .34);

    border-radius: 20px;
}

*::-webkit-scrollbar-thumb:hover {
    background: rgba(110, 165, 196, .50);
}


/* ---------------------------------------------------------
   Footer / status
   --------------------------------------------------------- */

.footer,
#list-footer,
.listing-footer,
#messagelist-footer {
    background: #061827 !important;

    color: #a8c2d1 !important;

    border-color: var(--mx-global-line) !important;
}


/* ---------------------------------------------------------
   Genel separator
   --------------------------------------------------------- */

hr,
.divider {
    border-color: var(--mx-global-line) !important;
}
/* === MX1 NAVY FINAL OVERRIDES === */

/* === MX1 NAVY FINAL OVERRIDES === */

/* ---------------------------------------------------------
   SOL KLASÖR PANELİ - GRİYİ TAMAMEN KALDIR
   --------------------------------------------------------- */

#layout-sidebar,
#layout-sidebar .scroller,
#layout-sidebar .listing,
#layout-sidebar .listbox,
#layout-sidebar .treelist,
#layout-sidebar .folderlist,
#layout-sidebar .footer,
#layout-sidebar .header,
#folderlist-content,
#folderlist-content .scroller,
#folderlist {
    background: #071d2e !important;
    background-color: #071d2e !important;
}


/* Klasör satırlarının boş alanları */
#folderlist li,
#folderlist li > a,
.folderlist li,
.folderlist li > a {
    background-color: transparent !important;
}

#folderlist li:hover,
#folderlist li > a:hover,
.folderlist li:hover,
.folderlist li > a:hover {
    background-color: #0a263a !important;
}


/* ---------------------------------------------------------
   MAİL OKUMA ALANI - ANA GRİ ALAN
   --------------------------------------------------------- */

#layout-content,
#layout-content .scroller,
#layout-content .content,
#layout-content .iframe-wrapper,
#layout-content .iframe,
#layout-content .message-part,
#layout-content .messagebody,
#layout-content .message-content,
#layout-content .message-htmlpart,
#layout-content .message-partheaders,
#layout-content .message-partbody,
#message-content,
#messagebody,
.messagebody,
.message-part,
.message-partbody {
    background: #061827 !important;
    background-color: #061827 !important;
    color: #e6f3fa !important;
}


/* Boş mail görünümü / logo alanı */
#layout-content .watermark,
#layout-content .watermark-box,
#layout-content .empty,
#layout-content .empty-content,
#layout-content .content-frame {
    background: #061827 !important;
    background-color: #061827 !important;
}


/* ---------------------------------------------------------
   ÜST MAİL TOOLBAR - GRİ BLOKLAR
   --------------------------------------------------------- */

#layout-content > .header,
#layout-content .header,
#messagetoolbar,
#toolbar-menu,
.toolbar,
.toolbar-menu,
.menu.toolbar,
#layout-content .toolbar {
    background: #071c2b !important;
    background-color: #071c2b !important;
    border-color: rgba(123, 181, 216, .15) !important;
}


/* Toolbar butonlarının kendi gri kutuları */
.toolbar a,
.toolbar button,
.toolbar .button,
.toolbar-menu a,
.toolbar-menu button,
#messagetoolbar a,
#messagetoolbar button {
    background: transparent !important;
    color: #bcd9e9 !important;
}

.toolbar a:hover,
.toolbar button:hover,
.toolbar .button:hover,
#messagetoolbar a:hover,
#messagetoolbar button:hover {
    background: rgba(13, 143, 232, .12) !important;
    color: #ffffff !important;
}


/* Pasif toolbar butonları */
.toolbar a.disabled,
.toolbar button:disabled,
.toolbar .disabled,
#messagetoolbar .disabled {
    background: transparent !important;
    color: #607d8d !important;
}


/* ---------------------------------------------------------
   MESAJ BAŞLIK BLOĞU
   --------------------------------------------------------- */

#message-header,
.message-header,
#message-header .header,
.message-header .header,
.message-header .subject,
.message-header .message-headers,
#messageheader {
    background: #071c2b !important;
    background-color: #071c2b !important;
    color: #edf7fd !important;
    border-color: rgba(123, 181, 216, .15) !important;
}


/* ---------------------------------------------------------
   ORTA / SAĞ PANEL ÇİZGİLERİ
   --------------------------------------------------------- */

#layout-list,
#layout-content,
#layout-sidebar {
    border-color: rgba(123, 181, 216, .15) !important;
}


/* ---------------------------------------------------------
   LİSTE BAŞLIĞI VE ARAMA ALANI
   --------------------------------------------------------- */

#layout-list .header,
#layout-list > .header,
#layout-list .searchbar,
#layout-list .searchbox,
#layout-list .toolbar {
    background: #071c2b !important;
    background-color: #071c2b !important;
}


/* ---------------------------------------------------------
   SAĞ İŞ YÖNETİMİ PANELİNDEKİ GRİ KARTLAR
   --------------------------------------------------------- */

.mx1-bm-module {
    background:
        linear-gradient(
            180deg,
            #0b2a3e,
            #082235
        ) !important;

    border-color: rgba(84, 164, 210, .20) !important;
}

.mx1-bm-module:hover {
    background:
        linear-gradient(
            180deg,
            #0e344c,
            #0a293d
        ) !important;
}


/* Sekmelerdeki griyi laciverte çek */
.mx1-bm-tabs,
.mx1-bm-tabs button {
    background: #0a2233 !important;
}

.mx1-bm-tabs button.active {
    background: #0b293d !important;
}


/* Hızlı işlem kartları */
.mx1-bm-quick-grid button {
    background:
        linear-gradient(
            180deg,
            #0b2a3e,
            #082235
        ) !important;

    border-color: rgba(84, 164, 210, .18) !important;
}


/* ---------------------------------------------------------
   ROUND CUBE GENEL PANEL / BOX GRİLERİ
   --------------------------------------------------------- */

.boxlist,
.boxcontent,
.boxfooter,
.boxheader,
.content-box,
.listbox,
.pagenav,
.statusbar {
    background: #071d2e !important;
    background-color: #071d2e !important;
    border-color: rgba(123, 181, 216, .15) !important;
}


/* ---------------------------------------------------------
   GÖRÜNMEYEN AMA GRİ KALABİLEN ELASTIC ELEMANLARI
   --------------------------------------------------------- */

#layout > .content,
#layout > .sidebar,
#layout > .list,
#layout > .main,
#layout div[role="main"],
#layout div[role="navigation"] {
    border-color: rgba(123, 181, 216, .15) !important;
}


/* ---------------------------------------------------------
   IFRAME VARSA DIŞ ZEMİN
   --------------------------------------------------------- */

iframe {
    background-color: #061827 !important;
}


/* ---------------------------------------------------------
   BODY VE ANA CONTAINER SON ZORLAMA
   --------------------------------------------------------- */

body,
#layout {
    background-color: #041421 !important;
}
/* === MX1 MANUAL NAVY FIXES === */

/* === MX1 MANUAL NAVY FIXES === */

html.dark-mode > body {
    background-color: #071d2e !important;
    background-blend-mode: soft-light !important;
}

.messagelist tr,
.records-table tr,
.listing li {
    background: #061827 !important;
    color: var(--mx-text) !important;
    border-bottom: 1px solid #334144 !important;
}

#layout-content,
#layout-preview,
#messagecontent,
#mailview-right,
#messagebody,
.iframe-wrapper,
.scroller,
.box,
.uibox {
    background: #071d2e !important;
    color: var(--mx-text) !important;
    border-color: var(--mx-border) !important;
}
