/**
 * Impronta — Light Mode Central Overrides
 * Questo file contiene TUTTI i [data-theme="light"] override per le sezioni
 * che non hanno un proprio blocco light. Caricato in base.php dopo tutti
 * gli altri CSS, quindi vince la cascade su qualsiasi regola precedente.
 *
 * Dipende da tokens.css (per le variabili light ridefinite).
 * Tutte le regole sono scoped a [data-theme="light"]: nessun impatto sul dark.
 *
 * INDICE:
 *   1.  Reading
 *   2.  Dashboard
 *   3.  Transit
 *   4.  Home (guest/marketing)
 *   5.  Auth
 *   6.  Yoga
 *   7.  Archive
 *   8.  Pricing
 *   9.  Learn
 *   10. Onboarding
 *   11. About / Legal
 *   12. Aura Sound
 *   13. Profile themes
 */

/* ════════════════════════════════════════════════════════════════
   1. READING — Schermata lettura/bodygraph
   ════════════════════════════════════════════════════════════════ */

/* Ombre dark → shadow system */
[data-theme="light"] .rdg-stat-card:hover {
  box-shadow: var(--shadow-md);
}
[data-theme="light"] .rdg-center:hover {
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .rdg-channel-detail:hover {
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .rdg-linechip:hover,
[data-theme="light"] .rdg-chanchip:hover {
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .rdg-profile-band:hover {
  box-shadow: var(--shadow-sm);
}

/* Decorazione bianca nella barra titolo pannello */
[data-theme="light"] .rdg-panel__title::after {
  background: linear-gradient(to right, rgba(28, 22, 8, .06), transparent);
}

/* Summary AI gradient bianco → neutro caldo */
[data-theme="light"] .rdg-ai-block__summary {
  background: rgba(28, 22, 8, .02);
}
[data-theme="light"] .rdg-ai-block__summary:hover {
  background: rgba(28, 22, 8, .04);
}

/* QR dropdown: shadow + no backdrop blur duro */
[data-theme="light"] .rdg-qr-dropdown {
  box-shadow: var(--shadow-lg);
  backdrop-filter: none;
}

/* Modali link/lock/gate: overlay + box più sobri */
[data-theme="light"] .rdg-link-modal {
  background: rgba(28, 22, 8, .45);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
[data-theme="light"] .rdg-link-modal__box {
  box-shadow: var(--shadow-lg);
}
[data-theme="light"] .rdg-lmodal__box {
  box-shadow: var(--shadow-lg);
}
[data-theme="light"] .rdg-gmodal__box {
  background: var(--card);
  box-shadow: var(--shadow-lg);
  border-color: rgba(138, 90, 12, .22);
}

/* Body section heading lines: white gradient → ink */
[data-theme="light"] .rdg-block::after,
[data-theme="light"] .rdg-narrative::after {
  background: linear-gradient(90deg, transparent, rgba(138, 90, 12, .16), transparent);
}

/* Chip gate/channel count */
[data-theme="light"] .rdg-panel__count {
  background: rgba(138, 90, 12, .08);
  border-color: rgba(138, 90, 12, .18);
  color: var(--gold-dim);
}

/* Identity birth date */
[data-theme="light"] .rdg-identity__birth {
  color: var(--ink30);
}

/* Spec gradient su summary AI inline su h1 */
[data-theme="light"] .reading-page .rdg-identity__name {
  font-family: var(--sacred);
  font-weight: 300;
}

/* ════════════════════════════════════════════════════════════════
   2. DASHBOARD
   ════════════════════════════════════════════════════════════════ */

/* Greeting (violet accent) */
[data-theme="light"] .dash-greeting {
  background: rgba(103, 74, 168, .06);
  border-left-color: var(--violet-ln);
}

/* Trial banner */
[data-theme="light"] .dash-trial-banner {
  background: rgba(103, 74, 168, .07);
  border-color: var(--violet-ln);
}

/* PWA banner */
[data-theme="light"] .dash-pwa-banner {
  background: var(--gold-bg);
  border-color: var(--gold-ln);
}

/* Card head separator */
[data-theme="light"] .dash-card-head {
  border-bottom-color: rgba(28, 22, 8, .09);
}

/* Sky/planet cards shadow */
[data-theme="light"] .dash-sky-card,
[data-theme="light"] .dash-planet-card,
[data-theme="light"] .dash-channels-card,
[data-theme="light"] .dash-design-card,
[data-theme="light"] .dash-yoga-card {
  box-shadow: var(--shadow-md);
}

/* ════════════════════════════════════════════════════════════════
   3. TRANSIT
   ════════════════════════════════════════════════════════════════ */

/* Loader: bg warm ivory (già usa var(--bg), ma forziamo sfondo pieno) */
[data-theme="light"] .ts-loader {
  background: var(--bg);
}

/* Planet rituale: colori su sfondo chiaro */
[data-theme="light"] .rit-planet__sym {
  color: var(--gold-dim);
  opacity: .7;
}
[data-theme="light"] .rit-planet__name { color: var(--ink40); }
[data-theme="light"] .rit-planet__gate { color: var(--ink20); }

/* Transit bar fill */
[data-theme="light"] .ts-ritual-moon__date { color: var(--gold); }

/* Block shadow */
/* L'ombra-card vale SOLO per i blocchi che sono davvero .card: i blocchi
   contenitori trasparenti (calendario, box guida) non devono sembrare card
   vuote con i contenuti appiccicati ai bordi. */
[data-theme="light"] .ts-block.card { box-shadow: var(--shadow-md); }

/* Pill snapshot: tonalità più scure per contrasto sul fondo chiaro
   (l'azzurro chiaro era poco leggibile). */
[data-theme="light"] .ts-pill--gold    { --tsc: 150,108,28;  --tsval: #7a5a14; }
[data-theme="light"] .ts-pill--aqua    { --tsc: 28,110,98;   --tsval: #166256; }
[data-theme="light"] .ts-pill--neutral { --tsc: 120,98,52;   --tsval: var(--ink); }

/* Etichette crema poco leggibili sul fondo chiaro → più scure */
[data-theme="light"] .ts-snapshot__eyebrow { color: var(--ink40); }

/* In light i blocchi sembrano card (ombra): lo snapshot non aveva padding,
   così i contenuti toccavano i bordi. Lo rendiamo una card con respiro. */
[data-theme="light"] .ts-snapshot {
  background: var(--card-grad);
  border: 1px solid var(--ln);
  border-radius: var(--rL);
  padding: 24px;
  box-shadow: var(--shadow-md);
}
@media (max-width:768px){
  [data-theme="light"] .ts-snapshot { padding: 16px; }
}

/* Tag/chip "sky" e centri attivi: l'azzurro chiaro (#8fd4c6) non si vede sul
   crema → teal scuro leggibile. */
[data-theme="light"] .xtag-sky {
  color: #176256;
  background: rgba(28,110,98,.10);
  border-color: rgba(28,110,98,.30);
}
[data-theme="light"] .ts-center-chip {
  color: #176256;
  background: rgba(28,110,98,.08);
  border-color: rgba(28,110,98,.28);
}
#sky-tip-gate, [data-theme="light"] #sky-tip-gate { color: #8fd4c6; } /* tooltip su fondo scuro: invariato */

/* ════════════════════════════════════════════════════════════════
   BODYGRAPH — tema light (palette definita nello Studio).
   Override di bodygraph-theme.css; vale per tutti i bodygraph in light. */
[data-theme="light"] .cross-bg { background:#E5E0D6; border-bottom-color: rgba(58,46,30,.10); }
[data-theme="light"] .chart-view-bg .bg-wrap,
[data-theme="light"] .combo-viewport,
[data-theme="light"] .mini-bg-wrap,
[data-theme="light"] .prof-bodygraph-mini,
[data-theme="light"] .field-bodygraph-wrap { background:#E5E0D6; }

/* Legenda colori bodygraph light */
[data-theme="light"] .bg-legend__sw--gc-p { background:#1B1C1E; border:none; }
[data-theme="light"] .bg-legend__sw--gc-d { background:#A83C30; }
[data-theme="light"] .bg-legend__sw--gc-b { background:#B89038; }
[data-theme="light"] .bg-legend__sw--gc-s { background:transparent; border:2px dashed rgba(58,46,30,.45); animation:none; box-shadow:none; }
[data-theme="light"] .bg-legend__sw--c-def { background:#EDEAE0; border:1px solid #B8B4A8; }
[data-theme="light"] .bg-legend__sw--c-open { background:rgba(58,46,30,.04); border:1.5px solid rgba(58,46,30,.20); }

/* Frecce variabili bodygraph: Personalità nere in light (SVG fill override) */
[data-theme="light"] #bg-variables-svg .bg-var-arrow[data-var="motivation"] polygon,
[data-theme="light"] #bg-variables-svg .bg-var-arrow[data-var="perspective"] polygon { fill: #1B1C1E; }
/* Frecce Design: reddish visibile in light */
[data-theme="light"] #bg-variables-svg .bg-var-arrow[data-var="digestion"] polygon,
[data-theme="light"] #bg-variables-svg .bg-var-arrow[data-var="environment"] polygon { fill: #A83C30; }

/* Partial transit chart — dark bg del bodygraph già gestito in tokens.css */

/* ════════════════════════════════════════════════════════════════
   4. HOME (guest/marketing)
   ════════════════════════════════════════════════════════════════ */

/* Section tinted strips */
[data-theme="light"] .home-section--alt {
  background:    rgba(103, 74, 168, .04);
  border-top:    0.5px solid rgba(103, 74, 168, .09);
  border-bottom: 0.5px solid rgba(103, 74, 168, .09);
}
[data-theme="light"] .home-section--warm {
  background:    rgba(138, 90, 12, .04);
  border-top:    0.5px solid rgba(138, 90, 12, .09);
  border-bottom: 0.5px solid rgba(138, 90, 12, .09);
}

/* Stelle decorative: più visibili su bg chiaro */
[data-theme="light"] .home-hero__star {
  background: var(--gold-dim);
  opacity: .35;
}

/* CTA glow: più caldo */
[data-theme="light"] .home-hero__glow {
  background: radial-gradient(ellipse at 50% -10%, rgba(138, 90, 12, .10) 0%, transparent 60%);
}

/* Feature card shadow */
[data-theme="light"] .home-feature-card { box-shadow: var(--shadow-md); }

/* ════════════════════════════════════════════════════════════════
   5. AUTH (login, register, profile, forgot, reset)
   ════════════════════════════════════════════════════════════════ */

/* Auth card shadow */
[data-theme="light"] .auth-page .card { box-shadow: var(--shadow-md); }

/* Google note link */
[data-theme="light"] .auth-google-note a { color: var(--ink40); }

/* Divider auth */
[data-theme="light"] .auth-divider { color: var(--ink30); }
[data-theme="light"] .auth-divider::before,
[data-theme="light"] .auth-divider::after { background: rgba(28, 22, 8, .14); }

/* Footer link */
[data-theme="light"] .auth-footer-link { color: var(--ink30); }

/* UUID badge (register con UUID linkato) */
[data-theme="light"] .auth-uuid-badge {
  background:   var(--sage-bg);
  border-color: var(--sage-ln);
}

/* ════════════════════════════════════════════════════════════════
   6. YOGA
   ════════════════════════════════════════════════════════════════ */

/* Card shadow */
[data-theme="light"] .yoga-stat-card,
[data-theme="light"] .yoga-program-card {
  box-shadow: var(--shadow-md);
}

/* Session view: pose immagine panel mantiene dark (è un'area grafica) */

/* ════════════════════════════════════════════════════════════════
   7. ARCHIVE
   ════════════════════════════════════════════════════════════════ */

/* Card shadow */
[data-theme="light"] .archive-card,
[data-theme="light"] .archive-resonance-card,
[data-theme="light"] .ar-card {
  box-shadow: var(--shadow-md);
}

/* Locked state */
[data-theme="light"] .archive-locked { background: var(--bg2); }

/* ════════════════════════════════════════════════════════════════
   8. PRICING / SUBSCRIPTION
   ════════════════════════════════════════════════════════════════ */

/* Plan card shadow */
[data-theme="light"] .plan-card { box-shadow: var(--shadow-md); }

/* Featured plan: gold tint + shadow forte */
[data-theme="light"] .plan-card--featured {
  box-shadow: var(--shadow-lg);
  border-color: var(--gold-ln) !important;
}

/* ════════════════════════════════════════════════════════════════
   9. LEARN / GUIDE (bodygraph, centri, gate, canali)
   ════════════════════════════════════════════════════════════════ */

/* Card shadow */
[data-theme="light"] .learn-card,
[data-theme="light"] .lk-card,
[data-theme="light"] .bgg-card,
[data-theme="light"] .learn-nav-card {
  box-shadow: var(--shadow-md);
}

/* Nav card hover */
[data-theme="light"] .learn-nav-card:hover { box-shadow: var(--shadow-lg); }

/* Hero: titolo serif */
[data-theme="light"] .learn-hero__title {
  font-family: var(--sacred);
  font-weight: 300;
}

/* ════════════════════════════════════════════════════════════════
   10. ONBOARDING
   ════════════════════════════════════════════════════════════════ */

/* Dot progress: più visibile */
[data-theme="light"] .ob-dot { background: rgba(28, 22, 8, .16); }
[data-theme="light"] .ob-dot.active { background: var(--gold); }

/* Button: gold coerente */
[data-theme="light"] .ob-next {
  background: var(--gold);
  color: var(--card);
}
[data-theme="light"] .ob-next:hover { background: var(--gold-dim); }

/* Skip button */
[data-theme="light"] .ob-skip { color: var(--ink30); }
[data-theme="light"] .ob-skip:hover { color: var(--ink55); }

/* ════════════════════════════════════════════════════════════════
   11. ABOUT / LEGAL
   ════════════════════════════════════════════════════════════════ */

/* About hero h1 in serif */
[data-theme="light"] .about-hero__h1 {
  font-family: var(--sacred);
  font-weight: 300;
  color: var(--gold);
}

/* Section headings */
[data-theme="light"] .about-section__h2 {
  letter-spacing: -.02em;
}

/* ════════════════════════════════════════════════════════════════
   12. AURA SOUND
   ════════════════════════════════════════════════════════════════ */

/* Flash (toast) in light */
[data-theme="light"] .aura-flash {
  box-shadow: var(--shadow-md);
}

/* Tile art shadow */
[data-theme="light"] .aura-tile__art {
  box-shadow: var(--shadow-sm);
}
[data-theme="light"] .aura-tile:hover .aura-tile__art {
  box-shadow: var(--shadow-md);
}

/* Aura relax: è una schermata full-screen intenzionalmente scura —
   NON si tocca: .aura-relax-on, .aura-relax__veil, .aura-relax__scrim
   restano dark a prescindere dal tema (è un'esperienza immersiva) */

/* Opt radio selector */
[data-theme="light"] .aura-opt {
  border-color: rgba(28, 22, 8, .16);
}
[data-theme="light"] .aura-opt:has(input:checked) {
  border-color: var(--gold);
  background: var(--gold-bg);
}

/* Switch grande */
[data-theme="light"] .aura-switch-lg__track { background: rgba(28, 22, 8, .18); }
[data-theme="light"] .aura-switch-lg input:checked + .aura-switch-lg__track {
  background: var(--gold-bg);
  border: 1px solid var(--gold-ln);
}

/* ════════════════════════════════════════════════════════════════
   13. PROFILE THEMES (field/@username)
   Alcuni temi usano body:has(.theme-X) per sfondo full-page.
   In light mode i gradienti scuri sparirebbero: li sostituiamo
   con versioni chiare coerenti col palette avorio.
   ════════════════════════════════════════════════════════════════ */

/* Tema minimal/classic: usa direttamente le var light — nessun override */

/* Tutti i theme-card in light ricevono shadow */
[data-theme="light"] .theme-card {
  box-shadow: var(--shadow-md);
  border-color: rgba(28, 22, 8, .13);
}

/* Profilo flag badge: già fixato in profile-ux.css */

/* ════════════════════════════════════════════════════════════════
   APP HEADER — sidebar logo area usa il colore del pannello bodygraph
   L'utente vede il #7A6E5C anche fuori dal grafico, come continuità.
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .app-sidebar__logo {
  background: #7A6E5C;
  border-bottom-color: rgba(28, 22, 8, .14);
}
[data-theme="light"] .app-sidebar__logo-text {
  color: #F0E8D4;
}
[data-theme="light"] .app-sidebar__logo-text span {
  color: rgba(212, 176, 104, .88);
}
[data-theme="light"] .app-sidebar__logo img {
  opacity: .88;
}

/* Topbar mobile: stesso colore header */
[data-theme="light"] .app-topbar__logo-text {
  color: #F0E8D4;
}

/* ════════════════════════════════════════════════════════════════
   READING — centri non-definiti nel pannello HTML: meno visibili
   Risponde a: "i centri non attivi devono risultare trasparenti"
   Questo è il blocco HTML (.rdg-centers-grid), NON l'SVG.
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .rdg-center:not(.is-defined) {
  opacity: 0.50;
}

/* ════════════════════════════════════════════════════════════════
   READING — pallino personalità canale: bianco su sfondo chiaro
   Il bianco (var(--hd-p) = #E8DFC8) è il colore della personalità
   nel sistema HD: NON si cambia. Si aggiunge solo un anello scuro
   sottile che lo rende visibile su fondo chiaro.
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .rdg-channel__dot {
  box-shadow: 0 0 0 1.5px rgba(28, 22, 8, .24) !important;
}

/* ════════════════════════════════════════════════════════════════
   READING — chip tono personalità (rb-tone-p): crema su crema
   Il crema rappresenta la personalità — non lo cambiamo.
   Aggiungiamo uno sfondo minimale e testo leggibile in ink.
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .rb-tone-p .rb-chip {
  background: rgba(28, 22, 8, .06);
  border-color: rgba(28, 22, 8, .14);
  color: var(--ink55);
}
[data-theme="light"] .rb-tone-p .rb-dot {
  background: #C4AF8A;
  box-shadow: 0 0 0 1px rgba(28, 22, 8, .16);
}

/* ════════════════════════════════════════════════════════════════
   READING — spectrum SVG divider centrale bianco
   L'SVG inline ha rgba(255,255,255,.06) al 50% → quasi trasparente
   su bg chiaro. Nascondo l'SVG e lo sostituisco con CSS.
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .rdg-spectrum__center svg { display: none; }
[data-theme="light"] .rdg-spectrum__center::after {
  content: '';
  display: block;
  width: 1.5px;
  height: 56px;
  background: linear-gradient(
    to bottom,
    rgba(158, 60, 30, .38),
    rgba(28, 22, 8, .10),
    rgba(58, 110, 68, .32)
  );
  border-radius: 1px;
}

/* ════════════════════════════════════════════════════════════════
   READING — lock overlay premium: hardcoded dark su light
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .rdg-lock-stage__overlay {
  background: radial-gradient(120% 80% at 50% 55%, rgba(28, 22, 8, .44), rgba(28, 22, 8, .84));
}

/* ════════════════════════════════════════════════════════════════
   FILTER DROPDOWN bodygraph — testo colori su bg chiaro
   Il filtro mostra testi con rgba(232,223,200,.85) hardcoded inline
   (personalità) che è invisibile su bg chiaro. Override background.
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .bg-filter-dropdown__menu {
  background: var(--card);
  border-color: var(--ln2);
  box-shadow: var(--shadow-md);
}
[data-theme="light"] .bg-filter-dropdown__item[data-filter="personality"] {
  color: var(--ink60) !important;
}
[data-theme="light"] .bg-filter-dropdown__item[data-filter="design"] {
  color: rgba(158, 60, 30, .85) !important;
}
[data-theme="light"] .bg-filter-dropdown__item[data-filter="both"] {
  color: var(--gold) !important;
}
[data-theme="light"] .bg-filter-dropdown__item[data-filter="suspended"] {
  color: rgba(103, 74, 168, .85) !important;
}

/* ════════════════════════════════════════════════════════════════
   TOOLTIP TRANSITI — versione tema chiaro (glass chiaro, oro scuro)
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .help-pop {
  background: linear-gradient(165deg, rgba(248, 245, 236, .97), rgba(243, 240, 231, .98));
  border-color: rgba(138, 90, 12, .28);
  color: #1C1912;
  box-shadow: 0 16px 44px -12px rgba(60, 45, 15, .28),
              0 0 0 .5px rgba(138, 90, 12, .12),
              inset 0 1px 0 rgba(255, 255, 255, .6);
}
[data-theme="light"] .help-pop::before { border-bottom-color: rgba(138, 90, 12, .28); }
[data-theme="light"] .help-pop::after  { border-bottom-color: rgba(248, 245, 236, .98); }
[data-theme="light"] .help-pop__title {
  color: #8A5A0C;
  border-bottom-color: rgba(138, 90, 12, .18);
}
[data-theme="light"] .help-pop__title::before {
  background: #8A5A0C;
  box-shadow: 0 0 8px rgba(138, 90, 12, .4);
}
[data-theme="light"] .help-pop__body { color: rgba(28, 25, 18, .82); }
[data-theme="light"] .help-dot {
  border-color: rgba(138, 90, 12, .35);
  background: rgba(138, 90, 12, .06);
  color: rgba(138, 90, 12, .8);
}
[data-theme="light"] .help-dot:hover,
[data-theme="light"] .help-dot.open {
  border-color: rgba(138, 90, 12, .6);
  background: rgba(138, 90, 12, .12);
  color: #8A5A0C;
}

/* ════════════════════════════════════════════════════════════════
   PLANETARY TIMELINE v2 (corsie) — tema chiaro, linee e punti visibili
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .ts-tl2-axis { border-bottom-color: rgba(138, 90, 12, .25); }
[data-theme="light"] .ts-tl2-tick__lbl { color: rgba(28, 25, 18, .5); }
[data-theme="light"] .ts-tl2-axis .ts-tl2-tick:first-child .ts-tl2-tick__lbl { color: #166256; }
[data-theme="light"] .ts-tl2-lane__sym { color: #8A5A0C; }
[data-theme="light"] .ts-tl2-lane--moon .ts-tl2-lane__sym { color: #166256; }
[data-theme="light"] .ts-tl2-lane__name { color: rgba(28, 25, 18, .55); }
[data-theme="light"] .ts-tl2-lane__line {
  background: linear-gradient(90deg, rgba(138, 90, 12, .4), rgba(138, 90, 12, .15));
}
[data-theme="light"] .ts-tl2-lane--moon .ts-tl2-lane__line {
  background: linear-gradient(90deg, rgba(28, 110, 98, .4), rgba(28, 110, 98, .15));
}
[data-theme="light"] .ts-tl2-dot {
  background: rgba(243, 240, 231, .95);
  border-color: rgba(138, 90, 12, .55);
}
[data-theme="light"] .ts-tl2-lane--moon .ts-tl2-dot { border-color: rgba(28, 110, 98, .55); }
[data-theme="light"] .ts-tl2-dot__gate { color: #8A5A0C; }
[data-theme="light"] .ts-tl2-lane--moon .ts-tl2-dot__gate { color: #166256; }
[data-theme="light"] .ts-tl2-dot:hover,
[data-theme="light"] .ts-tl2-dot:focus { border-color: #8A5A0C; box-shadow: 0 0 14px rgba(138, 90, 12, .35); }
[data-theme="light"] .ts-tl2-dot--chan {
  border-color: #8A5A0C;
  box-shadow: 0 0 0 3px rgba(138, 90, 12, .18);
}
[data-theme="light"] .ts-tl2-dot--chan .ts-tl2-dot__gate { color: #6d4708; }
[data-theme="light"] .ts-tl2-dot[data-tl-tip]:hover::after,
[data-theme="light"] .ts-tl2-dot[data-tl-tip]:focus::after {
  background: linear-gradient(165deg, rgba(248, 245, 236, .97), rgba(243, 240, 231, .98));
  border-color: rgba(138, 90, 12, .28);
  color: #1C1912;
}
[data-theme="light"] .ts-tl2-legend { border-top-color: rgba(138, 90, 12, .12); }
[data-theme="light"] .ts-tl2-legend__dot { border-color: rgba(138, 90, 12, .55); }
[data-theme="light"] .ts-tl2-legend__dot--chan {
  border-color: #8A5A0C;
  box-shadow: 0 0 0 2px rgba(138, 90, 12, .18);
}

/* ════════════════════════════════════════════════════════════════
   TIME TRAVEL SLIDER — tema chiaro
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .ts-tm {
  background: rgba(138, 90, 12, .05);
  border-color: rgba(138, 90, 12, .16);
}
[data-theme="light"] .ts-tm__eyebrow { color: rgba(138, 90, 12, .65); }
[data-theme="light"] .ts-tm__time { color: #8A5A0C; }
[data-theme="light"] .ts-tm__slider {
  background: linear-gradient(90deg, rgba(138, 90, 12, .5), rgba(28, 110, 98, .5));
}
[data-theme="light"] .ts-tm__slider::-webkit-slider-thumb {
  background: #8A5A0C;
  border-color: #E9E5D7;
  box-shadow: 0 2px 8px rgba(60, 45, 15, .25), 0 0 0 1px rgba(138, 90, 12, .5);
}
[data-theme="light"] .ts-tm__slider::-moz-range-thumb {
  background: #8A5A0C;
  border-color: #E9E5D7;
}
[data-theme="light"] .ts-tm__hint { color: rgba(28, 110, 98, .75); }
[data-theme="light"] .ts-tm__reset:hover {
  border-color: rgba(138, 90, 12, .5);
  color: #8A5A0C;
}

/* ════════════════════════════════════════════════════════════════
   RESTYLE PREMIUM v2 — tema chiaro
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .ts-page .ts-snapshot {
  background:
    radial-gradient(120% 80% at 50% 0%, rgba(138, 90, 12, .05), transparent 60%),
    var(--card);
  border-color: rgba(138, 90, 12, .14);
}
[data-theme="light"] .ts-page .ts-snapshot::before {
  background: linear-gradient(90deg,
    transparent, rgba(138, 90, 12, .4), rgba(28, 110, 98, .35), transparent);
}
[data-theme="light"] .ts-page .ts-eyebrow::before {
  background: rgba(138, 90, 12, .75);
  box-shadow: 0 0 8px rgba(138, 90, 12, .4);
}
[data-theme="light"] .ts-page .ts-block.card {
  border-color: rgba(138, 90, 12, .14);
  box-shadow: 0 1px 2px rgba(60, 45, 15, .08),
              0 8px 28px -16px rgba(60, 45, 15, .2);
}
[data-theme="light"] .ts-page .ts-block.card:hover {
  border-color: rgba(138, 90, 12, .22);
}
[data-theme="light"] .ts-page .tz--cross::after,
[data-theme="light"] .ts-page .tz--forecast::after,
[data-theme="light"] .ts-page .tz--timeline::after,
[data-theme="light"] .ts-page .tz--mandala::after,
[data-theme="light"] .ts-page .tz--calendar::after {
  background: linear-gradient(90deg,
    transparent, rgba(138, 90, 12, .3), rgba(28, 110, 98, .3), transparent);
}

/* ════════════════════════════════════════════════════════════════
   TIME TRAVEL v2 + zoom trasparenti — tema chiaro
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .ts-tm {
  background:
    radial-gradient(140% 100% at 50% 0%, rgba(138, 90, 12, .06), transparent 70%),
    rgba(138, 90, 12, .03);
  border-color: rgba(138, 90, 12, .18);
}
[data-theme="light"] .ts-tm__day { color: rgba(28, 110, 98, .8); }
[data-theme="light"] .ts-tm__step {
  border-color: rgba(138, 90, 12, .3);
  background: rgba(138, 90, 12, .06);
  color: #8A5A0C;
}
[data-theme="light"] .ts-tm__step:hover {
  background: rgba(138, 90, 12, .14);
  border-color: rgba(138, 90, 12, .5);
}
[data-theme="light"] .ts-tm__slider::-webkit-slider-thumb {
  background: linear-gradient(150deg, #b88838, #8A5A0C 55%, #6d4708);
  border-color: #E9E5D7;
}
[data-theme="light"] .ts-tm__slider::-moz-range-thumb {
  background: #8A5A0C;
  border-color: #E9E5D7;
}
/* Pulsanti zoom bodygraph trasparenti — tema chiaro */
[data-theme="light"] .bg-zoom button {
  border-color: rgba(138, 90, 12, .25);
  background: rgba(138, 90, 12, .05);
  color: rgba(138, 90, 12, .85);
}
[data-theme="light"] .bg-zoom button:hover {
  background: rgba(138, 90, 12, .12);
  border-color: rgba(138, 90, 12, .5);
  color: #8A5A0C;
}

/* ════════════════════════════════════════════════════════════════
   TOOLTIP BODYGRAPH (bg-tip) — tema chiaro, era illeggibile
   (sfondo scuro hardcoded + testo scuro). Ora glass chiaro.
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .bg-tip {
  background: linear-gradient(165deg, rgba(248, 245, 236, .98), rgba(243, 240, 231, .99));
  border-color: rgba(28, 110, 98, .35);
  color: #1C1912;
  box-shadow: 0 10px 30px -8px rgba(60, 45, 15, .25);
}
[data-theme="light"] .bg-tip-name { color: #166256; }

/* ════════════════════════════════════════════════════════════════
   TOOLTIP INCROCIO (xch-pop, xtip) — tema chiaro, erano illeggibili
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .xch-pop,
[data-theme="light"] .xtip {
  background: linear-gradient(165deg, rgba(248, 245, 236, .98), rgba(243, 240, 231, .99));
  border-color: rgba(138, 90, 12, .3);
  color: #1C1912;
  box-shadow: 0 10px 30px -8px rgba(60, 45, 15, .25);
}

/* ════════════════════════════════════════════════════════════════
   ESAGRAMMA + CROCE DEL GIORNO — tema chiaro
   ════════════════════════════════════════════════════════════════ */
[data-theme="light"] .ts-hex-symbol {
  background: rgba(138, 90, 12, .05);
  border-color: rgba(138, 90, 12, .14);
}
[data-theme="light"] .ts-hex-bar { background: linear-gradient(90deg, #8A5A0C, #6d4708); }
[data-theme="light"] .ts-hex-line--current .ts-hex-bar {
  background: linear-gradient(90deg, #166256, #0f4a3f);
  box-shadow: 0 0 10px rgba(22, 98, 86, .4);
}
[data-theme="light"] .ts-hex-line--current .ts-hex-line__num { color: #166256; }
[data-theme="light"] .ts-hex-num { color: rgba(138, 90, 12, .75); }
[data-theme="light"] .ts-hex-line-detail {
  background: rgba(22, 98, 86, .06);
  border-left-color: rgba(22, 98, 86, .4);
}
[data-theme="light"] .ts-hex-line-detail__label { color: #166256; }

[data-theme="light"] .ts-daycross-bg {
  background: #d0c7b9;
  border-color: rgba(138, 90, 12, .14);
}
[data-theme="light"] .ts-daycross-gates__label { color: rgba(138, 90, 12, .65); }
[data-theme="light"] .ts-daycross-gate {
  background: rgba(138, 90, 12, .05);
  border-color: rgba(138, 90, 12, .14);
}
[data-theme="light"] .ts-daycross-gate:hover {
  border-color: rgba(138, 90, 12, .3);
  background: rgba(138, 90, 12, .08);
}
[data-theme="light"] .ts-daycross-gate__num { color: #8A5A0C; }
[data-theme="light"] .ts-daycross-desc__toggle {
  color: #8A5A0C;
  border-color: rgba(138, 90, 12, .3);
}
[data-theme="light"] .ts-daycross-desc__toggle:hover {
  border-color: rgba(138, 90, 12, .55);
  background: rgba(138, 90, 12, .08);
}

/* ══════════════════════════════════════════════════════════════
   ESAGRAMMA nel modal Linee + badge profilo — tema chiaro
   ══════════════════════════════════════════════════════════════ */
[data-theme="light"] .rdg-hex { background: rgba(138,90,12,.05); }
[data-theme="light"] .rdg-hex-bar { background: #8A5A0C; }
[data-theme="light"] .rdg-hex-line--cur .rdg-hex-bar {
  background: #9a4a2c;
  box-shadow: 0 0 8px rgba(154,74,44,.4);
}
[data-theme="light"] .rdg-hex-line--cur .rdg-hex-line__n { color: #9a4a2c; }
[data-theme="light"] .rdg-hex-num { color: #8A5A0C; }
[data-theme="light"] .rdg-linechip__badge { color: #fff; background: #8A5A0C; }

/* ══════════════════════════════════════════════════════════════
   HD DREAMS — tema chiaro
   ══════════════════════════════════════════════════════════════ */
[data-theme="light"] .dreams-head__eyebrow,
[data-theme="light"] .dreams-seal__eyebrow,
[data-theme="light"] .dreams-card__gate,
[data-theme="light"] .dreams-moon__gate,
[data-theme="light"] .dreams-resonance__label,
[data-theme="light"] .dreams-guardian__gate,
[data-theme="light"] .dreams-bg__phase-name,
[data-theme="light"] .dreams-empty__symbol { color: #674AA8; }

[data-theme="light"] .dreams-moon--natal .dreams-moon__gate { color: var(--ink70); }

/* Tooltip chiari e leggibili in tema light */
[data-theme="light"] .dreams-page .help-pop {
  background: linear-gradient(165deg, rgba(248, 245, 252, .98), rgba(243, 240, 249, .99));
  border-color: rgba(103, 74, 168, .3);
  color: #1C1912;
  box-shadow: 0 16px 44px -12px rgba(60, 45, 90, .25);
}
[data-theme="light"] .dreams-page .help-pop::before { border-bottom-color: rgba(103, 74, 168, .3); }
[data-theme="light"] .dreams-page .help-pop__title { color: #674AA8; border-bottom-color: rgba(103, 74, 168, .18); }
[data-theme="light"] .dreams-page .help-pop__title::before { background: #674AA8; }
[data-theme="light"] .dreams-page .help-pop__body { color: #3a3550; }
[data-theme="light"] .dreams-page .help-dot {
  border-color: rgba(103, 74, 168, .35);
  background: rgba(103, 74, 168, .06);
  color: rgba(103, 74, 168, .8);
}
[data-theme="light"] .dreams-page .help-dot:hover,
[data-theme="light"] .dreams-page .help-dot.open {
  border-color: rgba(103, 74, 168, .65);
  background: rgba(103, 74, 168, .12);
  color: #674AA8;
}

/* Bodygraph notturno: sfondo chiaro */
[data-theme="light"] .dreams-bg__stage { background: #d8d2e2; border-color: rgba(103, 74, 168, .16); }

/* HD Dreams — Calendario lunare tema chiaro */
[data-theme="light"] .dreams-cal__eyebrow,
[data-theme="light"] .dreams-cal__gate,
[data-theme="light"] .dreams-cal__cell--today .dreams-cal__daynum { color: #674AA8; }
[data-theme="light"] .dreams-cal__cell--today {
  border-color: rgba(103, 74, 168, .5);
  background: rgba(103, 74, 168, .1);
}

/* HD Dreams — Diario dei sogni tema chiaro */
[data-theme="light"] .dreams-jr__eyebrow,
[data-theme="light"] .dreams-jr__entry-date,
[data-theme="light"] .dreams-jr__entry-gate { color: #674AA8; }
[data-theme="light"] .dreams-jr__date,
[data-theme="light"] .dreams-jr__textarea {
  background: #f0edf6;
  border-color: rgba(103, 74, 168, .25);
  color: #1C1912;
  color-scheme: light;
}
[data-theme="light"] .dreams-jr__submit {
  background: #674AA8;
  color: #fff;
}
[data-theme="light"] .dreams-jr__entry-moon { background: rgba(103, 74, 168, .1); }

/* HD Dreams — tooltip calendario e guardiani: freccia in basso (tema chiaro) */
[data-theme="light"] .dreams-cal__pop::before,
[data-theme="light"] .dreams-guardian__pop::before {
  border-bottom-color: transparent;
  border-top-color: rgba(103, 74, 168, .3);
}
[data-theme="light"] .dreams-guardian:hover,
[data-theme="light"] .dreams-guardian:focus,
[data-theme="light"] .dreams-guardian.open {
  border-color: rgba(103, 74, 168, .35);
  background: rgba(103, 74, 168, .08);
}