/* BRANDFORGE OS — Theme system (dark default / light optional)
   Linked by every sales page. Token triplets power Tailwind's
   var()-based palette (see tailwind.config.js) + direct CSS vars.
   CANONICAL PALETTE: keep dark bg/card/line/muted/ink values in sync with
   app/web-modern/src/app.css (the real dashboard) — workspace.html is a
   mockup OF the product; drifted tokens misrepresent it. */
:root{
  --sb-bg-rgb: 7 13 17;       /* #070D11 — matches dashboard --bg */
  --sb-card-rgb: 15 23 42;    /* #0F172A — matches dashboard --card */
  --sb-line-rgb: 30 41 59;    /* #1E293B — matches dashboard --line */
  --sb-gold-rgb: 232 181 74;  /* #E8B54A */
  --sb-muted-rgb: 148 163 184;/* #94A3B8 — matches dashboard --mut */
  --sb-ink: #F8FAFC;          /* matches dashboard --ink */
  --sb-faint: #76829B;
  --sb-hairline: rgba(255,255,255,.07);
  --gold: #E8B54A;
  --gold-ink: #0A0D14;
}
[data-theme="light"]{
  --sb-bg-rgb: 246 244 239;   /* #F6F4EF warm paper */
  --sb-card-rgb: 255 255 255;
  --sb-line-rgb: 214 209 197; /* #D6D1C5 */
  --sb-gold-rgb: 180 125 18;  /* #B47D12 rich amber */
  --sb-muted-rgb: 90 100 114; /* #5A6472 */
  --sb-ink: #14181F;
  --sb-faint: #616B7A;
  --sb-hairline: rgba(20,24,31,.12);
  --gold: #B47D12;
  --gold-ink: #FFFFFF;
}

body {
  background-color: rgb(var(--sb-bg-rgb));
  color: rgb(var(--sb-ink));
}

html[data-theme="light"] body {
  background-color: rgb(var(--sb-bg-rgb));
  color: rgb(var(--sb-ink));
}

/* Headings base contrast */
h1, h2, h3, h4, h5, h6 {
  color: rgb(var(--sb-ink));
}
[data-theme="light"] h1,
[data-theme="light"] h2,
[data-theme="light"] h3,
[data-theme="light"] h4,
[data-theme="light"] h5,
[data-theme="light"] h6 {
  color: #14181F;
}

/* Universal high-contrast buttons */
.btn-gold, .cta-gold {
  background-color: rgb(var(--sb-gold-rgb)) !important;
  color: var(--gold-ink) !important;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  transition: all .2s ease;
}
.btn-gold:hover, .cta-gold:hover {
  opacity: 0.92;
  transform: translateY(-1px);
}
[data-theme="light"] .btn-gold,
[data-theme="light"] .cta-gold {
  background-color: #B47D12 !important;
  color: #FFFFFF !important;
}

.btn-outline, .btn-ghost {
  border: 1px solid rgb(var(--sb-line-rgb));
  color: rgb(var(--sb-ink)) !important;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  transition: all .2s ease;
}
.btn-outline:hover, .btn-ghost:hover {
  border-color: rgb(var(--sb-gold-rgb));
  color: rgb(var(--sb-ink)) !important;
}
[data-theme="light"] .btn-outline,
[data-theme="light"] .btn-ghost {
  border-color: rgb(var(--sb-line-rgb));
  color: #14181F !important;
  background-color: #FFFFFF;
}

