/* ============================================================
   mysociale.net — tema scuro (correzioni a mano).
   Lo strato automatico e' dark-auto.css (scripts/gen-dark.py); qui i token e le rifiniture.
   Si attiva con <html data-theme="dark"> (script nel <head> di app/layout.js).
   ============================================================ */
:root[data-theme="dark"]{
  color-scheme:dark;
  --background:#0B1031;
  --foreground:#E6EBFF;
  --ink:#E6EBFF; --ink-2:#DCE3FF; --ink-3:#C9D3FA;
  --text:#E6EBFF;
  --muted:#A9B4DD;
  --subtle:#7F8AB9;
  --line:#253067;
  --surface:#0E1539;
  --surface-2:#151E4D;
  --accent:#5A80FF;
  --wa-bubble:#1B2766;
  --blue:#5A80FF;
  /* solo tema scuro */
  --d-card:#131B47; --d-card-2:#19235A;
  --d-edge:#2E3A80; --d-shadow:#03061A;
  --d-text:#E6EBFF;
  --d-solid:#E6EBFF; --d-on-solid:#0A1240;
  --d-inkbg:#1B2766;
  --pop-shadow:0 .3rem 0 var(--d-shadow);
}
:root[data-theme="dark"] body{ background:var(--background); color:var(--text) }
:root[data-theme="dark"] ::selection{ background:#3355C8; color:#fff }

/* campi dei moduli */
:root[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
:root[data-theme="dark"] textarea, :root[data-theme="dark"] select{ background-color:#0F173F; color:var(--text); border-color:#2E3A80 }
:root[data-theme="dark"] input::placeholder, :root[data-theme="dark"] textarea::placeholder{ color:#6F7AAB }
:root[data-theme="dark"] input:focus, :root[data-theme="dark"] textarea:focus, :root[data-theme="dark"] select:focus{ border-color:#5A80FF }
:root[data-theme="dark"] option{ background:#131B47; color:var(--text) }

/* barre di scorrimento */
:root[data-theme="dark"] *{ scrollbar-color:#2E3A80 transparent }

/* interruttore del tema nell'intestazione (in tutti e due i temi) */
.theme-slot{ display:contents }
.thm{ position:relative }
.thm__btn{ display:grid; place-items:center; width:2.4rem; height:2.4rem; border-radius:50%; border:1px solid rgba(255,255,255,.35); background:rgba(255,255,255,.08); color:#fff; cursor:pointer; transition:background .2s, transform .2s }
.thm__btn:hover{ background:rgba(255,255,255,.18) } .thm__btn:active{ transform:scale(.94) }
.thm__menu{ position:absolute; right:0; top:calc(100% + .5rem); z-index:120; min-width:13rem; padding:.4rem; border-radius:1rem; background:#fff; border:2px solid #0A1240; box-shadow:0 .35rem 0 #0A1240, 0 18px 40px rgba(10,18,64,.25); color:#0A1240 }
.thm__menu button{ width:100%; display:flex; align-items:center; gap:.6rem; padding:.6rem .7rem; border:0; border-radius:.7rem; background:none; font:inherit; font-size:.9rem; font-weight:700; color:inherit; cursor:pointer; text-align:left }
.thm__menu button:hover{ background:#EEF3FF } .thm__menu button.is-on{ background:#E8EEFF; color:#2456F0 }
.thm__chk{ margin-left:auto }
.thm__menu p{ margin:.3rem .7rem .3rem; font-size:.74rem; color:#4B5687 }
:root[data-theme="dark"] .thm__menu{ background:#131B47; border-color:#2E3A80; box-shadow:0 .35rem 0 #03061A, 0 18px 40px rgba(0,0,0,.5); color:var(--text) }
:root[data-theme="dark"] .thm__menu button:hover{ background:#19235A } :root[data-theme="dark"] .thm__menu button.is-on{ background:#1B2766; color:#9DB4FF }
:root[data-theme="dark"] .thm__menu p{ color:var(--muted) }

/* menu (telefono e desktop): scelta del tema accanto a "Close" */
.navmenu__theme{ margin-left:auto; margin-right:.6rem } .navmenu__theme:empty{ display:none }
.thm-seg{ display:flex; gap:.2rem; padding:.2rem; border-radius:9999px; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.06) }
.thm-seg button{ display:grid; place-items:center; width:2.1rem; height:2.1rem; border-radius:50%; border:0; background:none; color:#fff; cursor:pointer }
.thm-seg button.is-on{ background:#FFC63A; color:#0A1240 }
/* intestazione: le voci del menu non vanno a capo */
@media (min-width:1024px){ [data-theme-on] .nav ul{ gap:clamp(1rem,1.7vw,2rem) } [data-theme-on] .nav a, [data-theme-on] .nav a span{ white-space:nowrap } }

/* ---------------------------------------------------- rifiniture per pagina */
/* pulsante del check-in gia' fatto */
:root[data-theme="dark"] .checkin:disabled{ background:#16422A; color:#86EFAC; border-color:#2B6A45 }
/* footer: un tono piu' profondo della pagina, con la linea di stacco; il pulsante resta bianco come nel tema chiaro */
:root[data-theme="dark"] .footer{ background:#070B24; box-shadow:0 -1px 0 #1E2760 }
:root[data-theme="dark"] .footer .pill--light .pill__in{ background:#fff; color:#0A1240; border-color:#fff }
:root[data-theme="dark"] .footer .pill--light .pill__badge{ background:#0A1240; color:#FFC63A }
@media (max-width:639px){ .navmenu__theme{ margin-right:.4rem } .thm-seg{ padding:.15rem } .thm-seg button{ width:1.8rem; height:1.8rem } }