
html[data-theme="dark"] {
  color-scheme:dark;
  --primary:#6C20FF; --primary-hover:#5917d8; --primary-soft:#27203b;
  --navy:#16141f; --background:#11121a; --surface:#191b26; --surface-2:#20232f;
  --text:#ececf4; --text-secondary:#9ca3b5; --border:#2b2e3d;
  --shadow-xs:0 1px 2px rgba(0,0,0,.22); --shadow-sm:0 2px 8px rgba(0,0,0,.24);
  --shadow-md:0 10px 30px rgba(0,0,0,.28); --shadow-lg:0 24px 60px rgba(0,0,0,.34);
}
html[data-theme="dark"] body { background:var(--background)!important;color:var(--text)!important; }
html[data-theme="dark"] .header { background:rgba(17,18,26,.90)!important;border-bottom-color:var(--border)!important; }
html[data-theme="dark"] .nav-toggle,
html[data-theme="dark"] .card,
html[data-theme="dark"] .pricing-card,
html[data-theme="dark"] .feature-card,
html[data-theme="dark"] .faq-item,
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select { background:var(--surface)!important;color:var(--text)!important;border-color:var(--border)!important; }
html[data-theme="dark"] .brand__mark-img { content:url('/logo-mark-dark.png')!important; }
html[data-theme="light"] .brand__mark-img { content:url('/logo-mark-light.png')!important; }

.brand__mark-img{display:block;width:30px;height:30px;object-fit:contain;background:transparent;border:0;box-shadow:none}

