/* DennyTips dark theme options — scoped overrides on top of dennytips-theme.css + dt-shell.css. Apply by setting data-dt-dark + data-dt-theme="graphite|midnight|slate" on a wrapper (or ). */ [data-dt-theme="graphite"] { --dt-blue: #58a6e8; --dt-blue-dark: #7cbcf0; --dt-cyan: #46bdf0; --dt-ink: #e9edf1; --dt-muted: #aeb9c4; --dt-grey: #7f8b97; --dt-bg: #131619; --dt-line: #2a313a; --dt-ok: #3ecf85; --dt-warn: #f0a63b; --dt-err: #f07067; --dtd-side: rgba(24,28,32,.94); --dtd-surface: #1b2026; --dtd-surface-hi: #262d35; --dtd-line-soft: #232a32; --dtd-active: rgba(88,166,232,.14); --dtd-bar: rgba(88,166,232,.35); --dtd-bar-hover: rgba(88,166,232,.65); --dtd-bar-val: #5c6a77; } [data-dt-dark] { color: var(--dt-ink); } [data-dt-dark] .dt-sidebar { background: var(--dtd-side); border-right-color: rgba(255,255,255,.07); scrollbar-color: rgba(255,255,255,.2) transparent; } [data-dt-dark] .dt-brand img, [data-dt-dark] .dt-topbar-mobile img { filter: brightness(0) invert(1); opacity: .92; } [data-dt-dark] .dt-admin-chip { background: rgba(240,112,103,.16); color: #ff9a90; } [data-dt-dark] .dt-nav-heading { color: var(--dt-grey); } [data-dt-dark] .dt-nav-link { color: var(--dt-muted); } [data-dt-dark] .dt-nav-link:hover { color: var(--dt-ink); background: rgba(255,255,255,.05); } [data-dt-dark] .dt-nav-link .dt-nav-ico { color: var(--dt-grey); } [data-dt-dark] .dt-nav-link.active, [data-dt-dark] .dt-nav-link.active:hover { background: var(--dtd-active); color: var(--dt-blue); } [data-dt-dark] .dt-nav-link.active .dt-nav-ico { color: var(--dt-blue); } [data-dt-dark] .dt-seg { background: rgba(0,0,0,.28); border-color: rgba(255,255,255,.06); } [data-dt-dark] .dt-seg a { color: var(--dt-grey); } [data-dt-dark] .dt-seg a:hover { color: var(--dt-ink); } [data-dt-dark] .dt-seg a.active { background: var(--dtd-surface-hi); color: var(--dt-ink); box-shadow: 0 1px 3px rgba(0,0,0,.5); } [data-dt-dark] .dt-account:hover { background: rgba(255,255,255,.06); } [data-dt-dark] .dt-account .dt-account-name { color: var(--dt-ink); } [data-dt-dark] .dt-widget, [data-dt-dark] .dt-chart2, [data-dt-dark] .dt-card, [data-dt-dark] .dt-table-card, [data-dt-dark] .dt-tile, [data-dt-dark] .dt-empty { background: var(--dtd-surface); border-color: var(--dt-line); box-shadow: 0 1px 2px rgba(0,0,0,.35); } [data-dt-dark] .dt-widget-foot { border-top-color: var(--dtd-line-soft); } [data-dt-dark] .dt-widget-chip.dt-chip-blue { background: rgba(88,166,232,.16); } [data-dt-dark] .dt-widget-chip.dt-chip-green { background: rgba(62,207,133,.14); } [data-dt-dark] .dt-widget-chip.dt-chip-amber { background: rgba(240,166,59,.14); } [data-dt-dark] .dt-chart2-grid { border-top-color: var(--dtd-line-soft); } [data-dt-dark] .dt-chart2-grid.dt-baseline { border-top-color: var(--dt-line); } [data-dt-dark] .dt-bar2 { background: var(--dtd-bar); } [data-dt-dark] .dt-bar2-col:hover .dt-bar2 { background: var(--dtd-bar-hover); } [data-dt-dark] .dt-bar2-col.dt-peak .dt-bar2, [data-dt-dark] .dt-bar2-col.dt-peak:hover .dt-bar2 { background: linear-gradient(180deg, #2fb1ea, #1878d0); } [data-dt-dark] .dt-bar2-val { color: var(--dtd-bar-val); } [data-dt-dark] .dt-bar2-tip { background: #05101c; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 6px 16px rgba(0,0,0,.5); } [data-dt-dark] .dt-eyebrow { color: var(--dt-grey); } [data-dt-dark] .dt-topbar-mobile { background: var(--dtd-surface); border-bottom-color: var(--dt-line); } [data-dt-dark] .dt-hamburger span { background: var(--dt-ink); } /* ================= Full coverage for all Areas pages ================= */ /* Shared tint helpers (graphite) */ [data-dt-theme="graphite"] { --dtd-tint-blue: rgba(88,166,232,.14); --dtd-tint-blue-strong: rgba(88,166,232,.22); --dtd-tint-green: rgba(62,207,133,.14); --dtd-tint-amber: rgba(240,166,59,.14); --dtd-tint-red: rgba(240,112,103,.14); --dtd-input-bg: #14181d; --dtd-input-focus-bg: #10141a; --dtd-border: #333c46; } /* Typography */ [data-dt-dark] h1, [data-dt-dark] h2, [data-dt-dark] h3, [data-dt-dark] h4, [data-dt-dark] h5, [data-dt-dark] h6 { color: var(--dt-ink); } /* Buttons */ [data-dt-dark] .btn-secondary, [data-dt-dark] .btn-light, [data-dt-dark] .btn-dark { background: var(--dtd-surface-hi); border-color: var(--dtd-border); color: var(--dt-muted); } [data-dt-dark] .btn-secondary:hover, [data-dt-dark] .btn-light:hover, [data-dt-dark] .btn-dark:hover { background: var(--dtd-surface-hi); border-color: var(--dt-blue); color: var(--dt-blue); } [data-dt-dark] .btn-warning { background: var(--dtd-tint-amber); border-color: rgba(240,166,59,.35); color: var(--dt-warn); } [data-dt-dark] .btn-warning:hover { background: rgba(240,166,59,.24); color: var(--dt-warn); } [data-dt-dark] .btn-outline-primary:hover { background: var(--dtd-tint-blue); } [data-dt-dark] .btn-outline-danger { background: transparent; } [data-dt-dark] .btn-outline-danger:hover { background: var(--dtd-tint-red); } [data-dt-dark] .btn-outline-light { border-color: var(--dtd-border); color: var(--dt-muted); } [data-dt-dark] .btn-pill { background: var(--dtd-surface-hi); border-color: var(--dtd-border); color: var(--dt-muted); } [data-dt-dark] .btn-pill:hover { border-color: var(--dt-blue); color: var(--dt-blue); } [data-dt-dark] .btn-pill.active { background: var(--dtd-tint-blue); border-color: var(--dt-blue); color: var(--dt-blue); } [data-dt-dark] .btn-tint-primary { background: var(--dtd-tint-blue); border-color: transparent; color: var(--dt-blue); } [data-dt-dark] .btn-tint-primary:hover { background: var(--dtd-tint-blue-strong); border-color: transparent; } [data-dt-dark] .dt-btn-outline2, [data-dt-dark] .dt-sa-stepbtn, [data-dt-dark] .dt-sa-copy { background: var(--dtd-surface-hi); border-color: var(--dtd-border); } [data-dt-dark] .dt-btn-outline2:hover { background: var(--dtd-surface-hi); border-color: var(--dt-blue); } [data-dt-dark] .dt-sa-stepbtn { color: var(--dt-muted); } [data-dt-dark] .dt-sa-stepbtn.dt-sa-stepdis { color: var(--dtd-border); } [data-dt-dark] .dt-sa-month { color: var(--dt-ink); } /* Forms */ [data-dt-dark] label, [data-dt-dark] .form-label, [data-dt-dark] .dt-toolbar-label, [data-dt-dark] .dt-upload-row .dt-upload-title { color: var(--dt-muted); } [data-dt-dark] .form-control, [data-dt-dark] .form-select, [data-dt-dark] .custom-select { background: var(--dtd-input-bg); color: var(--dt-ink); } [data-dt-dark] .form-control:focus, [data-dt-dark] .form-select:focus, [data-dt-dark] .custom-select:focus { background: var(--dtd-input-focus-bg); border-color: var(--dt-blue); color: var(--dt-ink); } [data-dt-dark] .form-control::placeholder { color: var(--dt-grey); } [data-dt-dark] .form-control[readonly], [data-dt-dark] .form-control:disabled { background: var(--dtd-surface-hi); color: var(--dt-grey); } [data-dt-dark] .form-control.is-invalid, [data-dt-dark] .was-validated .form-control:invalid { background: var(--dtd-input-bg); } [data-dt-dark] .form-control.is-valid, [data-dt-dark] .was-validated .form-control:valid { background: var(--dtd-input-bg); } [data-dt-dark] .input-group-text, [data-dt-dark] .input-group-addon { background: var(--dtd-surface-hi); color: var(--dt-muted); } [data-dt-dark] .form-check-input, [data-dt-dark] .dt-check, [data-dt-dark] .dt-matrix input[type="checkbox"] { background-color: var(--dtd-input-bg); border-color: var(--dtd-border); } [data-dt-dark] .form-check-input:checked, [data-dt-dark] .dt-check:checked, [data-dt-dark] .dt-matrix input[type="checkbox"]:checked { background-color: var(--dt-blue); border-color: var(--dt-blue); } [data-dt-dark] .dt-switch .dt-switch-track, [data-dt-dark] .form-switch .form-check-input, [data-dt-dark] .custom-switch .custom-control-label::before { background: var(--dtd-border); } [data-dt-dark] .dt-switch input:checked ~ .dt-switch-track, [data-dt-dark] .form-switch .form-check-input:checked, [data-dt-dark] .custom-switch .custom-control-input:checked ~ .custom-control-label::before { background: var(--dt-blue); } [data-dt-dark] .dt-amount-input { background: var(--dtd-input-bg); border-color: var(--dtd-border); color: var(--dt-ink); } [data-dt-dark] .dt-upload-row { border-color: var(--dtd-border); } /* Toolbars, search, menus */ [data-dt-dark] .dt-toolbar { border-bottom-color: var(--dt-line); } [data-dt-dark] .dt-toolbar-input, [data-dt-dark] .dt-toolbar-date { background: var(--dtd-input-bg); color: var(--dt-ink); } [data-dt-dark] .dt-toolbar-input:focus, [data-dt-dark] .dt-toolbar-date:focus { background: var(--dtd-input-focus-bg); } [data-dt-dark] .dt-toolbar-input::placeholder { color: var(--dt-grey); } [data-dt-dark] .dt-toolbar-clear { background: var(--dtd-surface-hi); color: var(--dt-muted); } [data-dt-dark] .dt-icon-btn:hover { background: rgba(255,255,255,.07); color: var(--dt-ink); } [data-dt-dark] .dt-icon-btn.open { background: var(--dtd-tint-blue); } [data-dt-dark] .dt-menu, [data-dt-dark] .dt-account-menu, [data-dt-dark] .dropdown-menu, [data-dt-dark] .select2-dropdown, [data-dt-dark] .datepicker.dropdown-menu, [data-dt-dark] .popover, [data-dt-dark] .modal-content { background: var(--dtd-surface-hi); border-color: var(--dtd-border); box-shadow: 0 10px 30px rgba(0,0,0,.5); } [data-dt-dark] .dt-menu a, [data-dt-dark] .dt-menu button, [data-dt-dark] .dt-account-menu a, [data-dt-dark] .dropdown-item, [data-dt-dark] .link-list-opt a { color: var(--dt-muted); } [data-dt-dark] .dt-menu a:hover, [data-dt-dark] .dt-menu button:hover, [data-dt-dark] .dt-account-menu a:hover, [data-dt-dark] .dropdown-item:hover, [data-dt-dark] .link-list-opt a:hover { background: rgba(255,255,255,.06); color: var(--dt-ink); } [data-dt-dark] .dt-menu .dt-danger:hover, [data-dt-dark] .dt-account-menu a.dt-danger:hover, [data-dt-dark] .dropdown-item.text-danger:hover { background: var(--dtd-tint-red); } [data-dt-dark] .dt-account-menu .dt-menu-head, [data-dt-dark] .dropdown-divider { border-color: var(--dtd-line-soft); } /* Tables */ [data-dt-dark] .table { color: var(--dt-muted); } [data-dt-dark] .table thead th, [data-dt-dark] .nk-tb-head .sub-text { background: var(--dtd-surface); color: var(--dt-grey); border-bottom-color: var(--dt-line); } [data-dt-dark] .table td, [data-dt-dark] .table th { border-color: var(--dtd-line-soft); } [data-dt-dark] .table-hover tbody tr:hover, [data-dt-dark] .table tbody tr:hover { background: rgba(255,255,255,.03); } [data-dt-dark] .table .tb-lead, [data-dt-dark] .dt-lead .dt-lead-name { color: var(--dt-ink); } [data-dt-dark] .dt-table-card .table td { border-bottom-color: var(--dtd-line-soft); } [data-dt-dark] .dt-table-foot { background: var(--dtd-surface); border-top-color: var(--dt-line); } [data-dt-dark] .dt-lead .dt-avatar, [data-dt-dark] .dt-lead .dt-avatar.dt-avatar-alt { background: var(--dtd-tint-blue); color: var(--dt-blue); } /* Cards / stats / tiles */ [data-dt-dark] .card, [data-dt-dark] .dt-summary-card, [data-dt-dark] .dt-qs-card, [data-dt-dark] .dt-dir-card, [data-dt-dark] .dt-chart-card, [data-dt-dark] .dt-danger-card { background: var(--dtd-surface); border-color: var(--dt-line); } [data-dt-dark] .card-header { border-bottom-color: var(--dtd-line-soft); color: var(--dt-ink); } [data-dt-dark] .dt-stat, [data-dt-dark] .card-stat { background: rgba(255,255,255,.04); border-color: var(--dt-line); } [data-dt-dark] .dt-metric { border-right-color: var(--dtd-line-soft); } [data-dt-dark] .dt-progress-track, [data-dt-dark] .progress { background: var(--dtd-line-soft); } [data-dt-dark] a.dt-tile:hover { border-color: var(--dt-blue); } [data-dt-dark] .dt-danger-card { border-color: rgba(240,112,103,.4); } [data-dt-dark] .dt-qs-row { border-bottom-color: var(--dtd-line-soft); } [data-dt-dark] .dt-qs-row:hover { background: rgba(255,255,255,.03); } [data-dt-dark] .dt-qs-mark { background: var(--dtd-border); } [data-dt-dark] .dt-empty-icon { background: var(--dtd-tint-blue); } [data-dt-dark] .dt-empty-badge { background: var(--dtd-tint-amber); border-color: var(--dtd-surface); } [data-dt-dark] .dt-widget-stars .dt-star-empty, [data-dt-dark] .dt-head-rating .dt-rating-stars .dt-star-empty { color: var(--dtd-border); } [data-dt-dark] .dt-qr-card, [data-dt-dark] .dt-qr-card.dt-qr-v2 .dt-qr-frame, [data-dt-dark] .dt-qr-card .dt-qr-img { background: var(--dtd-surface); border-color: var(--dt-line); } [data-dt-dark] .dt-qr-card .dt-qr-frame, [data-dt-dark] .dt-qr-card.dt-qr-v2 .dt-qr-frame { background: #fff; } /* QR must stay scannable */ /* Chips, callouts, banners, how-to */ [data-dt-dark] .dt-callout, [data-dt-dark] .dt-shift-banner, [data-dt-dark] .dt-how { background: var(--dtd-tint-blue); border-color: rgba(88,166,232,.3); color: var(--dt-muted); } [data-dt-dark] .dt-callout.dt-callout-warn { background: var(--dtd-tint-amber); border-color: rgba(240,166,59,.3); color: var(--dt-warn); } [data-dt-dark] .dt-shift-banner .dt-shift-text, [data-dt-dark] .dt-how-title { color: var(--dt-ink); } [data-dt-dark] .dt-shift-banner .dt-shift-chip, [data-dt-dark] .dt-how-chip { background: var(--dtd-surface-hi); } [data-dt-dark] .dt-how-step { background: var(--dtd-surface); border-color: var(--dt-line); } [data-dt-dark] .dt-verified-chip { background: var(--dtd-tint-green); } [data-dt-dark] .dt-dir-chip.dt-chip-blue { background: var(--dtd-tint-blue); } [data-dt-dark] .dt-dir-chip.dt-chip-green { background: var(--dtd-tint-green); } [data-dt-dark] .dt-dir-chip.dt-chip-amber { background: var(--dtd-tint-amber); } [data-dt-dark] .dt-dir-body b { color: var(--dt-ink); } /* Alerts / badges / toasts */ [data-dt-dark] .alert-info, [data-dt-dark] .alert-primary, [data-dt-dark] .dt-toast.dt-toast-info { background: var(--dtd-tint-blue); border-color: rgba(88,166,232,.35); color: var(--dt-blue-dark); } [data-dt-dark] .alert-success, [data-dt-dark] .dt-toast.dt-toast-ok { background: var(--dtd-tint-green); border-color: rgba(62,207,133,.35); color: var(--dt-ok); } [data-dt-dark] .alert-warning, [data-dt-dark] .alert-light, [data-dt-dark] .dt-toast.dt-toast-warn { background: var(--dtd-tint-amber); border-color: rgba(240,166,59,.35); color: var(--dt-warn); } [data-dt-dark] .alert-danger, [data-dt-dark] .dt-toast.dt-toast-err { background: var(--dtd-tint-red); border-color: rgba(240,112,103,.35); color: var(--dt-err); } [data-dt-dark] .badge-success, [data-dt-dark] .bg-success { background: var(--dtd-tint-green) !important; } [data-dt-dark] .badge-warning, [data-dt-dark] .bg-warning { background: var(--dtd-tint-amber) !important; } [data-dt-dark] .badge-danger, [data-dt-dark] .bg-danger { background: var(--dtd-tint-red) !important; } [data-dt-dark] .badge-info, [data-dt-dark] .badge-primary, [data-dt-dark] .bg-info, [data-dt-dark] .bg-primary { background: var(--dtd-tint-blue) !important; } [data-dt-dark] .badge-secondary, [data-dt-dark] .bg-secondary { background: var(--dtd-surface-hi) !important; color: var(--dt-muted) !important; } [data-dt-dark] .dt-toast { background: var(--dtd-surface-hi); border-color: var(--dtd-border); color: var(--dt-ink); } [data-dt-dark] .toast { background: var(--dtd-surface-hi); border-color: var(--dtd-border); } [data-dt-dark] .toast-header { border-bottom-color: var(--dtd-line-soft); color: var(--dt-ink); } /* Pagination / tabs / list group / breadcrumb */ [data-dt-dark] .page-link { background: transparent; border-color: var(--dtd-border); color: var(--dt-muted); } [data-dt-dark] .page-link:hover { background: rgba(255,255,255,.06); } [data-dt-dark] .page-item.active .page-link { background: var(--dt-blue); border-color: var(--dt-blue); color: #0d1420; } [data-dt-dark] .page-item.disabled .page-link { color: var(--dtd-border); border-color: var(--dtd-line-soft); } [data-dt-dark] .nav-tabs, [data-dt-dark] .nav-pills, [data-dt-dark] .dt-tabs { background: rgba(0,0,0,.28); } [data-dt-dark] .nav-tabs .nav-link, [data-dt-dark] .nav-pills .nav-link, [data-dt-dark] .dt-tabs button { color: var(--dt-grey); } [data-dt-dark] .nav-tabs .nav-link.active, [data-dt-dark] .nav-pills .nav-link.active, [data-dt-dark] .dt-tabs button.active { background: var(--dtd-surface-hi); color: var(--dt-ink); box-shadow: 0 1px 3px rgba(0,0,0,.5); } [data-dt-dark] .list-group-item { background: var(--dtd-surface); border-color: var(--dtd-line-soft); color: var(--dt-muted); } [data-dt-dark] .list-group-item.active { background: var(--dtd-tint-blue); border-color: transparent; color: var(--dt-blue); } [data-dt-dark] .breadcrumb-item.active { color: var(--dt-ink); } /* Modals */ [data-dt-dark] .modal-header, [data-dt-dark] .modal-footer { border-color: var(--dtd-line-soft); } [data-dt-dark] .modal-backdrop.show { background: #000; opacity: .6; } [data-dt-dark] .close { color: var(--dt-grey); } [data-dt-dark] .close:hover { color: var(--dt-ink); } /* Select2 */ [data-dt-dark] .select2-container--default .select2-selection--single, [data-dt-dark] .select2-container--default .select2-selection--multiple { background: var(--dtd-input-bg); } [data-dt-dark] .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--dt-ink); } [data-dt-dark] .select2-container--default.select2-container--focus .select2-selection--single, [data-dt-dark] .select2-container--default.select2-container--open .select2-selection--single, [data-dt-dark] .select2-container--default.select2-container--focus .select2-selection--multiple, [data-dt-dark] .select2-container--default.select2-container--open .select2-selection--multiple { background: var(--dtd-input-focus-bg); } [data-dt-dark] .select2-container--default .select2-selection--multiple .select2-selection__choice { background: var(--dtd-tint-blue); } [data-dt-dark] .select2-search--dropdown .select2-search__field { background: var(--dtd-input-bg); border-color: var(--dtd-border); color: var(--dt-ink); } [data-dt-dark] .select2-results__option { color: var(--dt-muted); } [data-dt-dark] .select2-container--default .select2-results__option--highlighted[aria-selected], [data-dt-dark] .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background: var(--dtd-tint-blue); color: var(--dt-blue); } [data-dt-dark] .select2-close-mask { background-color: transparent; } /* Datepicker */ [data-dt-dark] .datepicker table tr td, [data-dt-dark] .datepicker table tr th { color: var(--dt-ink); } [data-dt-dark] .datepicker table tr th.dow, [data-dt-dark] .datepicker .prev, [data-dt-dark] .datepicker .next { color: var(--dt-grey); } [data-dt-dark] .datepicker .datepicker-switch:hover, [data-dt-dark] .datepicker .prev:hover, [data-dt-dark] .datepicker .next:hover, [data-dt-dark] .datepicker tfoot tr th:hover, [data-dt-dark] .datepicker table tr td.day:hover, [data-dt-dark] .datepicker table tr td.focused, [data-dt-dark] .datepicker table tr td span:hover { background: rgba(255,255,255,.07); } [data-dt-dark] .datepicker table tr td.old, [data-dt-dark] .datepicker table tr td.new, [data-dt-dark] .datepicker table tr td.disabled, [data-dt-dark] .datepicker table tr td.disabled:hover { color: var(--dtd-border); } [data-dt-dark] .datepicker table tr td.today, [data-dt-dark] .datepicker table tr td.today:hover { background: var(--dtd-tint-blue); } /* Chart (legacy dt-chart-card) */ [data-dt-dark] .dt-chart-bars { border-left-color: var(--dt-line); border-bottom-color: var(--dt-line); } [data-dt-dark] .dt-chart-bars .dt-gridline { border-top-color: var(--dtd-line-soft); } /* Public / auth / doc / error pages (dt-pub-*, dt-doc-*) — hardcoded colors in shell */ [data-dt-dark] .dt-pub-wrap, [data-dt-dark] .dt-doc-wrap { background: var(--dt-bg); } [data-dt-dark] .dt-pub-card, [data-dt-dark] .dt-doc-card, [data-dt-dark] .dt-doc-topbar { background: var(--dtd-surface); border-color: var(--dt-line); } [data-dt-dark] .dt-pub-title, [data-dt-dark] .dt-pub-text b, [data-dt-dark] .dt-doc-card h1, [data-dt-dark] .dt-doc-card h2, [data-dt-dark] .dt-doc-card h3, [data-dt-dark] .dt-doc-card h4 { color: var(--dt-ink); } [data-dt-dark] .dt-pub-title small, [data-dt-dark] .dt-pub-text, [data-dt-dark] .dt-doc-card p { color: var(--dt-muted); } [data-dt-dark] .dt-pub-text a, [data-dt-dark] .dt-doc-card a { color: var(--dt-blue); } [data-dt-dark] .dt-pub-icon-ok { background: var(--dtd-tint-green); } [data-dt-dark] .dt-pub-icon-err { background: var(--dtd-tint-red); } [data-dt-dark] .dt-pub-icon-info { background: var(--dtd-tint-blue); } [data-dt-dark] .dt-pub-icon-pending { background: var(--dtd-tint-amber); } [data-dt-dark] .dt-pub-btn-outline { background: var(--dtd-surface-hi); border-color: var(--dtd-border); color: var(--dt-ink); } [data-dt-dark] .dt-pub-btn-outline:hover, [data-dt-dark] .dt-pub-btn-outline:focus { border-color: var(--dt-blue); color: var(--dt-blue); } [data-dt-dark] .dt-error-title { color: var(--dt-ink); } [data-dt-dark] .dt-error-text { color: var(--dt-muted); } /* Misc */ [data-dt-dark] .user-avatar.bg-white { background: var(--dtd-surface-hi); border-color: var(--dt-line); } [data-dt-dark] .dt-note { color: var(--dt-grey); }