/* ---------------------------------------------------------------------------
   Ordoli design tokens — generated by hand from Design/tokens.json
   (project_ordoli.md §11.1; palette and specs from docs/ordoli_style_guide.pdf,
   "Revised light-theme style guide", applied 2026-11-02, ADR-W20).
   Never hard-code a hex value in a view: use these custom properties, or the
   Bootstrap variables they override below.

   Contrast (WCAG 2.2 AA, from the guide's table): #172B4D on white 14.1:1,
   #2459A6 on white 6.87:1 (primary buttons, links), #52627A on white 6.2:1
   (secondary text), #75859B on white 3.76:1 — UI controls and borders only,
   never text. Dark mode: white on #2F6FE0 ≈ 4.7:1.
   --------------------------------------------------------------------------- */

:root,
[data-bs-theme="light"] {
    --ol-background: #F3F6FA;
    --ol-surface: #FFFFFF;
    --ol-surface-elevated: #F3F6FA;
    --ol-surface-muted: #E8EDF4;
    --ol-primary: #2459A6;
    --ol-primary-pressed: #1D4F91;
    --ol-primary-deep: #173B70;
    --ol-on-primary: #FFFFFF;
    --ol-primary-tint: #E8F0FC;
    --ol-primary-soft: #D6E4FA;
    --ol-text-heading: #172B4D;
    --ol-text-body: #172B4D;
    --ol-text-secondary: #52627A;
    --ol-text-tertiary: #75859B;
    --ol-border: #D5DCE6;
    --ol-border-strong: #75859B;
    --ol-link: #2459A6;
    --ol-link-hover: #1D4F91;
    --ol-navy: #172B4D;
    --ol-on-navy: #FFFFFF;
    --ol-on-navy-muted: #B9C6DA;
    --ol-success: #176B4D;
    --ol-success-tint: #E3F3EC;
    --ol-warning: #8A4B08;
    --ol-warning-tint: #FFF1DC;
    --ol-error: #B42318;
    --ol-error-tint: #FDECEA;
    --ol-header-bg: #FFFFFF;
    --ol-shadow: 0 8px 24px -16px rgba(23, 43, 77, 0.3);
    --ol-shadow-soft: 0 1px 2px rgba(23, 43, 77, 0.06);
    --ol-gradient-hero: linear-gradient(135deg, #E8F0FC 0%, #F1F6FD 100%);
    --ol-hero-image: url("../img/hero-wave.png");
    --ol-band-image: url("../img/cta-wave.png");
    --ol-gradient-band: #E8F0FC;
    --ol-select-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23172B4D' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    --ol-switch-knob: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2352627A'/%3e%3c/svg%3e");
    --ol-error-glyph: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B42318' stroke-width='2.2' stroke-linecap='round'%3e%3ccircle cx='12' cy='12' r='9'/%3e%3cpath d='M12 7.5v5.5M12 16.5h.01'/%3e%3c/svg%3e");
}

[data-bs-theme="dark"] {
    --ol-background: #0B1A33;
    --ol-surface: #112346;
    --ol-surface-elevated: #16305A;
    --ol-surface-muted: #1B3760;
    --ol-primary: #2F6FE0;
    --ol-primary-pressed: #2560C9;
    --ol-primary-deep: #BFD6FF;
    --ol-on-primary: #FFFFFF;
    --ol-primary-tint: #1B3A6B;
    --ol-primary-soft: #1F4680;
    --ol-text-heading: #FFFFFF;
    --ol-text-body: #E3EAF5;
    --ol-text-secondary: #A9B8D0;
    --ol-text-tertiary: #8495B0;
    --ol-border: #2A4270;
    --ol-border-strong: #6F86AA;
    --ol-link: #8AB4FF;
    --ol-link-hover: #B3CCFF;
    --ol-navy: #07142A;
    --ol-on-navy: #FFFFFF;
    --ol-on-navy-muted: #A9B8D0;
    --ol-success: #5FCF9A;
    --ol-success-tint: #143A2E;
    --ol-warning: #FFC97A;
    --ol-warning-tint: #3E2E14;
    --ol-error: #FF8E8E;
    --ol-error-tint: #4A1F22;
    --ol-header-bg: #0B1A33;
    --ol-shadow: 0 8px 24px -16px rgba(0, 0, 0, 0.7);
    --ol-shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.3);
    --ol-gradient-hero: linear-gradient(135deg, #12284F 0%, #0E2142 100%);
    --ol-hero-image: none;
    --ol-band-image: none;
    --ol-gradient-band: #15305C;
    --ol-select-chevron: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23FFFFFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    --ol-switch-knob: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23A9B8D0'/%3e%3c/svg%3e");
    --ol-error-glyph: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF8E8E' stroke-width='2.2' stroke-linecap='round'%3e%3ccircle cx='12' cy='12' r='9'/%3e%3cpath d='M12 7.5v5.5M12 16.5h.01'/%3e%3c/svg%3e");
}

:root {
    --ol-radius-card: 16px;
    --ol-radius-panel: 16px;
    --ol-radius-button: 10px;
    --ol-radius-input: 10px;
    --ol-radius-nav: 10px;
    --ol-radius-chip: 999px;

    --ol-space-xs: 4px;
    --ol-space-sm: 8px;
    --ol-space-md: 12px;
    --ol-space-lg: 16px;
    --ol-space-xl: 24px;
    --ol-space-xxl: 32px;

    --ol-type-title: 32px;
    --ol-type-heading: 24px;
    --ol-type-card: 18px;
    --ol-type-body: 16px;
    --ol-type-secondary: 14px;
    --ol-type-caption: 12px;

    --ol-control-height: 48px;
    --ol-content-width: 1200px;

    --ol-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial,
        "Noto Sans Devanagari", "Noto Naskh Arabic", "Noto Sans SC", "Noto Sans JP", sans-serif;
}

/* ---- Bootstrap 5.3 variable overrides (both colour modes) ------------------ */

:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --bs-body-bg: var(--ol-background);
    --bs-body-color: var(--ol-text-body);
    --bs-secondary-color: var(--ol-text-secondary);
    --bs-secondary-bg: var(--ol-surface-muted);
    --bs-tertiary-bg: var(--ol-surface-elevated);
    --bs-border-color: var(--ol-border);
    --bs-heading-color: var(--ol-text-heading);
    --bs-link-color: var(--ol-link);
    --bs-link-hover-color: var(--ol-link-hover);
    --bs-link-color-rgb: 36, 89, 166;
    --bs-primary: var(--ol-primary);
    --bs-success: var(--ol-success);
    --bs-warning: var(--ol-warning);
    --bs-danger: var(--ol-error);
    --bs-body-font-family: var(--ol-font-sans);
    --bs-body-font-size: 1rem;
    --bs-body-line-height: 1.5;
    --bs-border-radius: var(--ol-radius-input);
    --bs-border-radius-lg: var(--ol-radius-card);
    --bs-border-radius-pill: var(--ol-radius-chip);
    --bs-focus-ring-color: color-mix(in srgb, var(--ol-primary) 35%, transparent);
    --bs-emphasis-color: var(--ol-text-heading);
}

[data-bs-theme="dark"] {
    --bs-link-color-rgb: 138, 180, 255;
}