/* Appearance for public product pages and registration; tenant themes stay separate. */
html[data-theme="light"] { color-scheme: light; }
html.platform-billing[data-theme="light"] {
  --bg: #f5f5f7;
  --surface: #fff;
  --surface2: #f0f0f3;
  --border: #d4d4d9;
  --line: #d4d4d9;
  --text: #1d1d1f;
  --ink: #1d1d1f;
  --text-dim: #62626a;
  --primary: #b72e24;
  --red: #b72e24;
  --primary-glow: rgba(183, 46, 36, .16);
  --gradient: #b72e24;
  --success: #176338;
  --warning: #865000;
  --info: #b72e24;
  --danger: #b42318;
}
html[data-theme="dark"] {
  color-scheme: dark;
  --paper: #0b0c0e;
  --ink: #f5f5f7;
  --muted: #aaadb5;
  --line: #34373e;
  --red: #f38b7d;
  --dark: #15171b;
  --bg: #0b0c0e;
  --surface: #17191e;
  --surface2: #23262d;
  --border: #494e58;
  --text: #f5f5f7;
  --text-dim: #aaadb5;
  --primary: #f38b7d;
  --error: #ffb4a8;
  --error-bg: #3a2020;
  --success: #8bddac;
  --success-bg: #183123;
}

