/*
 * Givre brand layer over the Neo Elite kit: frosted ice. Givre #8DD8F1 is the accent (filled buttons,
 * active navigation, badges) with dark ink #12384D on it, never white. Glacier #176381 carries links,
 * primary text and focus; Encre #153C52 the headings, #304F61 the body, Brume #4C6577 the muted text.
 * The page is Glace #EDF6FB under soft glacier glows; surfaces are translucent white with a white rim
 * and an inner top highlight. Dark theme: polar night #0D1F2A under dark glass, same accent with
 * #0B2533 ink, links #9FE0F5. Only tokens are overridden, every component follows; the shared brand
 * panel tokens (--pv-panel-*) dress the landing bands and the sign-in aside. Blur (--ui-glass-filter)
 * stays on chrome, floating layers and brand panels; content cards are translucent without blur.
 * Loaded right after theme.css. Contrast (WCAG AA) checked for text on the page, on glass over the
 * strongest glow, on soft tints and on the accent, in both themes.
 */

:root,
[data-bs-theme="light"] {
    --bs-body-color: #304f61;
    --bs-body-color-rgb: 48, 79, 97;
    --bs-body-bg: #f7fcff;
    --bs-body-bg-rgb: 247, 252, 255;
    --bs-emphasis-color: #153c52;
    --bs-emphasis-color-rgb: 21, 60, 82;
    --bs-secondary-color: #4c6577;
    --bs-secondary-color-rgb: 76, 101, 119;
    --bs-secondary-bg: #e8f3f9;
    --bs-secondary-bg-rgb: 232, 243, 249;
    --bs-tertiary-color: #6a8495;
    --bs-tertiary-color-rgb: 106, 132, 149;
    --bs-tertiary-bg: #f2f9fd;
    --bs-tertiary-bg-rgb: 242, 249, 253;
    --bs-border-color: rgba(23, 99, 129, 0.14);
    --bs-border-color-translucent: rgba(23, 99, 129, 0.14);

    --bs-primary: #8dd8f1;
    --bs-primary-rgb: 141, 216, 241;
    --bs-primary-text-emphasis: #176381;
    --bs-link-color: #176381;
    --bs-link-color-rgb: 23, 99, 129;
    --bs-link-hover-color: #124d67;
    --bs-link-hover-color-rgb: 18, 77, 103;
    --bs-code-color: #176381;

    /* Info is a cobalt blue, bluer than the kit's indigo and clearly apart from the glacier accent */
    --bs-info: #3e54d3;
    --bs-info-rgb: 62, 84, 211;
    --bs-info-text-emphasis: #3245b3;

    --bs-box-shadow-sm: 0 1px 2px rgba(23, 77, 104, 0.06);
    --bs-box-shadow: 0 14px 34px -10px rgba(23, 77, 104, 0.18), 0 2px 6px -2px rgba(23, 77, 104, 0.08);
    --bs-box-shadow-lg: 0 32px 64px -18px rgba(23, 77, 104, 0.3), 0 4px 12px -4px rgba(23, 77, 104, 0.1);

    --ui-on-primary: #12384d;
    --pv-accent-fill: rgba(141, 216, 241, 0.88);
    --pv-accent-hover: #6cc9ea;

    /* Ambient backdrop: glacier and aurora glows over an icy page */
    --ui-page-bg: #edf6fb;
    --ui-ambient-1: rgba(141, 216, 241, 0.5);
    --ui-ambient-2: rgba(173, 210, 245, 0.34);
    --ui-ambient-3: rgba(191, 235, 246, 0.48);

    /* Frosted glass: cards (no blur), chrome (topbar, sidebar), floating layers (menus, modals) */
    --ui-glass-surface: rgba(255, 255, 255, 0.66);
    --ui-glass-chrome: rgba(255, 255, 255, 0.58);
    --ui-glass-bg: rgba(255, 255, 255, 0.8);
    --ui-glass-border: rgba(255, 255, 255, 0.85);
    --ui-glass-shadow: 0 0 0 1px rgba(23, 99, 129, 0.07), 0 14px 34px -22px rgba(23, 99, 129, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.95);
    --ui-nav-active-bg: rgba(141, 216, 241, 0.42);
    --ui-surface-raised: #fbfeff;
    --ui-input-bg: rgba(255, 255, 255, 0.6);
    --ui-input-bg-focus: rgba(255, 255, 255, 0.94);
    --ui-input-border: rgba(23, 99, 129, 0.28);
    --ui-scroll-thumb: rgba(48, 79, 97, 0.36);
    --ui-hover: rgba(23, 99, 129, 0.06);
    --ui-active: rgba(23, 99, 129, 0.1);
    --ui-backdrop: rgba(21, 60, 82, 0.2);

    /* Soft accent tint close to #E3F5FC on white */
    --bs-primary-bg-subtle: color-mix(in srgb, var(--bs-primary) 26%, transparent);
    --bs-primary-border-subtle: color-mix(in srgb, var(--bs-primary) 55%, transparent);

    /* Focus: a Glacier edge for contrast inside a pale Givre halo */
    --ui-focus-border: #176381;
    --ui-focus-ring: 0 0 0 1px #176381, 0 0 0 4px rgba(141, 216, 241, 0.55);
    --bs-focus-ring-color: rgba(23, 99, 129, 0.35);

    /* Brand panel (landing bands, sign-in aside): ice glass with a glacier glow in the corner */
    --pv-panel-bg:
        radial-gradient(42rem 28rem at 105% -10%, rgba(141, 216, 241, 0.42), transparent 62%),
        radial-gradient(34rem 24rem at -10% 110%, rgba(191, 235, 246, 0.5), transparent 60%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.78), rgba(240, 250, 254, 0.64) 55%, rgba(222, 243, 251, 0.62));
    --pv-panel-ink: #153c52;
    --pv-panel-muted: #304f61;
    --pv-panel-subtle: #4c6577;
    --pv-panel-accent: #176381;
    --pv-panel-border: rgba(255, 255, 255, 0.9);
    --pv-panel-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.95), inset 0 -1px 0 rgba(23, 99, 129, 0.06), 0 0 0 1px rgba(23, 99, 129, 0.06), 0 28px 60px -36px rgba(23, 99, 129, 0.4);
    --pv-panel-chip-bg: rgba(255, 255, 255, 0.62);
    --pv-panel-chip-border: rgba(255, 255, 255, 0.95);
    --pv-panel-rule: rgba(23, 99, 129, 0.14);

    /* Data viz: glacier first, then orange and a green-leaning teal (kept apart from the blue for
       colour-blind readers); sequential ramp in the glacier hue */
    --ui-chart-1: #1677a8;
    --ui-chart-2: #e8622c;
    --ui-chart-3: #16a085;
    --ui-seq-1: #74bbe1;
    --ui-seq-2: #46a0cf;
    --ui-seq-3: #1883b8;
    --ui-seq-4: #006897;
    --ui-seq-5: #084868;
}

