/* Gestionale — stili del modulo «abbonamenti». */

/* Il verdetto sta in testa alla linguetta: la domanda vera è una sola, e si legge in un colpo. */
.verdetto{display:flex;align-items:baseline;gap:12px;padding:12px 14px;border-radius:12px;
 border:1px solid var(--line);background:var(--panel2);margin-bottom:4px}
.verdetto b{font-size:22px;line-height:1}
.verdetto span{font-size:13px;color:var(--muted)}
.verdetto.si{border-color:rgba(47,128,85,.5);background:linear-gradient(145deg,rgba(47,128,85,.14),var(--panel2))}
.verdetto.si b{color:#9fe8c0}
.verdetto.no{border-color:rgba(215,101,94,.5);background:linear-gradient(145deg,rgba(215,101,94,.12),var(--panel2))}
.verdetto.no b{color:#ffb7b2}

.profile-section.corrente{border-color:rgba(239,211,165,.4)}
.storico{margin-top:8px}
.storico summary{cursor:pointer;font-size:var(--fs-xs);color:var(--muted);padding:4px 0;min-height:var(--h-piccolo)}
.storico-riga{font-size:var(--fs-xs);padding:4px 0 4px 12px;border-left:2px solid var(--line)}

@media(max-width:820px){
 .verdetto{flex-direction:column;gap:4px;align-items:flex-start}
 .verdetto b{font-size:24px}
 .verdetto span{font-size:14px}
 .storico summary{min-height:44px;font-size:14px}
 .storico-riga{font-size:13.5px;padding:7px 0 7px 12px}
}

/* --- fase 2: prenotazioni, lista d'attesa, orario settimanale --- */
.ab-sub{margin:14px 0 6px;font-size:var(--fs-xs);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ab-azioni{flex-wrap:wrap;gap:8px}
.ab-riga{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.ab-riga:last-child{border-bottom:0}
.ab-riga>span:first-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.ab-riga small{color:var(--muted);font-size:var(--fs-xs)}
.ab-riga[role=button]{cursor:pointer}
.ab-riga[role=button]:focus-visible{outline:2px solid var(--sand);outline-offset:2px}
.ab-serie{color:var(--sand)}
.ab-posizione{background:var(--panel2);color:var(--sand);font-weight:800}
.ab-nota{font-size:var(--fs-xs);margin:0 0 6px}
.ab-docs{display:flex;flex-direction:column;gap:6px;margin:8px 0}
.ab-doc{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.ab-conteggi{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 10px}
.ab-esiti{max-height:52vh;overflow:auto;padding-right:4px}
.ab-orario-testa{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px;margin:6px 0 10px}
.ab-orario-righe{display:flex;flex-direction:column;gap:8px;max-height:52vh;overflow:auto}
.ab-orario-riga{display:grid;grid-template-columns:repeat(7,minmax(0,1fr)) 40px;gap:8px;align-items:end;padding:8px;border:1px solid var(--line);border-radius:10px;background:var(--panel2)}
.ab-orario-riga [hidden]{display:none}
.ab-orario-riga .editor-remove{width:44px;justify-self:end}
/* PT individuale in agenda: un terzo colore, distinto da sala e corsi */
.calendar-slot.pt{border-left-color:var(--info, #6aa7d8)}
.agenda-legend i.pt{background:var(--info, #6aa7d8)}

@media(max-width:820px){
 .ab-riga{padding:12px 0;min-height:48px}
 .ab-riga small{font-size:13.5px}
 .ab-azioni button{flex:1 1 140px;min-height:46px}
 .ab-doc .inline-actions button{min-height:44px}
 .ab-orario-riga{grid-template-columns:1fr 1fr;padding:10px}
 .ab-orario-riga .editor-remove{grid-column:2;justify-self:end;min-height:44px;min-width:44px}
 .ab-orario-testa{flex-direction:column;align-items:stretch}
}

/* --- fase 3: catalogo --- */
.ab-catalogo{display:flex;flex-direction:column;gap:12px}
.ab-cat{padding:0}
.ab-cat>summary{list-style:none;cursor:pointer;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px}
.ab-cat>summary::-webkit-details-marker{display:none}
.ab-cat>summary::after{content:"▾";color:var(--muted);transition:transform .15s}
.ab-cat:not([open])>summary::after{transform:rotate(-90deg)}
.ab-cat>summary span{display:flex;flex-direction:column;gap:2px}
.ab-cat>summary b{font-size:16px}
.ab-cat>summary small{color:var(--muted);font-size:var(--fs-xs)}
.ab-cat-righe,.ab-regole .form-grid{padding:0 16px 12px}
.ab-regole .modal-actions{padding:0 16px 16px}
.ab-prodotto{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1fr) minmax(0,.8fr) auto;gap:12px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.ab-prodotto.spento{opacity:.85}
.ab-prodotto small{display:block;color:var(--muted);font-size:var(--fs-xs);margin-top:2px}
.ab-prodotto-prezzo b{font-size:15px}
.ab-prodotto-azioni{justify-content:flex-end;flex-wrap:wrap;gap:6px}
.ab-freccia{min-width:36px;padding:0 8px;font-size:15px}
.ab-spenti>summary{cursor:pointer;color:var(--muted);font-size:13px;padding:10px 0;min-height:var(--h-tocco)}
@media(max-width:820px){
 .ab-prodotto{grid-template-columns:1fr auto;gap:6px 10px;padding:12px 0}
 .ab-prodotto-nome{grid-column:1/-1}
 .ab-prodotto-azioni{grid-column:1/-1;justify-content:stretch;flex-wrap:nowrap}
 .ab-prodotto-azioni button{flex:1 1 0;min-width:0;min-height:44px;padding:0 6px}
 .ab-freccia{flex:0 0 44px!important}
 .ab-cat>summary{min-height:56px}
}

/* --- modali corte: campi nascosti quando non servono; regole in Sistema --- */
#dynamicFields .field[hidden]{display:none!important}
.ab-regole-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px 12px;margin-bottom:8px}
.ab-regole-grid .ab-regola-larga{grid-column:span 2}
.ab-regole-titolo{margin:4px 0 2px;font-size:var(--fs-s);font-weight:650;color:#d3dad0}
/* spunte e pulsante sulla stessa riga: le regole stanno in una pagina sola (Sistema senza scorrere) */
.ab-regole-piede{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.ab-regole-spunte{display:grid;gap:2px;min-width:0}
#abRegoleCard .checkbox-field{display:flex;align-items:center;gap:8px;min-height:32px;padding:2px 0;border:0;font-size:var(--fs-s)}
#abRegoleCard .ab-regole-piede>.primary-btn{flex:0 0 auto;margin:0}
@media(max-width:820px){.ab-regole-grid{grid-template-columns:1fr}.ab-regole-grid .ab-regola-larga{grid-column:auto}}
/* le tendine non escono dalla loro colonna */
.ab-regole-grid>*{min-width:0}
.ab-regole-grid select,.ab-regole-grid input{width:100%;max-width:100%;box-sizing:border-box;text-overflow:ellipsis}
.ab-regole-grid>label{display:flex;flex-direction:column;justify-content:flex-end;gap:6px}
