/*
 * IgniteATS Design Tokens
 * Default values on :root = Orange & Blue (light) theme.
 * Theme files override these via [data-theme] attribute selectors.
 * Components consume these tokens via var(--iats-*).
 */

:root {
    /* ===== Brand ===== */
    --iats-brand-primary: #074774;
    --iats-brand-primary-hover: #063556;
    --iats-brand-secondary: #F2B045;

    /* ===== Logo ===== */
    --iats-logo-primary: var(--iats-brand-primary);
    --iats-logo-secondary: var(--iats-brand-secondary);

    /* ===== Surface / Background ===== */
    --iats-bg-body: #ffffff;
    --iats-bg-surface: var(--iats-bg-body);
    --iats-bg-surface-raised: #f5f5f5;
    --iats-bg-surface-sunken: #f7f7f7;
    --iats-bg-sidebar: var(--iats-bg-body);
    --iats-bg-topbar: #f7f7f7;
    --iats-bg-overlay: rgba(8, 52, 83, 0.2);
    --iats-bg-login-card: var(--iats-bg-body);

    /* ===== Text ===== */
    --iats-text-primary: var(--iats-neutral-gray-darkest);
    --iats-text-secondary: #666666;
    --iats-text-tertiary: #7b7b7b;
    --iats-text-inverse: var(--iats-neutral-white);
    --iats-text-link: #006bb7;
    --iats-text-link-hover: var(--iats-brand-primary);
    --iats-text-heading: var(--iats-neutral-black);

    /* ===== Buttons ===== */
    --iats-btn-primary-bg: var(--iats-brand-primary);
    --iats-btn-primary-border: var(--iats-brand-primary);
    --iats-btn-primary-text: var(--iats-text-inverse);
    --iats-btn-primary-hover-bg: var(--iats-brand-primary-hover);
    --iats-btn-primary-hover-border: var(--iats-brand-primary-hover);
    --iats-btn-secondary-bg: var(--iats-bg-body);
    --iats-btn-secondary-border: var(--iats-accent-primary);
    --iats-btn-secondary-text: var(--iats-accent-primary);
    --iats-btn-secondary-hover-bg: #f2f7fb;
    --iats-btn-danger-bg: #FF6D6D;
    --iats-btn-danger-hover-bg: #e55a5a;
    --iats-btn-danger-text: var(--iats-text-inverse);

    /* ===== Form / Input ===== */
    --iats-input-bg: var(--iats-bg-body);
    --iats-input-border: #bfbfbf;
    --iats-input-text: var(--iats-text-primary);
    --iats-input-placeholder: var(--iats-text-tertiary);
    --iats-input-focus-border: var(--iats-accent-primary);
    --iats-input-focus-ring: #258cfb;
    --iats-input-valid: #26b050;
    --iats-input-invalid: #e50000;

    /* ===== Borders ===== */
    --iats-border-default: #d6d5d5;
    --iats-border-light: #edf1f4;
    --iats-border-input: #929292;
    --iats-border-header-control: #8fb8c9;

    /* ===== Navigation ===== */
    --iats-nav-text: var(--iats-brand-primary);
    --iats-nav-text-active: var(--iats-nav-text);
    --iats-nav-active-bg: var(--iats-accent-primary-light);
    --iats-nav-active-bar: var(--iats-brand-primary);
    --iats-nav-hover-bg: rgba(7, 71, 116, 0.08);

    /* ===== Sidebar ===== */
    --iats-sidebar-border-color: var(--iats-border-default);
    --iats-sidebar-brand-bg: transparent;
    --iats-sidebar-close-bg: rgba(0, 0, 0, 0.06);
    --iats-sidebar-close-color: var(--iats-text-secondary);
    --iats-sidebar-close-hover-bg: rgba(0, 0, 0, 0.12);
    --iats-sidebar-close-hover-color: var(--iats-text-primary);
    --iats-sidebar-footer-border: var(--iats-border-light);
    --iats-sidebar-version-color: var(--iats-text-tertiary);
    --iats-sidebar-link-color: var(--iats-text-secondary);
    --iats-sidebar-link-hover-color: var(--iats-text-primary);
    --iats-sidebar-link-separator-color: var(--iats-text-tertiary);
    --iats-sidebar-heading-color: var(--iats-text-tertiary);

    /* ===== Status / Toast ===== */
    --iats-status-error-bg: #fef2f2;
    --iats-status-error-border: #fecaca;
    --iats-status-error-text: #991b1b;
    --iats-status-success-bg: #f0fdf4;
    --iats-status-success-border: #bbf7d0;
    --iats-status-success-text: #166534;
    --iats-status-warning-bg: #fffbeb;
    --iats-status-warning-border: #fde68a;
    --iats-status-warning-text: #92400e;
    --iats-status-info-bg: #eff6ff;
    --iats-status-info-border: #bfdbfe;
    --iats-status-info-text: #1e40af;

    /* ===== Accent (agreement, checkboxes, focus) ===== */
    --iats-accent-primary: #0E5A8E;
    --iats-accent-primary-hover: var(--iats-brand-primary);
    --iats-accent-primary-light: rgba(15, 89, 142, 0.12);
    --iats-accent-continue-bg: var(--iats-brand-primary);
    --iats-accent-continue-hover: #0a5589;

    /* ===== Scrollbar ===== */
    --iats-scrollbar-thumb: var(--iats-text-tertiary);
    --iats-scrollbar-track: var(--iats-bg-surface-raised);

    /* ===== Border Radius ===== */
    --iats-radius-sm: 4px;
    --iats-radius-md: 8px;
    --iats-radius-lg: 12px;
    --iats-radius-xl: 16px;
    --iats-radius-pill: 9999px;

    /* ===== Typography ===== */
    --iats-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --iats-font-size-xs: 0.75rem;
    --iats-font-size-sm: 0.875rem;
    --iats-font-size-base: 1rem;
    --iats-font-size-lg: 1.125rem;
    --iats-font-size-xl: 1.25rem;
    --iats-font-weight-normal: 400;
    --iats-font-weight-medium: 500;
    --iats-font-weight-semibold: 600;
    --iats-font-weight-bold: 700;

    /* ===== Layout ===== */
    --iats-header-height: 64px;
    --iats-sidebar-width: 250px;
    --iats-content-bg: var(--iats-bg-surface-raised);
    --iats-content-padding: 1.5rem;
    --iats-content-padding-mobile: 1rem;
    --iats-transition-speed: 0.3s;

    /* ===== Shadows ===== */
    --iats-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.08);
    --iats-shadow-md: 0 10px 25px rgba(0, 0, 0, 0.2);
    --iats-shadow-lg: 0 24px 56px rgba(0, 0, 0, 0.18);

    /* ===== Content / Secondary usage ===== */
    --iats-content-color: #337AB7;
    --iats-secondary-link: #FFB800;
    --iats-highlight: var(--iats-brand-secondary);

    /* ===== Color Palette Tokens ===== */
    --iats-primary-tone-0: #012136;
    --iats-primary-tone-10: #072F4A;
    --iats-primary-tone-20: #063556;
    --iats-primary-tone-30: #074774;
    --iats-primary-tone-40: #0F598E;
    --iats-primary-tone-50: #337AB7;
    --iats-primary-tone-80: #5CA2DF;
    --iats-primary-tone-100: #98C7F1;

    --iats-secondary-tone-0: #B87A15;
    --iats-secondary-tone-10: #CA9032;
    --iats-secondary-tone-20: #F2B045;
    --iats-secondary-tone-30: #E8B96D;
    --iats-secondary-tone-40: #EBC992;
    --iats-secondary-tone-80: #ECD5AF;
    --iats-secondary-tone-100: #F6EAD7;

    --iats-tertiary-tone-0: #485A65;
    --iats-tertiary-tone-10: #5B7383;
    --iats-tertiary-tone-20: #7594A8;
    --iats-tertiary-tone-30: #8BADC3;
    --iats-tertiary-tone-40: #9FC6E0;
    --iats-tertiary-tone-50: #C6E4F8;

    --iats-gender-male: #9BE6F0;
    --iats-gender-female: #F9AEC5;
    --iats-gender-unspecified: #FDEC79;

    --iats-label-warning: #C55A12;
    --iats-label-bad: #F4B183;
    --iats-label-normal: #FFE699;
    --iats-label-good: #D6E9C9;
    --iats-label-excellent: #548235;

    --iats-notify-link: #0066FF;
    --iats-notify-error: #FF0F01;
    --iats-notify-warning: #FFD34E;
    --iats-notify-success: #34BC0B;

    --iats-neutral-white: #FFFFFF;
    --iats-neutral-black: #000000;
    --iats-neutral-gray-lightest: #F9F9F9;
    --iats-neutral-gray-darkest: #1C1C1C;

    /* ===== Mode switch (dark/light toggle) ===== */
    --iats-mode-switch-track-bg: #FFFFFF;
    --iats-mode-switch-track-border: #D0D0D0;
    --iats-mode-switch-sun-bg: #FFFFFF;
    --iats-mode-switch-sun-stroke: var(--iats-brand-primary);
    --iats-mode-switch-moon-bg: var(--iats-brand-primary);
    --iats-mode-switch-moon-stroke: #F5F5F5;

    /* ===== Smart.Blazor remapping ===== */
    /* Moved to css/_smart-overrides.css (must load after smart.default.css) */
}