/* Native details and radio inputs retain normal keyboard and screen-reader behavior. */
.platform-theme { position: relative; flex: 0 0 auto; margin: 0; border: 0; color: var(--ink, var(--text, #1d1d1f)); }
.platform-theme>summary { display: grid; place-items: center; width: 44px; min-width: 0; height: 44px; min-height: 44px; margin: 0; padding: 0; border: 0; border-radius: 50%; list-style: none; cursor: pointer; color: inherit; }
.platform-theme>summary::after { content: none; }
.platform-theme>summary::-webkit-details-marker { display: none; }
.platform-theme>summary:hover,.platform-theme[open]>summary { background: #e7e7eb; }
.platform-theme-icon { width: 18px; height: 18px; display: block; }
.platform-theme-popover { position: absolute; z-index: 80; top: calc(100% + 8px); right: 0; width: 204px; max-width: calc(100vw - 32px); min-width: 0; margin: 0; padding: 6px; border: 1px solid #dcdce2; border-radius: 14px; background: #fff; color: #1d1d1f; box-shadow: 0 12px 40px #0000001f; }
.platform-theme-option { position: relative; display: flex; align-items: center; gap: 12px; min-height: 44px; padding: 9px 12px; margin: 0; border-radius: 9px; font-size: 13px; font-weight: 500; cursor: pointer; line-height: 1.4; }
.platform-theme-option:hover { background: #f0f0f3; }
.platform-theme-option:has(input:checked) { background: #f0f0f3; }
.platform-theme-option>svg { width: 17px; height: 17px; flex: 0 0 17px; }
.platform-theme-option>input,.platform-theme-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.platform-theme-check { margin-left: auto; visibility: hidden; font-size: 15px; }
.platform-theme-option:has(input:checked) .platform-theme-check { visibility: visible; }
.platform-theme>summary:focus-visible,.platform-theme-option:has(input:focus-visible) { outline: 2px solid var(--red, var(--primary, #bd3327)); outline-offset: 2px; }
.platform-theme-option>input:focus-visible { outline: none; }

html[data-theme="dark"] .platform-theme>summary:hover,
html[data-theme="dark"] .platform-theme[open]>summary { background: #292c33; }
html[data-theme="dark"] .platform-theme-popover { background: #202329; color: var(--ink); border-color: #454a54; box-shadow: 0 16px 44px #00000066; }
html[data-theme="dark"] .platform-theme-option:hover,
html[data-theme="dark"] .platform-theme-option:has(input:checked) { background: #343841; }

/* Public product navigation, cards, pricing and copy. Screenshots keep their own colors. */
html[data-theme="dark"] .site-header { background: var(--paper); }
html[data-theme="dark"] .skip-link { background: #23262d; color: var(--ink); }
html[data-theme="dark"] .muted,
html[data-theme="dark"] .hero-description,
html[data-theme="dark"] .spec-list dd,
html[data-theme="dark"] details p,
html[data-theme="dark"] .footer nav { color: var(--muted); }
html[data-theme="dark"] .pricing-section,
html[data-theme="dark"] .explore-grid>a,
html[data-theme="dark"] .integration-grid article { background: #17191e; }
html[data-theme="dark"] .automation-teaser { background: #22252b; }
html[data-theme="dark"] .extra-option:has(input:checked) { background: #262a32; box-shadow: 12px 0 #262a32, -12px 0 #262a32; }
html[data-theme="dark"] .extra-option input { accent-color: #f38b7d; }
html[data-theme="dark"] .button,
html[data-theme="dark"] .button-light,
html[data-theme="dark"] .closing .button { background: #f5f5f7; border-color: #f5f5f7; color: #16181c; }
html[data-theme="dark"] .button:hover,
html[data-theme="dark"] .button-light:hover,
html[data-theme="dark"] .closing .button:hover { background: #f6a397; border-color: #f6a397; color: #16181c; }
html[data-theme="dark"] .closing { color: var(--ink); }
html[data-theme="dark"] .device-grid li>span,
html[data-theme="dark"] .integration-format,
html[data-theme="dark"] .integration-grid .integration-access,
html[data-theme="dark"] .integration-note { color: var(--muted); }
html[data-theme="dark"] .integration-grid article,
html[data-theme="dark"] .integration-grid .integration-access { border-color: var(--line); }
/* Logos supplied for white backgrounds remain on white; dark artwork keeps its dark tile. */
html[data-theme="dark"] .device-logo:not(.device-logo-dark),
html[data-theme="dark"] .integration-logo:not(.device-logo-dark) { background: #fff; }
html[data-theme="dark"] .device-logo { border-color: #414650; }
html[data-theme="dark"] .device-logo-dark,
html[data-theme="dark"] .integration-logo.device-logo-dark { background: #232529; }

/* The live configurator uses light surfaces independently of the landing tokens. */
html[data-theme="dark"] .pc-shell { background: #17191e; border-color: var(--line); }
html[data-theme="dark"] .pc-steps,
html[data-theme="dark"] .pc-options .pc-option,
html[data-theme="dark"] .pc-facts>div,
html[data-theme="dark"] .pc-detail-footer { border-color: var(--line); }
html[data-theme="dark"] .pc-steps button,
html[data-theme="dark"] .pc-reset,
html[data-theme="dark"] .pc-status,
html[data-theme="dark"] .pc-vehicle-make,
html[data-theme="dark"] .pc-vehicle-generation,
html[data-theme="dark"] .pc-gain h4,
html[data-theme="dark"] .pc-gain-stock,
html[data-theme="dark"] .pc-facts dt,
html[data-theme="dark"] .pc-detail-footer p { color: var(--muted); }
html[data-theme="dark"] .pc-steps button:disabled { color: #838894; }
html[data-theme="dark"] .pc-steps button[aria-current="step"] { color: var(--ink); border-bottom-color: var(--red); }
html[data-theme="dark"] .pc-search input { background: #22252c; border-color: #484e59; color: var(--ink); }
html[data-theme="dark"] .pc-search input::placeholder { color: #a5aab5; opacity: 1; }
html[data-theme="dark"] .pc-options .pc-option { background: #1d2026; color: var(--ink); }
html[data-theme="dark"] .pc-options .pc-option:hover { background: #2b3039; border-color: #6e7685; }
html[data-theme="dark"] .pc-option::after { color: #b5bac4; }
html[data-theme="dark"] .pc-stage-switch { background: #292d35; }
html[data-theme="dark"] .pc-stage-switch button { color: #ced1d8; }
html[data-theme="dark"] .pc-stage-switch button[aria-pressed="true"] { background: #484e59; color: #fff; box-shadow: 0 1px 5px #00000033; }
html[data-theme="dark"] .pc-gain { background: #262a32; }
html[data-theme="dark"] .pc-gain-delta { color: #83d5ab; }
html[data-theme="dark"] .pc-chart-panel { background: #101216; box-shadow: inset 0 0 0 1px #30343c; }

/* The first booking step uses its existing form variables and specific control surfaces. */
html[data-theme="dark"] .register-box { border-color: var(--line); }
html[data-theme="dark"] .register-box .form-control { background: #20232a; color: var(--text); }
html[data-theme="dark"] .register-box .form-control::placeholder { color: #a5aab5; opacity: 1; }
html[data-theme="dark"] .register-box .btn-submit { background: #f5f5f7; color: #16181c; }
html[data-theme="dark"] .register-box .btn-submit:hover:not(:disabled) { background: #f6a397; color: #16181c; }
html[data-theme="dark"] .register-box .extra-checkbox { accent-color: #f38b7d; }
html[data-theme="dark"] .lang-toggle button.active { background: #272b33; color: var(--text); }
.lang-toggle .platform-theme { align-self: center; }
html.platform-billing .page-header { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0 16px; align-items: start; }
html.platform-billing .page-header>h1,
html.platform-billing .page-header>p { grid-column: 1; min-width: 0; }
html.platform-billing .billing-appearance { grid-column: 2; grid-row: 1 / span 2; }
html.platform-billing[data-theme="dark"] { --gradient: #ad3027; --warning: #f4c276; --info: #f38b7d; --danger: #ffb4a8; }
html.platform-billing[data-theme="dark"] #btnActivate,
html.platform-billing[data-theme="dark"] #btnCheckoutSubmit { color: #16181c !important; }
html[data-theme="dark"] .integration-status { color: #f4c276; border-color: #665138; background: #332b22; }

@media(max-width:599px) {
  .nav-actions .platform-theme>summary { width: 36px; }
  .nav-actions { gap: 0; }
  .navigation { gap: 4px; }
  .nav-actions #menuToggle { width: 32px; }
  .nav-actions #langToggle { min-width: 30px; }
}
@media(max-width:399px) {
  .navigation .brand { font-size: 18px; }
  .nav-actions .button-small { font-size: 10px; padding-inline: 10px; }
}
@media(max-width:359px) {
  .site-header .navigation { width: calc(100% - 24px); }
  .navigation .brand { font-size: 16px; }
  .nav-actions .platform-theme>summary { width: 32px; }
  .nav-actions #menuToggle { width: 28px; }
  .nav-actions #langToggle { min-width: 26px; }
}

html[data-theme="dark"] .flashy-feature{background:#181a1d;color:#f5f5f7;border:1px solid #3a3d42}
html[data-theme="dark"] .flashy-feature-intro>p:not(.eyebrow){color:#b8b9bf}
html[data-theme="dark"] .flashy-feature-grid article{background:#222428;border-color:#3a3d42}
html[data-theme="dark"] .flashy-feature-grid strong{color:#e99a8d}
html[data-theme="dark"] .flashy-feature-grid p{color:#b8b9bf}

/* Subscription assurance in dark appearance */
html[data-theme="dark"] .hero-assurance{color:#e99a8d}
html[data-theme="dark"] .assurance{background:#181a1d;border:1px solid #3a3d42;color:#f5f5f7}
html[data-theme="dark"] .assurance h2,html[data-theme="dark"] .assurance .eyebrow{color:#f5f5f7}
html[data-theme="dark"] .assurance p:not(.eyebrow),html[data-theme="dark"] .assurance-points span,html[data-theme="dark"] .assurance-points p{color:#b8b9bf}
html[data-theme="dark"] .assurance-points>div{background:#222428;border:1px solid #3a3d42}
html[data-theme="dark"] .assurance-points strong{color:#e99a8d}
html[data-theme="dark"] .assurance .button-accent{background:#b43b31;border-color:#b43b31;color:#fff}
html[data-theme="dark"] .assurance .button-accent:hover{background:#922d25;border-color:#922d25;color:#fff}

.provider-term-totals{margin:12px 0 16px;padding:12px 14px;border-radius:12px;background:#eeece8;color:#444247}
.provider-term-totals [hidden]{display:none}
.provider-term-totals p{margin:0;line-height:1.5}
html[data-theme="dark"] .provider-term-totals{background:#222428;color:#d5d6da}

html[data-theme="dark"] .brand-service{background:#181a1d;border:1px solid #3a3d42}
html[data-theme="dark"] .brand-service-grid article{background:#222428;border-color:#3a3d42}
html[data-theme="dark"] .brand-service-grid p{color:#b8b9bf}

/* Shared action colour across the public dark appearance. */
html[data-theme="dark"] .button-accent,
html[data-theme="dark"] .hero-actions .button,
html[data-theme="dark"] .nav-actions .button-small,
html[data-theme="dark"] .booking-summary .button,
html[data-theme="dark"] .closing .button,
html[data-theme="dark"] .webdesign-offer .button {
  background:#b43b31;
  border-color:#b43b31;
  color:#fff;
}
html[data-theme="dark"] .button-accent:hover,
html[data-theme="dark"] .hero-actions .button:hover,
html[data-theme="dark"] .nav-actions .button-small:hover,
html[data-theme="dark"] .booking-summary .button:hover,
html[data-theme="dark"] .closing .button:hover,
html[data-theme="dark"] .webdesign-offer .button:hover {
  background:#922d25;
  border-color:#922d25;
  color:#fff;
}
