/* ===== Tema chiaro/scuro — tubespyai.app =====
   Il tema scuro e' quello originale (variabili definite nella pagina). Default: CHIARO (data-theme="light" impostato da theme.js).
   Qui: interruttore, palette chiara e correzioni specifiche del sito. */

html{color-scheme:dark;}
html[data-theme="light"]{color-scheme:light;}
html.theme-anim body,html.theme-anim nav,html.theme-anim section,html.theme-anim footer{transition:background-color .3s ease,color .3s ease,border-color .3s ease;}

/* ---------- Interruttore ---------- */
.theme-toggle{position:relative;flex:none;width:58px;height:30px;padding:0;border-radius:99px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);cursor:pointer;color:#9a98b3;transition:background .25s,border-color .25s,box-shadow .25s;-webkit-tap-highlight-color:transparent;}
.theme-toggle:hover{border-color:rgba(139,92,246,.5);}
.theme-toggle:focus-visible{outline:2px solid #a78bfa;outline-offset:3px;}
.tt-icons{position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 8px;pointer-events:none;}
.tt-i{display:flex;opacity:.55;}
.tt-knob{position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;transition:transform .35s cubic-bezier(.2,.9,.3,1.2),background .3s,box-shadow .3s;pointer-events:none;}
.tt-k{position:absolute;display:flex;transition:opacity .25s,transform .35s;}
.tt-k svg{width:13px;height:13px;}
html:not([data-theme="light"]) .tt-knob{transform:translateX(28px);background:linear-gradient(135deg,#8b5cf6,#4f46e5);box-shadow:0 0 12px rgba(139,92,246,.5);}
html:not([data-theme="light"]) .tt-k-sun{opacity:0;transform:rotate(-90deg) scale(.5);}
html[data-theme="light"] .tt-knob{transform:translateX(0);background:linear-gradient(135deg,#fbbf24,#f59e0b);box-shadow:0 2px 10px rgba(245,158,11,.45);}
html[data-theme="light"] .tt-k-moon{opacity:0;transform:rotate(90deg) scale(.5);}
html[data-theme="light"] .theme-toggle{background:rgba(15,23,42,.06);border-color:rgba(30,20,70,.16);color:#544f6e;}
.theme-toggle--desk{margin-left:14px;}
.theme-toggle--solo{margin-left:14px;margin-right:2px;}
.theme-toggle--mob{display:none;}
@media(max-width:768px){
  .theme-toggle--desk{display:none;}
  .theme-toggle--mob{display:block;margin-left:auto;margin-right:12px;}
}

/* ---------- Palette tema chiaro (rosso/verde neon -> toni piu scuri per il contrasto) ---------- */
html[data-theme="light"]{
  --bg:#f7f6fc;--bg-card:#ffffff;--bg-card2:#efedf8;
  --red:#b91c1c;--red-dim:rgba(185,28,28,.08);--red-border:rgba(185,28,28,.25);--red-glow:rgba(185,28,28,.22);
  --green:#047857;--green-dim:rgba(4,120,87,.09);--green-border:rgba(4,120,87,.25);
  --text:#14111f;--muted:#544f6e;--border:rgba(30,20,70,.11);--border2:rgba(30,20,70,.16);
}
html[data-theme="light"] body::before{opacity:.25;}
html[data-theme="light"] nav{background:rgba(255,255,255,.92);}
html[data-theme="light"] .nav-cta:hover,
html[data-theme="light"] .btn-primary:hover,
html[data-theme="light"] .plan-btn.solid:hover{background:#991b1b;}
html[data-theme="light"] .btn-ghost{background:rgba(15,23,42,.05);}
html[data-theme="light"] .btn-ghost:hover{border-color:rgba(30,20,70,.25);background:rgba(15,23,42,.09);}
html[data-theme="light"] .ptab{background:rgba(15,23,42,.04);}
html[data-theme="light"] .faq-q:hover{background:rgba(15,23,42,.03);}
html[data-theme="light"] .plan-features li.no{color:rgba(20,17,31,.55);}
html[data-theme="light"] .plan-features li.no::before{color:rgba(20,17,31,.25);}
html[data-theme="light"] footer p{color:var(--muted);}
html[data-theme="light"] .dash-block-label{color:rgba(185,28,28,.85);}
html[data-theme="light"] .plan.featured,
html[data-theme="light"] .plan{box-shadow:0 8px 30px rgba(30,20,70,.06);}

/* mockup dell'app (dashboard e anteprima): restano scuri, sono l'interfaccia del prodotto */
html[data-theme="light"] .dashboard,
html[data-theme="light"] .preview-frame{
  --bg:#0a0a0f;--bg-card:#0e0e16;--bg-card2:#121220;
  --red:#ff2020;--red-dim:rgba(255,32,32,.08);--red-border:rgba(255,32,32,.2);--red-glow:rgba(255,32,32,.25);
  --green:#00e87a;--green-dim:rgba(0,232,122,.08);--green-border:rgba(0,232,122,.18);
  --text:#f0f0f8;--muted:rgba(240,240,248,.45);--border:rgba(255,255,255,.07);--border2:rgba(255,255,255,.11);
  color:var(--text);
}
html[data-theme="light"] .dashboard .dash-block-label{color:rgba(255,32,32,.7);}