/* SamueleFitnessCoach — stili per guide tecniche, video, semaforo, sfide, motivazione */

/* ---------- Comuni ---------- */
.sfc-chips{display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;padding:2px 0 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.sfc-chips::-webkit-scrollbar{display:none}
.sfc-chips button{flex:0 0 auto;padding:7px 13px;border-radius:999px;border:1px solid var(--line-strong);background:rgba(255,255,255,.03);color:var(--dim);font:600 13px var(--font-ui);cursor:pointer;transition:all .18s}
.sfc-chips button[aria-pressed="true"]{background:var(--orange-dim);border-color:var(--orange);color:var(--text)}
.sfc-chips button:hover{color:var(--text)}
.sfc-hidden{display:none !important}

/* ---------- Guide tecniche ---------- */
.sfc-tg-bar{display:flex;flex-direction:column;gap:10px;margin-bottom:6px}
.sfc-tg-bar input{width:100%}
.sfc-tg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px}
.sfc-tg-card{position:relative;display:flex;flex-direction:column;gap:6px;padding:16px;border-radius:16px;border:1px solid var(--line);
  background:linear-gradient(160deg,rgba(255,122,26,.08),rgba(255,255,255,0) 45%),var(--panel);transition:border-color .2s,transform .2s,box-shadow .2s}
