/* Rendiconto del compenso della collaboratrice: stessa grammatica delle schede coupon. */
.compenso-admin {max-width:1180px;margin:0 auto;min-width:0}
.compenso-testata {display:flex;align-items:center;justify-content:space-between;gap:24px;margin:24px 0}
.compenso-testata h1 {margin:4px 0 12px}.compenso-testata .sottotitolo{margin:0;max-width:760px}
.compenso-etichetta {color:var(--ui-blu);font-size:.8rem;font-weight:750;text-transform:uppercase;letter-spacing:.08em;display:block;margin:0 0 10px}
.compenso-riepilogo {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:24px 0}
.compenso-riepilogo>div {background:var(--bianco);border:1px solid var(--linea);border-radius:var(--ui-raggio);padding:22px;display:flex;flex-direction:column;gap:8px;min-width:0}
.compenso-riepilogo strong {font-size:1.55rem;color:var(--inchiostro);overflow-wrap:anywhere}.compenso-riepilogo span{color:var(--grigio);line-height:1.45}
.compenso-riepilogo>.compenso-attenzione {border-color:#e2b93b;background:var(--giallo-chiaro)}
.compenso-mesi h2 {margin:36px 0 8px}
.compenso-vuoto {background:var(--ui-blu-tenue);border:1px solid var(--linea);border-radius:var(--ui-raggio);padding:20px;margin:16px 0}
.compenso-mese {background:var(--bianco);border:1px solid var(--linea);border-radius:16px;padding:24px;margin:16px 0;min-width:0}
.compenso-mese>header {display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.compenso-mese>header>div:first-child {display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.compenso-mese h3 {margin:0;font-size:1.25rem;text-transform:capitalize}
.compenso-dovuto {display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.compenso-dovuto strong {font-size:1.5rem}.compenso-dovuto span{color:var(--grigio);font-size:.9rem;text-align:right}
.compenso-numeri {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 24px;margin:22px 0 0}
.compenso-numeri dt {color:var(--grigio);font-size:.85rem;margin-bottom:6px}.compenso-numeri dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.compenso-numeri small {display:block;font-weight:400;color:var(--grigio);margin-top:4px}
.compenso-negativo {color:var(--rosso)}
.compenso-nota-mese {margin:16px 0 0;color:var(--grigio)}
.compenso-dettagli, .compenso-modifica {margin:18px 0 0;border-top:1px solid var(--linea);padding-top:14px}
.compenso-dettagli summary, .compenso-modifica summary {cursor:pointer;font-weight:600;padding:6px 0}
.compenso-dettagli table {margin-top:10px}.compenso-dettagli td,.compenso-dettagli th{font-size:15px;padding:10px 8px}
.compenso-campi {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px;margin:14px 0 18px}
.compenso-campi label {display:flex;flex-direction:column;gap:8px;min-width:0;font-weight:600}
.compenso-campi input, .compenso-campi textarea {width:100%;min-width:0;font-weight:400}
.compenso-campi small {font-weight:400;color:var(--grigio);line-height:1.45}
.compenso-campi .compenso-largo {grid-column:1 / -1}
.compenso-form-inline {display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin:16px 0 0}
.compenso-form-inline label {display:flex;flex-direction:column;gap:8px;font-weight:600;min-width:0}
.compenso-form-inline input {min-width:0;max-width:200px;font-weight:400}
.compenso-form-inline button {margin:0;flex-shrink:0}.compenso-form-inline>span{padding-bottom:12px}
.compenso-pagamento {border-top:1px solid var(--linea);padding-top:14px;margin-top:18px}
.compenso-regole ol {margin:12px 0 0;padding-left:22px;line-height:1.65}.compenso-regole li{margin:8px 0}
.compenso-regole>p:first-of-type {font-size:1.05rem;line-height:1.65;margin:8px 0 4px}
.compenso-esempio {background:var(--ui-blu-tenue);border:1px solid var(--linea);border-radius:12px;padding:18px 20px;margin:20px 0 14px}
.compenso-esempio h3 {margin:0 0 8px;font-size:1.05rem}.compenso-esempio td{font-size:15px;padding:9px 6px;vertical-align:top}
.compenso-esempio td small {display:block;color:var(--grigio);margin-top:3px}
.compenso-cifra {text-align:right;white-space:nowrap;font-weight:600;width:1%}
.compenso-esempio-totale td {border-bottom:0;font-weight:700;font-size:16px}
.tag.compenso-pagato {background:var(--verde-chiaro);color:var(--verde)}
.tag.compenso-da_pagare {background:var(--rosso-chiaro);color:var(--rosso)}
.tag.compenso-in_corso {background:var(--giallo-chiaro);color:var(--giallo)}
.tag.compenso-niente {background:var(--ui-blu-tenue);color:var(--ui-blu-scuro)}
@media(max-width:900px){.compenso-riepilogo{grid-template-columns:repeat(2,minmax(0,1fr))}.compenso-numeri{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.compenso-testata{align-items:stretch;flex-direction:column}.compenso-riepilogo{grid-template-columns:1fr;gap:10px}
  .compenso-riepilogo>div{padding:16px;flex-direction:row;align-items:center;justify-content:space-between;gap:12px}.compenso-riepilogo strong{font-size:1.2rem}
  .compenso-riepilogo span{text-align:right;font-size:.9rem}.compenso-mese{padding:18px}.compenso-numeri{grid-template-columns:1fr;gap:14px}
  .compenso-campi{grid-template-columns:1fr}.compenso-dovuto{align-items:flex-start}.compenso-dovuto span{text-align:left}
  .compenso-form-inline{flex-direction:column;align-items:stretch}.compenso-form-inline input{max-width:none}.compenso-form-inline button{width:100%}}
