/* Pinned copy of the hub's public/ici-tokens.css, icihomes/icihomes.com-new-build@67f211af47bb9eeec0f7493a045d713110502041 (PR #3367).
   Served same-origin so the admin keeps its look when the hub is down and on /admin/env-store (style-src 'self').
   Do not edit: re-copy byte for byte from the hub and update the commit above. */
/*!
 * ICI tool design tokens (docs/sso/tool-style-guide.md).
 *
 * The one palette every internal ICI tool uses: ici-errors, ici-punchlist, ici-analytics,
 * infrastructure-manager, middleware3's admin, Workspace and the hub's employee screens.
 * Not for the public sites, which keep the luxury look in STYLE_GUIDE.md.
 *
 * Link it from a tool's page head, next to hub-header.js (the tool's CSP needs the hub origin in style-src):
 *   <link rel="stylesheet" href="https://icihomes.com/ici-tokens.css">
 * and read every value with a fallback, var(--ici-bg, #FAF8F3), so a hub outage never unstyles a page.
 * A tool with a build step may copy these values instead; this file stays the source of truth.
 *
 * Theme: light by default, dark when the system prefers it. A tool with its own theme switch
 * forces one by putting `dark` or `light` (class or data-theme) on <html>.
 * Hand-written, no build step.
 */
:root {
    color-scheme: light;

    /* Surfaces and lines: warm neutrals from the hub palette */
    --ici-bg: #FAF8F3;
    --ici-surface: #FFFFFF;
    --ici-surface-muted: #F1EDE3;
    --ici-border: #E8E2D4;
    --ici-border-strong: #CBC7BF;

    /* Text */
    --ici-text: #1B2230;
    --ici-text-muted: #64625D;

    /* Brand: navy primary, gold accent */
    --ici-primary: #1C3A63;
    --ici-primary-hover: #12274A;
    --ici-on-primary: #FFFFFF;
    --ici-gold: #C3A265;
    --ici-gold-text: #7A5F2A;
    --ici-focus: #9A7B3F;
    --ici-link: #1C3A63;

    /* Status: the same meaning in every tool. Light values pass 4.5:1 as text on their own soft tint over --ici-surface-muted. */
    --ici-success: #116329;
    --ici-warning: #7D5400;
    --ici-danger: #B42323;
    --ici-info: #2457B5;
    --ici-soft-mix: 12%;

    /* Charts: categorical, series 1 in ICI navy */
    --ici-chart-1: #1C3A63;
    --ici-chart-2: oklch(0.65 0.17 55);
    --ici-chart-3: oklch(0.58 0.15 150);
    --ici-chart-4: oklch(0.58 0.19 25);
    --ici-chart-5: oklch(0.55 0.16 300);
    --ici-chart-6: oklch(0.52 0.09 65);
    --ici-chart-7: oklch(0.65 0.17 350);
    --ici-chart-8: oklch(0.62 0.13 118);
    --ici-chart-9: oklch(0.62 0.12 205);
    --ici-chart-10: oklch(0.50 0.17 280);
    --ici-chart-11: oklch(0.60 0.11 180);
    --ici-chart-12: oklch(0.70 0.15 85);

    /* Type, corners, depth */
    --ici-font: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ici-font-brand: Jost, "Helvetica Neue", Arial, sans-serif;
    --ici-font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --ici-radius-control: 6px;
    --ici-radius-card: 8px;
    --ici-shadow-popover: 0 8px 24px rgb(11 27 51 / 0.16);
    --ici-header-height: 44px;
}

:root {
    --ici-success-soft: color-mix(in srgb, var(--ici-success) var(--ici-soft-mix), transparent);
    --ici-warning-soft: color-mix(in srgb, var(--ici-warning) var(--ici-soft-mix), transparent);
    --ici-danger-soft: color-mix(in srgb, var(--ici-danger) var(--ici-soft-mix), transparent);
    --ici-info-soft: color-mix(in srgb, var(--ici-info) var(--ici-soft-mix), transparent);
    --ici-primary-soft: color-mix(in srgb, var(--ici-primary) var(--ici-soft-mix), transparent);
}

@media (prefers-color-scheme: dark) {
    :root:not(.light):not([data-theme="light"]) {
        color-scheme: dark;
        --ici-bg: #10141A;
        --ici-surface: #171C23;
        --ici-surface-muted: #1B2129;
        --ici-border: #2A3039;
        --ici-border-strong: #343B46;
        --ici-text: #E6E9EE;
        --ici-text-muted: #A9B0BA;
        --ici-primary: #DBC392;
        --ici-primary-hover: #C3A265;
        --ici-on-primary: #0B1B33;
        --ici-gold-text: #DBC392;
        --ici-focus: #DBC392;
        --ici-link: #A9C2E6;
        --ici-success: #4AC26B;
        --ici-warning: #D29922;
        --ici-danger: #E5747B;
        --ici-info: #8FB4F0;
        --ici-soft-mix: 16%;
        --ici-chart-1: oklch(0.75 0.12 255);
        --ici-chart-2: oklch(0.78 0.14 60);
        --ici-chart-3: oklch(0.76 0.14 150);
        --ici-chart-4: oklch(0.74 0.15 25);
        --ici-chart-5: oklch(0.75 0.13 300);
        --ici-chart-6: oklch(0.72 0.08 65);
        --ici-chart-7: oklch(0.78 0.13 350);
        --ici-chart-8: oklch(0.78 0.13 118);
        --ici-chart-9: oklch(0.78 0.11 205);
        --ici-chart-10: oklch(0.72 0.13 280);
        --ici-chart-11: oklch(0.77 0.11 180);
        --ici-chart-12: oklch(0.82 0.12 90);
        --ici-shadow-popover: 0 8px 24px rgb(0 0 0 / 0.4);
    }
}

:root.dark,
:root[data-theme="dark"] {
    color-scheme: dark;
    --ici-bg: #10141A;
    --ici-surface: #171C23;
    --ici-surface-muted: #1B2129;
    --ici-border: #2A3039;
    --ici-border-strong: #343B46;
    --ici-text: #E6E9EE;
    --ici-text-muted: #A9B0BA;
    --ici-primary: #DBC392;
    --ici-primary-hover: #C3A265;
    --ici-on-primary: #0B1B33;
    --ici-gold-text: #DBC392;
    --ici-focus: #DBC392;
    --ici-link: #A9C2E6;
    --ici-success: #4AC26B;
    --ici-warning: #D29922;
    --ici-danger: #E5747B;
    --ici-info: #8FB4F0;
    --ici-soft-mix: 16%;
    --ici-chart-1: oklch(0.75 0.12 255);
    --ici-chart-2: oklch(0.78 0.14 60);
    --ici-chart-3: oklch(0.76 0.14 150);
    --ici-chart-4: oklch(0.74 0.15 25);
    --ici-chart-5: oklch(0.75 0.13 300);
    --ici-chart-6: oklch(0.72 0.08 65);
    --ici-chart-7: oklch(0.78 0.13 350);
    --ici-chart-8: oklch(0.78 0.13 118);
    --ici-chart-9: oklch(0.78 0.11 205);
    --ici-chart-10: oklch(0.72 0.13 280);
    --ici-chart-11: oklch(0.77 0.11 180);
    --ici-chart-12: oklch(0.82 0.12 90);
    --ici-shadow-popover: 0 8px 24px rgb(0 0 0 / 0.4);
}