/* ============================================================================
   VK ALABASTER GUARDRAIL
   Single source of truth for light-theme color drift across the whole site.
   Loaded LAST on every page (after vk-theme-v2.css and all per-page <style>
   blocks) so it always wins the cascade. Everything here targets
   [data-theme="light"] only -- dark theme is untouched.

   WHY THIS FILE EXISTS:
   This site has no shared token system -- every page carries its own copy of
   --bg/--bg1/--bg2 vars, vk-theme-v2.css defines a SEPARATE --vk-* variable
   system, and dozens of components hardcode raw hex colors instead of
   referencing any variable at all. This file is the single choke point.
   Any future dark/off-white patch should be added HERE, not on individual
   pages.
   ============================================================================ */

/* ---- 1. Canonical semantic tokens (redeclared here as the final word) ---- */
[data-theme="light"] {
  --bg:        #FAF9F6 !important;
  --bg1:       #FAF9F6 !important;
  --bg2:       linear-gradient(180deg, #F6F3EB 0%, #ECE6D8 100%) !important;
  --bg3:       linear-gradient(180deg, #EFEAE0 0%, #E4DDCC 100%) !important;
  --b:         rgba(0,0,0,0.12) !important;
  --b2:        rgba(0,0,0,0.12) !important;
}

/* ---- 2. vk-theme-v2.css runs a separate variable system. Collapse it here
   so anything built on --vk-* lands on the same alabaster family. ---- */
[data-theme="light"] {
  --vk-void:    #FAF9F6 !important;
  --vk-abyss:   #FAF9F6 !important;
  --vk-deep:    linear-gradient(180deg, #F6F3EB 0%, #ECE6D8 100%) !important;
  --vk-base:    linear-gradient(180deg, #F6F3EB 0%, #ECE6D8 100%) !important;
  --vk-surface: linear-gradient(180deg, #F6F3EB 0%, #ECE6D8 100%) !important;
  --vk-raised:  linear-gradient(180deg, #F6F3EB 0%, #ECE6D8 100%) !important;
  --vk-float:   linear-gradient(180deg, #EFEAE0 0%, #E4DDCC 100%) !important;
  --vk-overlay: linear-gradient(180deg, #EFEAE0 0%, #E4DDCC 100%) !important;
}

/* ---- 3. Structural elements: nav / footer / sections, flat, no banding ---- */
[data-theme="light"] section:nth-child(odd),
[data-theme="light"] section:nth-child(even) {
  background: #FAF9F6 !important;
}
[data-theme="light"] section + section {
  border-top: none !important;
}
[data-theme="light"] footer {
  background: #FAF9F6 !important;
  border-top: none !important;
}
[data-theme="light"] .faq-section:nth-child(3n+1),
[data-theme="light"] .faq-section:nth-child(3n+2),
[data-theme="light"] .faq-section:nth-child(3n+3) {
  background: #FAF9F6 !important;
  border: 1px solid rgba(0,0,0,0.07) !important;
  box-shadow: none !important;
}

/* ---- 4. Card-family components: one flat panel color, no drop shadows ---- */
[data-theme="light"] .pcard,
[data-theme="light"] .gcard,
[data-theme="light"] .pstep,
[data-theme="light"] .cblock,
[data-theme="light"] .prob-panel,
[data-theme="light"] .c,
[data-theme="light"] .paradigm-cta,
[data-theme="light"] .int-card,
[data-theme="light"] .doc-card,
[data-theme="light"] .integration-card,
[data-theme="light"] .vks-cell,
[data-theme="light"] .vks-foot {
  background: linear-gradient(180deg, #F6F3EB 0%, #ECE6D8 100%) !important;
  border-color: rgba(0,0,0,0.09) !important;
  box-shadow: none !important;
}
[data-theme="light"] .gcard:hover,
[data-theme="light"] .int-card:hover {
  background: linear-gradient(180deg, #F0EBDF 0%, #E4DBC8 100%) !important;
  border-color: rgba(0,0,0,0.16) !important;
}

/* ---- 5. Known one-off hardcoded-dark components (add new offenders here
   instead of patching the page they were found on) ---- */
[data-theme="light"] .nav-dd {
  background: #FAF9F6 !important;
  border-color: rgba(0,0,0,0.1) !important;
}

/* ---- 6. Catch-all safety net for any element still carrying an inline
   hardcoded dark background. Backstop only -- new components should use
   tokens, not rely on this rule saving them. ---- */
[data-theme="light"] [style*="background:#111213"],
[data-theme="light"] [style*="background: #111213"],
[data-theme="light"] [style*="background:#0c0d0e"],
[data-theme="light"] [style*="background: #0c0d0e"],
[data-theme="light"] [style*="background:#080909"],
[data-theme="light"] [style*="background: #080909"],
[data-theme="light"] [style*="background:#0e0c0a"],
[data-theme="light"] [style*="background: #0e0c0a"],
[data-theme="light"] [style*="background:#080808"],
[data-theme="light"] [style*="background: #080808"],
[data-theme="light"] [style*="background:#060708"],
[data-theme="light"] [style*="background: #060708"],
[data-theme="light"] [style*="background:#0c0c0e"],
[data-theme="light"] [style*="background: #0c0c0e"],
[data-theme="light"] [style*="background:#0f0f11"],
[data-theme="light"] [style*="background: #0f0f11"],
[data-theme="light"] [style*="background:#0f0f0f"],
[data-theme="light"] [style*="background: #0f0f0f"],
[data-theme="light"] [style*="background:#000"],
[data-theme="light"] [style*="background: #000"] {
  background: #FAF9F6 !important;
}
[data-theme="light"] [style*="background:rgba(8,9,9"],
[data-theme="light"] [style*="background: rgba(8,9,9"] {
  background: rgba(250,249,246,0.97) !important;
}

/* ---- 7. Footer fixed-overlay fixes ----
   The chat launcher (#seb-toggle/#seb-widget) and the nginx-injected
   privacy-settings tab (#vk-privacy-tab) are both position:fixed at the
   bottom of the viewport, and were overlapping the footer's logo/copyright
   on pages short enough that the footer sits at the very bottom of the
   viewport. Bumped clear of the footer (~100px tall) on every page.
   The privacy tab itself is fixed in nginx (bottom:130px), this only
   covers the chat widget, which lives in per-page <style> blocks. ---- */
#seb-toggle {
  bottom: 130px !important;
}
#seb-widget {
  bottom: 194px !important;
}


/* ---- 8. #vsx-stage wave/grid fix ----
   .vsx-scene elements are <section> tags nested inside the animated wave
   stage. Rule #3 above (and the equivalent in vk-theme-v2.css) forces a
   solid alabaster background onto every section:nth-child(odd/even) in
   light theme -- which was also painting over these nested scene layers,
   completely hiding the canvas wave and SVG grid that sit behind them.
   They must stay transparent so the animation shows through. ---- */
[data-theme="light"] #vsx-stage .vsx-scene {
  background: transparent !important;
}