/* Tailwind config colors are wired to these triplets (bg/card/line/gold/muted). */
[data-theme="light"] .text-white{ color:#14181F; }
[data-theme="light"] .text-zinc-300{ color:#3A4353; }
[data-theme="light"] .text-zinc-400{ color:#4A5568; }
[data-theme="light"] .text-zinc-500{ color:#6B7686; }
[data-theme="light"] .text-zinc-600{ color:#6E7889; }
[data-theme="light"] .bg-white{ background-color:#14181F; color:#F6F4EF; }
[data-theme="light"] .text-black{ color:#F6F4EF; }
[data-theme="light"] .bg-white\/10{ background-color:rgba(20,24,31,.06); }
[data-theme="light"] .bg-black\/60,[data-theme="light"] .bg-black\/70,[data-theme="light"] .bg-black\/80{ background-color:rgba(255,255,255,.75); }
[data-theme="light"] .border-white\/10,[data-theme="light"] .border-white\/20,[data-theme="light"] .border-white\/30,[data-theme="light"] .border-white\/40{ border-color:rgba(20,24,31,.14); }
[data-theme="light"] .bg-bg\/70,[data-theme="light"] .bg-bg\/80{ background-color:rgba(246,244,239,.8); }
[data-theme="light"] .shadow-\[0_0_60px_rgba\(255\,255\,255\,0\.08\)\]{ box-shadow:0 0 60px rgba(180,125,18,.12); }
[data-theme="light"] .hover\:bg-zinc-100:hover{ background-color:#E9E5DC; }
[data-theme="light"] .hover\:bg-zinc-200:hover{ background-color:#E2DED4; }
[data-theme="light"] .backdrop-blur-xl,[data-theme="light"] .backdrop-blur-2xl{ backdrop-filter:saturate(1.4) blur(16px); }

/* Keep colors legible on paper */
[data-theme="light"] .text-emerald-400{ color:#0E8A5F; }
[data-theme="light"] .text-blue-300{ color:#2563B0; }
[data-theme="light"] .text-purple-300{ color:#7A4FC0; }
[data-theme="light"] .text-gold{ color:rgb(var(--sb-gold-rgb)); }

/* theme toggle button (shared) */
.theme-toggle{ display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; border-radius:9999px; border:1px solid var(--sb-hairline);
  background:transparent; color:rgb(var(--sb-muted-rgb)); cursor:pointer; transition:all .25s ease; flex-shrink:0; }
.theme-toggle:hover{ color:rgb(var(--sb-ink)); border-color:rgb(var(--sb-line-rgb)); transform:translateY(-1px); }
/* dark (default): moon icon. light: sun icon */
.theme-toggle .icon-sun{ display:none; }
.theme-toggle .icon-moon{ display:inline; }
[data-theme="light"] .theme-toggle .icon-sun{ display:inline; }
[data-theme="light"] .theme-toggle .icon-moon{ display:none; }

/* WCAG AA: theme-agnostic utility text colors remapped per theme. */
html .text-zinc-500, html .text-zinc-600 { color:#94A3B8; }
[data-theme="light"] .text-zinc-500 { color:#5B6472; }
[data-theme="light"] .text-zinc-600 { color:#52525B; }
[data-theme="light"] .text-zinc-200,
[data-theme="light"] .text-zinc-300,
[data-theme="light"] .text-zinc-400 { color:#3F4854; }
[data-theme="light"] .text-emerald-300,
[data-theme="light"] .text-emerald-400,
[data-theme="light"] .text-emerald-500 { color:#047857; }
[data-theme="light"] .text-blue-300 { color:#1D4ED8; }
[data-theme="light"] .text-purple-300 { color:#7E22CE; }

/* ---- mobile nav (shared) ---- */
.nav-burger{
  display:inline-flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:10px;cursor:pointer;
  border:1px solid rgb(var(--sb-line-rgb));background:transparent;
  color:rgb(var(--sb-ink-rgb, 248 250 252));
}
.nav-burger svg{width:20px;height:20px}
#mobile-menu{
  position:absolute;left:0;right:0;top:100%;z-index:60;
  display:none;flex-direction:column;
  padding:10px 20px 18px;
  background:rgb(var(--sb-bg-rgb));
  border-bottom:1px solid rgb(var(--sb-line-rgb));
  box-shadow:0 24px 48px -24px rgba(0,0,0,.65);
}
#mobile-menu.vg-open{display:flex}
#mobile-menu a.mm-link{
  display:block;padding:12px 8px;border-radius:10px;
  font-size:15px;color:rgb(var(--sb-muted-rgb));
}
#mobile-menu a.mm-link:hover{color:#fff;background:rgba(255,255,255,.04)}
#mobile-menu .mm-cta{
  display:block;margin-top:10px;padding:13px 16px;border-radius:9999px;
  text-align:center;font-weight:700;font-size:14px;
  background:rgb(var(--sb-gold-rgb));color:#0b0f17;
}
#mobile-menu .mm-row{display:flex;align-items:center;justify-content:space-between;padding:8px}
@media (min-width:768px){
  .nav-burger{display:none}
  #mobile-menu{display:none !important}
}