/* Nova Mail theme on top of Roundcube Elastic.
   Colours are theme variables (dark default, html.nv-light for light); structural rules only apply on desktop (html.nova-desk). */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Montserrat:wght@600;700;800&display=swap");

:root {
  --nv-bg: #0c0c0f;
  --nv-panel: #141418;
  --nv-panel-2: #1a1a1f;
  --nv-line: #26262d;
  --nv-text: #f4f4f6;
  --nv-text-2: #e3e3e8;
  --nv-muted: #9b9ca6;
  --nv-dim: #6c6d77;
  --nv-icon: #c3c4cc;
  --nv-strong: #ffffff;
  --nv-hover: rgba(255, 255, 255, .06);
  --nv-hover-2: rgba(255, 255, 255, .03);
  --nv-btn-line: #3a3a43;
  --nv-scroll: #34343c;
  --nv-shadow: rgba(0, 0, 0, .5);
  --nv-red: #f0434b;
  --nv-red-2: #ff5a61;
  --nv-accent-rgb: 240, 67, 75;
  --nv-red-soft: rgba(var(--nv-accent-rgb), .13);
  --nv-green: #2fd07a;
  --nv-radius: 14px;
}
html.nv-light {
  --nv-bg: #eceef2;
  --nv-panel: #ffffff;
  --nv-panel-2: #f5f6f8;
  --nv-line: #e4e6eb;
  --nv-text: #15161a;
  --nv-text-2: #2a2c33;
  --nv-muted: #6b6f7a;
  --nv-dim: #9a9ea8;
  --nv-icon: #4b4f5a;
  --nv-strong: #0c0d10;
  --nv-hover: rgba(15, 18, 30, .05);
  --nv-hover-2: rgba(15, 18, 30, .025);
  --nv-btn-line: #d4d7de;
  --nv-scroll: #c8cbd2;
  --nv-shadow: rgba(16, 20, 30, .14);
  --nv-red-soft: rgba(var(--nv-accent-rgb), .10);
}