/* Shared by both themes */
:root,
[data-bs-theme] {
    --ui-glass-filter: blur(18px) saturate(160%);
    --ui-chevron-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%236a8495' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M3 6l5 5 5-5'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] {
    --bs-body-color: #e4eff5;
    --bs-body-color-rgb: 228, 239, 245;
    --bs-body-bg: #132836;
    --bs-body-bg-rgb: 19, 40, 54;
    --bs-emphasis-color: #f4fafd;
    --bs-emphasis-color-rgb: 244, 250, 253;
    --bs-secondary-color: #a9c2d0;
    --bs-secondary-color-rgb: 169, 194, 208;
    --bs-secondary-bg: #1b3546;
    --bs-secondary-bg-rgb: 27, 53, 70;
    --bs-tertiary-color: #8da9b8;
    --bs-tertiary-color-rgb: 141, 169, 184;
    --bs-tertiary-bg: #172f3e;
    --bs-tertiary-bg-rgb: 23, 47, 62;
    --bs-border-color: rgba(170, 225, 245, 0.14);
    --bs-border-color-translucent: rgba(170, 225, 245, 0.14);
    --bs-light: #1e3a4b;
    --bs-light-rgb: 30, 58, 75;

    --bs-primary: #8dd8f1;
    --bs-primary-rgb: 141, 216, 241;
    --bs-primary-text-emphasis: #bdebfa;
    --bs-link-color: #9fe0f5;
    --bs-link-color-rgb: 159, 224, 245;
    --bs-link-hover-color: #c4eefb;
    --bs-link-hover-color-rgb: 196, 238, 251;
    --bs-code-color: #bdebfa;

    --bs-info: #93a4ff;
    --bs-info-rgb: 147, 164, 255;
    --bs-info-text-emphasis: #bcc7ff;
    --ui-on-info: #111a40;

    /* The light block also matches :root, so every token it sets is set again here */
    --bs-box-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.22);
    --bs-box-shadow: 0 16px 40px -10px rgba(0, 0, 0, 0.38), 0 2px 6px -2px rgba(0, 0, 0, 0.24);
    --bs-box-shadow-lg: 0 32px 72px -16px rgba(0, 0, 0, 0.54);
    --bs-primary-bg-subtle: color-mix(in srgb, var(--bs-primary) 15%, transparent);
    --bs-primary-border-subtle: color-mix(in srgb, var(--bs-primary) 30%, transparent);
    --ui-backdrop: rgba(3, 12, 18, 0.5);

    --ui-on-primary: #0b2533;
    --pv-accent-fill: #8dd8f1;
    --pv-accent-hover: #b0e6f7;

    --ui-page-bg: #0d1f2a;
    --ui-ambient-1: rgba(141, 216, 241, 0.14);
    --ui-ambient-2: rgba(120, 170, 230, 0.1);
    --ui-ambient-3: rgba(141, 216, 241, 0.08);
    --ui-glass-surface: rgba(22, 48, 64, 0.55);
    --ui-glass-chrome: rgba(20, 44, 59, 0.6);
    --ui-glass-bg: rgba(24, 52, 71, 0.9);
    --ui-glass-border: rgba(170, 225, 245, 0.14);
    --ui-glass-shadow: 0 0 0 1px rgba(0, 0, 0, 0.16), 0 16px 36px -22px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(200, 240, 255, 0.08);
    --ui-scroll-thumb: #4f7184;
    --ui-nav-active-bg: rgba(141, 216, 241, 0.14);
    --ui-surface-raised: #1d3a4c;
    --ui-input-bg: rgba(9, 26, 37, 0.45);
    --ui-input-bg-focus: #163243;
    --ui-input-border: #5c7f92;
    --ui-hover: rgba(170, 225, 245, 0.07);
    --ui-active: rgba(170, 225, 245, 0.12);
    --ui-glow: 0 0 18px -6px rgba(141, 216, 241, 0.5);

    --ui-focus-border: #9fe0f5;
    --ui-focus-ring: 0 0 0 1px #9fe0f5, 0 0 0 4px rgba(141, 216, 241, 0.28);
    --bs-focus-ring-color: rgba(141, 216, 241, 0.4);

    --pv-panel-bg:
        radial-gradient(42rem 28rem at 105% -10%, rgba(141, 216, 241, 0.16), transparent 62%),
        radial-gradient(34rem 24rem at -10% 110%, rgba(120, 170, 230, 0.12), transparent 60%),
        linear-gradient(135deg, rgba(28, 61, 82, 0.66), rgba(20, 44, 59, 0.58));
    --pv-panel-ink: #f4fafd;
    --pv-panel-muted: #d3e6f0;
    --pv-panel-subtle: #bfd5e1;
    --pv-panel-accent: #8dd8f1;
    --pv-panel-border: rgba(170, 225, 245, 0.16);
    --pv-panel-shadow: inset 0 1px 0 rgba(200, 240, 255, 0.1), 0 28px 60px -36px rgba(0, 0, 0, 0.6);
    --pv-panel-chip-bg: rgba(170, 225, 245, 0.08);
    --pv-panel-chip-border: rgba(170, 225, 245, 0.16);
    --pv-panel-rule: rgba(170, 225, 245, 0.14);

    --ui-chart-1: #338fc7;
    --ui-chart-2: #db703b;
    --ui-chart-3: #1ea87b;
    --ui-seq-1: #1a6286;
    --ui-seq-2: #1c7eab;
    --ui-seq-3: #3c9ac7;
    --ui-seq-4: #63b6de;
    --ui-seq-5: #9ad4ef;
}

