/* Stili specifici del prodotto. Usare SEMPRE le variabili della palette (var(--pri), var(--panel), var(--tx),
   var(--mut), var(--line), var(--ok), var(--warn), var(--crit)...) così funzionano in tutte le palette e temi. */

/* CabinaFlow */
.appt{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border-radius:10px;margin-bottom:8px;background:var(--panel2);border-left:4px solid var(--info)}
.appt.eseguito{border-left-color:var(--ok)}.appt.annullato{border-left-color:var(--line);opacity:.65}.appt.non.venuto,.appt[class*="non"]{border-left-color:var(--crit)}
.appt .at{min-width:46px;text-align:center}.appt .at b{display:block;font-size:15px}.appt .at small{color:var(--mut)}
.dstrip{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:14px}
.dbtn{display:flex;flex-direction:column;align-items:center;padding:6px 2px;border:1px solid var(--line);border-radius:10px;background:var(--panel);text-decoration:none;color:var(--tx);min-height:56px}
.dbtn small{color:var(--mut);text-transform:uppercase;font-size:11px}.dbtn b{font-size:16px}.dbtn span{font-size:11px;color:var(--pri);min-height:14px}
.dbtn.today{border-color:var(--pri)}.dbtn.on{background:var(--pri);color:var(--pri-tx)}.dbtn.on small,.dbtn.on span{color:var(--pri-tx)}
.prog{height:6px;background:var(--panel);border:1px solid var(--line);border-radius:99px;overflow:hidden;margin:6px 0 4px;max-width:260px}.prog i{display:block;height:100%;background:var(--pri)}
.fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}.fgrid figure{margin:0}
.fgrid img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px;display:block}.fbtn{padding:0;border:0;background:none;cursor:pointer;width:100%}
.fgrid figcaption{font-size:12px;margin-top:4px}
.btn[disabled]{opacity:.5;cursor:not-allowed}
#lock{position:fixed;inset:0;z-index:200;background:var(--side-bg);display:flex;align-items:center;justify-content:center;padding:20px}
.lockbox{background:var(--panel);color:var(--tx);border-radius:16px;padding:24px;width:min(340px,100%);text-align:center;box-shadow:var(--sh)}
.lockbox input{width:100%;text-align:center;font-size:24px;letter-spacing:.3em}
@media(max-width:900px){.appt{flex-wrap:wrap}.dstrip{gap:4px}}