/* Kill all transitions while the theme is switching so every element snaps together */
.iats-theme-switching,
.iats-theme-switching *,
.iats-theme-switching *::before,
.iats-theme-switching *::after {
    transition-duration: 0s !important;
}

/* Dark-mode switch overrides (references themed tokens, so theme-agnostic) */
[data-theme-mode="dark"] {
    --iats-mode-switch-track-bg: var(--iats-brand-primary);
    --iats-mode-switch-track-border: var(--iats-brand-primary);
    --iats-mode-switch-sun-bg: #FFFFFF;
    --iats-mode-switch-sun-stroke: #FFFFFF;
    --iats-mode-switch-moon-bg: var(--iats-brand-primary);
    --iats-mode-switch-moon-stroke: #F5F5F5;
}

/* Reduced motion: disable transitions for users who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
    :root {
        --iats-transition-speed: 0s;
    }
}

/* No-JS dark mode fallback for users with prefers-color-scheme: dark */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme-mode]) {
        --iats-bg-body: var(--iats-neutral-gray-darkest);
        --iats-bg-surface: #222222;
        --iats-bg-surface-raised: #2a2a2a;
        --iats-bg-surface-sunken: #1a1a1a;
        --iats-bg-topbar: var(--iats-neutral-gray-darkest);
        --iats-bg-login-card: #222222;
        --iats-bg-overlay: rgba(0, 0, 0, 0.5);
        --iats-text-primary: #e2e8f0;
        --iats-text-secondary: #a0aec0;
        --iats-text-tertiary: #718096;
        --iats-text-heading: #f7fafc;
        --iats-text-link: #5CA2DF;
        --iats-text-link-hover: #98C7F1;
        --iats-btn-primary-bg: #0E5A8E;
        --iats-btn-primary-border: var(--iats-btn-primary-bg);
        --iats-btn-primary-hover-bg: #337AB7;
        --iats-btn-primary-hover-border: var(--iats-btn-primary-hover-bg);
        --iats-btn-secondary-bg: #1f2b47;
        --iats-btn-secondary-border: #5CA3DF;
        --iats-btn-secondary-text: #5CA3DF;
        --iats-btn-secondary-hover-bg: #263550;
        --iats-btn-danger-bg: #c53030;
        --iats-btn-danger-hover-bg: #e53e3e;
        --iats-btn-danger-text: var(--iats-neutral-white);
        --iats-input-bg: #1a1a1a;
        --iats-input-border: #4a5568;
        --iats-input-text: var(--iats-text-primary);
        --iats-input-placeholder: var(--iats-text-tertiary);
        --iats-input-focus-border: #5CA3DF;
        --iats-input-focus-ring: var(--iats-input-focus-border);
        --iats-border-default: #2d3748;
        --iats-border-light: #1f2b47;
        --iats-border-input: var(--iats-input-border);
        --iats-accent-primary: #5CA3DF;
        --iats-accent-primary-hover: #337AB7;
        --iats-accent-primary-light: rgba(92, 163, 223, 0.15);
        --iats-accent-continue-bg: var(--iats-btn-primary-bg);
        --iats-accent-continue-hover: var(--iats-btn-primary-hover-bg);
        --iats-scrollbar-thumb: #4a5568;
        --iats-scrollbar-track: #1a202c;
        --iats-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.3);
        --iats-shadow-md: 0 10px 25px rgba(0, 0, 0, 0.4);
        --iats-shadow-lg: 0 24px 56px rgba(0, 0, 0, 0.5);
        --iats-content-color: #5CA3DF;
        --iats-secondary-link: #F2B045;
        --iats-highlight: var(--iats-brand-secondary);
        /* Status colors for dark mode */
        --iats-status-error-bg: #3b1111;
        --iats-status-error-border: #7f1d1d;
        --iats-status-error-text: #fca5a5;
        --iats-status-success-bg: #0f2a1a;
        --iats-status-success-border: #166534;
        --iats-status-success-text: #86efac;
        --iats-status-warning-bg: #2a1f0a;
        --iats-status-warning-border: #92400e;
        --iats-status-warning-text: #fcd34d;
        --iats-status-info-bg: #0f1a2e;
        --iats-status-info-border: #1e40af;
        --iats-status-info-text: #93c5fd;
        --iats-border-header-control: #4a5f70;
        /* Sidebar dark fallback */
        --iats-bg-sidebar: var(--iats-bg-body);
        --iats-nav-text: #5CA2DF;
        --iats-nav-text-active: var(--iats-nav-text);
        --iats-nav-active-bg: #0d1e30;
        --iats-nav-active-bar: var(--iats-accent-primary);
        --iats-nav-hover-bg: rgba(255, 255, 255, 0.08);
        --iats-sidebar-border-color: transparent;
        --iats-sidebar-brand-bg: transparent;
        --iats-sidebar-close-bg: rgba(255, 255, 255, 0.1);
        --iats-sidebar-close-color: #d7d7d7;
        --iats-sidebar-close-hover-bg: rgba(255, 255, 255, 0.2);
        --iats-sidebar-close-hover-color: var(--iats-neutral-white);
        --iats-sidebar-footer-border: rgba(255, 255, 255, 0.1);
        --iats-sidebar-version-color: rgba(255, 255, 255, 0.4);
        --iats-sidebar-link-color: rgba(255, 255, 255, 0.5);
        --iats-sidebar-link-hover-color: rgba(255, 255, 255, 0.8);
        --iats-sidebar-link-separator-color: rgba(255, 255, 255, 0.3);
        --iats-sidebar-heading-color: rgba(255, 255, 255, 0.5);
        /* Mode switch dark fallback */
        --iats-mode-switch-track-bg: var(--iats-brand-primary);
        --iats-mode-switch-track-border: var(--iats-brand-primary);
        --iats-mode-switch-sun-bg: #FFFFFF;
        --iats-mode-switch-sun-stroke: #FFFFFF;
        --iats-mode-switch-moon-bg: var(--iats-brand-primary);
        --iats-mode-switch-moon-stroke: #F5F5F5;
    }
}