/* ============================================================
RosterDive DS — Page: User Payments
Stili specifici per la pagina "I miei pagamenti".
DS components usati: inline-header, tabs-bar, datatable, badge
Token: css/tokens.css

Nota: le classi condivise con org_members_payments (celle di
importo `.payments-table__cost`, pulsante `.payments-table__paid` e
contenuto del modale acconti `.installments-modal__*`) vivono in
css/payments.css.
============================================================ */

/* ── Pannelli tab ── */
.tab-panel[hidden] {
  display: none;
}

/* ── Riga intestazione di gruppo (organizzazione) ── */
.user-payments-group-row th {
  background: var(--color-surface-container);
  color: var(--color-text-secondary);
  font-size: var(--font-label-large);
  text-align: left;
}

.user-payments-group-row .material-symbols-outlined {
  font-size: 1.125rem;
  vertical-align: middle;
  margin-right: var(--space-2);
}