/**
 * Base color tokens — Bootstrap 5 variables
 *
 * Brand anchors (logo): azure #00619D, navy #222D5B.
 * Soft surfaces + semantic accents keep Duolingo-style clarity
 * without fighting the logo. Themes override via the same --bs-* names.
 *
 * RGB triplets stay comma-separated so rgba(var(--bs-*-rgb), a) works.
 */

:root,
[data-bs-theme='light'] {
    /* ------------------------------------------------------------------ */
    /* Brand — logo azure + navy                                           */
    /* ------------------------------------------------------------------ */
    --color-sky: #00619d;
    --color-sky-deep: #004f80;
    --color-sky-bright: #0078c2;
    --color-sky-soft: #e7f1f8;
    --color-sky-mist: #f2f7fb;
    --color-navy: #222d5b;
    --color-midnight: #161d3d;

    /* Neutrals — never pure black; soft paper canvas */
    --color-ink: #3c3c3c;
    --color-ink-soft: #4b4b4b;
    --color-mute: #777777;
    --color-faint: #afafaf;
    --color-line: #e5e5e5;
    --color-wash: #f7f7f7;
    --color-paper: #ffffff;

    /* Semantic accents */
    --color-ok: #58cc02;
    --color-ok-deep: #58a700;
    --color-ok-soft: #d7ffb8;
    --color-warn: #ffc800;
    --color-warn-deep: #e5a100;
    --color-warn-soft: #fff5cc;
    --color-alert: #ff4b4b;
    --color-alert-deep: #ea2b2b;
    --color-alert-soft: #ffe5e5;
    --color-info: #00619d;
    --color-info-deep: #004f80;
    --color-info-soft: #e7f1f8;

    /* ------------------------------------------------------------------ */
    /* Bootstrap bridge                                                    */
    /* ------------------------------------------------------------------ */
    --bs-blue: var(--color-sky);
    --bs-indigo: #222d5b;
    --bs-purple: #ce82ff;
    --bs-pink: #ff86d0;
    --bs-red: var(--color-alert);
    --bs-orange: #ff9600;
    --bs-yellow: var(--color-warn);
    --bs-green: var(--color-ok);
    --bs-teal: #00cd9c;
    --bs-cyan: var(--color-sky);
    --bs-black: #000000;
    --bs-white: var(--color-paper);
    --bs-gray: var(--color-mute);
    --bs-gray-dark: var(--color-ink);

    --bs-gray-100: #f7f7f7;
    --bs-gray-200: #efefef;
    --bs-gray-300: #e5e5e5;
    --bs-gray-400: #cfcfcf;
    --bs-gray-500: #afafaf;
    --bs-gray-600: #777777;
    --bs-gray-700: #4b4b4b;
    --bs-gray-800: #3c3c3c;
    --bs-gray-900: #1f1f1f;

    /* Primary — logo azure #00619D */
    --bs-primary: #00619d;
    --bs-primary-rgb: 0, 97, 157;
    --bs-primary-rgb-hover: 0, 120, 194;
    --bs-primary-text-emphasis: #004472;
    --bs-primary-bg-subtle: #e7f1f8;
    --bs-primary-border-subtle: #b3d4e8;

    /* Secondary — logo navy #222D5B */
    --bs-secondary: #222d5b;
    --bs-secondary-rgb: 34, 45, 91;
    --bs-secondary-rgb-hover: 22, 29, 61;
    --bs-secondary-text-emphasis: #222d5b;
    --bs-secondary-bg-subtle: #e9ebf1;
    --bs-secondary-border-subtle: #c5cad8;

    /* Success */
    --bs-success: #58cc02;
    --bs-success-rgb: 88, 204, 2;
    --bs-success-rgb-hover: 88, 167, 0;
    --bs-success-text-emphasis: #3d7c00;
    --bs-success-bg-subtle: #e8fbcf;
    --bs-success-border-subtle: #b8ef7a;

    /* Info — same family as primary */
    --bs-info: #00619d;
    --bs-info-rgb: 0, 97, 157;
    --bs-info-rgb-hover: 0, 120, 194;
    --bs-info-text-emphasis: #004472;
    --bs-info-bg-subtle: #e7f1f8;
    --bs-info-border-subtle: #b3d4e8;

    /* Warning */
    --bs-warning: #ffc800;
    --bs-warning-rgb: 255, 200, 0;
    --bs-warning-rgb-hover: 229, 161, 0;
    --bs-warning-text-emphasis: #8a6500;
    --bs-warning-bg-subtle: #fff5cc;
    --bs-warning-border-subtle: #ffe680;

    /* Danger */
    --bs-danger: #ff4b4b;
    --bs-danger-rgb: 255, 75, 75;
    --bs-danger-rgb-hover: 234, 43, 43;
    --bs-danger-text-emphasis: #b42318;
    --bs-danger-bg-subtle: #ffe5e5;
    --bs-danger-border-subtle: #ffb3b3;

    /* Light / dark */
    --bs-light: #f7f7f7;
    --bs-light-rgb: 247, 247, 247;
    --bs-light-text-emphasis: #4b4b4b;
    --bs-light-bg-subtle: #fcfcfc;
    --bs-light-border-subtle: #efefef;

    --bs-dark: #3c3c3c;
    --bs-dark-rgb: 60, 60, 60;
    --bs-dark-text-emphasis: #1f1f1f;
    --bs-dark-bg-subtle: #ececec;
    --bs-dark-border-subtle: #cfcfcf;

    /* Body & surfaces */
    --bs-body-color: #4b4b4b;
    --bs-body-color-rgb: 75, 75, 75;
    --bs-body-bg: #ffffff;
    --bs-body-bg-rgb: 255, 255, 255;
    --bs-emphasis-color: #3c3c3c;
    --bs-emphasis-color-rgb: 60, 60, 60;
    --bs-secondary-color: rgba(75, 75, 75, 0.75);
    --bs-secondary-color-rgb: 75, 75, 75;
    --bs-tertiary-color: rgba(75, 75, 75, 0.5);
    --bs-tertiary-color-rgb: 75, 75, 75;
    --bs-tertiary-bg: #f7f7f7;
    --bs-tertiary-bg-rgb: 247, 247, 247;

    /* Borders, links, focus */
    --bs-border-color: #e5e5e5;
    --bs-border-color-translucent: rgba(60, 60, 60, 0.12);
    --bs-heading-color: #3c3c3c;
    --bs-link-color: #00619d;
    --bs-link-color-rgb: 0, 97, 157;
    --bs-link-hover-color: #0078c2;
    --bs-link-hover-color-rgb: 0, 120, 194;
    --bs-code-color: #ce82ff;
    --bs-highlight-bg: #fff5cc;
    --bs-focus-ring-color: rgba(0, 97, 157, 0.35);
    --bs-focus-ring-opacity: 0.35;

    /* Form controls */
    --bs-form-valid-color: #58a700;
    --bs-form-valid-border-color: #58cc02;
    --bs-form-invalid-color: #ea2b2b;
    --bs-form-invalid-border-color: #ff4b4b;

    /* App helpers used by existing theme overrides */
    --scrollbar-thumb-rgb: 0, 97, 157;
    --scrollbar-track-rgb: 229, 229, 229;
    --bs-nav-link-active-rgb: 0, 97, 157;
    --bs-nav-link-active-rgb-hover: 0, 120, 194;
    --bs-primary-bg-rgb: 242, 247, 251;
    --bs-primary-bg-darker-rgb: 231, 241, 248;

    /* Legacy aliases (theme.css / plugins) */
    --primary-rgb: var(--bs-primary-rgb);
    --secondary-rgb: var(--bs-secondary-rgb);
}

