/* =====================================================
   ROOMS-DARK-1: dark mode for Rooms 0 + 2. Per device, html.s26-dark.
   Screen only: printing and PDFs never change.
   The invoice editor goes dark too: the customer PDF is made elsewhere and never changes.
   ===================================================== */
@media screen {

html.s26-dark body.shell-room0 {
    --s26-accent: #22d3ee;
    --s26-accent-deep: #67e8f9;
    --s26-accent-soft: rgba(34, 211, 238, 0.14);
    --s26-rail: #07303a;
    --r0-stage: #0f1419;
    --r0-card: #171d26;
    --r0-ink: #e6eaf0;
    --r0-muted: #98a2b3;
}

html.s26-dark body.shell-room2 {
    --s26-accent: #3b8bff;
    --s26-accent-deep: #8ab8ff;
    --s26-accent-soft: rgba(59, 139, 255, 0.16);
    --s26-rail: #0a2a6b;
    --r2-stage: #0f1419;
    --r2-card: #171d26;
    --r2-ink: #e6eaf0;
    --r0-stage: #0f1419;
    --r0-card: #171d26;
    --r0-ink: #e6eaf0;
    --r0-muted: #98a2b3;
}

html.s26-dark body:is(.shell-room0, .shell-room2) {
    --s26-line: #2a3441;
    --s26-ink: #e6eaf0;
    --s26-muted: #98a2b3;
    --s26-card: #171d26;
    --s26-stage: #0f1419;
    --s26-head: #1b222d;
    --s26-hover: #1e2631;
    --s26-input: #1e2631;
    --s26-row: #222b37;
    --s26-danger: #f97066;
    --s26-danger-soft: rgba(249, 112, 102, 0.14);
    --s26-shadow: none;
    background: var(--s26-stage);
    color: var(--s26-ink);
    color-scheme: dark;
}

/* Stage */
html.s26-dark body:is(.shell-room0, .shell-room2) .matrix-bg,
html.s26-dark body.shell-room0 .r0-stage,
html.s26-dark body.shell-room0 .r0-stage > .module-view,
html.s26-dark body.shell-room0 .r0-stage > .content,
html.s26-dark body.shell-room0 .r0-water,
html.s26-dark body.shell-room0 .r0-water > .content,
html.s26-dark body.shell-room2 .r2-stage {
    background: var(--s26-stage);
    color: var(--s26-ink);
}

/* Words: the old sheets pin dark text in many places */
html.s26-dark body:is(.shell-room0, .shell-room2) :is(.r0-stage, .r2-stage, .client-panel, .modal)
    :is(h1, h2, h3, h4, p, label, td, th, legend, strong, .status, .panel-title, .modal-title, .modal-text, .stat-value, .result-count, .form-field, .fl-checkbox-label) {
    color: var(--s26-ink);
    text-shadow: none;
}

html.s26-dark body:is(.shell-room0, .shell-room2) :is(.r0-stage, .r2-stage, .client-panel, .modal) :is(th, label, .stat-label, .status, .sort-btn) {
    color: var(--s26-muted);
    text-shadow: none;
}

/* Cards and windows */
html.s26-dark body:is(.shell-room0, .shell-room2) :is(.r0-stage, .r2-stage) :is(.glass-panel, .corp-panel, .table-wrap, .footer-bar, .inv-subnav, .inv-disclaimer, .stat-card, .search-bar, .period-filters, .kj-controls-row),
html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view :is(.search-bar, .period-filters, .table-wrap, .corp-table-wrap),
html.s26-dark body:is(.shell-room0, .shell-room2) :is(.client-panel.glass-panel, .modal.glass-panel, #fl-verifikation-panel, #fl-speedledger-panel, #fl-bokio-panel) {
    background: var(--s26-card);
    border-color: var(--s26-line);
    box-shadow: none;
    color: var(--s26-ink);
}

html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view :is(.module-summary-stats, .stats),
html.s26-dark body:is(.shell-room0, .shell-room2) .module-summary-stats {
    background: transparent;
}

html.s26-dark body:is(.shell-room0, .shell-room2) :is(.panel-header, .panel-footer, .modal-header, .modal-footer) {
    background: transparent;
    border-color: var(--s26-line);
}

html.s26-dark body:is(.shell-room0, .shell-room2) :is(.panel-backdrop, .modal-overlay) {
    background: rgba(0, 0, 0, 0.6);
}

/* Fields */
html.s26-dark body:is(.shell-room0, .shell-room2) :is(.r0-stage, .r2-stage, .client-panel, .modal, #fl-verifikation-panel, #fl-speedledger-panel, #fl-bokio-panel) :is(input:not([type='checkbox']):not([type='radio']), select, textarea) {
    background-color: var(--s26-input);
    border: 1px solid var(--s26-line);
    color: var(--s26-ink);
}

html.s26-dark body:is(.shell-room0, .shell-room2) :is(input, textarea)::placeholder {
    color: var(--s26-muted);
    opacity: 1;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view .search-bar input {
    background: transparent;
    border: none;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view .period-select {
    background-color: var(--s26-input) !important;
    border-color: var(--s26-line) !important;
    color: var(--s26-ink) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view #period-month.period-select:disabled {
    background-color: var(--s26-card) !important;
    color: var(--s26-muted) !important;
}

/* Tables */
html.s26-dark body:is(.shell-room0, .shell-room2) table thead,
html.s26-dark body:is(.shell-room0, .shell-room2) table th,
html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view #client-table thead,
html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view #client-table th {
    background: var(--s26-head);
    border-color: var(--s26-line);
}

html.s26-dark body:is(.shell-room0, .shell-room2) table td,
html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view #client-table td {
    background: transparent;
    border-bottom-color: var(--s26-row);
    color: var(--s26-ink);
}

html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view #client-table :is(.col-city, .col-phone, .col-web, .col-orders) {
    color: var(--s26-muted);
}