html[data-theme="dark"] .m{background-image:url('/logo-mark-dark.png')!important}
html[data-theme="light"] .m{background-image:url('/logo-mark-light.png')!important}
html[data-theme="dark"]{--text-primary:#f5f3ff;--text-secondary:#a8b0c2;--surface-alt:#121624;--surface:#171a26;--background:#0d101b;--border:#30384d}html[data-theme="dark"] .hero,html[data-theme="dark"] .section,html[data-theme="dark"] .legal-page,html[data-theme="dark"] footer{background-color:#0d101b!important;color:#f5f3ff!important;border-color:#30384d!important}html[data-theme="dark"] .legal-hero{background:radial-gradient(circle at 18% 35%,rgba(108,32,255,.18),transparent 30%),#121624!important;color:#f5f3ff!important;border-color:#30384d!important}html[data-theme="dark"] .legal-hero h1,html[data-theme="dark"] .legal-content h2,html[data-theme="dark"] .legal-content h3,html[data-theme="dark"] .legal-content strong{color:#f5f3ff!important}html[data-theme="dark"] .employee-preview__header,html[data-theme="dark"] .employee-preview__section,html[data-theme="dark"] .employee-preview__summary span,html[data-theme="dark"] .employee-preview__bottom{background:#171a26!important;color:#f5f3ff!important;border-color:#30384d!important}


/* Landing embedded product previews must also obey the selected theme. */
html[data-theme="dark"] .schedule-preview,
html[data-theme="dark"] .schedule-preview__header,
html[data-theme="dark"] .schedule-preview__team,
html[data-theme="dark"] .schedule-preview__grid,
html[data-theme="dark"] .schedule-preview__cell,
html[data-theme="dark"] .schedule-preview__shift,
html[data-theme="dark"] .employee-preview,
html[data-theme="dark"] .employee-preview__body,
html[data-theme="dark"] .employee-preview__day,
html[data-theme="dark"] .employee-preview__stat{
  background:#171a26!important;color:#f5f3ff!important;border-color:#30384d!important;
}
html[data-theme="dark"] .schedule-preview__team,
html[data-theme="dark"] .schedule-preview__grid{background:#111522!important}
html[data-theme="dark"] .schedule-preview__cell,
html[data-theme="dark"] .employee-preview__day{background:#202330!important}
html[data-theme="dark"] .schedule-preview__muted,
html[data-theme="dark"] .employee-preview__muted{color:#9ca7bd!important}


/* ===== Landing dark mockups v4 ===== */

/* Hero dashboard preview */
html[data-theme="dark"] .mock{
  background:#151925!important;
  border-color:#30384d!important;
}
html[data-theme="dark"] .mock__bar{
  background:#171a26!important;
  border-bottom:1px solid #30384d!important;
}
html[data-theme="dark"] .mock__side{
  background:#151925!important;
  border-color:#30384d!important;
}
html[data-theme="dark"] .mock__board,
html[data-theme="dark"] .mock__day{
  background:#151925!important;
  border-color:#30384d!important;
}
html[data-theme="dark"] .mock__dayhead{
  background:#1a1f2d!important;
  border-color:#30384d!important;
  color:#f5f3ff!important;
}
html[data-theme="dark"] .mock-shift{
  background:#1a1f2d!important;
  border-color:#34394b!important;
  color:#f5f3ff!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .mock-shift--ghost{
  background:#171a26!important;
  color:#9ca7bd!important;
}
html[data-theme="dark"] .mock-emp__name{color:#f5f3ff!important}
html[data-theme="dark"] .mock__generate{background:#6C20FF!important}

/* Miniatura "Edición y control" */
html[data-theme="dark"] .mock-modal{
  background:#171a26!important;
  border-color:#30384d!important;
  color:#f5f3ff!important;
}
html[data-theme="dark"] .mock-modal__head,
html[data-theme="dark"] .mock-modal__foot{
  background:#171a26!important;
  border-color:#30384d!important;
}
html[data-theme="dark"] .mock-field div{
  background:#111522!important;
  color:#e9eaf1!important;
  border-color:#34394b!important;
}
html[data-theme="dark"] .mock-field div.is-focus{
  border-color:#6C20FF!important;
  box-shadow:0 0 0 3px rgba(108,32,255,.16)!important;
}
html[data-theme="dark"] .mock-btn--primary{background:#6C20FF!important}

/* Employee preview: logo correcto + morado + días dark */
html[data-theme="dark"] .employee-preview{
  background:#111522!important;
  color:#f5f3ff!important;
}
html[data-theme="dark"] .employee-preview__brand-logo{
  content:url('/logo-mark-dark.png')!important;
}
html[data-theme="dark"] .employee-preview__today{
  background:linear-gradient(135deg,#24114f,#6C20FF)!important;
  box-shadow:0 9px 22px rgba(108,32,255,.22)!important;
}
html[data-theme="dark"] .employee-preview__days div{
  background:#151925!important;
  border-color:#30384d!important;
  color:#e9eaf1!important;
}
html[data-theme="dark"] .employee-preview__days .is-today{
  background:#261b43!important;
  border-color:#6C20FF!important;
  color:#b893ff!important;
}
html[data-theme="dark"] .employee-preview__days span,
html[data-theme="dark"] .employee-preview__days small{
  color:#929bad!important;
}

/* CTA final: misma familia visual que FAQ, sin navy desentonado */
html[data-theme="dark"] .cta{
  background:#171a26!important;
  color:#f5f3ff!important;
  border:1px solid #30384d!important;
  box-shadow:none!important;
}
html[data-theme="dark"] .cta p{color:#a8b0c2!important}
html[data-theme="dark"] .cta .btn--light{
  background:#6C20FF!important;
  color:#fff!important;
  border-color:#6C20FF!important;
}
html[data-theme="dark"] .cta .btn--outline-light{
  background:#1a1f2d!important;
  color:#f5f3ff!important;
  border-color:#3b4052!important;
}

/* =========================================================
   LANDING AMBIENT BACKGROUNDS · 2026-09-08
   Reuse the Employee login ambience on alternating sections.
   ========================================================= */
html[data-theme="dark"] .hero{
  background:
    radial-gradient(circle at 8% 12%,rgba(108,32,255,.12),transparent 25%),
    radial-gradient(circle at 92% 86%,rgba(108,32,255,.10),transparent 28%),
    #0d101b!important;
}
html[data-theme="dark"] .section.section--alt{
  background:
    radial-gradient(circle at 12% 20%,rgba(108,32,255,.09),transparent 28%),
    radial-gradient(circle at 88% 78%,rgba(108,32,255,.075),transparent 30%),
    #10111b!important;
}
html[data-theme="dark"] .section:not(.section--alt){
  background:#0d101b!important;
}
