:root {
  color-scheme: light;
  --theme-page: #f1f2f2;
  --theme-surface: #ffffff;
  --theme-surface-raised: #e5e7e7;
  --theme-text: #242729;
  --theme-muted: #62696c;
  --theme-border: #d1d5d5;
  --theme-input: #ffffff;
  --theme-accent: #b42336;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --theme-page: #111315;
  --theme-surface: #191c1e;
  --theme-surface-raised: #202426;
  --theme-text: #f1f2f2;
  --theme-muted: #b3b9bb;
  --theme-border: #3a4042;
  --theme-input: #151819;
  --theme-accent: #ef7080;
}

.theme-toggle {
  display: inline-flex;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  border: 1px solid var(--theme-border);
  border-radius: 999px;
  padding: 0.5rem 0.75rem;
  background: var(--theme-surface);
  color: var(--theme-text);
  font: 700 0.75rem/1 "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  white-space: nowrap;
  cursor: pointer;
}

.theme-toggle:hover {
  border-color: var(--theme-accent);
}

.theme-toggle svg {
  width: 17px;
  height: 17px;
  flex: 0 0 auto;
}

.theme-toggle .theme-icon-sun,
:root[data-theme="dark"] .theme-toggle .theme-icon-moon {
  display: none;
}

:root[data-theme="dark"] .theme-toggle .theme-icon-sun {
  display: block;
}

@media (max-width: 1100px) {
  .theme-toggle-label {
    display: none;
  }

  .theme-toggle {
    width: 40px;
    padding: 0;
  }
}

:root[data-theme="dark"] body {
  background: var(--theme-page) !important;
  background-image: none !important;
  color: var(--theme-text) !important;
}

.shell > .theme-toggle,
main > .theme-toggle {
  position: fixed;
  z-index: 60;
  top: 1rem;
  right: 1rem;
}

:root[data-theme="dark"] .site-header,
:root[data-theme="dark"] .account-header,
:root[data-theme="dark"] .header {
  border-color: var(--theme-border) !important;
  background: rgba(17, 19, 21, 0.96) !important;
}

:root[data-theme="dark"] .site-nav,
:root[data-theme="dark"] .brand,
:root[data-theme="dark"] .brand-caption,
:root[data-theme="dark"] .header-links,
:root[data-theme="dark"] .back-link {
  color: var(--theme-text);
}

:root[data-theme="dark"] .site-nav a:hover,
:root[data-theme="dark"] .site-nav a[aria-current="page"],
:root[data-theme="dark"] .auth-trigger:hover {
  color: #ffffff;
}

:root[data-theme="dark"] .site-nav {
  background: #171a1c;
}

:root[data-theme="dark"] a:not(.button):not(.primary-button):not(.theme-toggle),
:root[data-theme="dark"] .text-button {
  color: #ef8491;
}

:root[data-theme="dark"] .button-outline {
  border-color: #697174;
  background: transparent;
  color: var(--theme-text);
}

:root[data-theme="dark"] .button-outline:hover {
  border-color: #ef8491;
  background: rgba(239, 112, 128, 0.1);
}

:root[data-theme="dark"] .site-nav a,
:root[data-theme="dark"] .site-nav .auth-trigger {
  border-color: var(--theme-border);
  color: var(--theme-text);
}

:root[data-theme="dark"] .hero {
  background: var(--theme-page) !important;
  color: var(--theme-text);
}