html.s26-dark body:is(.shell-room0, .shell-room2) table tbody tr:hover,
html.s26-dark body:is(.shell-room0, .shell-room2) table tbody tr.selected {
    background: var(--s26-hover);
}

html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view #client-table th.sort-active .sort-btn {
    color: var(--s26-accent-deep);
}

/* Keys */
html.s26-dark body:is(.shell-room0, .shell-room2) :is(.page-btn, .panel-close-btn, .panel-delete-btn, .panel-new-log-btn, .panel-close-header) {
    background: var(--s26-input);
    border: 1px solid var(--s26-line);
    box-shadow: none;
    color: var(--s26-ink);
}

html.s26-dark body:is(.shell-room0, .shell-room2) .page-btn:hover:not(:disabled) {
    background: var(--s26-hover);
    border-color: var(--s26-muted);
    color: var(--s26-ink);
}

html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view #client-new-btn,
html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view #client-new-btn[hidden] {
    background: var(--s26-accent);
    border-color: var(--s26-accent);
    color: #06121f;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view .intel-row-edit-btn {
    background: transparent;
    border-color: transparent;
    color: var(--s26-accent-deep);
}

html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view .intel-row-delete-btn {
    background: transparent;
    border-color: transparent;
    color: var(--s26-danger);
}

html.s26-dark body:is(.shell-room0, .shell-room2) a:not(.page-btn) {
    color: var(--s26-accent-deep);
}

/* Rail */
html.s26-dark body.shell-room0 .r0-rail,
html.s26-dark body.shell-room2 .r2-rail,
html.s26-dark body.hotel-phone.shell-room0 .r0-rail-door,
html.s26-dark body.shell-room2.hotel-phone .r2-rail-door {
    background: var(--s26-rail);
}

html.s26-dark body.shell-room0 .r0-rail .module-tab.active,
html.s26-dark body.shell-room0 .r0-rail .module-tab.active:hover,
html.s26-dark body.shell-room2 .r2-rail .module-tab.active,
html.s26-dark body.shell-room2 .r2-rail .module-tab.active:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
}

html.s26-dark body.shell-room2 .r2-rail-logo {
    opacity: 0.85;
}

html.s26-dark body:is(.shell-room0, .shell-room2) :is(.r0-hotel-picker, .r2-hotel-picker) {
    background: var(--s26-card);
    border-color: var(--s26-line);
    color: var(--s26-muted);
}

/* Search keeps the card's colour */
html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view .search-bar input {
    background: transparent !important;
    color: var(--s26-ink) !important;
}