[data-bs-theme='dark'] {
    --color-sky: #4d9fd4;
    --color-sky-deep: #00619d;
    --color-sky-bright: #6bb3de;
    --color-sky-soft: #0d2a3f;
    --color-sky-mist: #091c2a;
    --color-navy: #a8b0d0;
    --color-midnight: #e8eaf2;

    --color-ink: #f2f2f2;
    --color-ink-soft: #e0e0e0;
    --color-mute: #a3a3a3;
    --color-faint: #6b6b6b;
    --color-line: #2a2a2a;
    --color-wash: #161616;
    --color-paper: #121212;

    --color-ok: #89e219;
    --color-ok-deep: #58cc02;
    --color-ok-soft: #1f3a0a;
    --color-warn: #ffd633;
    --color-warn-deep: #ffc800;
    --color-warn-soft: #3d3200;
    --color-alert: #ff6b6b;
    --color-alert-deep: #ff4b4b;
    --color-alert-soft: #3d1212;
    --color-info: #4d9fd4;
    --color-info-deep: #00619d;
    --color-info-soft: #0d2a3f;

    --bs-primary: #4d9fd4;
    --bs-primary-rgb: 77, 159, 212;
    --bs-primary-rgb-hover: 107, 179, 222;
    --bs-primary-text-emphasis: #b8d9ef;
    --bs-primary-bg-subtle: #0d2a3f;
    --bs-primary-border-subtle: #1a4a6b;

    --bs-secondary: #a8b0d0;
    --bs-secondary-rgb: 168, 176, 208;
    --bs-secondary-rgb-hover: 196, 202, 224;
    --bs-secondary-text-emphasis: #d5d9ea;
    --bs-secondary-bg-subtle: #1a1e2e;
    --bs-secondary-border-subtle: #2e3450;

    --bs-success: #89e219;
    --bs-success-rgb: 137, 226, 25;
    --bs-success-rgb-hover: 88, 204, 2;
    --bs-success-text-emphasis: #c6f58a;
    --bs-success-bg-subtle: #1f3a0a;
    --bs-success-border-subtle: #3d6a12;

    --bs-info: #4d9fd4;
    --bs-info-rgb: 77, 159, 212;
    --bs-info-rgb-hover: 107, 179, 222;
    --bs-info-text-emphasis: #b8d9ef;
    --bs-info-bg-subtle: #0d2a3f;
    --bs-info-border-subtle: #1a4a6b;

    --bs-warning: #ffd633;
    --bs-warning-rgb: 255, 214, 51;
    --bs-warning-rgb-hover: 255, 200, 0;
    --bs-warning-text-emphasis: #ffe999;
    --bs-warning-bg-subtle: #3d3200;
    --bs-warning-border-subtle: #6b5800;

    --bs-danger: #ff6b6b;
    --bs-danger-rgb: 255, 107, 107;
    --bs-danger-rgb-hover: 255, 75, 75;
    --bs-danger-text-emphasis: #ffb3b3;
    --bs-danger-bg-subtle: #3d1212;
    --bs-danger-border-subtle: #7a2424;

    --bs-light: #2a2a2a;
    --bs-light-rgb: 42, 42, 42;
    --bs-light-text-emphasis: #f2f2f2;
    --bs-light-bg-subtle: #1a1a1a;
    --bs-light-border-subtle: #333333;

    --bs-dark: #e0e0e0;
    --bs-dark-rgb: 224, 224, 224;
    --bs-dark-text-emphasis: #ffffff;
    --bs-dark-bg-subtle: #2a2a2a;
    --bs-dark-border-subtle: #444444;

    --bs-body-color: #e0e0e0;
    --bs-body-color-rgb: 224, 224, 224;
    --bs-body-bg: #121212;
    --bs-body-bg-rgb: 18, 18, 18;
    --bs-emphasis-color: #f2f2f2;
    --bs-emphasis-color-rgb: 242, 242, 242;
    --bs-secondary-color: rgba(224, 224, 224, 0.75);
    --bs-secondary-color-rgb: 224, 224, 224;
    --bs-tertiary-color: rgba(224, 224, 224, 0.5);
    --bs-tertiary-color-rgb: 224, 224, 224;
    --bs-tertiary-bg: #1a1a1a;
    --bs-tertiary-bg-rgb: 26, 26, 26;

    --bs-border-color: #2a2a2a;
    --bs-border-color-translucent: rgba(255, 255, 255, 0.12);
    --bs-heading-color: #f2f2f2;
    --bs-link-color: #4d9fd4;
    --bs-link-color-rgb: 77, 159, 212;
    --bs-link-hover-color: #6bb3de;
    --bs-link-hover-color-rgb: 107, 179, 222;
    --bs-code-color: #e0aaff;
    --bs-highlight-bg: #3d3200;
    --bs-focus-ring-color: rgba(77, 159, 212, 0.4);

    --bs-form-valid-color: #89e219;
    --bs-form-valid-border-color: #89e219;
    --bs-form-invalid-color: #ff6b6b;
    --bs-form-invalid-border-color: #ff6b6b;

    --scrollbar-thumb-rgb: 77, 159, 212;
    --scrollbar-track-rgb: 42, 42, 42;
    --bs-nav-link-active-rgb: 77, 159, 212;
    --bs-nav-link-active-rgb-hover: 107, 179, 222;
    --bs-primary-bg-rgb: 13, 42, 63;
    --bs-primary-bg-darker-rgb: 9, 28, 42;

    --primary-rgb: var(--bs-primary-rgb);
    --secondary-rgb: var(--bs-secondary-rgb);
}