/* ============================================================================
   House design tokens.

   Link this ONCE, before any component CSS. Only the PALETTE block is
   per-project; everything under "FIXED LAYER" is shared across every app and
   must not be edited.

   Used by: Content/Login.css, Content/AppSelect.css
   ========================================================================= */

/* ==== PER-PROJECT PALETTE — the only thing you change ================== */

:root {
    --ui-primary: #4b8bf5;
    --ui-primary-text: #ffffff;
    --ui-primary-hover: rgba(75, 139, 245, .12);
    --ui-secondary: #7a5af8;
    --ui-tertiary: #0f9d8f;
    --ui-info: #2c8ad6;
    --ui-success: #2e9e5b;
    --ui-warning: #d98218;
    --ui-error: #d3453f;
    --ui-surface: #ffffff;
    --ui-background: #f5f6f8;
    --ui-background-alt: #eceef1;
    --ui-lines: #dfe2e7;
    --ui-text-primary: #1b1d21;
    --ui-text-secondary: #6b7280;
    --ui-action: #6b7280;
    --ui-hover: rgba(0, 0, 0, .05);
}

:root[data-theme="dark"] {
    --ui-surface: #1e2126;
    --ui-background: #16181c;
    --ui-background-alt: #24272d;
    --ui-lines: #33373f;
    --ui-text-primary: #e9eaec;
    --ui-text-secondary: #9aa1ad;
    --ui-action: #9aa1ad;
    --ui-hover: rgba(255, 255, 255, .07);
    --ui-primary: #6d95ee;
    --ui-primary-hover: rgba(109, 149, 238, .16);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --ui-surface: #1e2126;
        --ui-background: #16181c;
        --ui-background-alt: #24272d;
        --ui-lines: #33373f;
        --ui-text-primary: #e9eaec;
        --ui-text-secondary: #9aa1ad;
        --ui-action: #9aa1ad;
        --ui-hover: rgba(255, 255, 255, .07);
        --ui-primary: #6d95ee;
        --ui-primary-hover: rgba(109, 149, 238, .16);
    }
}

/* ==== FIXED LAYER — identical in every project. Do not edit. =========== */

:root {
    /* Geometry */
    --ui-radius-card: 12px;
    --ui-radius-chip: 9px;
    --ui-radius-control: 8px;
    --ui-radius-control-sm: 7px;
    --ui-radius-pill: 999px;
    --ui-radius-tag: 4px;
    /* Elevation — intentionally neutral, the only non-token colors here. */
    --ui-shadow-card: 0 1px 2px rgba(0, 0, 0, .06);
    --ui-shadow-raised: 0 4px 14px rgba(0, 0, 0, .08);
    /* Motion */
    --ui-motion: .15s ease;
    --ui-motion-row: .12s ease;
}
