/* ══════════════════════════════════════════════════════════════════════
   MASTER COLOR FILE
   ──────────────────────────────────────────────────────────────────────
   Every themed color across the app (top bar, buttons, modals/popups,
   progress bars, status boxes) is a CSS custom property defined here.
   Change a value in this one file and it applies everywhere that
   references var(--...) instead of a hardcoded hex code.
   ══════════════════════════════════════════════════════════════════════ */

:root {

    /* ── Brand gradient (top bar, wizard/modal headers) ──
    Current theme: "Arctic Reflection" — deep navy-charcoal easing through
    slate blue-gray into steel blue. Change these three stops to re-theme
    every header at once. */
    --brand-grad-start: #243c4c;
    --brand-grad-mid:   #698696;
    --brand-grad-end:   #5289ad;
    --brand-gradient: linear-gradient(135deg, var(--brand-grad-start) 0%, var(--brand-grad-mid) 55%, var(--brand-grad-end) 100%);

    /* Header text — most themes are dark gradients that want white text,
    but a light/pastel gradient needs dark text instead. Every header
    component reads these two instead of hardcoding white. */
    --header-text: #ffffff;
    --header-text-muted: rgba(255,255,255,.65);
    --header-btn-bg: rgba(255,255,255,.15);
    --header-btn-bg-hover: rgba(255,255,255,.25);

    /* ── Primary brand color — buttons, links, active states, borders ── */
    --color-primary: #243c4c;
    --color-primary-dark: #1a2c38;
    --color-primary-light: #f4fcfb;
    --color-accent: #5289ad;

    /* Two-tone gradients built from the primary/accent pair — used on
    buttons and progress bars. */
    --accent-gradient: linear-gradient(135deg, var(--color-primary), var(--color-accent));
    --accent-gradient-h: linear-gradient(90deg, var(--color-primary), var(--color-accent));

    /* ── Semantic status colors ── */
    --color-success: #16a34a;
    --color-success-dark: #166534;
    --color-success-light: #f0fdf4;
    --color-success-border: #86efac;

    --color-danger: #dc2626;
    --color-danger-dark: #991b1b;
    --color-danger-light: #fef2f2;
    --color-danger-border: #fca5a5;

    --color-warning: #d97706;
    --color-info: #3b82f6;

    /* ── Typography (buttons) ──
    One font-size/weight for every action button across the portal —
    change it here once instead of tuning each button class separately. */
    --btn-font-family: 'Inter', sans-serif;
    --btn-font-size: .85rem;
    --btn-font-weight: 700;

    /* ── Neutrals ── */
    --color-text: #1e2535;
    --color-text-muted: #64748b;
    --color-text-faint: #94a3b8;
    --color-border: #e0e7f0;
    --color-bg: #f0f4f9;
    --color-surface: #ffffff;
}

/* ── Base reset ──
   Headings/labels/icons/static text aren't meant to be selected — without
   this, hovering them shows a text I-beam cursor and clicking can leave a
   stray blinking selection caret, which reads as a UI glitch (this is the
   "bar" that shows up over plain text throughout the app). Already used on
   the login screen (Views/Account/_AuthLayout.cshtml); centralized here so
   it applies to every page that loads theme.css instead of needing to be
   repeated per page. Form inputs/textareas remain natively
   selectable/editable — user-select doesn't affect text typed into them. */
body {
    -webkit-user-select: none;
    user-select: none;
}