/* =============================================================================
   base/variables.css
   Single source of truth for all design tokens.

   Canonical names are listed first. Legacy aliases that are still in active
   use are grouped at the bottom of each section — do not add new aliases.
   ============================================================================= */

:root {
    /* ── Brand ─────────────────────────────────────────────────────────── */
    --primary:            #003ec5;
    --primary-dark:       #002aa3;
    --primary-light:      #e6f0ff;

    /* ── Text ───────────────────────────────────────────────────────────── */
    --text-dark:          #1f2937;
    --text-medium:        #4b5563;
    --text-light:         #6b7280;
    --text-subtle:        #9ca3af;

    /* ── Backgrounds ────────────────────────────────────────────────────── */
    --bg-primary:         #ffffff;
    --bg-secondary:       #f9fafb;
    --bg-tertiary:        #f3f4f6;
    --bg-hover:           #f3f4f6;
    --input-bg:           #ffffff;

    /* legacy alias used across info/ and out-of-scope files — do not add new uses */
    --background:         #ffffff;

    /* ── Borders ────────────────────────────────────────────────────────── */
    --border-color:       #e5e7eb;
    --border-light:       #f3f4f6;
    --border-focus:       #003ec5;

    /* ── Shadows ────────────────────────────────────────────────────────── */
    --shadow-sm:          0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-md:          0 4px 6px rgba(0, 0, 0, 0.06);
    --shadow-lg:          0 8px 16px rgba(0, 0, 0, 0.08);
    --shadow-primary:     0 4px 12px rgba(0, 62, 197, 0.15);
    --card-shadow:        0 1px 3px rgba(0, 62, 197, 0.08);
    --shadow-color:       rgba(0, 62, 197, 0.05); /* legacy — used by subscription/info files */

    /* ── Semantic: Success ──────────────────────────────────────────────── */
    --success:            #10b981;
    --success-light:      #d1fae5;
    --success-bg:         #ecfdf5;
    --success-border:     #a7f3d0;
    --success-color:      #10b981; /* legacy alias */

    /* ── Semantic: Warning ──────────────────────────────────────────────── */
    --warning:            #f59e0b;
    --warning-light:      #fef3c7;
    --warning-bg:         #fffbeb;

    /* ── Semantic: Danger ───────────────────────────────────────────────── */
    --danger:             #ef4444;
    --danger-light:       #fee2e2;
    --danger-bg:          #fef2f2;
    --danger-border:      #fecaca;
    --danger-color:       #ef4444; /* legacy alias */

    /* ── Semantic: Info ─────────────────────────────────────────────────── */
    --info:               #3b82f6;
    --info-light:         #dbeafe;
    --info-bg:            #eff6ff;

    /* ── Accent (used by admin.css) ─────────────────────────────────────── */
    --accent-teal:        #14b8a6;
    --accent-purple:      #8b5cf6;
    --accent-indigo:      #6366f1;

    /* ── Gray scale ─────────────────────────────────────────────────────── */
    --gray-50:            #f9fafb;
    --gray-100:           #f3f4f6;
    --gray-200:           #e5e7eb;
    --gray-300:           #d1d5db;
    --gray-400:           #9ca3af;
    --gray-500:           #6b7280;
    --gray-600:           #4b5563;
    --gray-700:           #374151;
    --gray-800:           #1f2937;
    --gray-900:           #111827;

    /* ── Border radius ──────────────────────────────────────────────────── */
    --radius-sm:          6px;
    --radius-md:          8px;
    --radius-lg:          12px;
    --radius-xl:          16px;
    --radius-full:        9999px;

    /* legacy aliases — used across many existing files */
    --border-radius-sm:   6px;
    --border-radius-md:   8px;
    --border-radius-lg:   12px;
    --border-radius-xl:   16px;

    /* ── Spacing ────────────────────────────────────────────────────────── */
    --space-1:            0.25rem;
    --space-2:            0.5rem;
    --space-3:            0.75rem;
    --space-4:            1rem;
    --space-5:            1.25rem;
    --space-6:            1.5rem;
    --space-8:            2rem;
    --space-10:           2.5rem;
    --space-12:           3rem;

    /* ── Typography ─────────────────────────────────────────────────────── */
    --font-family:        -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Inter", sans-serif;
    --font-size-xs:       0.6875rem;  /* 11px */
    --font-size-sm:       0.8125rem;  /* 13px */
    --font-size-base:     0.875rem;   /* 14px */
    --font-size-md:       0.9375rem;  /* 15px */
    --font-size-lg:       1rem;       /* 16px */
    --font-size-xl:       1.125rem;   /* 18px */
    --font-size-2xl:      1.25rem;    /* 20px */
    --font-size-3xl:      1.5rem;     /* 24px */
    --font-weight-normal:   400;
    --font-weight-medium:   500;
    --font-weight-semibold: 600;
    --font-weight-bold:     700;
    --line-height-tight:    1.25;
    --line-height-normal:   1.5;
    --line-height-relaxed:  1.75;

    /* ── Transitions ────────────────────────────────────────────────────── */
    --transition-fast:    all 0.15s ease;
    --transition-base:    all 0.2s ease;
    --transition-slow:    all 0.3s ease;

    /* legacy alias — widely used across existing files */
    --transition:         all 0.2s ease;

    /* ── Z-index scale ──────────────────────────────────────────────────── */
    --z-dropdown:         1000;
    --z-sticky:           1020;
    --z-fixed:            1030;
    --z-modal-backdrop:   1040;
    --z-modal:            1050;
    --z-modal-overlay:    1050;
    --z-popover:          1060;
    --z-tooltip:          1070;
}

/* ── Accessibility ────────────────────────────────────────────────────────── */

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

@media (prefers-contrast: high) {
    :root {
        --primary:       #003ec5;
        --text-dark:     #000000;
        --text-light:    #374151;
        --border-color:  #4b5563;
    }
}