/* ======================================================
theme.css  —  BuildStudio Light / Dark Theme Variables
Design System v2 — based on official color palette.
Load BEFORE all other custom CSS in _Layout.cshtml.
====================================================== */

:root {
  /* ── Text ─────────────────────────────────── */
  --bst-text-primary:       #071437;    /* Heading */
  --bst-text-secondary:     #252F4A;    /* Text 1 */
  --bst-text-tertiary:      #4B5675;    /* Text 2 */
  --bst-text-muted:         #99A1B7;    /* Text 4 */
  --bst-text-placeholder:   #78829D;    /* Text 3 */
  --bst-text-light:         #C4CADA;    /* Text 5 */
  --bst-text-white:         #ffffff;
  --bst-fix-text-white:    #ffffff;
  
  /* ── Surfaces ─────────────────────────────── */
  --bst-bg-dark-black-body: #000000;
  --bst-bg-black-body:      <partial name="_FocusModeHeader" />#070707;  
  --bst-bg-body:            #F9FBFC;
  --bst-bg-page:            #ffffff;
  --bst-bg-surface:         #F5F6FA;    /* Light BG */
  --bst-bg-surface-alt:     #F5F0FA;    /* Dark BG */
  --bst-bg-surface-raised:  #ffffff;
  --bst-bg-input:           #F5FBFC;
  --bst-bg-line-number:     #eef0f5;
  --bst-bg-code-block:      #071437;
  --bst-bg-code-block-text: #e8e8ef;
  --bst-bg-overlay:         rgba(0, 0, 0, 0.1);
  
  /* ── Borders ──────────────────────────────── */
  --bst-border:             #EBEDF3;    /* Dark Border */
  --bst-border-light:       #F4F6F8;    /* Light Border */
  
  /* ── Brand / Primary Green ─────────────────── */
  --bst-green:              #19AA59;    /* Primary */
  --bst-green-hover:        #06B352;    /* Button Hover */
  --bst-green-pressed:      #049846;    /* Button Pressed */
  --bst-green-50:           #8CD5AC;    /* Primary 50% */
  --bst-green-40:           #A3DDBD;    /* Primary 40% */
  --bst-green-30:           #BAE6CE;    /* Primary 30% */
  --bst-green-20:           #D1EEDE;    /* Primary 20% */
  --bst-green-15:           #DDF2E6;    /* Primary 15% */
  --bst-green-10:           #E8F7EF;    /* Primary 10% */
  --bst-green-5:            #F3FAF6;    /* Primary 5% */
  --bst-green-light-bg:     #f0fdf4;
  --bst-green-lighter-bg:   #f5fcf8;
  --bst-green-soft-bg:      #e7f8f0;
  --bst-green-border:       #99e1ba;
  --bst-green-a005:         rgba(25, 170, 89, 0.05);
  --bst-green-a010:         rgba(25, 170, 89, 0.1);
  --bst-green-a050:         rgba(25, 170, 89, 0.5);
  --bst-green-a060:         rgba(25, 170, 89, 0.6);
  /* Dark-green shades used in decorative gradients (hero glow, animated card borders).
     Kept in light root so references resolve; effective only on explicitly dark sections. */
  --bst-green-60:           #0F6635;    /* Primary 60% — animated border dark stop */
  --bst-green-dark:         #07331B;    /* Hero radial-gradient dark green */
  --bst-green-darker:       #052212;    /* Footer radial-gradient deepest green */
  --bst-green-deep-10:      #021109;    /* Dark-tab hover gradient stop */
  --bst-green-hero-1:       #81e7ae;    /* Sharing hero radial-gradient stop 1 */
  --bst-green-hero-2:       #94f3be;    /* Sharing hero radial-gradient stop 2 */
  --bst-green-grad-1:       #26af62;    /* Light tool-card animated border stop 1 */
  --bst-green-grad-2:       #aaddc0;    /* Light tool-card animated border stop 2 */
  --bst-green-deep-black:   #000b05;    /* Access-tag near-black-green pill bg */

  /* ── Red / Error ──────────────────────────── */
  --bst-red:                #F8285A;    /* Error 100% */
  --bst-red-active:         #E82646;    /* Error Active */
  --bst-red-hover:          #E82646;    /* Error Active (alias) */
  --bst-red-50:             #FC94AD;    /* Error 50% */
  --bst-red-30:             #FDBFCE;    /* Error 30% */
  --bst-red-20:             #FED4DE;    /* Error 20% */
  --bst-red-10:             #FFEAEF;    /* Error 10% */
  --bst-red-5:              #FEF4F6;    /* Error 5% */
  --bst-red-light-bg:       #fef3f2;
  --bst-red-border:         #f6a8b5;
  --bst-red-diff-bg:        #fde2e6;
  --bst-red-diff-text-bg:   #f8d7da;
  --bst-red-lighter-bg:      #EFD9DF;
  --bst-red-lighter-border:  #F8285A;
  --bst-different-red-text:   #9F1239;
  
  /* ── Orange / Warning ─────────────────────── */
  --bst-orange:             #F6B100;    /* Warning 100% */
  --bst-orange-active:      #DFA000;    /* Warning Active */
  --bst-orange-50:          #FBD880;    /* Warning 50% */
  --bst-orange-30:          #FDE8B3;    /* Warning 30% */
  --bst-orange-20:          #FDEFCC;    /* Warning 20% */
  --bst-orange-10:          #FFF8E6;    /* Warning 10% */
  --bst-orange-5:           #FEFBF2;    /* Warning 5% */
  --bst-orange-light-bg:    #fff8eb;
  
  /* ── Blue / Info ──────────────────────────── */
  --bst-blue:               #1B84FF;    /* Info 100% */
  --bst-blue-active:        #056EE9;    /* Info Active */
  --bst-blue-50:            #8DC2FF;    /* Info 50% */
  --bst-blue-30:            #BBDBFF;    /* Info 30% */
  --bst-blue-20:            #D1E6FF;    /* Info 20% */
  --bst-blue-10:            #E9F3FF;    /* Info 10% */
  --bst-blue-5:             #F3F9FF;    /* Info 5% */
  --bst-blue-light-bg:      #eff8ff;
  --bst-blue-a015:          rgba(27, 132, 255, 0.15);
  --bst-blue-a025:          rgba(27, 132, 255, 0.25);
  
  /* ── Purple ───────────────────────────────── */
  --bst-purple:             #8950fc;
  --bst-purple-light-bg:    #f5f3ff;
  
  /* ── Yellow ───────────────────────────────── */
  --bst-yellow-light-bg:    #fefce8;
  
  /* ── Success / Green ─────────────────────── */
  --bst-success:            #17C653;    /* Success 100% */
  --bst-success-active:     #04B440;    /* Success Active */
  --bst-success-50:         #8BE3A9;    /* Success 50% */
  --bst-success-30:         #BAEECC;    /* Success 30% */
  --bst-success-20:         #D1F4DD;    /* Success 20% */
  --bst-success-10:         #E8FAEE;    /* Success 10% */
  --bst-success-5:          #F3FCF6;    /* Success 5% */
  
  /* ── Diff / Highlight ─────────────────────── */
  --bst-success-bg:         #f0fdf4;
  --bst-success-border:     #99e1ba;
  --bst-diff-added-bg:      #dcfce7;
  --bst-diff-removed-bg:    #fde2e6;
  --bst-match-highlight:    #fef3cd;
  --bst-match-highlight-alt:#d4edda;
  --bst-replaced-text-bg:   #d4edda;
  --bst-removed-text-bg:    #f8d7da;
  
  /* ── Shadows ──────────────────────────────── */
  --bst-shadow-sm:          0 2px 10px rgba(0, 0, 0, 0.1);
  --bst-shadow-card-hover:  0 4px 20px rgba(25, 170, 89, 0.1);
  --bst-shadow-card-sm:     0 2px 12px rgba(25, 170, 89, 0.08);
  
  /* ── Tool-specific ────────────────────────── */
  --bst-tab-bg:             #F5FBFC;
  --bst-tab-active-bg:      #ffffff;
  --bst-tab-active-shadow:  0 1px 3px rgba(0, 0, 0, 0.08);
  --bst-toast-bg:           #071437;
  --bst-toast-color:        #ffffff;
  --bst-btn-disabled:       #C4CADA;
  
  /* ── Header ───────────────────────────────── */
  --bst-header-bg:          #ffffff;
  --bst-header-nav-color:   #071437;
  --bst-header-btn-bg:      #ffffff;
  
  /* ── Hero ──────────────────────────────────── */
  --bst-hero-bg-image:      url("../images/header-background.webp");
  
  /* ── Code Inline ──────────────────────────── */
  --bst-code-inline-bg:     #F5F0FA;
  --bst-code-inline-color:  #F8285A;
  
  /* ── Blockquote ───────────────────────────── */
  --bst-blockquote-bg:      #f8fdf9;
  
  /* ── White RGBA ───────────────────────────── */
  --bst-white-a005:         rgba(255, 255, 255, 0.05);
  --bst-white-a010:         rgba(255, 255, 255, 0.1);
  --bst-white-a015:         rgba(255, 255, 255, 0.15);
  --bst-white-a025:         rgba(255, 255, 255, 0.25);
  --bst-white-a050:         rgba(255, 255, 255, 0.5);
  
  /* ── Black RGBA ───────────────────────────── */
  --bst-black-a005:         rgba(0, 0, 0, 0.05);
  --bst-black-a010:         rgba(0, 0, 0, 0.1);
  --bst-black-a040:         rgba(0, 0, 0, 0.4);
  
  /* ── Other ────────────────────────────────── */
  --bst-other-1:            #FBFBFB;
  --bst-gray-light:         #e0e0e0;
  --bst-gray-lighter:       #f0f0f0;
  --bst-gray-mid:           #666666;
  --bst-gray-mid-dark:      #333333;    /* Features-border gradient stops */
  --bst-near-white:         #f7f7f7;    /* Tool-tab outer gradient white */
  --bst-near-black-card:    #1d1f20;    /* eliminateBox card bg on dark hero */
  --bst-input-border-dark:  #878B89;    /* Email input border on dark-hero bg */
  --bst-dark-surface-2:     #1F1F1F;    /* Dark gradient stop used in about-page feature cards */
  --bst-dark-surface-2-a20: rgba(31, 31, 31, 0.2); /* 20% alpha variant for buildCard gradient */
  --bst-dark-panel:         #0d0d0d;    /* Coming-soon gradient panel bg */
  --bst-progress-bg:        #e6f5ee;
  --bst-orange-warning-bg:  rgba(255, 168, 0, 0.1);
  --bst-green-dark-hover:   #168d47;
  --bst-megamenu-bg:        #f5f6f1;
  --bst-tool-card-bg:       linear-gradient(116.2deg, #EBEDF3 1.83%, #FDFDFD 125.03%);
  --bst-tool-card-hover-bg: linear-gradient(116.2deg, #FBFBFB 1.83%, #E8F7EF 125.03%);
  /* Tool-card animated border: light uses brand greens; dark mode overrides below */
  --bst-tool-card-grad-1:   var(--bst-green-grad-1);
  --bst-tool-card-grad-2:   var(--bst-green-grad-2);

  /* ── Platform Preview Colors ──────────────── */
  --bst-google-title-blue:  #1a0dab;
  --bst-google-url-green:   #006621;
  --bst-google-snippet-gray:#545454;
  --bst-google-primary-text:#202124;
  --bst-fb-border:          #dadde1;
  --bst-fb-placeholder-bg:  #e4e6eb;
  --bst-fb-secondary-text:  #606770;
  --bst-fb-primary-text:    #1d2129;
  --bst-tw-border:          #e1e8ed;
  --bst-tw-primary-text:    #0f1419;
  --bst-tw-secondary-text:  #536471;
  
  /* ── Semantic text ────────────────────────── */
  --bst-amber-text:         #92400e;
  --bst-green-dark-text:    #1a7a42;

  /* ── Component sizing tokens ──────────────── */
  --bst-btn-height-sm:      36px;
  --bst-btn-height-md:      45px;
  --bst-btn-height-lg:      55px;
  --bst-input-height:       45px;
  --bst-radius-sm:          6px;
  --bst-radius-md:          8px;
  --bst-radius-lg:          16px;
  --bst-radius-xl:          20px;
  --bst-radius-pill:        999px;
  --bst-transition-fast:    0.15s ease;
  --bst-transition-base:    0.3s ease;

  /* ── Font family (weights come from font-weight) ── */
  --bst-font:               "Webority Sans", sans-serif;

  /* ── Font sizes (numeric = literal px) ──── */
  --bst-fs-6:               6px;
  --bst-fs-8:               8px;
  --bst-fs-10:              10px;
  --bst-fs-12:              12px;
  --bst-fs-13:              13px;
  --bst-fs-14:              14px;
  --bst-fs-16:              16px;
  --bst-fs-18:              18px;
  --bst-fs-20:              20px;
  --bst-fs-22:              22px;
  --bst-fs-24:              24px;
  --bst-fs-28:              28px;
  --bst-fs-32:              32px;
  --bst-fs-36:              36px;
  --bst-fs-42:              42px;
  --bst-fs-52:              52px;
  --bst-fs-56:              56px;
  --bst-fs-60:              60px;
  --bst-fs-65:              65px;
  --bst-fs-72:              72px;

  /* Semantic aliases — prefer these in new code */
  --bst-fs-body:            var(--bst-fs-14);
  --bst-fs-small:           var(--bst-fs-12);
  --bst-fs-h1:              var(--bst-fs-28);
  --bst-fs-h2:              var(--bst-fs-24);
  --bst-fs-h3:              var(--bst-fs-22);
  --bst-fs-h4:              var(--bst-fs-20);
  --bst-fs-h5:              var(--bst-fs-18);

  /* ── Spacing scale (4px base unit) ──────── */
  --bst-space-0:            0;
  --bst-space-1:            4px;
  --bst-space-2:            8px;
  --bst-space-3:            12px;
  --bst-space-4:            16px;
  --bst-space-5:            20px;
  --bst-space-6:            24px;
  --bst-space-8:            32px;
  --bst-space-10:           40px;
  --bst-space-12:           50px;
  --bst-space-15:           60px;
  --bst-space-20:           80px;
  --bst-space-25:           100px;
  --bst-space-30:           120px;
}

/* ═══════════════════════════════════════════════
DARK MODE
Applied on tools pages via JS toggle.
═══════════════════════════════════════════════ */
.bst-dark {
  /* ── Text (inverted from light palette) ──── */
  --bst-text-primary:       #ffffff;    /* Text 5 */
  --bst-text-secondary:     #C4CADA;    /* Text 4 */
  --bst-text-tertiary:      #99A1B7;    /* Text 3 */
  --bst-text-muted:         #78829D;    /* Text 2 */
  --bst-text-placeholder:   #4B5675;    /* Text 2 */
  --bst-text-light:         #252F4A;    /* Text 1 */
  --bst-text-white:         #071437;
  
  /* ── Surfaces ─────────────────────────────── */
  --bst-bg-darker-body:        #000000;
  --bst-bg-page:             #070707;
  --bst-bg-body:            #070707;    /* Light BG */
  --bst-bg-surface:         #1F1F1F;    /* Dark BG */
  --bst-bg-surface-alt:     #1F1F1F;
  --bst-bg-surface-raised:  #252530;
  --bst-bg-input:           #0D0D0D;    /* Other 1 */
  --bst-bg-line-number:     #1F1F1F;
  --bst-bg-code-block:      #0D0D0D;
  --bst-bg-code-block-text: #C4CADA;
  --bst-bg-overlay:         rgba(0, 0, 0, 0.4);
  
  /* ── Borders ──────────────────────────────── */
  --bst-border:             #303346;    /* Dark Border */
  --bst-border-light:       #1C1F27;
  
  /* ── Brand / Primary Green ─────────────────── */
  --bst-green:              #19AA59;
  --bst-green-hover:        #06B352;
  --bst-green-pressed:      #049846;
  --bst-green-60:           #0F6635;    /* Primary 60% */
  --bst-green-50:           #0C552C;    /* Primary 50% */
  --bst-green-40:           #0A4424;    /* Primary 40% */
  --bst-green-30:           #07331B;    /* Primary 30% */
  --bst-green-20:           #052212;    /* Primary 20% */
  --bst-green-15:           #04190D;    /* Primary 15% */
  --bst-green-10:           #021109;    /* Primary 10% */
  --bst-green-5:            #010804;    /* Primary 5% */
  --bst-green-light-bg:     rgba(25, 170, 89, 0.1);
  --bst-green-lighter-bg:   rgba(25, 170, 89, 0.06);
  --bst-green-soft-bg:      rgba(25, 170, 89, 0.12);
  --bst-green-border:       rgba(25, 170, 89, 0.25);
  --bst-green-a005:         rgba(25, 170, 89, 0.05);
  --bst-green-a010:         rgba(25, 170, 89, 0.12);
  --bst-green-a050:         rgba(25, 170, 89, 0.5);
  --bst-green-a060:         rgba(25, 170, 89, 0.6);
  
  /* ── Red / Error ──────────────────────────── */
  --bst-red:                #F8285A;
  --bst-red-active:         #E82646;
  --bst-red-hover:          #E82646;
  --bst-red-50:             #7C142D;    /* Error 50% */
  --bst-red-30:             #4A0C1B;    /* Error 30% */
  --bst-red-20:             #320812;    /* Error 20% */
  --bst-red-10:             #190409;    /* Error 10% */
  --bst-red-5:              #0C0204;    /* Error 5% */
  --bst-red-light-bg:       rgba(248, 40, 90, 0.12);
  --bst-red-border:         rgba(248, 40, 90, 0.25);
  --bst-red-diff-bg:        rgba(248, 40, 90, 0.15);
  --bst-red-diff-text-bg:   rgba(248, 40, 90, 0.15);
  --bst-red-lighter-bg:      #20040B;
  --bst-red-lighter-border:        #390614;
  
  
  
  /* ── Orange / Warning ─────────────────────── */
  --bst-orange:             #F6B100;
  --bst-orange-active:      #DFA000;
  --bst-orange-50:          #7B5800;    /* Warning 50% */
  --bst-orange-30:          #4A3500;    /* Warning 30% */
  --bst-orange-20:          #312300;    /* Warning 20% */
  --bst-orange-10:          #191200;    /* Warning 10% */
  --bst-orange-5:           #0C0900;    /* Warning 5% */
  --bst-orange-light-bg:    rgba(246, 177, 0, 0.1);
  
  /* ── Blue / Info ──────────────────────────── */
  --bst-blue:               #1B84FF;
  --bst-blue-active:        #056EE9;
  --bst-blue-50:            #0D427F;    /* Info 50% */
  --bst-blue-30:            #08284C;    /* Info 30% */
  --bst-blue-20:            #051A33;    /* Info 20% */
  --bst-blue-10:            #030D19;    /* Info 10% */
  --bst-blue-5:             #01070D;    /* Info 5% */
  --bst-blue-light-bg:      rgba(27, 132, 255, 0.1);
  --bst-blue-a015:          rgba(27, 132, 255, 0.15);
  --bst-blue-a025:          rgba(27, 132, 255, 0.25);
  
  /* ── Purple ───────────────────────────────── */
  --bst-purple:             #a070ff;
  --bst-purple-light-bg:    rgba(137, 80, 252, 0.1);
  
  /* ── Yellow ───────────────────────────────── */
  --bst-yellow-light-bg:    rgba(255, 200, 0, 0.08);
  
  /* ── Success / Green ─────────────────────── */
  --bst-success:            #17C653;
  --bst-success-active:     #04B440;
  --bst-success-50:         #0B632A;    /* Success 50% */
  --bst-success-30:         #073B19;    /* Success 30% */
  --bst-success-20:         #052811;    /* Success 20% */
  --bst-success-10:         #021408;    /* Success 10% */
  --bst-success-5:          #010A04;    /* Success 5% */
  
  /* ── Diff / Highlight ─────────────────────── */
  --bst-success-bg:         rgba(25, 170, 89, 0.1);
  --bst-success-border:     rgba(25, 170, 89, 0.25);
  --bst-diff-added-bg:      rgba(25, 170, 89, 0.12);
  --bst-diff-removed-bg:    rgba(248, 40, 90, 0.12);
  --bst-match-highlight:    rgba(255, 200, 0, 0.2);
  --bst-match-highlight-alt:rgba(25, 170, 89, 0.2);
  --bst-replaced-text-bg:   rgba(25, 170, 89, 0.2);
  --bst-removed-text-bg:    rgba(248, 40, 90, 0.15);
  
  /* ── Shadows ──────────────────────────────── */
  --bst-shadow-sm:          0 2px 10px rgba(0, 0, 0, 0.3);
  --bst-shadow-card-hover:  0 4px 20px rgba(25, 170, 89, 0.06);
  --bst-shadow-card-sm:     0 2px 12px rgba(25, 170, 89, 0.04);
  
  /* ── Tool-specific ────────────────────────── */
  --bst-tab-bg:             #1F1F1F;
  --bst-tab-active-bg:      #3F4254;
  --bst-tab-active-shadow:  0 1px 3px rgba(0, 0, 0, 0.2);
  --bst-toast-bg:           #C4CADA;
  --bst-toast-color:        #070707;
  --bst-btn-disabled:       #3F4254;
  
  /* ── Header ───────────────────────────────── */
  --bst-header-bg:          #070707;
  --bst-header-nav-color:   #C4CADA;
  --bst-header-btn-bg:      rgba(25, 170, 89, 0.15);
  
  /* ── Hero ──────────────────────────────────── */
  --bst-hero-bg-image:      none;
  
  /* ── Code Inline ──────────────────────────── */
  --bst-code-inline-bg:     #1F1F1F;
  --bst-code-inline-color:  #F8285A;
  
  /* ── Blockquote ───────────────────────────── */
  --bst-blockquote-bg:      rgba(25, 170, 89, 0.06);
  
  /* ── White RGBA ───────────────────────────── */
  --bst-white-a005:         rgba(255, 255, 255, 0.03);
  --bst-white-a010:         rgba(255, 255, 255, 0.06);
  --bst-white-a015:         rgba(255, 255, 255, 0.08);
  --bst-white-a025:         rgba(255, 255, 255, 0.12);
  --bst-white-a050:         rgba(255, 255, 255, 0.25);
  
  /* ── Black RGBA ───────────────────────────── */
  --bst-black-a005:         rgba(0, 0, 0, 0.15);
  --bst-black-a010:         rgba(0, 0, 0, 0.25);
  --bst-black-a040:         rgba(0, 0, 0, 0.6);
  
  /* ── Other ────────────────────────────────── */
  --bst-other-1:            #0D0D0D;
  --bst-gray-light:         #303346;
  --bst-gray-lighter:       #1F1F1F;
  --bst-gray-mid:           #99A1B7;
  --bst-progress-bg:        rgba(25, 170, 89, 0.12);
  --bst-orange-warning-bg:  rgba(255, 168, 0, 0.08);
  --bst-green-dark-hover:   #0F6635;
  --bst-megamenu-bg:        #1F1F1F;
  --bst-tool-card-bg:       linear-gradient(115.5deg, #1F1F1F 1.82%, #070707 98.85%);
  --bst-tool-card-hover-bg: linear-gradient(116.2deg, #010804 1.83%, #04190D 125.03%);
  /* Tool-card animated border — dark mode swaps to deep-green stops */
  --bst-tool-card-grad-1:   var(--bst-green-60);
  --bst-tool-card-grad-2:   var(--bst-green-deep-10);

  /* ── Platform Preview Colors ──────────────── */
  --bst-google-title-blue:  #8ab4f8;
  --bst-google-url-green:   #32d74b;
  --bst-google-snippet-gray:#bdc1c6;
  --bst-google-primary-text:#e8eaed;
  --bst-fb-border:          #3a3b3c;
  --bst-fb-placeholder-bg:  #3a3b3c;
  --bst-fb-secondary-text:  #b0b3b8;
  --bst-fb-primary-text:    #e4e6eb;
  --bst-tw-border:          #38444d;
  --bst-tw-primary-text:    #e7e9ea;
  --bst-tw-secondary-text:  #8b98a5;
  
  /* ── Semantic text ────────────────────────── */
  --bst-amber-text:         #fbbf24;
  --bst-green-dark-text:    #4ade80;
}

/* ── Body background ────────────────────────── */
.bst-dark {
  background-color: var(--bst-bg-body);
  color: var(--bst-text-primary);
}

/* ── Dark hero treatment (tools pages) ──────── */
.bst-dark .sharingFirstSection,
.bst-dark .toolsHeroSection,
.bst-dark .toolPageHero {
  background: radial-gradient(40% 125.31% at 107% 146.11%, #05672f 0%, rgb(25 170 89 / 0%) 100%), radial-gradient(23% 215.27% at 6.35% 228.9%, #05672f 0%, rgba(25, 170, 121, 0) 100%);
}

/* ── Header: logo swap ──────────────────────── */
.logo-dark { display: none; }
.bst-dark .lightHeader .logo-light,
.bst-dark .fixed-header .logo-light,
.fixed-header.bst-dark .logo-light { display: none !important; }
.bst-dark .lightHeader .logo-dark,
.bst-dark .fixed-header .logo-dark,
.fixed-header.bst-dark .logo-dark { display: inline !important; }

/* ── Header: dark overrides ─────────────────── */
.bst-dark .fixed-header {
  background-color: var(--bst-header-bg);
  box-shadow: var(--bst-shadow-sm);
}
/* Nav link :hover and .active rules live in components.css (scoped for both light + dark). */
/* .transparentButton now uses canonical .btn-primary rules from components.css
   across light + dark. No explicit dark-mode override needed. */
.bst-dark .lightHeader .toggler-icon {
  background-color: var(--bst-header-nav-color);
}
.bst-dark .lightHeader .header {
    z-index: 999;
    position: relative;
    /* background: #ffffff; */
}
.bst-dark .header li a {
    color: var(--bst-text-primary);
}
.bst-dark .lightHeader .header ul li a.marginAdjustNav {
    color: #ffffff;
}
.mySidenav {
    background: var(--bst-bg-surface);
    backdrop-filter: blur(54px);
}
.bst-dark .mySidenav {
    background: linear-gradient(116.2deg, #1F1F1F 1.83%, rgba(28, 28, 28, 0) 125.03%);
    backdrop-filter: blur(54px);
}
.bst-dark .mobile-navSectionTitle {
    color: var(--bst-text-primary);
}
.bst-dark .mobile-navSectionHeader .mobile-navSectionTitle {
    color: var(--bst-text-tertiary);
}
.cus-line-height-normal {
    line-height: normal;
}

/* ── Footer: isolate from dark mode ─────────── */
.landingFooter {
  --bst-text-primary:   #071437;
  --bst-text-secondary: #252F4A;
  --bst-text-tertiary:  #4B5675;
  --bst-text-muted:     #99A1B7;
  --bst-border:         #EBEDF3;
}

/* ── reCAPTCHA v3 Badge — hidden per Google ToS, attribution shown inline near forms ── */
.grecaptcha-badge {
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* ── Theme Toggle Button ────────────────────── */
.bst-theme-toggle {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9990;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid var(--bst-border);
  background-color: var(--bst-bg-surface-raised);
  color: var(--bst-text-secondary);
  cursor: pointer;
  box-shadow: var(--bst-shadow-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.2s, background-color 0.2s, transform 0.15s;
  padding: 0;
  outline: none;
}
.bst-theme-toggle:hover {
  border-color: var(--bst-green);
  transform: scale(1.08);
}
.bst-theme-toggle svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media screen and (max-width: 576px) {
  .bst-theme-toggle {
    bottom: 16px;
    right: 16px;
    width: 40px;
    height: 40px;
  }
  .bst-theme-toggle svg {
    width: 18px;
    height: 18px;
  }
}