@import url("https://fonts.googleapis.com/css2?family=Martian+Mono:wdth,wght@75..112.5,100..800&display=swap");

:root { --nt-bg:#0e0911; --nt-bg2:#120c15; --nt-panel:#171019; --nt-line:#2e2231;
        --nt-text:#f4eaf1; --nt-muted:#9b8a99; --nt-pink:#ff4d9d; --nt-soft:#ffc2dd; }

html.dark-mode, html.dark-mode body,
html.dark-mode input, html.dark-mode button, html.dark-mode select, html.dark-mode textarea,
html.dark-mode .btn, html.dark-mode .form-control, html.dark-mode .popover, html.dark-mode .ui-dialog {
  font-family: "Martian Mono", ui-monospace, "JetBrains Mono", Consolas, monospace !important;
  font-stretch: 87.5%;
}
html.dark-mode body { background: var(--nt-bg) !important; color: var(--nt-text) !important; font-size: 13px; }
html.dark-mode ::selection { background: var(--nt-pink); color: var(--nt-bg); }

/* каркас */
html.dark-mode #layout,
html.dark-mode #layout > div,
html.dark-mode #layout-content,
html.dark-mode #layout-list { background-color: var(--nt-bg) !important; }
html.dark-mode #layout-sidebar { background-color: var(--nt-bg2) !important; }
html.dark-mode #layout-menu { background-color: #09050b !important; border-right: 1px solid var(--nt-line); }
html.dark-mode #layout > div,
html.dark-mode #layout-sidebar, html.dark-mode #layout-list, html.dark-mode #layout-content { border-color: var(--nt-line) !important; }
html.dark-mode .header, html.dark-mode .footer,
html.dark-mode #layout-content > .header, html.dark-mode #layout-list > .header, html.dark-mode #layout-sidebar > .header {
  background-color: var(--nt-panel) !important; border-color: var(--nt-line) !important; color: var(--nt-text) !important;
}
html.dark-mode iframe { background-color: var(--nt-bg) !important; }

/* левое меню задач */
html.dark-mode #taskmenu a { color: var(--nt-muted) !important; }
html.dark-mode #taskmenu a:hover { color: var(--nt-soft) !important; background: var(--nt-panel) !important; }
html.dark-mode #taskmenu a.selected { color: var(--nt-pink) !important; background: var(--nt-panel) !important; }
html.dark-mode #taskmenu .action-buttons a,
html.dark-mode #taskmenu a.compose { background: var(--nt-pink) !important; color: var(--nt-bg) !important; border-radius: 0 !important; }
html.dark-mode #taskmenu .action-buttons a:hover,
html.dark-mode #taskmenu a.compose:hover { background: var(--nt-soft) !important; }
html.dark-mode #logo { max-width: 100%; }

