/* Area segreteria */
.admin-hero { padding-bottom: 28px; }
.admin-hero h1 { font-size: clamp(30px, 5vw, 52px); }
.card.slim { max-width: 420px; margin: 0 auto; }
.card.wide { max-width: 100%; }

.topbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; gap: 12px; }
.btn-mini {
  display: inline-block; padding: 8px 16px; font: 600 13px 'Inter Tight', sans-serif;
  color: #fff; background: var(--blu); border-radius: 999px; text-decoration: none;
}
.btn-mini:hover { background: var(--blu-chiaro); }
.btn-mini.grigio { background: #888; }

table.elenco { width: 100%; border-collapse: collapse; font-size: 14px; }
table.elenco th {
  text-align: left; padding: 10px 12px; font-size: 12px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--blu); border-bottom: 2px solid var(--blu);
}
table.elenco td { padding: 12px; border-bottom: 1px solid #eee; vertical-align: top; }
table.elenco small { color: #999; }

.badge { display: inline-block; padding: 5px 12px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.badge.attesa { background: #fff7cc; color: #8a7500; border: 1px solid #e8d84a; }
.badge.ok { background: #e3f7e6; color: #0a7a1c; border: 1px solid #7fd48c; }
.badge.no { background: #ffe8e8; color: #a30000; border: 1px solid #f0a0a0; }

table.dettaglio { width: 100%; border-collapse: collapse; font-size: 14px; margin-bottom: 18px; }
table.dettaglio td { padding: 9px 12px; border-bottom: 1px solid #eee; }
table.dettaglio td:first-child { color: #888; width: 220px; }

.due-colonne { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 26px; }
.box-azione { border-radius: 12px; padding: 20px; }
.box-azione h3 { font-family: 'VTF Redzone Classic', sans-serif; text-transform: uppercase; font-size: 20px; margin-bottom: 14px; }
.ok-box { background: #f2fbf3; border: 1.5px solid #9adfa5; }
.ok-box h3 { color: #0a7a1c; }
.no-box { background: #fff5f5; border: 1.5px solid #f0b0b0; }
.no-box h3 { color: #a30000; }
.box-azione button { font-size: 17px; padding: 12px 20px; }
button.rosso { background: #a30000; }
button.rosso:hover { background: var(--rosso); }

@media (max-width: 760px) {
  .due-colonne { grid-template-columns: 1fr; }
  table.elenco thead { display: none; }
  table.elenco tr { display: block; border-bottom: 2px solid var(--blu); padding: 8px 0; }
  table.elenco td { display: block; border: 0; padding: 4px 8px; }
  table.elenco td::before { content: attr(data-l); display: block; font-size: 11px; color: #999; text-transform: uppercase; }
  table.elenco td:empty::before, table.elenco td:last-child::before { content: none; }
}