.sfc-tg-card:hover{border-color:rgba(255,106,0,.6);transform:translateY(-2px);box-shadow:0 14px 30px -18px rgba(255,106,0,.45)}
.sfc-tg-card h3{font-family:var(--font-display);font-variation-settings:"wdth" 110;font-size:18px;line-height:1.15;margin:2px 0}
.sfc-tg-card .sfc-hint{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sfc-tg-top{display:flex;justify-content:space-between;align-items:center}
.sfc-tg-cat{font:700 11px var(--font-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--orange)}
.sfc-tg-vid svg{width:20px;height:20px;color:var(--orange)}
.sfc-tg-acts{display:flex;gap:8px;margin-top:auto;padding-top:8px}
.sfc-tg-acts button{flex:1}
.sfc-guide .sfc-media{margin-bottom:14px}
.sfc-gs{padding:14px 0;border-top:1px solid var(--line)}
.sfc-gs:first-of-type{border-top:0}
.sfc-gs h4{font:700 13px var(--font-ui);letter-spacing:.05em;text-transform:uppercase;margin-bottom:8px;color:var(--text)}
.sfc-gs p{margin-bottom:8px;line-height:1.6}
.sfc-gl{margin:0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.sfc-gl li{position:relative;padding-left:22px;line-height:1.5}
.sfc-gl li::before{content:"";position:absolute;left:4px;top:.62em;width:7px;height:7px;border-radius:50%;background:var(--dim)}
.sfc-gs-ok .sfc-gl li::before{background:var(--ok,#3ddc84)}
.sfc-gs-bad .sfc-gl li::before{background:var(--red)}
.sfc-mrow{display:flex;gap:10px;align-items:flex-start;margin-bottom:8px}
.sfc-mrow small{flex:0 0 96px;color:var(--dim);font-size:12px;padding-top:4px}
.sfc-mchip{display:inline-block;margin:0 6px 6px 0;padding:4px 10px;border-radius:999px;font-size:12.5px;border:1px solid var(--line-strong)}
.sfc-mchip.p{background:rgba(255,106,0,.16);border-color:rgba(255,106,0,.5)}
.sfc-mchip.s{background:rgba(255,255,255,.05)}
.sfc-mchip.st{color:var(--dim)}
.sfc-checklist{display:flex;flex-direction:column;gap:6px;max-height:280px;overflow:auto;padding:4px}
.sfc-check{display:flex;gap:10px;align-items:center;padding:9px 10px;border-radius:10px;border:1px solid var(--line);cursor:pointer}
.sfc-check input{width:18px;height:18px;accent-color:var(--orange);flex:0 0 auto}
.sfc-check:has(input:disabled){opacity:.5;cursor:not-allowed}

/* ---------- Video ---------- */
.sfc-vpick{display:flex;flex-direction:column;gap:10px}
.sfc-vdrop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:22px 14px;border:1.5px dashed rgba(255,106,0,.55);border-radius:14px;
  background:rgba(255,106,0,.05);cursor:pointer;text-align:center;transition:background .2s}
.sfc-vdrop:hover{background:rgba(255,106,0,.1)}
.sfc-vdrop-ico{font-size:28px;line-height:1}
.sfc-vdrop-txt{font-weight:700}
.sfc-vprev video,.sfc-vbox video{width:100%;max-height:420px;border-radius:12px;background:#000;display:block}
.sfc-vprev{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.sfc-vprog{display:flex;flex-direction:column;gap:6px}
.sfc-vprog .sfc-meter{height:8px}
.sfc-vprog .sfc-meter i{transition:width .3s}
.sfc-vload{display:flex;align-items:center;justify-content:center;min-height:140px;border-radius:12px;background:rgba(0,0,0,.4);color:var(--dim);font-size:14px}
.sfc-vcard{padding:14px;border-radius:14px;border:1px solid var(--line);margin-bottom:12px;background:rgba(255,255,255,.02)}
.sfc-vcard.new{border-color:rgba(255,106,0,.65);box-shadow:0 0 0 1px rgba(255,106,0,.1)}
.sfc-fb{margin-top:10px;padding:12px 14px;border-radius:12px;background:linear-gradient(135deg,rgba(255,122,26,.14),rgba(255,45,85,.08));border:1px solid rgba(255,106,0,.35)}
.sfc-fb small{display:block;font-weight:700;color:var(--orange);text-transform:uppercase;letter-spacing:.05em;font-size:11px;margin-bottom:4px}

/* ---------- Semaforo clienti ---------- */
#sfc-light-bar{margin-bottom:6px}
.client-card[data-id]{position:relative;padding-left:30px}
.sfc-light{position:absolute;left:12px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:#555}
.client-card[data-light="red"] .sfc-light{background:#ff3b4e;box-shadow:0 0 0 4px rgba(255,59,78,.16),0 0 12px rgba(255,59,78,.7);animation:sfcPulse 1.8s ease-in-out infinite}
.client-card[data-light="yel"] .sfc-light{background:#ffc233;box-shadow:0 0 0 4px rgba(255,194,51,.14)}
.client-card[data-light="ok"] .sfc-light{background:#3ddc84;box-shadow:0 0 0 4px rgba(61,220,132,.12)}
.client-card[data-light="red"]{border-color:rgba(255,59,78,.4)}
.sfc-why{font-size:12px;margin-top:4px;color:var(--dim)}
.client-card[data-light="red"] .sfc-why{color:#ff7b88}
.client-card[data-light="yel"] .sfc-why{color:#ffd36b}
@keyframes sfcPulse{50%{box-shadow:0 0 0 7px rgba(255,59,78,.05),0 0 16px rgba(255,59,78,.9)}}
@media (prefers-reduced-motion:reduce){.client-card[data-light="red"] .sfc-light{animation:none}}

/* ---------- Motivazione (app cliente) ---------- */
.sfc-hero{position:relative;overflow:hidden;border-radius:20px;padding:18px;margin-bottom:16px;border:1px solid rgba(255,106,0,.35);
  background:radial-gradient(120% 90% at 100% 0%,rgba(255,45,85,.22),transparent 55%),radial-gradient(90% 80% at 0% 0%,rgba(255,122,26,.25),transparent 60%),var(--panel)}
.sfc-hero-top{display:flex;align-items:center;gap:14px}
.sfc-flame{font-size:40px;line-height:1;filter:drop-shadow(0 4px 14px rgba(255,106,0,.6))}
.sfc-flame.off{filter:grayscale(1) opacity(.5)}
.sfc-streak b{display:block;font-family:var(--font-display);font-variation-settings:"wdth" 120;font-weight:900;font-size:30px;line-height:1}
.sfc-streak span{color:var(--dim);font-size:13px}
.sfc-week{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin:16px 0 4px}
.sfc-week div{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:11px;color:var(--dim)}
.sfc-week i{width:100%;max-width:34px;aspect-ratio:1;border-radius:10px;border:1px solid var(--line-strong);background:rgba(255,255,255,.03);display:flex;align-items:center;justify-content:center;font-style:normal;font-size:14px}
.sfc-week i.on{background:var(--gradient);border-color:transparent;box-shadow:0 6px 16px -6px rgba(255,74,61,.8)}
.sfc-week i.today{outline:2px solid rgba(255,255,255,.35);outline-offset:2px}
.sfc-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.sfc-stats div{padding:10px;border-radius:12px;background:rgba(0,0,0,.25);text-align:center}
.sfc-stats b{display:block;font-size:18px;font-variant-numeric:tabular-nums}
.sfc-stats small{color:var(--dim);font-size:11px}
.sfc-hero-acts{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.sfc-hero-acts button{flex:1 1 auto}
.sfc-badges{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:10px}
.sfc-bdg{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border-radius:14px;border:1px solid var(--line);text-align:center;font-size:12px;line-height:1.25}
.sfc-bdg span{font-size:28px;line-height:1}
.sfc-bdg.lock{opacity:.38;filter:grayscale(1)}
.sfc-bdg.got{border-color:rgba(255,106,0,.5);background:rgba(255,106,0,.08)}
.sfc-bdg small{color:var(--dim);font-size:10.5px}
.sfc-ref{padding:16px;border-radius:16px;border:1px dashed rgba(255,106,0,.55);background:rgba(255,106,0,.05)}
.sfc-ref code{display:block;margin:10px 0;padding:10px;border-radius:10px;background:rgba(0,0,0,.35);font-size:12.5px;word-break:break-all;color:var(--text)}
.sfc-gbtn{margin-left:6px;padding:4px 9px !important;border-radius:999px !important;font-size:11.5px !important;font-weight:700 !important;background:var(--orange-dim) !important;color:var(--orange) !important;border:1px solid rgba(255,106,0,.45) !important}
.sfc-newdot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--red);margin-left:6px;vertical-align:middle;box-shadow:0 0 8px var(--red)}

/* ---------- Navigazione più comoda ---------- */
.tabs,nav.tabs,.tab-bar{scrollbar-width:none}
.tab-btn{white-space:nowrap}
:focus-visible{outline:2px solid var(--orange) !important;outline-offset:2px}
@media (max-width:640px){
  .sfc-tg-grid{grid-template-columns:1fr 1fr;gap:10px}
  .sfc-tg-card{padding:13px}
  .sfc-tg-card h3{font-size:16px}
  .sfc-tg-acts{flex-direction:column}
  .sfc-mrow{flex-direction:column;gap:4px}
  .sfc-mrow small{flex:none}
}
@media (max-width:380px){.sfc-tg-grid{grid-template-columns:1fr}}
nav.tabs{scroll-snap-type:x proximity;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 28px),transparent)}
nav.tabs button{scroll-snap-align:center}
.sfc-sec-t{font:700 12px var(--font-ui);letter-spacing:.06em;text-transform:uppercase;color:var(--dim);margin:18px 0 10px}

/* ---------- Accademia: lezioni ---------- */
.sfc-tg-card.lesson{background:linear-gradient(160deg,rgba(77,163,255,.09),rgba(255,255,255,0) 45%),var(--panel)}
.sfc-tg-card.lesson .sfc-tg-cat{color:#7db8ff}
.sfc-tg-card .sfc-hint{-webkit-line-clamp:3}
.sfc-lesson{line-height:1.65}
.sfc-lesson p{margin-bottom:10px}
.sfc-lsum{font-size:16px;color:var(--text);opacity:.9;margin:6px 0 14px !important;padding-left:12px;border-left:3px solid var(--orange)}
.sfc-lh{font-family:var(--font-display);font-variation-settings:"wdth" 108;font-size:17px;margin:20px 0 8px;letter-spacing:.01em}
.sfc-lesson .sfc-gl{margin-bottom:12px}
.sfc-ol{margin:0 0 12px 20px;display:flex;flex-direction:column;gap:6px}
.sfc-key{margin:14px 0;padding:12px 14px;border-radius:12px;background:rgba(255,194,51,.08);border:1px solid rgba(255,194,51,.35);font-weight:600}
.sfc-take{margin-top:18px;padding:14px 16px;border-radius:14px;background:rgba(61,220,132,.07);border:1px solid rgba(61,220,132,.3)}
.sfc-take h4{font:700 13px var(--font-ui);letter-spacing:.05em;text-transform:uppercase;margin-bottom:8px}
.sfc-take .sfc-gl li::before{background:var(--ok,#3ddc84)}
.sfc-refs{margin-top:14px;font-size:13px;color:var(--dim)}
.sfc-refs summary{cursor:pointer;font-weight:600;color:var(--text);padding:6px 0}
.sfc-refs .sfc-gl{margin-top:8px}
.sfc-med{margin:10px 0 12px;font-size:12.5px}

/* ---------- Installazione, notifiche, benvenuto, aiuto (app cliente) ---------- */
#install-btn,#install-btn-auth,#ios-install-hint,#ios-install-hint-auth{display:none !important}
.sfc-inst{margin:14px 0}
#app-screen main > .sfc-inst:first-child{margin-top:0}
.sfc-inst-card,.sfc-push-card{position:relative;padding:16px;border-radius:18px;border:1px solid rgba(255,106,0,.45);
  background:radial-gradient(120% 100% at 100% 0%,rgba(255,45,85,.14),transparent 55%),linear-gradient(160deg,rgba(255,122,26,.12),rgba(255,255,255,.02));text-align:left}
.sfc-push-card{margin-bottom:14px}
.sfc-push-card.warn{border-color:rgba(255,194,51,.5);background:rgba(255,194,51,.06)}
.sfc-push-card p,.sfc-inst-head p{color:var(--dim);font-size:13.5px;line-height:1.45;margin-top:4px}
.sfc-push-card strong,.sfc-inst-head strong{font-size:16px}
.sfc-inst-head{display:flex;gap:12px;align-items:center;margin-bottom:12px;padding-right:56px}
.sfc-inst-head img{border-radius:12px;flex:0 0 auto;box-shadow:0 6px 16px -8px rgba(255,106,0,.8)}
.sfc-steps{counter-reset:st;list-style:none;margin:6px 0 4px;padding:0;display:flex;flex-direction:column;gap:8px}
.sfc-steps li{counter-increment:st;position:relative;padding:10px 12px 10px 44px;border-radius:12px;background:rgba(0,0,0,.28);font-size:14px;line-height:1.45}
.sfc-steps li::before{content:counter(st);position:absolute;left:10px;top:9px;width:24px;height:24px;border-radius:50%;background:var(--gradient);color:#111;font-weight:800;font-size:13px;display:flex;align-items:center;justify-content:center}
.sfc-ic{width:20px;height:20px;vertical-align:-5px;color:#4da3ff}
.sfc-big{width:100%;padding:15px 18px !important;font-size:16px !important;margin-top:10px}
.sfc-wide{width:100%;margin-top:10px}
.sfc-inst-x{position:absolute;top:12px;right:12px;background:none !important;border:0 !important;color:var(--dim) !important;font-size:12.5px !important;padding:4px 6px !important;cursor:pointer}
.sfc-why-list{list-style:none;margin:10px 0 2px;padding:0;display:grid;gap:6px;font-size:14px}
.sfc-wel{text-align:center;padding:10px 4px 4px}
.sfc-wel-ico{font-size:56px;line-height:1;margin:6px 0 12px}
.sfc-wel h2{font-family:var(--font-display);font-variation-settings:"wdth" 112;font-size:24px;margin-bottom:10px}
.sfc-wel p{color:var(--dim);font-size:15px;line-height:1.55;max-width:360px;margin:0 auto}
.sfc-wel p b{color:var(--text)}
.sfc-dots{display:flex;gap:6px;justify-content:center;margin:18px 0}
.sfc-dots span{width:8px;height:8px;border-radius:50%;background:var(--line-strong);transition:all .2s}
.sfc-dots span.on{width:22px;border-radius:4px;background:var(--orange)}
.sfc-wel-acts{display:flex;gap:10px;justify-content:center}
.sfc-wel-acts .btn-primary{min-width:150px}
.sfc-help-sec{padding:14px 0;border-top:1px solid var(--line)}
.sfc-help-sec:first-child{border-top:0;padding-top:0}
.sfc-help-sec p{color:var(--dim);font-size:13.5px;margin:4px 0 10px}
.sfc-help-sec.sfc-inst{margin:0}
.sfc-auth-help{text-align:center;margin-top:12px;font-size:13px}
.sfc-auth-help a{color:#ff8a3d;text-decoration:underline;text-underline-offset:3px}
dialog#sfc-welcome{max-width:440px}
@media (max-width:420px){ #sfc-help-btn .sfc-lbl{display:none} }

/* ---------- Navigazione rapida e "Oggi" (app cliente) ---------- */
#sfc-qnav{position:sticky;top:var(--sfc-head,0px);z-index:30;display:flex;gap:6px;overflow-x:auto;padding:8px 14px;scrollbar-width:none;
  background:rgba(10,9,8,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
#sfc-qnav::-webkit-scrollbar{display:none}
#sfc-qnav button{position:relative;flex:0 0 auto;display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;border:1px solid var(--line-strong);background:rgba(255,255,255,.04);color:var(--text);font:600 13px var(--font-ui);cursor:pointer}
#sfc-qnav button:active{transform:scale(.96)}
#sfc-qnav i{font-style:normal;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--red);color:#fff;font-size:11px;display:inline-flex;align-items:center;justify-content:center}
.sfc-today{border-radius:20px;padding:14px 16px;margin-bottom:14px;border:1px solid var(--line-strong);background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.01)),var(--panel)}
.sfc-today-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.sfc-today-h strong{font-family:var(--font-display);font-variation-settings:"wdth" 118;font-size:22px;text-transform:uppercase;letter-spacing:.02em}
.sfc-today-h span{color:var(--dim);font-size:13px;text-transform:capitalize}
.sfc-today-r{display:flex;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--line)}
.sfc-today-r:first-of-type{border-top:0}
.sfc-today-r .ico{font-size:20px;width:26px;text-align:center;flex:0 0 auto}
.sfc-today-r .txt{flex:1;font-size:14.5px;line-height:1.4}
.sfc-today-r button{flex:0 0 auto}
.sfc-quick{margin:6px 0 2px}
.sfc-quick button{font-size:12.5px !important;padding:6px 11px !important}
.sfc-moved{position:relative;z-index:60;margin:0;padding:16px 18px;text-align:center;background:linear-gradient(135deg,#ff7a1a,#ff2d55);color:#fff}
.sfc-moved p{margin:6px auto 12px;max-width:520px;font-size:14px;line-height:1.45;color:#fff}
.sfc-moved .sfc-hint{color:rgba(255,255,255,.85)}
.sfc-moved .btn-primary{display:inline-block;background:#111 !important;color:#fff !important;padding:12px 20px;border-radius:999px;text-decoration:none;font-weight:700}
