/* Ghost Aperture - Rydhoodie - CLEAN REWRITE */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

html, body { font-family: 'Space Grotesk', Verdana, Arial, sans-serif !important; font-size: 13px !important; color: #e2e2f0 !important; background: #0a0a0f !important; }
a { color: #00d4aa !important; } a:visited { color: #00d4aa !important; } a:hover { color: #00efc0 !important; }
#topline { background: #0e0e16 !important; border-bottom: 1px solid #2a2a3e !important; color: #4a4a64 !important; }
#topline a, #topline span, #topline span.username { color: #4a4a64 !important; }
#topnav { background: #12121a !important; border-bottom: 1px solid #2a2a3e !important; margin-bottom: 10px !important; }
#taskbar a { color: #7a7a96 !important; }
#taskbar a:hover, #taskbar a.button-selected { color: #00d4aa !important; background: #1a1a26 !important; }
#taskbar a span.button-inner { filter: brightness(0.6) !important; }
#taskbar a:hover span.button-inner, #taskbar a.button-selected span.button-inner { filter: brightness(1.5) !important; }
#toplogo span { font-size: 16px !important; }
#mainscreen, #mainscreencontent { background: #0a0a0f !important; }
html body .uibox { background: #12121a !important; border: 1px solid #2a2a3e !important; }
html body .listbox { background: #0e0e16 !important; border: 1px solid #2a2a3e !important; background-image: none !important; }
html body .boxtitle, html body .uibox .boxtitle, html body .listbox .boxtitle { background: #1a1a26 !important; background-image: none !important; color: #7a7a96 !important; border-bottom: 1px solid #2a2a3e !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; }
html body .boxfooter, html body .listfooter, html body #messagelist-footer, html body .listbox .boxfooter { background: #0e0e16 !important; background-image: none !important; border-top: 1px solid #2a2a3e !important; color: #4a4a64 !important; }
.boxfooter .listbutton { background: #12121a !important; border-right: 1px solid #2a2a3e !important; }
.boxfooter .listbutton .inner { filter: brightness(0.6) !important; }
.boxfooter .countdisplay { color: #4a4a64 !important; }
html body #mailboxlist, html body .folderlist, html body #folderlist, html body #mailboxlist-container, html body #folderlist-container, html body ul.treelist { background-color: #0e0e16 !important; background-image: none !important; }
html body #mailboxlist li, html body .folderlist li { border-bottom: 1px solid #1a1a26 !important; }
html body #mailboxlist li a, html body .folderlist li a, html body ul.treelist li a { color: #7a7a96 !important; background: transparent !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
html body #mailboxlist li:hover > a, html body .folderlist li:hover > a { background: #1a1a26 !important; color: #e2e2f0 !important; }
html body #mailboxlist li.selected > a, html body .folderlist li.selected > a { background: #1a1a26 !important; color: #00d4aa !important; border-left: 3px solid #00d4aa !important; }
html body #messagelist, html body #messagelist-container, html body .boxlistcontent { background-color: #12121a !important; }
html body #messagelist thead td { background: #1a1a26 !important; color: #7a7a96 !important; border-color: #2a2a3e !important; font-size: 11px !important; text-transform: uppercase !important; letter-spacing: 0.5px !important; }
html body #messagelist tbody tr td { background-color: #12121a !important; color: #e2e2f0 !important; border-color: #1e1e2e !important; }
html body #messagelist tbody tr:hover td { background-color: #1a1a26 !important; }
html body #messagelist tbody tr.selected td { background-color: #1a1a26 !important; color: #00d4aa !important; border-left: 3px solid #00d4aa !important; }
html body #messagelist tbody tr.unread td { font-weight: 700 !important; color: #ffffff !important; }
html body .toolbar, html body #messagetoolbar, html body #addresstoolbar { background: #12121a !important; border-bottom: 1px solid #2a2a3e !important; }




#quicksearchbar, .searchbox { background: #12121a !important; }
#quicksearchbar input, .searchbox input { background: #1a1a26 !important; border: 1px solid #2a2a3e !important; color: #e2e2f0 !important; border-radius: 6px !important; }
input[type="text"], input[type="search"], input[type="email"], input[type="password"], select, textarea, .textbox { background: #12121a !important; border: 1px solid #2a2a3e !important; color: #e2e2f0 !important; border-radius: 6px !important; font-family: 'Space Grotesk', sans-serif !important; }
input:focus, select:focus, textarea:focus { border-color: #00d4aa !important; outline: none !important; box-shadow: 0 0 0 2px rgba(0,212,170,0.15) !important; }
select option { background: #12121a !important; color: #e2e2f0 !important; }
html body button, html body input.button, html body a.button { background: #1a1a26 !important; border: 1px solid #2a2a3e !important; color: #e2e2f0 !important; border-radius: 6px !important; font-family: 'Space Grotesk', sans-serif !important; }
html body button:hover, html body input.button:hover, html body a.button:hover { background: #2a2a3e !important; border-color: #00d4aa !important; }
html body button.mainaction, html body input.button.mainaction { background: #00d4aa !important; color: #0a0a0f !important; border-color: #00d4aa !important; font-weight: 700 !important; }
html body button[disabled], html body button[disabled]:hover { opacity: 0.3 !important; }
html body .popupmenu, html body ul.toolbarmenu { background: #1a1a26 !important; border: 1px solid #2a2a3e !important; border-radius: 8px !important; box-shadow: 0 8px 24px rgba(0,0,0,0.5) !important; }
html body ul.toolbarmenu li { border-top: 1px solid #2a2a3e !important; color: #e2e2f0 !important; min-width: 130px !important; }
html body ul.toolbarmenu li a { color: #e2e2f0 !important; padding: 8px 16px !important; }
html body ul.toolbarmenu li a:hover, html body ul.toolbarmenu li a.active { background: #2a2a3e !important; color: #00d4aa !important; }
html body .ui-dialog { background: #12121a !important; border: 1px solid #2a2a3e !important; color: #e2e2f0 !important; border-radius: 10px !important; }
html body .ui-dialog .ui-dialog-titlebar { background: #1a1a26 !important; border-bottom: 1px solid #2a2a3e !important; color: #e2e2f0 !important; border-radius: 10px 10px 0 0 !important; }
html body .ui-dialog .ui-widget-content { background: #12121a !important; color: #e2e2f0 !important; }
.splitter, .splitter-v, .splitter-h { background-color: #2a2a3e !important; }
#quotadisplay { background: #0e0e16 !important; color: #4a4a64 !important; }
.pagenav, .countdisplay { color: #4a4a64 !important; }
.unreadcount { background: #00d4aa !important; color: #0a0a0f !important; border-radius: 10px !important; font-weight: 700 !important; padding: 1px 5px !important; }
table, td, th { border-color: #2a2a3e !important; }
html body table.records-table thead td, html body table.records-table thead th { background: #1a1a26 !important; color: #7a7a96 !important; border-color: #2a2a3e !important; }
html body table.records-table tbody td { background: #12121a !important; color: #e2e2f0 !important; border-color: #2a2a3e !important; }
html body table.records-table tr:hover td { background: #1a1a26 !important; }
html body table.records-table tr.selected td { background: #1a1a26 !important; color: #00d4aa !important; }
.watermark { background-color: #0a0a0f !important; }
#messagecontframe { background: #0a0a0f !important; }
body.iframe { background: #0a0a0f !important; }

/* ── Non-selected folders - kill light blue ── */
html body #mailboxlist li,
html body #mailboxlist li a,
html body .folderlist li,
html body .folderlist li a,
html body ul.listing li,
html body ul.listing li a,
html body .listbox .listitem,
html body .listbox .listitem a,
html body .listbox .tablink,
html body .listbox .tablink a {
    background: #0e0e16 !important;
    background-color: #0e0e16 !important;
    color: #7a7a96 !important;
}

/* ── Messages count header strip ── */
html body #listcontrols,
html body .listbox .boxtitle,
html body #mailboxlist-title,
html body #message-count,
html body .scroller.withfooter + div,
html body div[id$="-title"],
html body .uibox .boxtitle {
    background: #1a1a26 !important;
    background-color: #1a1a26 !important;
    background-image: none !important;
    color: #00d4aa !important;
    border-color: #2a2a3e !important;
}

/* ── Bottom footer strips ── */
html body .boxfooter,
html body .listfooter,
html body #messagelist-footer,
html body .listbox .boxfooter,
html body #mailboxlist-footer {
    background: #0e0e16 !important;
    background-color: #0e0e16 !important;
    background-image: none !important;
    border-top: 1px solid #2a2a3e !important;
    color: #4a4a64 !important;
}

/* ── All dropdowns/popups ── */
html body .popupmenu,
html body ul.toolbarmenu,
html body #rcmKSearchpane,
html body .ui-autocomplete {
    background: #1a1a26 !important;
    background-color: #1a1a26 !important;
    border: 1px solid #2a2a3e !important;
    color: #e2e2f0 !important;
}
html body ul.toolbarmenu li a,
html body .popupmenu a {
    color: #e2e2f0 !important;
    background: transparent !important;
}
html body ul.toolbarmenu li a:hover,
html body .popupmenu a:hover {
    background: #2a2a3e !important;
    color: #00d4aa !important;
}

/* Messages count bar and bottom toolbar */
html body #messagelist-title,
html body #listcontrols,
html body #listcontrols td,
html body #mailboxlist-title,
html body .listbox > .scroller + div,
html body #message-list-title {
    background: #1a1a26 !important;
    background-color: #1a1a26 !important;
    background-image: none !important;
    color: #00d4aa !important;
    border-color: #2a2a3e !important;
}

html body #mailview-bottom,
html body #mailview-bottom .uibox,
html body #messagelist-footer,
html body #mailview-bottom .boxfooter,
html body .listbox > div:last-child,
html body #listcontrols ~ div {
    background: #0e0e16 !important;
    background-color: #0e0e16 !important;
    background-image: none !important;
    border-top: 1px solid #2a2a3e !important;
    color: #4a4a64 !important;
}

/* Correct IDs from inspector */
html body #messagelistfooter,
html body #messagelistfooter #listcontrols,
html body #messagelistfooter #listselectors,
html body #listcontrols,
html body #listselectors {
    background: #0e0e16 !important;
    background-color: #0e0e16 !important;
    background-image: none !important;
    border-top: 1px solid #2a2a3e !important;
    color: #4a4a64 !important;
}
html body #listcontrols td,
html body #listselectors td,
html body #listselectors select {
    background: #0e0e16 !important;
    color: #4a4a64 !important;
    border-color: #2a2a3e !important;
}

/* Correct header ID from inspector */
html body #messageslistheader,
html body #countcontrols,
html body #countcontrols span,
html body .pagenav.dark,
html body .pagenav.dark span,
html body .widescreen #countcontrols {
    background: #1a1a26 !important;
    background-color: #1a1a26 !important;
    color: #00d4aa !important;
    border-bottom: 1px solid #2a2a3e !important;
}

/* Every input select textarea in the whole app */
html body input,
html body input[type="text"],
html body input[type="search"],
html body input[type="email"],
html body input[type="password"],
html body input[type="number"],
html body select,
html body select option,
html body textarea,
html body .textbox,
html body .ui-widget input,
html body .ui-widget select,
html body .ui-widget textarea {
    background: #12121a !important;
    background-color: #12121a !important;
    border: 1px solid #2a2a3e !important;
    color: #e2e2f0 !important;
    border-radius: 4px !important;
}
select option { background: #12121a !important; color: #e2e2f0 !important; }

/* Correct ID: messagelistheader (no s) */
html body #messagelistheader,
html body .widescreen #messagelistheader,
html body #messagelistheader a,
html body #messagelistheader span {
    background: #1a1a26 !important;
    background-color: #1a1a26 !important;
    border-bottom: 1px solid #2a2a3e !important;
    color: #00d4aa !important;
}







/* ── Restore folder list icons ── */
.folderlist li.mailbox a,
#mailboxlist li.mailbox a {
    background-image: url(images/listicons.png) !important;
    background-repeat: no-repeat !important;
    background-position: 6px 3px !important;
    padding-left: 36px !important;
    filter: invert(0.5) !important;
}
.folderlist li.mailbox.selected > a,
#mailboxlist li.mailbox.selected > a {
    filter: invert(1) sepia(1) saturate(5) hue-rotate(130deg) !important;
}

/* ── Restore taskbar icons ── */
#taskbar a span.button-inner {
    background-image: url(images/buttons.png) !important;
    filter: invert(0.5) !important;
}
#taskbar a:hover span.button-inner,
#taskbar a.button-selected span.button-inner {
    filter: invert(1) sepia(1) saturate(5) hue-rotate(130deg) !important;
}

/* ── Fix ALL inputs selects dropdowns ── */
html body input[type="text"],
html body input[type="search"],
html body input[type="email"],
html body input[type="password"],
html body input[type="number"],
html body input[type="tel"],
html body input,
html body select,
html body textarea,
html body .textbox,
html body a.menuselector,
html body a.menuselector .handle,
html body select.decorated {
    background: #12121a !important;
    background-color: #12121a !important;
    background-image: none !important;
    border: 1px solid #2a2a3e !important;
    color: #e2e2f0 !important;
    border-radius: 4px !important;
}
html body select option,
html body select optgroup {
    background: #12121a !important;
    color: #e2e2f0 !important;
}
html body input:focus,
html body select:focus,
html body textarea:focus {
    border-color: #00d4aa !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(0,212,170,0.15) !important;
}

/* Quicksearch specifically */
html body #quicksearchbar input,
html body #search-query,
html body .searchbox input {
    background: #1a1a26 !important;
    background-color: #1a1a26 !important;
    color: #e2e2f0 !important;
    border: 1px solid #2a2a3e !important;
}

/* ── Fix folder list - remove filter from text, keep icon sprite ── */
.folderlist li.mailbox a,
#mailboxlist li.mailbox a,
#mailboxlist li a,
.folderlist li a {
    filter: none !important;
    color: #7a7a96 !important;
    background-color: #0e0e16 !important;
    background-image: url(images/listicons.png) !important;
    background-repeat: no-repeat !important;
    background-position: 6px 3px !important;
    padding-left: 36px !important;
}
#mailboxlist li:hover > a,
.folderlist li:hover > a {
    background-color: #1a1a26 !important;
    color: #e2e2f0 !important;
}
#mailboxlist li.selected > a,
.folderlist li.selected > a {
    background-color: #1a1a26 !important;
    color: #00d4aa !important;
    border-left: 3px solid #00d4aa !important;
}








/* ── Toolbar icons - filter only, don't override sprite ── */





/* ── Toolbar buttons - UNDO background-image:none, restore sprite ── */







/* ── Compose window ── */
html body.layout-normal,
html body.layout-widescreen,
html body.compose,
#compose-content,
#compose-toolbar,
#compose-header,
.compose-header-first,
#compose-from,
#compose-to,
#compose-cc,
#compose-bcc,
#compose-subject,
.composebody,
#composebody,
#compose-attachments,
#attachment-list,
#compose-toolbar .toolbar,
#send-status { background: #12121a !important; background-color: #12121a !important; color: #e2e2f0 !important; border-color: #2a2a3e !important; }

#composebody iframe,
.mce-container, .mce-panel, .mce-toolbar, .mce-menubar,
.mce-edit-area, .mce-statusbar { background: #0a0a0f !important; background-color: #0a0a0f !important; color: #e2e2f0 !important; border-color: #2a2a3e !important; }

/* ── Settings page ── */
#settings-sections, #sections-list,
#settings-right, .settings-right,
#identity-list, .propform,
#subscriptions-table, #userprefs-box,
.section-title, #sectionframe,
table.propform td, table.propform th,
.settingsbox, #tabsbar,
#tabsbar a, #tabsbar li { background: #12121a !important; background-color: #12121a !important; color: #e2e2f0 !important; border-color: #2a2a3e !important; }

#tabsbar a.selected, #tabsbar li.selected a { background: #1a1a26 !important; color: #00d4aa !important; border-bottom: 2px solid #00d4aa !important; }

table.propform input, table.propform select, table.propform textarea { background: #1a1a26 !important; border: 1px solid #2a2a3e !important; color: #e2e2f0 !important; }

/* ── Compose header fields (to/from/subject area) ── */
.TextboxTable, .TextboxTable td,
.header-title, .compose-header,
table.compose-header, table.compose-header td,
#compose-header table, #compose-header table td,
#compose-header table th,
.inputrow, .inputrow td,
.composetop, #composetop,
#compose-subject, #compose-subject td,
#compose-from td, #compose-to td,
#compose-cc td, #compose-bcc td,
#compose-replyto td,
.composerow, .composerow td,
form#compose-form, form#compose-form td,
#compose-attachments, #compose-attachments td {
    background: #12121a !important;
    background-color: #12121a !important;
    color: #e2e2f0 !important;
    border-color: #2a2a3e !important;
}

/* autocomplete dropdown */
#rcmKSearchpane, ul.ac-list,
ul.ac-list li {
    background: #1a1a26 !important;
    color: #e2e2f0 !important;
    border-color: #2a2a3e !important;
}
ul.ac-list li:hover, ul.ac-list li.selected {
    background: #2a2a3e !important;
    color: #00d4aa !important;
}

/* Exact selectors from inspector */
html body #composeheaders,
html body .messageheader,
html body .messageheader td,
html body table.headers-table,
html body table.headers-table td,
html body table.headers-table th,
html body table.compose-headers,
html body table.compose-headers td,
html body .compose-header-first,
html body .moreheaderstoggle {
    background: #12121a !important;
    background-color: #12121a !important;
    border-color: #2a2a3e !important;
    color: #e2e2f0 !important;
}
html body #composeheaders a,
html body .moreheaderstoggle a {
    color: #00d4aa !important;
}

/* Fix selected inbox li background - the li itself not just the a tag */
html body ul.treelist li.selected,
html body ul.listing li.selected,
html body #mailboxlist li.selected,
html body .folderlist li.selected,
html body .listbox .listitem.selected,
html body .listbox .tablink.selected,
html body .listbox .listitem.selected a,
html body .listbox .tablink.selected a {
    background: #1a1a26 !important;
    background-color: #1a1a26 !important;
    color: #00d4aa !important;
    border-left: 3px solid #00d4aa !important;
}
html body #mailboxlist li.selected > a,
html body .folderlist li.selected > a {
    background: #1a1a26 !important;
    background-color: #1a1a26 !important;
    color: #00d4aa !important;
}





/* Hide the voice/screenreader h2 that shows as text */
#topnav h2.voice, #topline h2.voice { 
    display: none !important; 
    visibility: hidden !important;
}



/* Hide screenreader voice element */
h2.voice, .voice { 
    position: absolute !important;
    left: -9999px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}



/* Logo - no interference */
#toplogo { cursor: pointer; }
#toplogo img { height: 36px; width: 36px; display: block; }

/* Logo text size bump */
#toplogo span { font-size: 20px !important; }

/* Logo text size bump */
#toplogo span { font-size: 24px !important; }

/* Logo text size bump */
#toplogo span { font-size: 28px !important; }