html, body, input, textarea, select, button, .btn, table { font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif !important; }
body { background: var(--nv-bg) !important; color: var(--nv-text); }
* { scrollbar-width: thin; scrollbar-color: var(--nv-scroll) transparent; }
::-webkit-scrollbar { width: 8px; height: 8px; background: transparent; }
::-webkit-scrollbar-thumb { background: var(--nv-scroll); border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::selection { background: rgba(var(--nv-accent-rgb), .3); }

/* ---------- global colours (all screen sizes) ---------- */
#layout > div, #layout > .sidebar, #layout-content, #layout-list, #layout-sidebar { background: var(--nv-panel) !important; color: var(--nv-text); }
#layout .header, #layout .footer { background: transparent !important; border-color: var(--nv-line) !important; color: var(--nv-text); }
a, .listing li a { color: var(--nv-text); }
.btn-primary, .btn.btn-primary, .formbuttons .btn.mainaction, button.mainaction { background: var(--nv-red) !important; border-color: var(--nv-red) !important; color: #fff !important; }
.btn-primary:hover, button.mainaction:hover { background: var(--nv-red-2) !important; }
.btn-secondary, .btn.btn-secondary, .input-group-append .btn, a.input-group-text, .input-group-text { background: var(--nv-panel-2) !important; border-color: var(--nv-line) !important; color: var(--nv-text) !important; }
.btn-secondary:hover { background: var(--nv-hover) !important; }
input.form-control, textarea.form-control, select.custom-select, .form-control { background: var(--nv-panel-2) !important; border-color: var(--nv-line) !important; color: var(--nv-text) !important; border-radius: 9px; }
.form-control:focus, .recipient-input.focus { border-color: rgba(var(--nv-accent-rgb), .6) !important; box-shadow: 0 0 0 3px rgba(var(--nv-accent-rgb), .15) !important; }
.popover, .popupmenu, .ui-dialog, .ui-dialog-content, .ui-dialog-buttonpane, .ui-dialog-titlebar { background: var(--nv-panel-2) !important; border-color: var(--nv-line) !important; color: var(--nv-text) !important; }
.popover .listing li a, .popupmenu .listing li a { color: var(--nv-text) !important; }
.popover .listing li a:hover, .popupmenu .listing li a:hover { background: var(--nv-hover) !important; }
.listing li.selected, .listing li.focused { background: transparent; }
.custom-switch .custom-control-label:before { background: var(--nv-panel-2) !important; border-color: var(--nv-btn-line) !important; }
.custom-switch .custom-control-input:checked ~ .custom-control-label:before { background: var(--nv-red) !important; border-color: var(--nv-red) !important; }

/* notices */
#messagestack div { background: var(--nv-panel-2) !important; color: var(--nv-text) !important; border: 1px solid var(--nv-line) !important; border-left: 4px solid var(--nv-muted) !important; border-radius: 11px !important; box-shadow: 0 12px 30px var(--nv-shadow) !important; font-size: 13px; }
#messagestack div.confirmation { border-left-color: var(--nv-green) !important; }
#messagestack div.error, #messagestack div.loading { border-left-color: var(--nv-red) !important; }
#messagestack div.warning { border-left-color: #ffc24a !important; }

/* ---------- desktop layout ---------- */
html.nova-desk #layout { position: fixed; top: 60px; left: 0; right: 0; bottom: 0; height: auto !important; gap: 10px; padding: 0 10px 10px 0; background: var(--nv-bg); }
html.nova-desk #layout > div:not(#layout-menu) { border: 1px solid var(--nv-line); border-radius: var(--nv-radius); overflow: hidden; }

/* top bar */
#nova-topbar { display: none; }
html.nova-desk #nova-topbar { display: flex; position: fixed; top: 0; left: 0; right: 0; height: 60px; align-items: center; gap: 22px; padding: 0 20px 0 16px; background: var(--nv-bg); z-index: 50; }
#nova-topbar .nv-brand { display: flex; align-items: center; gap: 14px; width: 232px; flex: none; color: var(--nv-text); text-decoration: none; }
#nova-topbar .nv-brand svg { width: 32px; height: 30px; flex: none; }
#nova-topbar .nv-brand span { font-family: "Montserrat", "Inter", sans-serif !important; font-weight: 600; font-size: 15px; letter-spacing: .42em; }
#nova-topbar .nv-search { flex: 1; max-width: 640px; }
#nova-topbar .nv-search .searchbar { display: flex !important; align-items: center; gap: 4px; position: static !important; width: 100% !important; height: 40px; margin: 0 !important; padding: 0 10px 0 4px; background: var(--nv-panel) !important; border: 1px solid var(--nv-line); border-radius: 11px; }
#nova-topbar .nv-search .searchbar > * { align-self: center; margin-top: 0 !important; margin-bottom: 0 !important; }
#nova-topbar .nv-search .searchbar input { background: transparent !important; border: 0 !important; color: var(--nv-text) !important; font-size: 14px; height: 38px; padding-left: 4px !important; box-shadow: none !important; }
#nova-topbar .nv-search .searchbar input::placeholder { color: var(--nv-muted); }
#nova-topbar .nv-search .searchbar a, #nova-topbar .nv-search .searchbar button, #nova-topbar .nv-search .searchbar a.button:before, #nova-topbar .nv-search .searchbar .input-group-prepend { color: var(--nv-muted) !important; }
#nova-topbar .nv-right { margin-left: auto; display: flex; align-items: center; gap: 18px; }
#nova-topbar .nv-status { display: flex; align-items: center; gap: 8px; color: var(--nv-muted); font-size: 13px; padding-right: 18px; border-right: 1px solid var(--nv-line); }
#nova-topbar .nv-status em { font-style: normal; }
#nova-topbar .nv-status i { width: 8px; height: 8px; border-radius: 50%; background: var(--nv-green); box-shadow: 0 0 0 3px rgba(47, 208, 122, .15); }
#nova-topbar .nv-status.off i { background: var(--nv-dim); box-shadow: none; }
#nova-topbar .nv-icon { position: relative; background: none; border: 0; color: var(--nv-text); cursor: pointer; padding: 6px; border-radius: 9px; }
#nova-topbar .nv-icon:hover { background: var(--nv-hover); }
#nova-topbar .nv-icon svg { width: 20px; height: 20px; display: block; }
#nova-topbar .nv-icon b { display: none; position: absolute; top: 5px; right: 5px; width: 8px; height: 8px; border-radius: 50%; background: var(--nv-red); border: 2px solid var(--nv-bg); }
#nova-topbar .nv-icon.has-dot b { display: block; }
#nova-topbar .nv-user { display: flex; align-items: center; gap: 8px; padding-left: 18px; border-left: 1px solid var(--nv-line); cursor: pointer; position: relative; }
#nova-topbar .nv-user .nv-chev { width: 15px; height: 15px; color: var(--nv-muted); }
#nova-topbar .nv-usermenu { display: none; position: absolute; right: 0; top: 46px; min-width: 210px; padding: 6px; background: var(--nv-panel-2); border: 1px solid var(--nv-line); border-radius: 12px; box-shadow: 0 16px 36px var(--nv-shadow); }
#nova-topbar .nv-user.open .nv-usermenu { display: block; }
#nova-topbar .nv-usermenu div { padding: 8px 10px 10px; color: var(--nv-muted); font-size: 12px; border-bottom: 1px solid var(--nv-line); margin-bottom: 4px; }
#nova-topbar .nv-usermenu a { display: block; padding: 8px 10px; border-radius: 8px; color: var(--nv-text); text-decoration: none; font-size: 13.5px; }
#nova-topbar .nv-usermenu a:hover { background: var(--nv-red-soft); }

/* avatars */
.nv-avatar { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 40px; height: 40px; border-radius: 50%; font-weight: 600; font-size: 14px; color: #1b1b22; letter-spacing: .02em; }
.nv-avatar.sm { width: 32px; height: 32px; font-size: 12px; }

/* icon rail */
html.nova-desk #layout-menu { width: 58px !important; min-width: 58px !important; background: var(--nv-bg) !important; border: 0 !important; border-right: 1px solid var(--nv-line) !important; padding-top: 12px; }
html.nova-desk #layout-menu > .popover-header, html.nova-desk #layout-menu #logo, html.nova-desk #layout-menu a.logo { display: none !important; }
html.nova-desk #taskmenu { display: flex; flex-direction: column; align-items: center; height: 100%; }
html.nova-desk #taskmenu a { width: 40px; height: 40px; margin: 4px auto; padding: 0 !important; border-radius: 10px; display: flex; align-items: center; justify-content: center; color: var(--nv-icon) !important; background: none !important; }
html.nova-desk #taskmenu a:before { font-size: 17px !important; margin: 0 !important; }
html.nova-desk #taskmenu a .inner { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
html.nova-desk #taskmenu a.selected { background: var(--nv-red-soft) !important; color: var(--nv-red) !important; }
html.nova-desk #taskmenu a:hover { background: var(--nv-hover) !important; }
html.nova-desk #taskmenu .action-buttons, html.nova-desk #taskmenu a.theme { display: none !important; }
html.nova-desk #taskmenu .special-buttons { margin-top: auto; padding-bottom: 10px; }

/* sidebar */
html.nova-desk #layout-sidebar { width: 232px !important; min-width: 232px !important; max-width: 232px !important; }
html.nova-desk #layout-sidebar > .header { display: none !important; }
#nova-compose { display: flex; align-items: center; gap: 10px; margin: 14px 12px 16px; height: 42px; padding: 0 16px; border: 0; border-radius: 10px; background: var(--nv-red); color: #fff; font-weight: 600; font-size: 14px; cursor: pointer; box-shadow: 0 6px 18px rgba(var(--nv-accent-rgb), .25); width: calc(100% - 24px); }
#nova-compose:hover { background: var(--nv-red-2); }
#nova-compose svg { width: 17px; height: 17px; }
html.nova-desk #mailboxlist, html.nova-desk #layout-sidebar .listing { padding: 0 8px; background: transparent !important; }
html.nova-desk #mailboxlist li, html.nova-desk #mailboxlist li.selected { border: 0 !important; margin: 1px 0; background: transparent !important; }
html.nova-desk #mailboxlist li a { display: flex; align-items: center; height: 38px; padding: 0 12px !important; border-radius: 9px; font-size: 14px; color: var(--nv-text-2) !important; position: relative; }
html.nova-desk #mailboxlist li a:hover { background: var(--nv-hover-2) !important; }
html.nova-desk #mailboxlist li a:before { width: 22px; margin-right: 10px !important; font-size: 15px; color: var(--nv-icon); }
html.nova-desk #mailboxlist li.selected > a, html.nova-desk #mailboxlist li.nv-active > a { background: var(--nv-red-soft) !important; font-weight: 600; color: var(--nv-strong) !important; }
html.nova-desk #mailboxlist li.selected > a:after, html.nova-desk #mailboxlist li.nv-active > a:after { content: ""; position: absolute; left: -8px; top: 7px; bottom: 7px; width: 3px; border-radius: 0 3px 3px 0; background: var(--nv-red); }
html.nova-desk #mailboxlist li.selected > a:before { color: var(--nv-red); }
html.nova-desk #mailboxlist li.nv-starred-filter.selected:not(.nv-active) > a, html.nova-desk #mailboxlist.nv-starred-on li.inbox.selected > a { background: none !important; font-weight: 400; }
html.nova-desk #mailboxlist.nv-starred-on li.inbox.selected > a:after { display: none; }
html.nova-desk #mailboxlist .unreadcount { background: none !important; color: var(--nv-red) !important; font-weight: 700; font-size: 12.5px; }
html.nova-desk #mailboxlist li:not(.selected) .unreadcount { color: var(--nv-muted) !important; font-weight: 500; }
html.nova-desk #mailboxlist li.nv-starred-filter > a:before { content: "\f005"; font-family: "Icons"; font-weight: 400; }
html.nova-desk #layout-sidebar > .footer { border-top: 1px solid var(--nv-line) !important; }

/* message list column */
html.nova-desk #layout-list { width: 380px !important; min-width: 340px !important; max-width: 380px !important; flex: none !important; }
html.nova-desk #messagelist-header { display: block !important; height: auto !important; padding: 16px 16px 8px 20px !important; border: 0 !important; }
html.nova-desk #messagelist-header > .header-title, html.nova-desk #messagelist-header > .back-sidebar-button, html.nova-desk #messagelist-header > .task-menu-button { display: none !important; }
html.nova-desk #messagelist-header #toolbar-list-menu { position: absolute; right: 12px; top: 12px; }
html.nova-desk #messagelist-header #toolbar-list-menu, html.nova-desk #messagelist-header #toolbar-list-menu li { border: 0 !important; box-shadow: none !important; }
html.nova-desk #messagelist-header #toolbar-list-menu li:not(:last-child) { display: none; }
html.nova-desk #messagelist-header a.refresh { position: absolute; right: 50px; top: 12px; }
html.nova-desk #messagelist-header a .inner, html.nova-desk #messagelist-header .toolbar a .inner { display: none !important; }
html.nova-desk #messagelist-header a.refresh, html.nova-desk #messagelist-header #toolbar-list-menu a { width: 34px; height: 34px; border-radius: 9px; color: var(--nv-muted) !important; }
html.nova-desk #messagelist-header a.refresh:hover, html.nova-desk #messagelist-header #toolbar-list-menu a:hover { background: var(--nv-hover); color: var(--nv-text) !important; }
#nova-listhead h1 { display: inline; margin: 0; font-size: 24px; font-weight: 700; color: var(--nv-text); letter-spacing: -.01em; }
#nova-listhead .nv-unread { margin-left: 10px; color: var(--nv-red); font-weight: 600; font-size: 13px; }
#nova-listhead .nv-pills { display: inline-flex; margin-top: 14px; padding: 3px; gap: 2px; background: var(--nv-panel-2); border: 1px solid var(--nv-line); border-radius: 9px; }
#nova-listhead .nv-pills button { border: 1px solid transparent; background: none; color: var(--nv-text-2); font-size: 12.5px; padding: 5px 15px; border-radius: 7px; cursor: pointer; }
#nova-listhead .nv-pills button.on { background: var(--nv-red-soft); border-color: rgba(var(--nv-accent-rgb), .55); color: var(--nv-strong); font-weight: 600; }

html.nova-desk #messagelist-content { padding: 0 8px; }
html.nova-desk #messagelist { border-collapse: separate !important; border-spacing: 0 2px; background: transparent !important; }
html.nova-desk #messagelist tbody tr td { background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--nv-line) !important; color: var(--nv-text); }
html.nova-desk #messagelist tbody tr td.subject { position: relative; padding: 13px 10px 13px 72px !important; height: 78px; }
html.nova-desk #messagelist tbody tr .nv-avatar { position: absolute; left: 22px; top: 17px; }
html.nova-desk #messagelist tbody tr.unread td.subject:before { content: ""; position: absolute; left: 8px; top: 33px; width: 7px; height: 7px; border-radius: 50%; background: var(--nv-red); }
html.nova-desk #messagelist tbody tr span.fromto, html.nova-desk #messagelist tbody tr span.subject { padding-left: 0 !important; margin-left: 0 !important; }
html.nova-desk #messagelist tbody tr span.fromto { display: inline-block; max-width: calc(100% - 84px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; font-weight: 600; color: var(--nv-text) !important; }
html.nova-desk #messagelist tbody tr span.fromto .rcmContactAddress { color: var(--nv-text) !important; }
html.nova-desk #messagelist tbody tr span.date { display: inline !important; visibility: visible !important; position: absolute; right: 10px; top: 15px; float: none; color: var(--nv-muted) !important; font-size: 11.5px; }
html.nova-desk #messagelist tbody tr span.size { display: none; }
html.nova-desk #messagelist tbody tr span.subject { display: block; margin-top: 3px; font-size: 13.5px; }
html.nova-desk #messagelist tbody tr span.subject a, html.nova-desk #messagelist tbody tr span.subject span { color: var(--nv-text-2) !important; }
html.nova-desk #messagelist tbody tr.unread span.subject a { color: var(--nv-strong) !important; font-weight: 600; }
html.nova-desk #messagelist tbody tr span.msgicon.status { display: none !important; }
html.nova-desk #messagelist tbody tr td.flags { position: relative; width: 36px; vertical-align: bottom; padding-bottom: 14px !important; }
html.nova-desk #messagelist tbody tr td.flags span.flag span { color: var(--nv-muted); }
html.nova-desk #messagelist tbody tr td.flags span.flag span.flagged:before { color: #f5b301; }
html.nova-desk #messagelist tbody tr.selected td, html.nova-desk #messagelist tbody tr.focused.selected td { background: rgba(var(--nv-accent-rgb), .09) !important; border-top: 1px solid rgba(var(--nv-accent-rgb), .4) !important; border-bottom: 1px solid rgba(var(--nv-accent-rgb), .4) !important; }
html.nova-desk #messagelist tbody tr.selected td:first-child, html.nova-desk #messagelist tbody tr.selected td.subject { border-left: 1px solid rgba(var(--nv-accent-rgb), .4) !important; border-radius: 12px 0 0 12px; }
html.nova-desk #messagelist tbody tr.selected td:last-child { border-right: 1px solid rgba(var(--nv-accent-rgb), .4) !important; border-radius: 0 12px 12px 0; }
html.nova-desk #messagelist tbody tr:hover td { background: var(--nv-hover-2) !important; }
html.nova-desk #layout-list > .footer { border-top: 1px solid var(--nv-line) !important; }

/* reading column toolbar */
html.nova-desk #layout-content > .header { height: 52px !important; padding: 0 12px !important; border-bottom: 1px solid var(--nv-line) !important; }
html.nova-desk #layout-content > .header > .header-title { display: none !important; }
html.nova-desk #layout-content > .header #toolbar-menu, html.nova-desk #layout-content > .header .menu.toolbar { margin: 0 !important; width: 100%; display: flex !important; align-items: center; justify-content: flex-start !important; gap: 2px; flex-wrap: nowrap; overflow: hidden; }
html.nova-desk #layout-content > .header #toolbar-menu > li { display: flex; align-items: center; }
html.nova-desk #layout-content > .header #toolbar-menu li, html.nova-desk #layout-content > .header #toolbar-menu a { border: 0 !important; box-shadow: none !important; }
html.nova-desk #layout-content > .header .menu.toolbar a { display: inline-flex !important; flex-direction: row !important; align-items: center; gap: 7px; min-width: 0 !important; max-width: none !important; width: auto !important; height: 34px; padding: 0 10px !important; border-radius: 8px; color: var(--nv-text-2) !important; font-size: 13px; }
html.nova-desk #layout-content > .header .menu.toolbar a:before { font-size: 14px !important; margin: 0 !important; display: inline-block !important; }
html.nova-desk #layout-content > .header .menu.toolbar a:after { display: none !important; }
html.nova-desk #layout-content > .header .menu.toolbar a .inner { display: inline !important; font-size: 13px; max-width: none !important; width: auto !important; overflow: visible !important; text-overflow: clip !important; white-space: nowrap; }
html.nova-desk #layout-content > .header .menu.toolbar a:hover { background: var(--nv-hover) !important; }
html.nova-desk #layout-content > .header .menu.toolbar a.disabled { opacity: .45; }
html.nova-desk #layout-content > .header .menu.toolbar a.dropdown { width: 16px !important; padding: 0 !important; margin-left: -8px; }
html.nova-desk #layout-content > .header .menu.toolbar a.dropdown .inner, html.nova-desk #layout-content > .header .menu.toolbar a.more .inner { display: none !important; }
html.nova-desk #layout-content > .header .menu.toolbar a.dropdown:before { font-size: 9px !important; color: var(--nv-muted); }
html.nova-desk #layout-content > .header .menu.toolbar li.spacer { width: 1px; height: 20px; margin: 0 8px; background: var(--nv-line); }
html.nova-desk #layout-content > .header .menu.toolbar > li:has(a.more) { margin-left: auto; }
html.nova-desk #layout-content > .header .menu.toolbar a.compose, html.nova-desk #layout-content > .header .menu.toolbar a.select,
html.nova-desk #layout-content > .header .menu.toolbar a.threads, html.nova-desk #layout-content > .header .menu.toolbar a.options,
html.nova-desk #layout-content > .header .menu.toolbar a.junk, html.nova-desk #layout-content > .header .menu.toolbar a.print,
html.nova-desk #layout-content > .header .menu.toolbar a.download, html.nova-desk #layout-content > .header .menu.toolbar a.source,
html.nova-desk #layout-content > .header .menu.toolbar a.extwin { display: none !important; }
html.nova-desk #layout-content, html.nova-desk #layout-content .iframe-wrapper, html.nova-desk #layout-content .content, html.nova-desk #layout-content iframe { background: var(--nv-panel) !important; }

/* ---------- reading pane (preview iframe) ---------- */
body.action-preview, body.action-show { background: var(--nv-panel) !important; }
body.action-preview #layout-content, body.action-show #layout-content { background: var(--nv-panel) !important; border: 0 !important; }
body.action-preview .frame-content { padding: 22px 26px 120px !important; }
body.action-preview #message-header { border: 0 !important; background: transparent !important; padding: 0 !important; }
body.action-preview #message-header h2.subject { font-size: 23px; font-weight: 700; line-height: 1.25; color: var(--nv-text); margin: 0 0 18px; padding-right: 40px; letter-spacing: -.01em; }
body.action-preview #message-header h2.subject a.extwin { display: none; }
body.action-preview #message-header .header { display: flex; align-items: center; gap: 14px; }
body.action-preview #message-header .header img.contactphoto { display: none; }
body.action-preview #message-header .header .nv-avatar { width: 44px; height: 44px; font-size: 15px; }
body.action-preview #message-header .header-content { flex: 1; }
body.action-preview #message-header .header-summary { font-size: 13.5px; color: var(--nv-muted); }
body.action-preview #message-header .header-summary a, body.action-preview #message-header .header-summary .adr a { color: var(--nv-text) !important; font-weight: 600; font-size: 15px; }
body.action-preview #message-header .header-links { margin-top: 4px; }
body.action-preview #message-header .header-links a { color: var(--nv-muted) !important; font-size: 12px; margin-right: 12px; }
body.action-preview #message-content { border: 0 !important; margin-top: 20px; }
body.action-preview #messagebody, body.action-preview .message-part, body.action-preview .message-htmlpart { background: transparent !important; border: 0 !important; color: var(--nv-text-2); font-size: 14.5px; line-height: 1.6; }
body.action-preview .message-part pre, body.action-preview .message-part div.pre { color: var(--nv-text-2); font-family: "Inter", sans-serif !important; font-size: 14.5px; white-space: pre-wrap; }
body.action-preview .message-htmlpart.nv-light { background: #fff !important; color: #111 !important; border-radius: 12px; padding: 14px !important; }
html.nv-light body.action-preview .message-htmlpart.nv-light { padding: 0 !important; border-radius: 0; }
body.action-preview .message-htmlpart.nv-dark .rcmBody, body.action-preview .message-htmlpart.nv-dark { background: transparent !important; color: var(--nv-text-2) !important; }
body.action-preview .message-htmlpart.nv-dark .rcmBody * { color: inherit; }
body.action-preview .message-htmlpart.nv-dark a { color: var(--nv-red) !important; }
body.action-preview #attachment-list { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; border: 0 !important; }
body.action-preview #attachment-list li { width: 280px; min-height: 58px; display: flex; align-items: center; padding: 10px 12px !important; background: var(--nv-panel-2) !important; border: 1px solid var(--nv-line) !important; border-radius: 10px; font-size: 13px; }
body.action-preview #attachment-list li a { color: var(--nv-text) !important; }
body.action-preview #attachment-list li .attachment-size { color: var(--nv-muted); }
body.action-preview .leftcol { border: 0 !important; }

#nova-quickreply { position: fixed; left: 14px; right: 14px; bottom: 14px; display: flex; flex-direction: column; gap: 10px; padding: 12px 14px; background: var(--nv-panel-2); border: 1px solid var(--nv-line); border-radius: 13px; box-shadow: 0 -8px 24px var(--nv-shadow); }
#nova-quickreply .nv-row { display: flex; align-items: center; gap: 12px; }
#nova-quickreply .nv-placeholder { flex: 1; color: var(--nv-muted); font-size: 14px; cursor: text; }
#nova-quickreply .nv-tools { display: flex; align-items: center; gap: 16px; color: var(--nv-icon); }
#nova-quickreply .nv-tools svg { width: 17px; height: 17px; cursor: pointer; }
#nova-quickreply .nv-send { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 16px; border: 0; border-radius: 9px; background: var(--nv-red); color: #fff; font-weight: 600; font-size: 13.5px; cursor: pointer; }
#nova-quickreply .nv-send svg { width: 16px; height: 16px; }

/* ---------- compose ---------- */
.editor-toolbar, #layout-content .editor-toolbar, .mce-container, .tox .tox-toolbar, .tox .tox-editor-header { background: var(--nv-panel-2) !important; border-color: var(--nv-line) !important; }
#composebody, textarea#composebody, .tox-edit-area__iframe { background: var(--nv-panel) !important; color: var(--nv-text) !important; }
#compose-attachments, .compose-attachments, .file-upload { border-color: var(--nv-line) !important; border-radius: 12px; }
.recipient-input, ul.recipient-input { background: var(--nv-panel-2) !important; border-color: var(--nv-line) !important; }
.recipient-input li.recipient { background: var(--nv-red-soft) !important; border-color: rgba(var(--nv-accent-rgb), .4) !important; color: var(--nv-text) !important; }

/* ---------- login page ---------- */
body.task-login { background: radial-gradient(1100px 560px at 50% -10%, rgba(var(--nv-accent-rgb), .16), transparent 60%), var(--nv-bg) !important; }
body.task-login #layout-content { background: transparent !important; }
body.task-login #login-form { background: var(--nv-panel); border: 1px solid var(--nv-line); border-radius: 18px; padding: 30px 32px; max-width: 400px; margin: 0 auto; box-shadow: 0 24px 64px var(--nv-shadow); }
body.task-login #logo { display: none; }
body.task-login .nv-login-brand { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-bottom: 22px; }
body.task-login .nv-login-brand svg { width: 44px; height: 42px; }
body.task-login .nv-login-brand span { font-family: "Montserrat", "Inter", sans-serif !important; font-weight: 600; font-size: 17px; letter-spacing: .42em; color: var(--nv-text); }
body.task-login #login-footer, body.task-login #login-footer a { color: var(--nv-dim) !important; }
html.nova-desk #taskmenu .special-buttons, html.nova-desk #layout-menu .special-buttons, html.nova-desk #taskmenu .special-buttons a { background: transparent !important; }

/* ---------- fixes v4 ---------- */
/* list icons: Elastic gives the icon a 15px box with a ~35px line-height, which drops the glyph below centre */
html.nova-desk #mailboxlist li a:before, html.nova-desk #directorylist li > a:before,
html.nova-desk #settings-menu li > a:before, html.nova-desk #sections-table td.section:before {
  float: none !important; display: inline-block !important; height: auto !important; line-height: 1 !important; text-align: center; vertical-align: middle; flex: none;
}
/* selected email row: one flat highlight, no per-cell borders that drift out of line */
html.nova-desk #messagelist tbody tr.selected td, html.nova-desk #messagelist tbody tr.focused.selected td { background: rgba(var(--nv-accent-rgb), .11) !important; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; border-bottom-color: transparent !important; box-shadow: none !important; }
html.nova-desk #messagelist tbody tr.selected td.subject { border-radius: 11px 0 0 11px !important; box-shadow: inset 3px 0 0 var(--nv-red) !important; }
html.nova-desk #messagelist tbody tr.selected td.flags { border-radius: 0 11px 11px 0 !important; }
html.nova-desk #messagelist tbody tr td.selection { display: none; }
html.nova-desk #messagelist.withselection tbody tr td.selection { display: table-cell; }
/* logo follows the accent colour */
:root { --nv-red-deep: #8e1c2a; }
html.nv-accent-purple { --nv-red-deep: #4a2fa3; }
html.nv-accent-blue { --nv-red-deep: #1c4aa0; }
html.nv-accent-teal { --nv-red-deep: #0b6a60; }
html.nv-accent-amber { --nv-red-deep: #985c05; }
.nv-logo-a { fill: var(--nv-red); }
/* the dark lines and flame tongue are cut-outs in the colour behind the logo */
.nv-logo-cut { stroke: var(--nv-bg); }
.nv-logo-fill { fill: var(--nv-bg); }
/* "New folder" link under the folder list */
#nova-newfolder { display: flex; align-items: center; gap: 10px; margin: 6px 8px 0; height: 34px; padding: 0 12px; border: 1px dashed var(--nv-line); border-radius: 9px; background: none; color: var(--nv-muted); font-size: 13px; cursor: pointer; width: calc(100% - 16px); }
#nova-newfolder:hover { color: var(--nv-text); border-color: var(--nv-btn-line); background: var(--nv-hover-2); }
#nova-newfolder svg { width: 14px; height: 14px; }
/* ---------- fixes v5: message rows ---------- */
/* Elastic makes td.subject a flex box, so it stops sharing the row height and the divider lines step out of line */
html.nova-desk #messagelist tbody tr td.subject { display: table-cell !important; vertical-align: middle !important; }
html.nova-desk #messagelist tbody tr td.flags { vertical-align: middle !important; padding-bottom: 0 !important; }
html.nova-desk #messagelist tbody tr span.fromto, html.nova-desk #messagelist tbody tr span.subject { line-height: 1.35 !important; }
html.nova-desk #messagelist tbody tr span.subject { margin-top: 2px !important; }
html.nova-desk #messagelist tbody tr .nv-avatar { top: 50% !important; transform: translateY(-50%); }
html.nova-desk #messagelist tbody tr.unread td.subject:before { top: 50% !important; margin-top: -3px; }
html.nova-desk #messagelist tbody tr span.date { top: calc(50% - 19px) !important; line-height: 1.6; }
/* name sits in its own tight line (an inline-block inherited the cell's tall line box) */
html.nova-desk #messagelist tbody tr td.subject { line-height: 1.35 !important; }
html.nova-desk #messagelist tbody tr span.fromto { display: block !important; }

/* Flame Mail lockup: envelope + flame, bold tight wordmark */
#nova-topbar .nv-brand { gap: 11px; }
#nova-topbar .nv-brand svg { width: 31px !important; height: 32px !important; }
#nova-topbar .nv-brand span { font-family: "Montserrat", "Inter", sans-serif !important; font-weight: 800 !important; font-size: 18px !important; letter-spacing: .01em !important; }
body.task-login .nv-login-brand svg { width: 54px !important; height: 56px !important; }
body.task-login .nv-login-brand span { font-family: "Montserrat", "Inter", sans-serif !important; font-weight: 800 !important; font-size: 24px !important; letter-spacing: .01em !important; }
body.task-login #login-form .nv-logo-cut { stroke: var(--nv-panel); }
body.task-login #login-form .nv-logo-fill { fill: var(--nv-panel); }