/* Invoice editor: the old sheets pin white with !important */
html.s26-dark body:is(.shell-room0, .shell-room2) #inv-panel-editor {
    background: var(--s26-card) !important;
    border-color: var(--s26-line) !important;
    color: var(--s26-ink) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-panel-editor :is(div, form, section, fieldset, aside, header, footer, table, thead, tbody, tr, th, td):not(.status-badge):not(.payment-badge):not([class*='banner']):not(.address-suggestions) {
    background: transparent !important;
    background-image: none !important;
    border-color: var(--s26-line) !important;
    box-shadow: none !important;
    color: var(--s26-ink) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-panel-editor :is(h1, h2, h3, h4, p, strong, span, small, td) {
    color: var(--s26-ink) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-panel-editor :is(label, th) {
    color: var(--s26-muted) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-panel-editor :is(input:not([type='checkbox']):not([type='radio']), select, textarea) {
    background: var(--s26-input) !important;
    border: 1px solid var(--s26-line) !important;
    box-shadow: none !important;
    color: var(--s26-ink) !important;
    -webkit-text-fill-color: var(--s26-ink) !important;
    opacity: 1 !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-panel-editor :is(input, textarea)::placeholder {
    color: var(--s26-muted) !important;
    -webkit-text-fill-color: var(--s26-muted) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-panel-editor :is(input, select, textarea):disabled {
    background: var(--s26-card) !important;
    color: var(--s26-muted) !important;
    -webkit-text-fill-color: var(--s26-muted) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-panel-editor [class*='banner'] {
    background: rgba(245, 158, 11, 0.12) !important;
    border-color: rgba(245, 158, 11, 0.45) !important;
    color: #fcd34d !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-panel-editor .address-suggestions {
    background: var(--s26-input) !important;
    border-color: var(--s26-line) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-panel-editor .address-suggestion {
    background: transparent !important;
    color: var(--s26-ink) !important;
}

/* Försäljningslogg: book choice rows and locked fields */
html.s26-dark body:is(.shell-room0, .shell-room2) .fl-bok-row {
    background: var(--s26-input) !important;
    border-color: var(--s26-line) !important;
    box-shadow: none !important;
    color: var(--s26-ink) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) .fl-bok-row:disabled,
html.s26-dark body:is(.shell-room0, .shell-room2) .fl-bok-row:not(.is-live) {
    opacity: 0.45;
}

html.s26-dark body:is(.shell-room0, .shell-room2) .fl-bok-row.is-selected,
html.s26-dark body:is(.shell-room0, .shell-room2) .fl-bok-row.is-active,
html.s26-dark body:is(.shell-room0, .shell-room2) .fl-bok-row.active {
    border-color: var(--s26-accent) !important;
    background: var(--s26-accent-soft) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) :is(.client-panel, #fl-verifikation-panel, #fl-speedledger-panel, #fl-bokio-panel) :is(input, select, textarea):disabled {
    background-color: var(--s26-card) !important;
    color: var(--s26-muted) !important;
    -webkit-text-fill-color: var(--s26-muted) !important;
    opacity: 1 !important;
}

/* Every table: the old sheets pin dark text per table */
html.s26-dark body:is(.shell-room0, .shell-room2) :is(.r0-stage, .r2-stage, .client-panel, .modal) table td {
    color: var(--s26-ink) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #intelligence-view #client-table :is(.col-city, .col-phone, .col-web, .col-orders) {
    color: var(--s26-muted) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) :is(.r0-stage, .r2-stage, .client-panel) tr[class*='-row'] :is(strong, b, small) {
    color: inherit !important;
}

/* Customer window: read-only values */
html.s26-dark body:is(.shell-room0, .shell-room2) .client-panel :is(.panel-value, .panel-sales-summary, .panel-field-log-item, .panel-field-log-date) {
    background-color: var(--s26-input) !important;
    border-color: var(--s26-line) !important;
    color: var(--s26-ink) !important;
    -webkit-text-fill-color: var(--s26-ink) !important;
    text-shadow: none !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) .client-panel .panel-label {
    color: var(--s26-muted) !important;
    text-shadow: none !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) .client-panel :is(.panel-table-wrap, .panel-section) {
    background: transparent !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) .client-panel .panel-sales-summary {
    background-color: transparent !important;
}

/* Status marks stay coloured, only brighter */
html.s26-dark body:is(.shell-room0, .shell-room2) :is(.status-badge, .payment-badge) {
    filter: brightness(1.75) saturate(1.2);
}

html.s26-dark body:is(.shell-room0, .shell-room2) .fl-undo-mark {
    background: rgba(245, 158, 11, 0.16) !important;
    color: #fcd34d !important;
}

/* Fakturering peek on phones */
html.s26-dark body:is(.shell-room0, .shell-room2) #inv-peek-overlay {
    background: rgba(0, 0, 0, 0.6) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-peek-paper,
html.s26-dark body:is(.shell-room0, .shell-room2) #inv-peek-body,
html.s26-dark body:is(.shell-room0, .shell-room2) .r0-inv-peek-top {
    background: var(--s26-card) !important;
    border-color: var(--s26-line) !important;
    box-shadow: none !important;
    color: var(--s26-ink) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-peek-paper :is(h1, h2, h3, p, strong, span, div, td, .inv-h2, .r0-inv-peek-kund, .r0-inv-peek-total) {
    color: var(--s26-ink) !important;
    text-shadow: none !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) .r0-inv-peek-lines th {
    background: var(--s26-head) !important;
    color: var(--s26-muted) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) .r0-inv-peek-lines :is(th, td) {
    border-color: var(--s26-line) !important;
}

html.s26-dark body:is(.shell-room0, .shell-room2) #inv-peek-close {
    background: var(--s26-input) !important;
    border: 1px solid var(--s26-line) !important;
    color: var(--s26-ink) !important;
}

} /* @media screen */

/* The Dark / Light key, both themes */
.s26-theme-key {
    align-self: flex-start;
    background: transparent;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-size: 0.78rem;
    font-weight: 500;
    padding: 6px 12px;
    touch-action: manipulation;
}

.s26-theme-key:hover {
    background: rgba(255, 255, 255, 0.14);
}

@media print {
    .s26-theme-key {
        display: none;
    }
}

@media screen {
    html.s26-dark body:is(.shell-room0, .shell-room2) .gps-bar,
    html.s26-dark body:is(.shell-room0, .shell-room2) .gps-bar * {
        color: var(--s26-ink) !important;
        text-shadow: none !important;
    }
}
