/* =====================================================================
   Sushell — Unified Dark Theme (Linear · Vercel · Axiom · Supabase)
   ===================================================================== */

html[data-theme="dark"],
html[data-theme="light"] {
  color-scheme: dark;
  --bg: #08090a;
  --surface: #0f1011;
  --surface-2: #161718;
  --muted-bg: rgba(255, 255, 255, 0.03);
  --text: #f7f8f8;
  --muted: #8a8f98;
  --line: #23252a;
  --line-strong: #34373f;
  --brand: #5e6ad2;
  --brand-dark: #4e5ac0;
  --brand-soft: rgba(94, 106, 210, 0.12);
  --theme-primary: #5e6ad2;
  --theme-accent: #8b8fff;
  --accent: #8b8fff;
  --shadow-sm: none;
  --shadow: none;
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.6);
}

html[data-theme="dark"] body {
  background: var(--bg);
  color: var(--text);
}

html[data-theme="dark"] .atomist-text-gradient,
html[data-theme="dark"] .text-gradient {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: currentColor !important;
  color: var(--text) !important;
}

/* Internal landing pages */
html[data-theme="dark"] .lp-wrap,
html[data-theme="dark"] .docs-shell,
html[data-theme="dark"] .lg-page,
html[data-theme="dark"] #sushell-felvus-showcase,
html[data-theme="dark"] #sushell-industries-pro,
html[data-theme="dark"] #sushell-funcionalidades-pro,
html[data-theme="dark"] #sushell-pricing-premium,
html[data-theme="dark"] #sushell-workflow-diagram,
html[data-theme="dark"] #sushell-custom-dev,
html[data-theme="dark"] #sushell-web-showcase,
html[data-theme="dark"] #sushell-about-pro,
html[data-theme="dark"] #sushell-workflow-pro,
html[data-theme="dark"] #sushell-orbit-page,
html[data-theme="dark"] #sushell-hero-hosting-pro,
html[data-theme="dark"] .sushell-hero-desarrollo,
html[data-theme="dark"] #sushell-custom-idea-pro {
  background-color: var(--bg) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] .h-feature-card,
html[data-theme="dark"] .lp-card,
html[data-theme="dark"] .lp-tier,
html[data-theme="dark"] .lp-faq details,
html[data-theme="dark"] .f-card,
html[data-theme="dark"] .industry-card,
html[data-theme="dark"] .func-card,
html[data-theme="dark"] .pricing-card,
html[data-theme="dark"] .d-node,
html[data-theme="dark"] .dev-card,
html[data-theme="dark"] .web-card,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .value-card,
html[data-theme="dark"] .step-card,
html[data-theme="dark"] .orbit-card,
html[data-theme="dark"] .docs-card,
html[data-theme="dark"] .lg-card,
html[data-theme="dark"] .content-box {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  color: var(--text) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .lp-card h3,
html[data-theme="dark"] .lp-tier h3,
html[data-theme="dark"] .f-card h4,
html[data-theme="dark"] .industry-card h4,
html[data-theme="dark"] .func-card h3,
html[data-theme="dark"] .pricing-card h3,
html[data-theme="dark"] .d-node h4,
html[data-theme="dark"] .dev-card h3,
html[data-theme="dark"] .web-card h3,
html[data-theme="dark"] .value-card h3,
html[data-theme="dark"] .step-card h3 {
  color: var(--text) !important;
  font-weight: 510 !important;
}

html[data-theme="dark"] .lp-card p,
html[data-theme="dark"] .lp-sub,
html[data-theme="dark"] .industry-card p,
html[data-theme="dark"] .func-card p,
html[data-theme="dark"] .pricing-card p,
html[data-theme="dark"] .d-node p,
html[data-theme="dark"] .dev-card p,
html[data-theme="dark"] .web-card p,
html[data-theme="dark"] .value-card p,
html[data-theme="dark"] .step-card p {
  color: var(--muted) !important;
}

html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="password"],
html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] textarea,
html[data-theme="dark"] select {
  background: #0f1011;
  border: 1px solid #23252a;
  color: #f7f8f8;
  border-radius: 6px;
  padding: 9px 12px;
  font-family: inherit;
}

html[data-theme="dark"] input:focus,
html[data-theme="dark"] textarea:focus,
html[data-theme="dark"] select:focus {
  border-color: #34373f;
  box-shadow: none;
  outline: none;
}