/* =========================================================
   HYPERVEX — Peso del cliente (pesata del mattino): LATO ATLETA   (voce 14, 4/10/2026)
   Card «Peso di oggi» in Home, schermata «Il mio peso», riga in Progressi (js/weigh-athlete.js, docs/PESO-CLIENTE.md).
   Solo colori, raggi e ombre del tema (--surface, --line, --txt, --red, --ok…): funziona con tutti i temi e gli accenti.
   Prefisso wa- (mai wk-: è dei blocchi settimana degli allenamenti). Tocchi >= 44 px, nessuno scroll orizzontale.
   ========================================================= */

.wa-slot:empty{ display:none; }
.wa-slot[data-wa="screen"]{ max-width:720px; margin-left:auto; margin-right:auto; }

/* ---------- card «Peso di oggi» (Home) ---------- */
.wa-card{ padding:10px 16px 14px; overflow:visible; }   /* compatta; overflow visibile: l'etichetta «ieri» sporge dal bordo */
.wa-head{ width:100%; min-height:44px; padding:0 0 6px; margin-bottom:8px; text-align:left; color:inherit; cursor:pointer; transition:opacity .15s; }
.wa-head:active{ opacity:.7; }
.wa-head .h2{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.wa-fields{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
.wa-fields .field{ margin-bottom:0; min-width:0; }
.wa-fields .field label{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wa-fields .input{ min-width:0; }
.wa-form input[type="time"]{ padding:0 12px; text-align:left; color-scheme:dark; }   /* con AM/PM (browser in inglese) deve starci tutto */
html[data-theme="light"] .wa-form input[type="time"]{ color-scheme:light; }
.wa-err{ margin-top:10px; padding:10px 12px; border-radius:12px; background:var(--red-soft); color:var(--red); font-size:13.5px; font-weight:800; line-height:1.35; overflow-wrap:anywhere; }
.wa-err[hidden]{ display:none; }
.wa-actions{ display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px; margin-top:12px; }
.wa-actions .btn{ height:auto; min-height:52px; padding:10px 14px; line-height:1.15; text-align:center; white-space:normal; }

.wa-done{ display:flex; align-items:center; gap:13px; }
.wa-ok{ width:46px; height:46px; flex:none; border-radius:15px; display:grid; place-items:center; background:rgba(47,208,122,.14); color:var(--ok); }
.wa-ok.off{ background:var(--surface-3); color:var(--txt-3); }
.wa-ok .ic{ width:24px; height:24px; }
.wa-done-t{ flex:1; min-width:0; font-size:17px; font-weight:800; line-height:1.3; overflow-wrap:anywhere; }
.wa-done-t b{ font-size:19px; font-weight:900; }
.wa-links{ display:grid; grid-template-columns:repeat(auto-fit,minmax(128px,1fr)); gap:10px; margin-top:14px; }
.wa-card .btn.sm, .wa-week .btn.sm{ height:auto; min-height:44px; padding:8px 14px; line-height:1.15; text-align:center; white-space:normal; }

/* ieri non segnato: etichetta piccola in alto a destra, a cavallo del bordo della card (area di tocco 44 px, pillola 26 px) */
.wa-card.has-yd{ margin-top:30px; }
.wa-yd{ position:absolute; top:-22px; right:8px; z-index:2; }
.wa-yd-t{ display:flex; align-items:center; justify-content:flex-end; min-height:44px; padding:0 4px; background:none; border:0; color:var(--txt-2); cursor:pointer; font:inherit; }
.wa-yd-pill{ display:inline-flex; align-items:center; gap:5px; height:26px; padding:0 11px 0 8px; border-radius:99px; background:var(--surface-2); border:1px solid rgba(255,176,32,.5); font-size:11.5px; font-weight:800; line-height:1; color:var(--txt); white-space:nowrap; box-shadow:0 2px 8px rgba(0,0,0,.35); }
.wa-yd-pill .ic{ width:14px; height:14px; flex:none; color:var(--warn); }
.wa-yd-t:active .wa-yd-pill{ transform:scale(.96); }
.wa-yd-h{ margin:-2px 0 12px; line-height:1.4; }   /* «un giorno saltato non entra nella media»: ora sta nel foglio di ieri */

/* modulo compatto SOLO nella card (Alex, 7/10/2026): titolo, poi su una riga peso · ora · ✓ · «Salta oggi» */
.wa-card .wa-form{ display:grid; grid-template-columns:minmax(0,1fr) 48px minmax(64px,84px); gap:8px; align-items:end; }
.wa-card .wa-fields{ grid-column:1; grid-row:1; gap:8px; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); }   /* il peso ha bisogno di poco, l ora di più */
.wa-card .wa-form input[type="time"]{ padding:0 8px; }
.wa-card .wa-fields .field label{ font-size:10px; letter-spacing:.2px; }   /* «Peso (kg)» deve starci intero nella colonna stretta */
.wa-card .wa-err{ grid-column:1 / -1; grid-row:2; margin-top:0; }
.wa-card .wa-actions{ display:contents; }
.wa-card .wa-actions .btn{ margin:0; height:52px; min-height:52px; padding:0 8px; font-size:13px; transition-property:background, color, border-color, box-shadow, transform, opacity; }   /* la misura (altezza) non si anima */
.wa-card .wa-actions .btn:not(.ghost){ grid-column:2; grid-row:1; padding:0; }
.wa-card .wa-actions .btn:not(.ghost) span{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }   /* «Salva»: a schermo solo la spunta, il testo resta per i lettori di schermo */
.wa-card .wa-actions .btn.ghost{ grid-column:3; grid-row:1; }
@media (max-width:350px){ .wa-card .wa-form{ grid-template-columns:minmax(0,1fr) 50px; } .wa-card .wa-actions .btn.ghost{ grid-column:1 / -1; grid-row:3; } }

/* ---------- riga in Progressi ---------- */
.wa-link{ margin-bottom:14px; }

/* ---------- schermata «Il mio peso» ---------- */
.wa-hero{ display:flex; align-items:center; gap:14px; padding:10px 2px 10px; }
.wa-hero-ic{ width:54px; height:54px; flex:none; border-radius:18px; display:grid; place-items:center; background:var(--red-soft); color:var(--red); }
.wa-hero-ic .ic{ width:28px; height:28px; }
.wa-hero-tx{ min-width:0; }
.wa-hero-p{ font-size:22px; font-weight:900; letter-spacing:-.5px; line-height:1.1; overflow-wrap:anywhere; }
.wa-hero-w{ margin-top:5px; font-size:15px; font-weight:900; color:var(--red); }
.wa-hero-r{ margin-top:2px; font-size:12.5px; font-weight:700; color:var(--txt-3); }
.wa-intro{ margin:2px 2px 16px; font-size:14px; line-height:1.5; font-weight:600; color:var(--txt-2); }
.wa-note{ display:flex; align-items:center; gap:11px; margin:-2px 0 14px; padding:12px 14px; border-radius:14px; background:var(--red-soft); color:var(--txt); font-size:14px; font-weight:800; line-height:1.4; }
.wa-note .ic{ width:20px; height:20px; flex:none; color:var(--red); }

/* settimana = tendina (accordion) */
.wa-week{ background:var(--surface); border:1px solid var(--line); border-radius:var(--r-m); margin-bottom:10px; overflow:hidden; box-shadow:var(--shadow); }
.wa-week.wa-cur{ border-color:var(--red-glow); scroll-margin-top:calc(var(--safe-t) + var(--vv-pad, 0px) + 76px); }   /* sotto la barra in alto quando la porto in vista */
.wa-wh{ width:100%; min-height:64px; display:flex; align-items:center; gap:12px; padding:12px 14px; text-align:left; color:var(--txt); transition:background .15s; }
button.wa-wh:active{ background:var(--surface-2); }
.wa-wl{ flex:1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.wa-wn{ font-size:16.5px; font-weight:900; letter-spacing:-.2px; }
.wa-wm{ display:flex; flex-wrap:wrap; align-items:center; gap:5px 8px; font-size:12.5px; font-weight:700; color:var(--txt-3); }
.wa-chip{ display:inline-flex; align-items:center; min-height:22px; padding:2px 9px; border-radius:8px; font-size:12px; font-weight:800; line-height:1.25; background:var(--surface-3); color:var(--txt-2); }
.wa-chip.now{ background:var(--red-soft); color:var(--red); }
.wa-chip.done{ background:rgba(47,208,122,.14); color:var(--ok); }
.wa-wr{ flex:none; display:flex; align-items:center; gap:10px; }
.wa-avg{ text-align:right; font-size:11.5px; font-weight:800; color:var(--txt-3); line-height:1.2; }
.wa-avg b{ display:block; margin-top:1px; font-size:16px; font-weight:900; color:var(--txt); white-space:nowrap; }
.wa-avg small{ display:block; margin-top:1px; font-size:11.5px; font-weight:700; color:var(--txt-3); white-space:nowrap; }
.wa-chev{ width:20px; height:20px; color:var(--txt-3); transition:transform .24s ease; }
.wa-week.on > .wa-wh .wa-chev{ transform:rotate(180deg); }
.wa-lk{ width:20px; height:20px; color:var(--txt-3); }
.wa-locked .wa-wl{ opacity:.8; }
.wa-count{ min-width:24px; height:24px; padding:0 7px; border-radius:8px; display:grid; place-items:center; background:var(--surface-3); color:var(--txt-2); font-size:13px; font-weight:900; }

/* corpo: si apre scorrendo (grid 0fr → 1fr); chiuso non è raggiungibile con la tastiera */
.wa-wb{ display:grid; grid-template-rows:0fr; visibility:hidden; transition:grid-template-rows .26s ease, visibility 0s linear .26s; }
.wa-week.on > .wa-wb{ grid-template-rows:1fr; visibility:visible; transition:grid-template-rows .26s ease, visibility 0s; }
.wa-wbi{ min-height:0; overflow:hidden; }

/* giorni */
.wa-days{ padding:0 14px; }
.wa-day{ display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; column-gap:10px; min-height:54px; padding:7px 0; border-top:1px solid var(--line-soft); }
.wa-dl{ min-width:0; display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 7px; }
.wa-dl b{ font-size:15px; font-weight:900; }
.wa-dl span{ font-size:13px; font-weight:700; color:var(--txt-3); }
.wa-dl em{ font-style:normal; padding:1px 7px; border-radius:6px; background:var(--red-soft); color:var(--red); font-size:11px; font-weight:900; letter-spacing:.4px; text-transform:uppercase; }
.wa-dv{ min-width:0; display:flex; flex-direction:column; align-items:flex-end; text-align:right; font-size:15px; font-weight:800; }
.wa-dv b{ font-size:16px; font-weight:900; white-space:nowrap; }
.wa-dv i{ font-style:normal; font-size:12px; font-weight:700; color:var(--txt-3); }
.wa-mute{ color:var(--txt-3); font-size:13.5px; font-weight:700; }
.wa-dash{ color:var(--txt-3); font-weight:800; }
.wa-dash.dim{ opacity:.45; }
.wa-out{ font-style:italic; }
.wa-s-outside{ opacity:.6; }
.wa-ib{ width:44px; height:44px; border-radius:13px; display:grid; place-items:center; background:var(--surface-2); color:var(--txt-2); transition:transform .15s; }
.wa-ib:active{ transform:scale(.9); }
.wa-ib .ic{ width:18px; height:18px; }
.wa-day-acts{ grid-column:1 / -1; display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:8px; margin:6px 0 4px; }

/* piede della settimana: media o cosa aspettarsi */
.wa-foot{ margin:6px 14px 14px; padding:11px 13px; border-radius:12px; background:var(--surface-2); font-size:13.5px; font-weight:700; line-height:1.45; color:var(--txt-2); }
.wa-foot b{ font-weight:900; color:var(--txt); }
.wa-foot.wa-mute{ color:var(--txt-3); }

/* programmi precedenti */
.wa-prevs{ padding:2px 12px 4px; }
.wa-prevs .wa-week{ background:var(--bg-2); box-shadow:none; }
.wa-pt{ display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 10px; padding:10px 4px 8px; }
.wa-pt b{ font-size:15px; font-weight:900; overflow-wrap:anywhere; }
.wa-pt span{ font-size:12.5px; font-weight:700; color:var(--txt-3); }
.wa-hist-t{ margin:20px 2px 10px; font-size:12.5px; font-weight:800; color:var(--txt-3); text-transform:uppercase; letter-spacing:.7px; }

/* funzione spenta dal coach */
.wa-off{ margin-top:6px; }
.wa-off .empty{ padding:30px 14px; }
.wa-off .empty b{ margin-bottom:8px; }

/* foglio per oggi/ieri */
.wa-sheet-d{ margin:-8px 0 14px; font-weight:800; }

/* in attesa dei dati dal server: scheletro con lo stesso ingombro (niente salti quando arrivano) */
.wa-skel{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:12px; }
.wa-skel.l{ margin-top:0; }
.wa-skel i, .wa-skbar{ display:block; height:54px; border-radius:15px; background:linear-gradient(90deg, var(--surface-2) 0%, var(--surface-3) 50%, var(--surface-2) 100%); background-size:220% 100%; animation:waShimmer 1.5s ease-in-out infinite; }
.wa-skel.l i{ height:14px; width:62%; border-radius:6px; }
.wa-skel.b i{ height:52px; border-radius:16px; }
.wa-card .wa-skel.b{ display:none; }   /* la card compatta non ha la riga dei bottoni */
.wa-skbar{ height:64px; border-radius:var(--r-m); margin-bottom:10px; }
.wa-skbar.t{ height:54px; width:72%; margin:10px 0 18px; }
@keyframes waShimmer{ 0%{ background-position:100% 0; } 100%{ background-position:-100% 0; } }
