/* Palette-only themes. Components consume semantic roles; user/content colors
   (photos, charts, tags, authored Color values) are never inverted. */
@layer themes {
    :root[data-theme="light"] { color-scheme: light; }
    :root:is([data-theme="dark"],[data-theme="terminal"]) {
        color-scheme: dark;
        --bobr-page-bg: #0c121d;
        --bobr-surface: #151f2d;
        --bobr-text: #e3eaf5;
        --bobr-text-subtle: #b4c3d8;
        --bobr-on-accent: #ffffff;
        --bobr-surface-inverse: #080e18;
        --bobr-color-black-light: #26364d;
        --bobr-color-gray: #b0bfd3;
        --bobr-color-gray-middle: #7286a2;
        --bobr-color-gray-border: #304159;
        --bobr-color-gray-light: #1d2a3d;
        --bobr-surface-stripe: #192538;
        --bobr-neutral-fill: #40546f;
        --bobr-color-blue: #2866c7;
        --bobr-color-blue-dark: #2255a6;
        --bobr-color-blue-hover: #3376d9;
        --bobr-color-blue-light: #82b3ff;
        --bobr-accent-ink: #91bfff;
        --bobr-color-blue-light-hover: #203857;
        --bobr-color-green: #16804b;
        --bobr-color-green-dark: #11643b;
        --bobr-color-green-deep: #0e5532;
        --bobr-success-ink: #7ae0ad;
        --bobr-color-red: #bb3e57;
        --bobr-color-red-light-hover: #472735;
        --bobr-danger-ink: #ffa0b1;
        --bobr-color-red-orange: #c65439;
        --bobr-color-orange: #9f511e;
        --bobr-color-orange-hover: #a95c27;
        --bobr-color-gold: #a56520;
        --bobr-color-pink: #c64c91;
        --bobr-scroll-track: #101927;
        --bobr-control-border: #58708f;
        --bobr-readonly-border: #6a819e;
        --bobr-readonly-opacity: .82;
        --bobr-monochrome-icon-filter: invert(1) brightness(.88);
        --bobr-control-disabled-bg: #28364a;
        --bobr-control-muted-bg: #2d3c51;
        --component-input-bg: #1e2c40;
        --component-placeholder-text: rgb(191 206 227 / 65%);
        --component-placeholder-hover-text: #a8ccff;
        --bobr-control-hover-overlay: rgb(147 188 244 / 12%);
        --bobr-control-highlight: #203b59;
        --bobr-control-info: #513e1e;
        --bobr-warning-bg: #382c1b;
        --bobr-warning-placeholder: #d4ad79;
        --bobr-table-empty-text: rgb(157 180 210 / 48%);
        --bobr-table-empty-text-strong: rgb(176 195 223 / 72%);
        --bobr-table-divider: #2c3d54;
        --bobr-table-selection: #233f62;
        --bobr-table-row-hover: rgb(147 188 244 / 8%);
        --bobr-table-row-overlay: rgb(147 188 244 / 5%);
        --table-crosshair-accent: #88b8fa;
        --bobr-tree-connector: #435774;
        --bobr-tree-active-hover: #21784f;
        --bobr-search-backdrop: rgb(2 6 14 / 70%);
        --bobr-search-highlight: #9a6423;
        --bobr-nav-surface-start: #172338;
        --bobr-nav-surface-end: #0b1320;
        --bobr-nav-text: #ced9ea;
        --bobr-nav-border: #30425c;
        --bobr-nav-hover-bg: #233753;
        --bobr-nav-backdrop: rgb(2 6 14 / 65%);
        --bobr-user-muted-text: #a6b7ce;
        --bobr-tab-hover-bg: #263950;
        --bobr-tab-hover-text: #c1dcff;
        --bobr-tab-hover-indicator: #91bfff;
        --bobr-tab-hover-highlight: #344c69;
        --bobr-hint-text: #c1cde0;
        --bobr-hint-key-bg: #283c57;
        --bobr-hint-key-text: #c5d6ee;
        --bobr-footer-bg: #101b2b;
        --bobr-dev-diagnostic-text: #a6bddb;
        --ui-backdrop-rgb: 2 6 14;
        --ui-surface-backdrop-opacity: .55;
        --ui-surface-shadow: 0 18px 70px rgb(0 0 0 / 55%);
        --bobr-history-shadow-color: rgb(0 0 0 / 45%);
        --bobr-message-shadow-color: rgb(0 0 0 / 35%);
        --bobr-dash-selected-bg: #34291f;
        --bobr-report-project: #1a2e43;
        --bobr-report-project-strong: #203b54;
        --bobr-report-group: #46321e;
        --bobr-report-note: #253a29;
    }
    :root[data-theme="terminal"] {
        --bobr-font-family: ui-monospace, "Cascadia Code", "DejaVu Sans Mono", Consolas, monospace;
        --bobr-font-family-linux: var(--bobr-font-family);
        --bobr-theme-radius-scale: 0;
        --bobr-radius-scale: 0;
        --bobr-page-bg: #080f0b;
        --bobr-page-texture: linear-gradient(rgb(141 243 164 / 2%) 1px, transparent 1px), linear-gradient(90deg,rgb(141 243 164 / 2%) 1px, transparent 1px);
        --bobr-page-texture-size: 8px 8px;
        --bobr-surface: #111e16;
        --bobr-text: #d5eed8;
        --bobr-text-subtle: #a5c5ad;
        --bobr-surface-inverse: #040a06;
        --bobr-color-black-light: #263c2c;
        --bobr-color-gray: #afc7b2;
        --bobr-color-gray-middle: #6f9a79;
        --bobr-color-gray-border: #385942;
        --bobr-color-gray-light: #1d3023;
        --bobr-surface-stripe: #1a2b20;
        --bobr-neutral-fill: #385e44;
        --bobr-color-blue: #245f3c;
        --bobr-color-blue-dark: #1c4c30;
        --bobr-color-blue-hover: #30784c;
        --bobr-color-blue-light: #8be4a5;
        --bobr-accent-ink: #a0f2b6;
        --bobr-color-blue-light-hover: #203f2b;
        --bobr-color-green: #206d3c;
        --bobr-color-green-dark: #19552f;
        --bobr-color-green-deep: #124327;
        --bobr-success-ink: #9ff6b8;
        --bobr-color-red: #923d43;
        --bobr-color-red-light-hover: #422427;
        --bobr-danger-ink: #ffaaa6;
        --bobr-color-orange: #855819;
        --bobr-color-orange-hover: #926722;
        --bobr-color-gold: #896220;
        --bobr-scroll-track: #0a140d;
        --bobr-control-border: #577e62;
        --bobr-readonly-border: #6b9877;
        --component-input-bg: #1c3022;
        --component-placeholder-text: #89a28f;
        --component-placeholder-hover-text: #b8f3c7;
        --component-focus-shadow: 0 0 0 1px var(--bobr-accent-ink);
        --bobr-control-highlight: #264931;
        --bobr-control-hover-overlay: rgb(148 229 169 / 12%);
        --bobr-table-divider: #35523d;
        --bobr-table-selection: #284d33;
        --bobr-table-row-hover: rgb(148 229 169 / 8%);
        --table-crosshair-accent: #94dfab;
        --bobr-tree-connector: #50725a;
        --bobr-nav-surface-start: #17291c;
        --bobr-nav-surface-end: #09120c;
        --bobr-nav-text: #c5e6ce;
        --bobr-nav-border: #3d6448;
        --bobr-nav-hover-bg: #294432;
        --bobr-tab-hover-bg: #294432;
        --bobr-tab-hover-text: #d0ffdc;
        --bobr-tab-hover-indicator: #a0f2b6;
        --bobr-tab-hover-highlight: #355c41;
        --bobr-hint-text: #c3e4cc;
        --bobr-hint-key-bg: #294432;
        --bobr-hint-key-text: #cef2d7;
        --bobr-footer-bg: #0b180f;
        --bobr-report-project: #1a3524;
        --bobr-report-project-strong: #26482f;
        --ui-surface-shadow: 6px 6px 0 rgb(0 0 0 / 60%);
    }
    :root:is([data-theme="dark"],[data-theme="terminal"])[data-surface-document] { --bobr-page-bg: var(--bobr-surface); --bobr-page-texture: none; }
}

