/* ============================================================
   Tema CHIARO condiviso per i tool /tools/
   Solo regole html[data-theme="light"] → il tema scuro (default) resta intatto.
   Chiaro = pagina chiara, card bianche, testo scuro, accenti blu leggibili.
   ============================================================ */

/* ---- Base / template ---- */
html[data-theme="light"]{ background:#eef3ff; }
html[data-theme="light"] body{
  color:#13213f;
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(100,206,251,.20), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(53,86,208,.12), transparent 55%),
    linear-gradient(160deg,#eef3ff 0%,#e7eeff 55%,#f3f6ff 100%);
}
html[data-theme="light"] .back{ color:#48597a; }
html[data-theme="light"] .back:hover{ color:#13213f; }
html[data-theme="light"] .eyebrow{ color:#2563c9; }
html[data-theme="light"] h1{ color:#0e1a44; text-shadow:none; }
html[data-theme="light"] .sub{ color:#41506f; }
html[data-theme="light"] .foot{ color:#5a6a8b; }
html[data-theme="light"] .foot a{ color:#2563c9; }

/* ---- Card / pannelli ---- */
html[data-theme="light"] .panel{
  background:#ffffff; border-color:rgba(13,33,68,.10);
  box-shadow:0 6px 24px rgba(20,40,90,.10);
}
html[data-theme="light"] .panel h2{ color:#0e1a44; }

/* ---- Campi input ---- */
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea{
  background:#ffffff; color:#13213f; border-color:rgba(13,33,68,.18); color-scheme:light;
}
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder{ color:#9aa6bd; }

/* ---- Label / testi secondari (muted) ---- */
html[data-theme="light"] label,
html[data-theme="light"] .fld label,
html[data-theme="light"] .row label,
html[data-theme="light"] .opt label,
html[data-theme="light"] .toggle{ color:#41506f; }
html[data-theme="light"] .hint,
html[data-theme="light"] .disc,
html[data-theme="light"] .note,
html[data-theme="light"] .privacy,
html[data-theme="light"] .slbl,
html[data-theme="light"] .read,
html[data-theme="light"] .bar-lbl,
html[data-theme="light"] .imc-extra,
html[data-theme="light"] .res small,
html[data-theme="light"] .res .u,
html[data-theme="light"] .cell .l,
html[data-theme="light"] .stat .l,
html[data-theme="light"] .it .nm,
html[data-theme="light"] .lbl,
html[data-theme="light"] .size{ color:#5a6a8b; }
html[data-theme="light"] .it .num{ color:#9aa6bd; }
html[data-theme="light"] .privacy b,
html[data-theme="light"] .imc-extra b,
html[data-theme="light"] .read b,
html[data-theme="light"] .cell .v{ color:#13213f; }

/* ---- Superfici traslucide → chiare ---- */
html[data-theme="light"] .stat,
html[data-theme="light"] .cell,
html[data-theme="light"] .it,
html[data-theme="light"] .cat,
html[data-theme="light"] .preset,
html[data-theme="light"] .mini,
html[data-theme="light"] .swap,
html[data-theme="light"] .copy{
  background:#f3f6fc; border-color:rgba(13,33,68,.12);
}
/* accenti testo (erano ciano chiaro → blu leggibile) */
html[data-theme="light"] .stat .n,
html[data-theme="light"] .tipval,
html[data-theme="light"] .lenval,
html[data-theme="light"] .swap,
html[data-theme="light"] .copy,
html[data-theme="light"] .qval{ color:#2563c9; }

/* ---- Drop zone (carica file) ---- */
html[data-theme="light"] .drop{ border-color:rgba(37,99,201,.4); }
html[data-theme="light"] .drop:hover,
html[data-theme="light"] .drop.over{ background:rgba(37,99,201,.06); }
html[data-theme="light"] .drop p{ color:#3a4a6b; }
html[data-theme="light"] .drop small{ color:#8a96ad; }

/* ---- countdown (titolo evento + box) ---- */
html[data-theme="light"] .cd .ev{ color:#0e1a44; }
html[data-theme="light"] .cd .box{ background:#f3f6fc; border-color:rgba(13,33,68,.12); }
html[data-theme="light"] .cd .box .n{ color:#2563c9; }
html[data-theme="light"] .cd .box .l{ color:#5a6a8b; }

/* ---- bottoni secondari (.btn.sec): in chiaro erano quasi invisibili → bordo+sfondo netti ---- */
html[data-theme="light"] .btn.sec{ background:#dde8ff; color:#173a8a; border:1px solid rgba(37,99,201,.55); box-shadow:0 1px 4px rgba(20,40,90,.10); }
html[data-theme="light"] .btn.sec:hover{ background:#cbdcff; }

/* ---- gioco 2048 (scorebox + pannello regole; la board resta scura di proposito) ---- */
html[data-theme="light"] .scorebox{ background:#f3f6fc; border-color:rgba(13,33,68,.12); }
html[data-theme="light"] .scorebox .v{ color:#0e1a44; }
html[data-theme="light"] .rules{ background:#fff; border-color:rgba(13,33,68,.10); }
html[data-theme="light"] .rules summary{ color:#0e1a44; }
html[data-theme="light"] .rules .body p,
html[data-theme="light"] .rules ol{ color:#41506f; }
html[data-theme="light"] .rules ol li b{ color:#0e1a44; }
html[data-theme="light"] .dpad-lbl{ color:#5a6a8b; }

/* ---- conta-parole / IMC big number restano accent (verde/dinamico): nessun override ---- */

/* ---- Nota rassicurante "originale al sicuro" (tool PDF): base + chiaro ---- */
.safenote{display:flex;gap:.65rem;align-items:flex-start;background:rgba(34,197,94,.13);
  border:1px solid rgba(34,197,94,.45);border-radius:12px;padding:.75rem .95rem;margin:0 0 1.4rem;
  font-size:.93rem;line-height:1.5;color:#d7ffe6}
.safenote .si{font-size:1.25rem;line-height:1.2;flex-shrink:0}
.safenote b{color:#7ef0a8}
html[data-theme="light"] .safenote{background:rgba(34,197,94,.12);border-color:rgba(22,163,74,.5);color:#1a5c34}
html[data-theme="light"] .safenote b{color:#0f7a3d}

/* ---- tool PDF: accenti/etichette + box "file caricato" ---- */
html[data-theme="light"] .step{ color:#2563c9; }
html[data-theme="light"] .val{ color:#2563c9; }
html[data-theme="light"] .loaded{ background:#f3f6fc; border-color:rgba(13,33,68,.12); color:#13213f; }
html[data-theme="light"] .loaded .nome{ color:#13213f; }
html[data-theme="light"] .loaded .pg{ color:#2563c9; }
html[data-theme="light"] .loaded button{ background:#dde8ff; color:#173a8a; border:1px solid rgba(37,99,201,.55); }
html[data-theme="light"] .ink{ color:#41506f; }

/* ---- firma-pdf: navigazione pagina + anteprima ---- */
html[data-theme="light"] .pagenav button,
html[data-theme="light"] .szbtn{ background:#dde8ff; color:#173a8a; border:1px solid rgba(37,99,201,.55); }
html[data-theme="light"] .pagenav .lbl{ color:#0e1a44; }
html[data-theme="light"] .preview{ background:#eef3fb; border-color:rgba(13,33,68,.12); }
html[data-theme="light"] .previewhint,
html[data-theme="light"] .presetlbl{ color:#5a6a8b; }
html[data-theme="light"] .grid6 button{ background:#dde8ff; color:#173a8a; border:1px solid rgba(37,99,201,.55); }

/* ---- HUB (/tools/) ---- */
html[data-theme="light"] .searchbar input{ background:#fff; }
html[data-theme="light"] .cat-title{ color:#0e1a44; }
html[data-theme="light"] .cat-title .ln{ background:linear-gradient(90deg,rgba(37,99,201,.35),transparent); }
html[data-theme="light"] .tool{
  background:#ffffff; border-color:rgba(13,33,68,.10);
  box-shadow:0 4px 18px rgba(20,40,90,.08);
}
html[data-theme="light"] .tool h2{ color:#0e1a44; }
html[data-theme="light"] .tool p{ color:#48597a; }
html[data-theme="light"] .nores{ color:#5a6a8b; }
html[data-theme="light"] .kofi{
  background:#ffffff; border-color:rgba(13,33,68,.10);
}
html[data-theme="light"] .kofi-title{ color:#0e1a44; }
html[data-theme="light"] .kofi-sub{ color:#48597a; }

/* ---- verifica-iban ---- */
html[data-theme="light"] .pretty{ color:#0e1a44; }
html[data-theme="light"] .rows{ border-color:rgba(13,33,68,.12); }
html[data-theme="light"] .row .k{ color:#5a6a8b; }
html[data-theme="light"] .row .v{ color:#13213f; }
html[data-theme="light"] .verdict.ok{ color:#15803d; }
html[data-theme="light"] .verdict.ko{ color:#dc2626; }

/* ---- calcola-calorie ---- */
html[data-theme="light"] .seg button{ background:#f3f6fc; color:#41506f; border-color:rgba(13,33,68,.14); }
html[data-theme="light"] .seg button.on{ background:#dde8ff; color:#173a8a; border-color:rgba(37,99,201,.55); }
html[data-theme="light"] .tdee-big{ color:#2563c9; }
html[data-theme="light"] .tdee-lbl{ color:#5a6a8b; }
html[data-theme="light"] .goal{ background:#f3f6fc; border-color:rgba(13,33,68,.12); }
html[data-theme="light"] .goal .g-lbl{ color:#41506f; }
html[data-theme="light"] .goal .g-lbl small{ color:#8a96ad; }
html[data-theme="light"] .goal .g-val{ color:#0e1a44; }
html[data-theme="light"] .goal.cut .g-val{ color:#b45309; }
html[data-theme="light"] .goal.keep .g-val{ color:#15803d; }
html[data-theme="light"] .goal.bulk .g-val{ color:#2563c9; }

/* ---- giorni-fertili ---- */
html[data-theme="light"] .card2{ background:#f3f6fc; border-color:rgba(13,33,68,.12); }
html[data-theme="light"] .card2 .lbl{ color:#5a6a8b; }
html[data-theme="light"] .card2 .val{ color:#0e1a44; }
html[data-theme="light"] .card2.fertile{ background:rgba(236,72,153,.10); border-color:rgba(219,39,119,.4); }
html[data-theme="light"] .card2.fertile .val{ color:#be185d; }
html[data-theme="light"] .card2.ovu{ background:rgba(37,99,201,.08); border-color:rgba(37,99,201,.4); }
html[data-theme="light"] .card2.ovu .val{ color:#2563c9; }

/* ---- giochi nuovi: chrome in tema chiaro (le board restano scure di proposito) ---- */
html[data-theme="light"] #mode{ color:#5a6a8b; }
html[data-theme="light"] .levels button{ background:#eef3fb; color:#41506f; border-color:rgba(13,33,68,.14); }
html[data-theme="light"] .levels button.on{ background:#dde8ff; color:#173a8a; border-color:rgba(37,99,201,.55); }
html[data-theme="light"] .status{ color:#13213f; }
html[data-theme="light"] .colbtns button{ background:#e2e9f7; color:#2563c9; }
html[data-theme="light"] .colbtns button:hover:not(:disabled){ background:#d2ddf4; }

/* ---- cicli-sonno ---- */
html[data-theme="light"] .sc{ background:#f3f6fc; border-color:rgba(13,33,68,.12); }
html[data-theme="light"] .sc .t{ color:#0e1a44; }
html[data-theme="light"] .sc .m{ color:#5a6a8b; }
html[data-theme="light"] .sc.best{ background:rgba(34,197,94,.12); border-color:rgba(22,163,74,.5); }
html[data-theme="light"] .sc.best .t{ color:#0f7a3d; }
html[data-theme="light"] .sc .tag{ color:#0f7a3d; }
html[data-theme="light"] .hint{ color:#5a6a8b; }
html[data-theme="light"] .now{ background:#dde8ff; color:#173a8a; border-color:rgba(37,99,201,.4); }

/* ---- convertitore-taglie ---- */
html[data-theme="light"] .eq{ background:#f3f6fc; border-color:rgba(13,33,68,.12); }
html[data-theme="light"] .eq .v{ color:#0e1a44; }
html[data-theme="light"] .eq .sys{ color:#5a6a8b; }
html[data-theme="light"] .eq.src{ background:rgba(37,99,201,.1); border-color:rgba(37,99,201,.5); }
html[data-theme="light"] .eq.src .v{ color:#2563c9; }
html[data-theme="light"] .tbl th{ color:#5a6a8b; }
html[data-theme="light"] .tbl td{ color:#41506f; border-color:rgba(13,33,68,.1); }
html[data-theme="light"] .tbl tr.hl td{ background:rgba(37,99,201,.1); color:#0e1a44; }

/* ---- segnapunti ---- */
html[data-theme="light"] .pl{ background:#f3f6fc; border-color:rgba(13,33,68,.12); }
html[data-theme="light"] .pl .nm,html[data-theme="light"] .pl .sco{ color:#0e1a44; }
html[data-theme="light"] .pl .rank{ color:#8a96ad; }
html[data-theme="light"] .pl.lead{ background:rgba(34,197,94,.12); border-color:rgba(22,163,74,.5); }
html[data-theme="light"] .pl.lead .sco,html[data-theme="light"] .pl.lead .rank{ color:#0f7a3d; }
html[data-theme="light"] .pm button{ background:#e2e9f7; color:#173a8a; border-color:rgba(37,99,201,.3); }
html[data-theme="light"] .pm .minus{ color:#c0392b; }
html[data-theme="light"] .pl .del{ color:#9aa6bd; }
html[data-theme="light"] .chip{ background:#eef3fb; color:#41506f; border-color:rgba(13,33,68,.14); }
html[data-theme="light"] .chip.on{ background:#dde8ff; color:#173a8a; border-color:rgba(37,99,201,.55); }
html[data-theme="light"] .empty{ color:#5a6a8b; }
html[data-theme="light"] .steprow .lbl{ color:#5a6a8b; }
html[data-theme="light"] .addrow .btn{ background:#2563c9; color:#fff; border-color:transparent; }
html[data-theme="light"] .addrow .btn:hover{ background:#1e50a8; }

/* ---- blocchi (la board resta scura di proposito) ---- */
html[data-theme="light"] .nextbox{ background:#f3f6fc; border-color:rgba(13,33,68,.12); }
html[data-theme="light"] .nextbox .k,html[data-theme="light"] .scorebox .k{ color:#5a6a8b; }
html[data-theme="light"] .pad button{ background:#e2e9f7; color:#173a8a; border-color:rgba(37,99,201,.3); }
html[data-theme="light"] .dpad-lbl{ color:#5a6a8b; }