/* Filled accent: a slightly translucent ice fill (solid on dark) with a crisper rim, solid on hover */
.btn-primary {
    --bs-btn-bg: var(--pv-accent-fill);
    --bs-btn-border-color: var(--pv-accent-hover);
    --bs-btn-hover-bg: var(--pv-accent-hover);
    --bs-btn-hover-border-color: var(--pv-accent-hover);
    --bs-btn-active-bg: var(--pv-accent-hover);
    --bs-btn-active-border-color: var(--pv-accent-hover);
    background-image: var(--ui-control-sheen);
}

/* The pale accent is a fill, not a text colour: text in "primary" uses the Glacier emphasis */
.text-primary,
.link-primary {
    color: var(--bs-primary-text-emphasis) !important;
}

/* Without backdrop blur, or when the system asks for less transparency, glass turns opaque */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    :root,
    [data-bs-theme] {
        --ui-glass-chrome: var(--bs-body-bg);
        --ui-glass-bg: var(--ui-surface-raised);
        --pv-panel-bg: var(--bs-body-bg);
    }
}

@media (prefers-reduced-transparency: reduce) {
    :root,
    [data-bs-theme] {
        --ui-glass-surface: var(--bs-body-bg);
        --ui-glass-chrome: var(--bs-body-bg);
        --ui-glass-bg: var(--ui-surface-raised);
        --ui-glass-filter: none;
        --ui-input-bg: var(--bs-body-bg);
        --pv-panel-bg: var(--bs-body-bg);
    }

    .btn-primary {
        --bs-btn-bg: var(--bs-primary);
    }
}
