/*
 * HIPAAmart design-system foundation
 * The semantic layer is intentionally independent from Bootstrap and tenant
 * overrides. Theme data-hm-theme remains the runtime theme switch.
 */
:root {
    color-scheme: light;
    --hm-ink: #1d2b40;
    --hm-muted: #5d6f87;
    --hm-border: #d7dfea;
    --hm-border-strong: #c2cfdf;
    --hm-canvas: #f6f8fc;
    --hm-surface: #ffffff;
    --hm-surface-soft: #f3f6fb;
    --hm-surface-muted: #eaf0f7;
    --hm-surface-hover: #edf5ff;
    --hm-overlay: rgba(29, 42, 64, 0.48);
    --hm-nav-surface: #ffffff;
    --hm-nav-surface-muted: #f8faff;
    --hm-nav-text: #40516a;
    --hm-nav-muted: #71829a;
    --hm-nav-hover: #eef5ff;
    --hm-nav-active: #0b74f2;
    --hm-nav-active-text: #ffffff;
    --hm-brand-blue: #0b74f2;
    --hm-brand-blue-dark: #0759c7;
    --hm-brand-blue-soft: #eaf3ff;
    --hm-brand-blue-contrast: #ffffff;
    --hm-brand-navy: #293752;
    --hm-brand-navy-deep: #1d2a40;
    --hm-yellow: #ffcb05;
    --hm-success: var(--hm-brand-blue-dark);
    --hm-warning: #a15c00;
    --hm-danger: #b42318;
    --hm-info: var(--hm-brand-blue);
    --hm-success-soft: var(--hm-brand-blue-soft);
    --hm-warning-soft: #fff6e6;
    --hm-danger-soft: #fef0ef;
    --hm-info-soft: #eaf3ff;
    --hm-info-ink: #184f8f;
    --hm-radius-sm: 8px;
    --hm-radius: 12px;
    --hm-radius-lg: 18px;
    --hm-shadow-sm: 0 1px 2px rgba(29, 42, 64, 0.06);
    --hm-shadow: 0 12px 30px rgba(29, 42, 64, 0.08);
    --hm-focus: 0 0 0 4px rgba(11, 116, 242, 0.2);

    /* Unprefixed semantic names are the contract for new shared UI. */
    --background: var(--hm-canvas);
    --foreground: var(--hm-ink);
    --surface: var(--hm-surface);
    --surface-secondary: var(--hm-surface-soft);
    --primary: var(--hm-brand-blue);
    --primary-foreground: #ffffff;
    --secondary: var(--hm-surface-muted);
    --muted: var(--hm-muted);
    --border: var(--hm-border);
    --input: var(--hm-border-strong);
    --ring: var(--hm-brand-blue);
    --success: var(--hm-success);
    --warning: var(--hm-warning);
    --destructive: var(--hm-danger);
    --destructive-foreground: #ffffff;

    /* Legacy product vocabularies. Keep these aliases stable for old views. */
    --hm-teal: var(--hm-brand-blue);
    --hm-teal-dark: var(--hm-brand-blue-dark);
    --hm-teal-soft: var(--hm-brand-blue-soft);
    --hm-navy: var(--hm-brand-navy);
    --hm-navy-deep: var(--hm-brand-navy-deep);
    --hm-auth-ink: var(--hm-ink);
    --hm-auth-muted: var(--hm-muted);
    --hm-auth-line: var(--hm-border);
    --hm-auth-surface: var(--hm-surface);
    --hm-auth-blue: var(--hm-brand-blue);
    --hm-auth-blue-dark: var(--hm-brand-blue-dark);
    --hm-auth-blue-soft: var(--hm-brand-blue-soft);
    --hm-auth-navy: var(--hm-brand-navy);
    --hm-auth-teal: var(--hm-brand-blue);
    --hm-auth-teal-dark: var(--hm-brand-blue-dark);
    --hm-auth-mint: var(--hm-brand-blue-soft);
    --hm-auth-danger: var(--hm-danger);
    --hm-auth-shadow: 0 30px 70px rgba(29, 43, 64, 0.2);
}

html[data-hm-theme="dark"] {
    color-scheme: dark;
    --hm-ink: #f1f5fb;
    --hm-muted: #adbbce;
    --hm-border: #344a64;
    --hm-border-strong: #48617f;
    --hm-canvas: #0f1b2d;
    --hm-surface: #18283d;
    --hm-surface-soft: #20334c;
    --hm-surface-muted: #293e59;
    --hm-surface-hover: #243d5e;
    --hm-overlay: rgba(4, 11, 21, 0.72);
    --hm-nav-surface: #142238;
    --hm-nav-surface-muted: #192b43;
    --hm-nav-text: #d7e3f2;
    --hm-nav-muted: #99adc5;
    --hm-nav-hover: rgba(75, 155, 255, 0.14);
    --hm-nav-active: #1769cf;
    --hm-brand-blue: #4b9bff;
    --hm-brand-blue-dark: #83bdff;
    --hm-brand-blue-soft: #203d68;
    --hm-brand-blue-contrast: #0f1b2d;
    --hm-brand-navy: #23334d;
    --hm-brand-navy-deep: #142238;
    --hm-yellow: #ffcf26;
    --hm-success: var(--hm-brand-blue-dark);
    --hm-warning: #f2bd70;
    --hm-danger: #ff958b;
    --hm-info: var(--hm-brand-blue-dark);
    --hm-success-soft: rgba(75, 155, 255, 0.16);
    --hm-warning-soft: rgba(242, 189, 112, 0.14);
    --hm-danger-soft: rgba(255, 149, 139, 0.14);
    --hm-info-soft: rgba(75, 155, 255, 0.16);
    --hm-info-ink: #b9d9ff;
    --hm-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.24);
    --hm-shadow: 0 14px 34px rgba(0, 0, 0, 0.3);
    --hm-focus: 0 0 0 4px rgba(75, 155, 255, 0.28);
}

html,
body {
    background-color: var(--hm-canvas);
    color: var(--hm-ink);
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 2px solid var(--hm-brand-blue) !important;
    outline-offset: 2px !important;
    box-shadow: var(--hm-focus) !important;
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}