/* Terminal component states must win over later component layers. Keep hidden
   tab scrollbars hidden; visible document, control and proxy bars share one skin. */
@layer state {
    /* Segoe's asymmetric optical padding is wrong for the terminal monospace face.
       Preserve total block padding; shift the baseline rather than changing field height. */
    :root[data-theme="terminal"] :is(com-input,com-date,com-range) :is(textarea.input,input.input,[contenteditable].input) { padding-block: 10px; }
    :root[data-theme="terminal"] com-input[readonly] :is(textarea.input,input.input),
    :root[data-theme="terminal"] com-input :is(textarea.input,input.input)[readonly] { padding-block: 9.5px; }
    :root[data-theme="terminal"] com-sbox .select { padding-block: 10px; }
    :root[data-theme="terminal"] com-sbox[readonly] .select { padding-block: 9.25px; }
    :root[data-theme="terminal"] com-setbox .box-data { padding-block: 9.5px; }
    :root[data-theme="terminal"] :is(com-date,com-range) .wrap-main input { padding-block: 7.5px; }
    :root[data-theme="terminal"] :is(com-date,com-range)[readonly] .wrap-main input[readonly] { padding-block: 6.815px; }
    :root[data-theme="terminal"] com-table { --table-editor-padding: 10px 12px; }
    :root[data-theme="terminal"] com-table td[data-cell-editor]::before,
    :root[data-theme="terminal"] com-table td[data-cell-editor]::after { padding-block: 10px; }
    :root[data-theme="terminal"] com-table table tbody td[data-cell-editor]:not([data-vcol-text], [data-cell-editing], [data-cell-proxy-dom])::before {
        content: "- -";
    }

    :root[data-theme="terminal"],
    :root[data-theme="terminal"] :not(tabs) {
        scrollbar-color: var(--bobr-scroll-thumb) var(--bobr-scroll-track);
        scrollbar-width: thin;
    }

    /* Chromium's standard scrollbar properties otherwise suppress its pseudo
       elements, including our shared hover color and exact five-pixel width. */
    @supports selector(::-webkit-scrollbar) {
        :root[data-theme="terminal"],
        :root[data-theme="terminal"] :not(tabs) {
            scrollbar-color: auto;
            scrollbar-width: auto;
        }
        :root[data-theme="terminal"]::-webkit-scrollbar,
        :root[data-theme="terminal"] ::-webkit-scrollbar {
            width: 5px;
            height: 5px;
            background: var(--bobr-scroll-track);
            border-radius: 0;
        }
        :root[data-theme="terminal"]::-webkit-scrollbar-track,
        :root[data-theme="terminal"] ::-webkit-scrollbar-track,
        :root[data-theme="terminal"]::-webkit-scrollbar-corner,
        :root[data-theme="terminal"] ::-webkit-scrollbar-corner {
            background: var(--bobr-scroll-track);
        }
        :root[data-theme="terminal"]::-webkit-scrollbar-thumb,
        :root[data-theme="terminal"] ::-webkit-scrollbar-thumb {
            background: var(--bobr-scroll-thumb);
            border: none;
            border-radius: 0;
        }
        :root[data-theme="terminal"]::-webkit-scrollbar-thumb:hover,
        :root[data-theme="terminal"] ::-webkit-scrollbar-thumb:hover {
            background: var(--bobr-scroll-thumb-hover);
        }
    }
}
