:root {
    /* =============================================
       BOOTSTRAP CORE
       ============================================= */
    --bs-primary:     #0b4650;
    --bs-info:        #a6e115;

    --bs-primary-rgb: 11, 70, 80;
    --bs-info-rgb:    166, 225, 21;

    --bs-info-light:                    #bce950;
    --bs-info-light1:                   #b3e638;
    --bs-primary-light:                 #48747c;

    --bs-info-light-rgb:                166, 225, 21;
    --bs-primary-light-rgb:             11, 70, 80;

    --bs-info-active-bg:                #85b411;
    --bs-primary-active-bg:             #093840;
    --bs-btn-active-border-color-info:      #7da910;
    --bs-btn-active-border-color-primary:   #08353c;
    --bs-btn-disabled-bg-info:              #c5ec67;
    --bs-btn-disabled-bg-primary:           #60878d;
    --bs-btn-disabled-border-color-info:    #c5ec67;
    --bs-btn-disabled-border-color-primary: #60878d;
    --bs-success-text-emphasis-primary:     #0d515c;
    --bs-btn-color-info:                    #7da910;

    /* =============================================
       VP / TEAL VARIANTS
       ============================================= */
    --vp-teal:      #1f555e;
    --vp-teal-mid:  #376770;
    --vp-dark:      #041c20;
    --vp-dark2:     #06272c;

    /* =============================================
       NAVY HIERARCHY
       ============================================= */
    --navy:       #0b4650;
    --navy-mid:   #235962;
    --navy-light: #3c6b73;
    --navy-dark:  #0a3f48;
    --navy-dark1: #093c44;
    --navy-dark2: #083138;

    /* =============================================
       LIME / INFO
       ============================================= */
    --lime:        #a6e115;
    --lime-bright: #b3e638;
    --lime-dim:    rgba(166, 225, 21, 0.18);
    --lime-glow:   rgba(166, 225, 21, 0.38);

    /* =============================================
       LANDING PAGE CHROME
       ============================================= */
    --primary:        #0b4650;
    --primary-r:      11;
    --primary-g:      70;
    --primary-b:      80;
    --primary-dark:   #093c44;
    --primary-light:  #91acb0;
    --primary-dim:    rgba(11,70,80,.10);
    --primary-mid:    rgba(11,70,80,.18);
    --primary-glow:   rgba(11,70,80,.28);

    --info:           #a6e115;
    --info-r:         166;
    --info-g:         225;
    --info-b:         21;
    --info-dark:      #85b411;
    --info-dim:       rgba(166,225,21,.12);
    --info-glow:      rgba(166,225,21,.3);

    /* ── Surfaces & Layout ── */
    --bg:             #f4f6f8;
    --bg-card:        #ffffff;
    /* FIX: use rgba with brand RGB so border is visible on light AND dark surfaces */
    --border:         rgba(11,70,80,0.10);
    --border-focus:   rgba(11,70,80,.35);
    --txt-hi:         #1a2332;
    --txt-mid:        #4a5568;
    --txt-lo:         #9aa5b4;
    --nav-h:          58px;
    --t:              .2s ease;
    --shadow-sm:      0 1px 3px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.04);
    --shadow-md:      0 4px 16px rgba(0,0,0,.08);
    --shadow-lg:      0 8px 32px rgba(0,0,0,.10), 0 3px 8px rgba(0,0,0,.05);

    /* =============================================
       NORDB2B THEME
       ============================================= */
    --red:            #0b4650;
    --red-light:      #cedadc;
    --red-mid:        #79999f;
    --red-dark:       #093c44;
    --red-darker:     #083138;

    --info-brand:     #a6e115;
    --info-bg:        #edf9d0;

    /* Surfaces */
    --surface:        #ffffff;
    --surface2:       #f0f4f5;

    /* Theme borders */
    --border2:        rgba(11,70,80,0.17);

    /* Text hierarchy */
    --text1:          #0a434c;
    --text2:          #547b82;
    --text3:          #91aaae;

    /* Semantic states */
    --success:        #1a7a4a;
    --success-bg:     #e6f4ed;
    --warn:           #8a5a00;
    --warn-bg:        #fff5d6;
    --danger:         #b22222;
    --danger-bg:      #fdeaea;

    /* Typography */
    
    --font-display:   'DM Sans', sans-serif;
    --font-body:      'DM Sans', sans-serif;

    /* Radii */
    --r:              10px;
    --r-lg:           14px;
    --r-xl:           18px;

    /* Shadows (primary-tinted) */
    --shadow:         0 2px 14px rgba(11,70,80,0.07);
    --shadow-xl:      0 16px 64px rgba(11,70,80,0.16);
}

/* =============================================
   DARK MODE
   ============================================= */
[data-theme="dark"] {
    /* ── Surfaces ── */
    --bg:             #020b0c;
    --bg-card:        #031214;
    --surface:        #031214;
    --surface2:       #04191c;

    /* ── Borders ── */
    /* FIX: was rgba(0,0,0,...) which disappears on dark backgrounds */
    --border:         rgba(255,255,255,0.08);
    --border-theme:   rgba(255,255,255,0.07);
    --border2:        rgba(255,255,255,0.13);
    --border-focus:   rgba(11,70,80,.45);

    /* ── Text ── */
    --text1:          #e8f1fb;
    --txt-hi:         #e8f1fb;
    --text2:          #91acb0;
    --txt-mid:        #79999f;
    --text3:          #48747c;
    --txt-lo:         #3c6b73;

    /* ── Navy inverted to light ── */
    --navy:           #c2d1d3;
    --navy-light:     #9db5b9;
    --navy-mid:       #79999f;
    /* FIX: dark1/dark2 were missing — invert to lighter tones in dark mode */
    --navy-dark:      #547e85;
    --navy-dark1:     #60878d;
    --navy-dark2:     #85a3a8;

    /* ── VP / teal variants ── */
    /* FIX: these had no dark override */
    --vp-teal:        #6d9096;
    --vp-teal-mid:    #85a3a8;
    --vp-dark:        #b6c8cb;
    --vp-dark2:       #9db5b9;

    /* ── Lime / info ── */
    /* FIX: lime-bright had no dark override */
    --lime-bright:    #aae321;
    --lime-dim:       rgba(166,225,21,0.22);
    --lime-glow:      rgba(166,225,21,0.40);

    /* ── Brand tints ── */
    --red-light:      rgba(11,70,80,0.20);
    --red-mid:        rgba(11,70,80,0.30);
    /* FIX: red-dark / red-darker had no dark override */
    --red-dark:       #6d9096;
    --red-darker:     #91acb0;

    --primary-dim:    rgba(11,70,80,0.18);
    --primary-mid:    rgba(11,70,80,0.25);

    /* FIX: info-brand had no dark override */
    --info-brand:     #afe42c;
    --info-bg:        rgba(166,225,21,0.15);
    --info-dim:       rgba(166,225,21,0.18);

    /* ── Semantic states ── */
    /* FIX: --success/warn/danger text colors were missing in dark mode */
    --success:        #4cbb82;
    --success-bg:     #092415;
    --warn:           #f0b429;
    --warn-bg:        #201500;
    --danger:         #e05c5c;
    --danger-bg:      #1e0808;

    /* ── Shadows ── */
    --shadow:         0 2px 14px rgba(0,0,0,0.45);
    --shadow-sm:      0 1px 3px rgba(0,0,0,0.30);
    --shadow-md:      0 4px 16px rgba(0,0,0,0.50);
    --shadow-lg:      0 8px 32px rgba(0,0,0,0.55);
    --shadow-xl:      0 16px 64px rgba(0,0,0,0.65);
}