:root[data-theme="dark"] .hero::before {
  background: linear-gradient(90deg, #111315 0%, #111315 44%, rgba(17, 19, 21, 0.86) 55%, rgba(17, 19, 21, 0.08) 100%) !important;
}

:root[data-theme="dark"] .hero-media {
  border-color: var(--theme-border);
  background:
    linear-gradient(135deg, transparent 0 49.8%, rgba(239, 112, 128, 0.2) 50%, transparent 50.2%),
    radial-gradient(ellipse at 75% 30%, rgba(180, 35, 54, 0.18), transparent 40%),
    linear-gradient(145deg, #23282a, #191d1f 55%, #252a2c);
}

:root[data-theme="dark"] .hero-visual {
  color: #e4e8e9;
}

:root[data-theme="dark"] .hero-visual::before,
:root[data-theme="dark"] .hero-orbit {
  border-color: rgba(228, 232, 233, 0.2);
}

:root[data-theme="dark"] .hero-core,
:root[data-theme="dark"] .hero-node {
  border-color: #454c4e;
  background: rgba(25, 28, 30, 0.94);
  color: #f1f2f2;
}

:root[data-theme="dark"] .hero-core span,
:root[data-theme="dark"] .hero-copy,
:root[data-theme="dark"] .trust-note {
  color: #c1c7c9;
}

:root[data-theme="dark"] .hero h1,
:root[data-theme="dark"] .benefit h2,
:root[data-theme="dark"] .section-heading h2,
:root[data-theme="dark"] .typebot-copy h2,
:root[data-theme="dark"] .about-copy h2,
:root[data-theme="dark"] .process-intro h2,
:root[data-theme="dark"] .contact-copy h2 {
  color: var(--theme-text);
}

:root[data-theme="dark"] .hero h1 span,
:root[data-theme="dark"] .brand-name span,
:root[data-theme="dark"] .eyebrow,
:root[data-theme="dark"] .service-index,
:root[data-theme="dark"] .plan-badge,
:root[data-theme="dark"] .step-count,
:root[data-theme="dark"] .review-stars,
:root[data-theme="dark"] .text-button,
:root[data-theme="dark"] .back,
:root[data-theme="dark"] .terms-section li::marker,
:root[data-theme="dark"] .account-eyebrow,
:root[data-theme="dark"] .card-label {
  color: #ef8491;
}

:root[data-theme="dark"] .benefit-band,
:root[data-theme="dark"] .plans,
:root[data-theme="dark"] .typebot-showcase,
:root[data-theme="dark"] .site-footer {
  border-color: var(--theme-border);
  background: var(--theme-surface-raised) !important;
}

:root[data-theme="dark"] .service-catalog,
:root[data-theme="dark"] .about,
:root[data-theme="dark"] .process,
:root[data-theme="dark"] .contact,
:root[data-theme="dark"] .contact-section {
  border-color: var(--theme-border);
  background: var(--theme-page) !important;
}

:root[data-theme="dark"] .service-card,
:root[data-theme="dark"] .plan-card,
:root[data-theme="dark"] .typebot-preview,
:root[data-theme="dark"] .contact-form,
:root[data-theme="dark"] .auth-dialog {
  border-color: var(--theme-border) !important;
  background: var(--theme-surface) !important;
  color: var(--theme-text);
}

:root[data-theme="dark"] .plan-card-featured,
:root[data-theme="dark"] .plan-card-selected,
:root[data-theme="dark"] .username-preview {
  border-color: #80404a !important;
  background: #2a2022 !important;
}

:root[data-theme="dark"] .service-card h3,
:root[data-theme="dark"] .plan-card h3,
:root[data-theme="dark"] .plan-price,
:root[data-theme="dark"] .contact-form label,
:root[data-theme="dark"] .typebot-preview-title strong,
:root[data-theme="dark"] .process-step h3,
:root[data-theme="dark"] .text-link,
:root[data-theme="dark"] .about-stat span,
:root[data-theme="dark"] .contact-details a,
:root[data-theme="dark"] .contact-location {
  color: var(--theme-text);
}

:root[data-theme="dark"] .benefit p,
:root[data-theme="dark"] .section-heading > p:not(.eyebrow),
:root[data-theme="dark"] .service-card p,
:root[data-theme="dark"] .typebot-copy > p:not(.eyebrow),
:root[data-theme="dark"] .about-copy > p:not(.eyebrow),
:root[data-theme="dark"] .process-intro > p:not(.eyebrow),
:root[data-theme="dark"] .contact-copy > p:not(.eyebrow),
:root[data-theme="dark"] .plan-fit,
:root[data-theme="dark"] .plan-list li,
:root[data-theme="dark"] .plan-support,
:root[data-theme="dark"] .plans-note,
:root[data-theme="dark"] .footer-nav,
:root[data-theme="dark"] .copyright,
:root[data-theme="dark"] .form-note,
:root[data-theme="dark"] .form-status {
  color: var(--theme-muted);
}

:root[data-theme="dark"] .process-step p {
  color: var(--theme-muted);
}

:root[data-theme="dark"] .field input,
:root[data-theme="dark"] .field textarea,
:root[data-theme="dark"] .typebot-input,
:root[data-theme="dark"] .auth-form input,
:root[data-theme="dark"] .auth-form select {
  border-color: var(--theme-border);
  background: var(--theme-input);
  color: var(--theme-text);
}

:root[data-theme="dark"] .typebot-preview-header,
:root[data-theme="dark"] .typebot-preview-note,
:root[data-theme="dark"] .typebot-message {
  border-color: var(--theme-border);
  background: #252a2c;
  color: var(--theme-text);
}

:root[data-theme="dark"] .typebot-message-user {
  border-color: #70404a;
  background: #312226;
}

:root[data-theme="dark"] .consent-banner {
  border-color: var(--theme-border);
  background: #191c1e;
  color: var(--theme-text);
}

:root[data-theme="dark"] .consent-banner strong {
  color: var(--theme-text);
}

:root[data-theme="dark"] .consent-banner p {
  color: var(--theme-muted);
}

:root[data-theme="dark"] .consent-actions button,
:root[data-theme="dark"] .consent-settings {
  border-color: #596164;
  background: #252a2c;
  color: var(--theme-text);
}

:root[data-theme="dark"] .consent-actions [data-consent="accept"] {
  border-color: #b42336;
  background: #b42336;
  color: #ffffff;
}

:root[data-theme="dark"] .terms-section,
:root[data-theme="dark"] .account-footer,
:root[data-theme="dark"] .review,
:root[data-theme="dark"] .topic,
:root[data-theme="dark"] .replies,
:root[data-theme="dark"] .history li {
  border-color: var(--theme-border);
}

:root[data-theme="dark"] .terms-section h2,
:root[data-theme="dark"] .account-intro h1,
:root[data-theme="dark"] .profile-card h2,
:root[data-theme="dark"] .detail-card h2,
:root[data-theme="dark"] .review-name,
:root[data-theme="dark"] .topic h3,
:root[data-theme="dark"] .item h2,
:root[data-theme="dark"] h1,
:root[data-theme="dark"] h2,
:root[data-theme="dark"] h3 {
  color: var(--theme-text);
}

:root[data-theme="dark"] .terms-section p,
:root[data-theme="dark"] .terms-section ul,
:root[data-theme="dark"] .updated,
:root[data-theme="dark"] .intro,
:root[data-theme="dark"] .account-intro > p:last-child,
:root[data-theme="dark"] .card-description,
:root[data-theme="dark"] .field-help,
:root[data-theme="dark"] .detail-card > p:last-child,
:root[data-theme="dark"] .account-loading,
:root[data-theme="dark"] .account-status,
:root[data-theme="dark"] .panel-intro,
:root[data-theme="dark"] .sign-in-note,
:root[data-theme="dark"] .review-body,
:root[data-theme="dark"] .topic-body,
:root[data-theme="dark"] .reply,
:root[data-theme="dark"] .status-message,
:root[data-theme="dark"] .status,
:root[data-theme="dark"] .item p,
:root[data-theme="dark"] .page-status {
  color: var(--theme-muted);
}

:root[data-theme="dark"] .terms-section li::marker,
:root[data-theme="dark"] .eyebrow,
:root[data-theme="dark"] .account-eyebrow,
:root[data-theme="dark"] .card-label {
  color: var(--theme-accent);
}

:root[data-theme="dark"] .page-footer-inner,
:root[data-theme="dark"] .footer-inner {
  color: var(--theme-muted);
}

:root[data-theme="dark"] .site-footer,
:root[data-theme="dark"] .footer {
  border-color: var(--theme-border);
  background: var(--theme-surface-raised);
}

:root[data-theme="dark"] .account-card,
:root[data-theme="dark"] .detail-card,
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .status-card,
:root[data-theme="dark"] .item {
  border-color: var(--theme-border);
  background: var(--theme-surface);
  color: var(--theme-text);
}

:root[data-theme="dark"] .account-card {
  box-shadow: 0 12px 38px rgba(0, 0, 0, 0.22);
}

:root[data-theme="dark"] input,
:root[data-theme="dark"] textarea,
:root[data-theme="dark"] select,
:root[data-theme="dark"] .username-input input {
  border-color: var(--theme-border);
  background: var(--theme-input);
  color: var(--theme-text);
}

:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder {
  color: #aab1b3;
}

:root[data-theme="dark"] .username-preview {
  border-color: #70404a;
  color: var(--theme-text);
}

:root[data-theme="dark"] .username-preview span,
:root[data-theme="dark"] label {
  color: var(--theme-text);
}

:root[data-theme="dark"] .actions a,
:root[data-theme="dark"] .actions button,
:root[data-theme="dark"] .item-actions button {
  border-color: var(--theme-border);
  background: var(--theme-surface-raised);
  color: var(--theme-text);
}

:root[data-theme="dark"] .actions button,
:root[data-theme="dark"] .item-actions .approve {
  border-color: #16794a;
  background: #16794a;
  color: #ffffff;
}

:root[data-theme="dark"] .item-actions .reject {
  border-color: #b42336;
  background: #b42336;
  color: #ffffff;
}

:root[data-theme="dark"] .menu-toggle {
  border-color: var(--theme-border);
  background: var(--theme-surface-raised);
  color: var(--theme-text);
}

:root[data-theme="dark"] .auth-dialog-header h2,
:root[data-theme="dark"] .auth-dialog .auth-form label,
:root[data-theme="dark"] .username-preview span {
  color: var(--theme-text);
}

@media (max-width: 700px) {
  .site-header .theme-toggle {
    width: 40px;
    height: 40px;
    padding: 0;
  }

  .theme-toggle-label {
    display: none;
  }

  .site-header .header-inner {
    gap: 0.4rem;
  }
}

@media (min-width: 701px) and (max-width: 1100px) {
  :root[data-theme="dark"] .hero::before {
    background: linear-gradient(180deg, rgba(17, 19, 21, 0.05) 0%, rgba(17, 19, 21, 0.72) 42%, #111315 70%) !important;
  }
}

@media (max-width: 520px) {
  .site-header .header-inner,
  .account-header-inner {
    flex-wrap: wrap;
    padding-block: 0.65rem;
  }
}