/* ссылки и кнопки */
html.dark-mode a, html.dark-mode .btn-link, html.dark-mode a.btn.btn-link { color: var(--nt-soft); }
html.dark-mode a:hover { color: var(--nt-pink); }
html.dark-mode .btn { border-radius: 0 !important; }
html.dark-mode .btn-primary, html.dark-mode .btn.primary,
html.dark-mode button.mainaction, html.dark-mode .btn.mainaction {
  background: var(--nt-pink) !important; border-color: var(--nt-pink) !important; color: var(--nt-bg) !important; font-weight: 600;
}
html.dark-mode .btn-primary:hover, html.dark-mode .btn.mainaction:hover, html.dark-mode button.mainaction:hover {
  background: var(--nt-soft) !important; border-color: var(--nt-soft) !important; box-shadow: 0 0 30px rgba(255,77,157,.45);
}
html.dark-mode .btn-secondary { background: transparent !important; border-color: var(--nt-line) !important; color: var(--nt-soft) !important; }
html.dark-mode .btn-secondary:hover { border-color: var(--nt-pink) !important; color: var(--nt-pink) !important; }
html.dark-mode .btn-danger { background: transparent !important; border-color: #ff5d6c !important; color: #ff8f9a !important; }
html.dark-mode .toolbar a.button, html.dark-mode .menu a { color: var(--nt-text) !important; }
html.dark-mode .toolbar a.button:hover:not(.disabled), html.dark-mode .menu a:hover:not(.disabled) { color: var(--nt-pink) !important; background: transparent !important; }
html.dark-mode .toolbar a.button.disabled, html.dark-mode .menu a.disabled { color: #5b4d59 !important; }

/* списки: папки и письма */
html.dark-mode .listing li, html.dark-mode .listing tbody td, html.dark-mode table.listing td { border-color: var(--nt-line) !important; }
html.dark-mode .listing li > a, html.dark-mode .listing li a { color: var(--nt-text) !important; }
html.dark-mode .listing li.selected, html.dark-mode .listing li.selected > a,
html.dark-mode .listing tbody tr.selected td, html.dark-mode table.listing tr.selected td,
html.dark-mode .messagelist tr.selected td {
  background-color: #2a1324 !important; color: var(--nt-soft) !important;
}
html.dark-mode .listing li.selected > a, html.dark-mode .listing li.mailbox.selected > a { color: var(--nt-pink) !important; }
html.dark-mode .listing li:hover, html.dark-mode .listing tbody tr:hover td { background-color: #1b111c; }
html.dark-mode .messagelist tr.unread td, html.dark-mode .messagelist tr.unread a { color: #fff !important; font-weight: 600; }
html.dark-mode .messagelist td.subject span.fromto { color: var(--nt-soft) !important; }
html.dark-mode .messagelist td.subject span.date, html.dark-mode .messagelist span.size { color: var(--nt-muted) !important; }
html.dark-mode .messagelist span.msgicon.status.unread:before, html.dark-mode .unreadcount, html.dark-mode .badge-primary { color: var(--nt-pink) !important; }
html.dark-mode .unreadcount { background: transparent !important; }
html.dark-mode .searchbar, html.dark-mode .searchbar input, html.dark-mode .pagenav, html.dark-mode .pagenav.dark { background-color: var(--nt-bg2) !important; border-color: var(--nt-line) !important; color: var(--nt-text) !important; }

/* поля ввода */
html.dark-mode .form-control, html.dark-mode .custom-select, html.dark-mode .input-group-text,
html.dark-mode textarea, html.dark-mode input[type=text], html.dark-mode input[type=password], html.dark-mode input[type=email],
html.dark-mode .recipient-input, html.dark-mode .tox-tinymce {
  background-color: var(--nt-panel) !important; border-color: var(--nt-line) !important; color: var(--nt-text) !important; border-radius: 0 !important;
}
html.dark-mode .form-control:focus, html.dark-mode .custom-select:focus, html.dark-mode .recipient-input.focus {
  border-color: var(--nt-pink) !important; box-shadow: 0 0 0 1px var(--nt-pink) !important;
}
html.dark-mode .custom-control-input:checked ~ .custom-control-label::before { background-color: var(--nt-pink) !important; border-color: var(--nt-pink) !important; }
html.dark-mode label, html.dark-mode .col-form-label, html.dark-mode legend { color: var(--nt-muted); }
html.dark-mode .recipient-input .recipient { background: #2a1324 !important; border-color: var(--nt-line) !important; color: var(--nt-soft) !important; border-radius: 0 !important; }

/* всплывающие окна, меню, вкладки */
html.dark-mode .popover, html.dark-mode .popover-body, html.dark-mode .ui-dialog, html.dark-mode .ui-dialog-content,
html.dark-mode .ui-dialog-titlebar, html.dark-mode .ui-dialog-buttonpane, html.dark-mode .dropdown-menu, html.dark-mode .ui-menu {
  background-color: var(--nt-panel) !important; border-color: var(--nt-line) !important; color: var(--nt-text) !important; border-radius: 0 !important;
}
html.dark-mode .ui-dialog { border: 1px solid var(--nt-pink) !important; box-shadow: 0 30px 90px -20px rgba(255,77,157,.4) !important; }
html.dark-mode .nav-tabs { border-color: var(--nt-line) !important; }
html.dark-mode .nav-tabs .nav-link { color: var(--nt-muted) !important; border-radius: 0 !important; }
html.dark-mode .nav-tabs .nav-link.active { color: var(--nt-pink) !important; background: transparent !important; border-color: transparent transparent var(--nt-pink) !important; }
html.dark-mode .boxtitle, html.dark-mode .propform fieldset, html.dark-mode .formcontent { border-color: var(--nt-line) !important; }
html.dark-mode #messagestack div, html.dark-mode .ui.alert { border-radius: 0 !important; }

/* просмотр письма */
html.dark-mode #message-header, html.dark-mode .message-partheaders { border-color: var(--nt-line) !important; }
html.dark-mode #message-header .subject, html.dark-mode h2.subject { color: var(--nt-text) !important; font-weight: 800; letter-spacing: -0.02em; }
html.dark-mode #message-header .header-links a, html.dark-mode .header-title a { color: var(--nt-soft) !important; }
html.dark-mode .attachmentslist li { background: var(--nt-panel) !important; border-color: var(--nt-line) !important; border-radius: 0 !important; }

/* страница входа */
html.dark-mode body.task-login, html.dark-mode body.task-login #layout, html.dark-mode body.task-login #layout-content {
  background:
    radial-gradient(60% 50% at 50% 30%, rgba(255,77,157,.13), transparent 70%),
    var(--nt-bg) !important;
}
html.dark-mode body.task-login #logo { width: 330px; max-width: 80vw; margin-bottom: 1.5rem; }
html.dark-mode body.task-login #login-form { max-width: 360px; }
html.dark-mode body.task-login #login-form .input-group-text { color: var(--nt-pink) !important; }
html.dark-mode body.task-login #login-footer, html.dark-mode body.task-login #login-footer a { color: var(--nt-muted) !important; }

/* полосы прокрутки и фокус */
html.dark-mode * { scrollbar-color: var(--nt-line) transparent; }
html.dark-mode a:focus-visible, html.dark-mode button:focus-visible { outline: 2px solid var(--nt-pink); outline-offset: 2px; }
