:root:is([data-theme="dark"], [data-theme-resolved="dark"]) {
  color-scheme: dark;
  --bg: #10141d;
  --ink: #f6f0e6;
  --text: #f6f0e6;
  --muted: #b7c0cf;
  --muted2: #c6cedb;
  --line: rgba(231, 221, 202, 0.16);
  --border: rgba(231, 221, 202, 0.14);
  --panel: rgba(26, 32, 45, 0.84);
  --panel-2: rgba(21, 27, 39, 0.9);
  --panel-strong: #202838;
  --bg-card: #151c28;
  --navy: #f6f0e6;
  --body-background:
    radial-gradient(circle at 12% 0%, rgba(184, 102, 42, 0.16), transparent 28rem),
    radial-gradient(circle at 86% 8%, rgba(54, 91, 145, 0.18), transparent 30rem),
    linear-gradient(180deg, #171b25 0%, #10141d 100%);
  --shadow: 0 26px 80px rgba(0, 0, 0, 0.36);
  --grain-opacity: 0.055;
  --grain-blend: screen;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) body {
  background: var(--body-background) !important;
  color: var(--text) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) body::after {
  display: none;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) header,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .demo-header,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) nav {
  background: rgba(18, 23, 34, 0.9) !important;
  border-color: var(--line) !important;
  color: var(--text) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) h1,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) h2,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) h3,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) h4,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .brand h1,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .header-brand h1,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .nav-logo,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .categories h3,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .step-text h4,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .call-name,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .tech-val,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .price-row strong {
  color: var(--text) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .hero h1 {
  background: none !important;
  color: var(--text) !important;
  -webkit-text-fill-color: currentColor !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) li,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .brand p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .header-brand p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .lead,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .hero p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .section-sub,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .summary-card p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .rules p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .rules li,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .step-card p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .feature-item p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .usecase p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .service p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .try-card p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .try-card li,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .info-item div p:last-child,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .restaurant-details span,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .admin-demo-note p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .chooser-copy p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .restaurant-hero p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .whatsapp-layout p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .admin-head p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .call-transcript,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .tech-label,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .hint {
  color: var(--muted) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .back,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .back-btn,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .back-link,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .nav-back,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .btn-secondary,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .btn:not(.primary):not(.btn-green):not(.btn-amber):not(.nav-cta) {
  background: rgba(246, 240, 230, 0.06) !important;
  border-color: var(--line) !important;
  color: var(--muted2) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .back:hover,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .back-btn:hover,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .back-link:hover,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .nav-back:hover,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .btn-secondary:hover,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .btn:not(.primary):not(.btn-green):not(.btn-amber):not(.nav-cta):hover {
  background: rgba(246, 240, 230, 0.1) !important;
  color: var(--text) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .summary-card,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .rules,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .service,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .hero-visual,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .try-card,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .lead-preview-panel,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .call-card,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .step-card,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .feature-item,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .usecase,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .tech-box,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .cta-box,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .choice-card,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .restaurant-details article,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .whatsapp-layout,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .admin-real-panel,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .admin-demo-note,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .demo-cta,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .reservas-tour-card,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-tour-card,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-info-modal,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-info-grid article {
  background: var(--panel) !important;
  border-color: var(--line) !important;
  color: var(--text) !important;
  box-shadow: var(--shadow) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .choice-card.primary,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .cta-box {
  background:
    linear-gradient(135deg, rgba(184, 102, 42, 0.14), rgba(26, 32, 45, 0.88)),
    var(--panel) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .demo-cta h3 {
  color: var(--text) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .demo-cta p {
  color: var(--muted) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .demo-cta-primary {
  background: #f0bd67 !important;
  color: #171207 !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .demo-cta-secondary {
  background: rgba(246, 240, 230, 0.06) !important;
  border-color: var(--line) !important;
  color: var(--muted2) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .demo-cta-actions a:hover {
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .store-banner {
  background:
    radial-gradient(circle at 18% 12%, rgba(245, 196, 81, 0.14), transparent 26rem),
    linear-gradient(135deg, #132033 0%, #1d3557 100%) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .demo-context-bar,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .info-strip,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .steps span,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .demo-notice,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .wa-preview,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .tour-samples button,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-tour-example,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .tour-sample,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .hint span {
  background: rgba(245, 196, 81, 0.1) !important;
  border-color: rgba(245, 196, 81, 0.28) !important;
  color: #f7d884 !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .cat-item,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .menu-card {
  background: rgba(246, 240, 230, 0.055) !important;
  border: 1px solid var(--line) !important;
  color: var(--text) !important;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.22) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .cat-item p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .step-text p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .price-row {
  color: var(--muted) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) footer {
  background: #0c111b !important;
  border-top: 1px solid var(--line);
  color: var(--muted) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .browser,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .admin-real-frame {
  background: #151c28 !important;
  border-color: var(--line) !important;
  color: var(--text) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .browser-bar {
  background: #0d131e !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .browser-body {
  background: #151c28 !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .site-head,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .price-row {
  border-color: var(--line) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .change-chip {
  background: rgba(119, 196, 141, 0.14) !important;
  color: #9ce4b1 !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .lead-preview-panel pre {
  background: rgba(31, 168, 85, 0.1) !important;
  border-color: rgba(31, 168, 85, 0.28) !important;
  color: #9ce4b1 !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .tour-card {
  background: #182032 !important;
  color: var(--text) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .tour-title,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .tour-body strong,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-tour-card h2,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-info-modal h2,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-info-grid strong,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .reservas-tour-card h3 {
  color: var(--text) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .tour-body,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-tour-card p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-info-modal p,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-info-modal li,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .webchat-info-grid span,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .reservas-tour-card p {
  color: var(--muted) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .chat-preview,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .phone-preview {
  border-color: var(--line) !important;
  box-shadow: var(--shadow) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .phone,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .screen,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .dm,
:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .post-media {
  box-shadow: var(--shadow) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .flow-strip span {
  background: rgba(246, 240, 230, 0.06) !important;
  border-color: var(--line) !important;
  color: var(--muted2) !important;
}

:root:is([data-theme="dark"], [data-theme-resolved="dark"]) .demo-strip {
  background: linear-gradient(90deg, #0d1627, #10233d) !important;
  border-color: var(--line) !important;
}