/* ------------------------------------------------------------------
   Surcharges applicatives — Encaissements SISP.
   Le socle visuel vient de design-kit (chargé AVANT ce fichier).
   Ici : l'accent de l'app et les quelques éléments propres au suivi
   des soldes (signe des montants, grand livre mensuel, relevé imprimable).
   ------------------------------------------------------------------ */
:root {
  --accent: #9a4f12;            /* brun-orangé — « encaissements », distinct des apps sœurs */
  --accent-hover: #7d3f0d;
  --accent-dim: rgba(154, 79, 18, 0.08);
  --accent-mid: rgba(154, 79, 18, 0.35);
}

/* ── Montants ───────────────────────────────────────────────────────── */
.montant { font-variant-numeric: tabular-nums; white-space: nowrap; }
.montant.is-doit { color: var(--err); font-weight: 600; }       /* solde négatif : la personne doit */
.montant.is-avoir { color: var(--ok, #2f7d4f); font-weight: 600; } /* solde positif : avoir */
.montant.is-zero { color: var(--ink-3); }

/* ── Mode de paiement ────────────────────────────────────────────────── */
.mode-badge.is-cash { background: var(--accent-dim); color: var(--accent); border-color: var(--accent-mid); }
.mode-badge.is-facture { background: var(--bg-inset); color: var(--ink-2); }
.mode-aconfirmer { font-size: var(--t-11, 11px); color: var(--warn); font-weight: 600; margin-left: 6px; }

/* ── Liste des participant·e·s ───────────────────────────────────────── */
.table tr.is-clickable { cursor: pointer; }
.table tr.is-clickable:hover td { background: var(--bg-inset); }
.table td.num, .table th.num { text-align: right; }
.cell-sub { display: block; font-size: var(--t-11, 11px); color: var(--ink-3); }

/* ── Grilles des pages : le contenu principal large, le panneau d'actions étroit ── */
.dash-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(320px, 2fr); gap: var(--s24, 24px); align-items: start; }
.fiche-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 420px); gap: var(--s24, 24px); align-items: start; }
@media (max-width: 1100px) { .dash-grid, .fiche-grid { grid-template-columns: 1fr; } }
.page-title { white-space: nowrap; }

/* ── Grand livre mensuel (fiche participant·e) ───────────────────────── */
.ledger { display: flex; flex-direction: column; gap: var(--s12, 12px); }
.ledger-mois { border: 1px solid var(--line); border-radius: var(--r2, 6px); background: var(--surface); overflow: hidden; }
.ledger-mois-head {
  display: flex; flex-wrap: wrap; gap: var(--s4, 4px) var(--s20, 20px); align-items: baseline;
  padding: var(--s8) var(--s12); background: var(--bg-inset); border-bottom: 1px solid var(--line);
  font-size: var(--t-12, 12px); color: var(--ink-2); cursor: pointer; user-select: none; white-space: nowrap;
}
.ledger-mois-head > span:not(.mois-nom) { font-variant-numeric: tabular-nums; }
.ledger-mois-head .mois-nom { flex: 1 1 auto; display: inline-flex; align-items: center; gap: 4px; font-weight: 700; font-size: var(--t-13, 13px); color: var(--ink-1); text-transform: capitalize; }
.ledger-mois-head .k { color: var(--ink-3); margin-right: 4px; }
.ledger-mois .table { margin: 0; }
.ledger-mois .table td { font-size: var(--t-12, 12px); }
.ledger-row-paiement td { background: var(--accent-dim); }
.ledger-row-exclue td { color: var(--ink-3); text-decoration: line-through; }
.ledger-row-exclue td.motif { text-decoration: none; font-style: italic; }
.ledger-ouverture { padding: var(--s8) var(--s12); font-size: var(--t-12, 12px); color: var(--ink-3); border: 1px dashed var(--line); border-radius: var(--r2, 6px); }

/* Actions discrètes dans les lignes (exclure / rétablir une séance) */
.btn-ligne { border: none; background: none; color: var(--ink-3); cursor: pointer; padding: 0 4px; font-size: var(--t-11, 11px); }
.btn-ligne:hover { color: var(--accent); text-decoration: underline; }

/* ── Panneau d'actions (colonne de droite) ───────────────────────────── */
.two-column { align-items: start; }
.panel .form-group + .form-group { margin-top: var(--s12, 12px); }
.facture-item { display: flex; justify-content: space-between; align-items: center; gap: var(--s8); padding: var(--s8) 0; border-bottom: 1px solid var(--line); font-size: var(--t-12, 12px); }
.facture-item:last-child { border-bottom: none; }

/* ── Relevé / facture imprimable ─────────────────────────────────────── */
.releve { max-width: 760px; margin: 0 auto; padding: 32px; background: #fff; color: #111; font-size: 13px; line-height: 1.45; }
.releve-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; border-bottom: 2px solid #111; padding-bottom: 12px; margin-bottom: 20px; }
.releve-head img { height: 44px; }
.releve-title { font-size: 20px; font-weight: 700; margin: 0 0 4px; }
.releve-meta { font-size: 12px; color: #444; }
.releve table { width: 100%; border-collapse: collapse; margin-top: 16px; }
.releve th, .releve td { padding: 6px 8px; border-bottom: 1px solid #ddd; text-align: left; font-size: 12.5px; }
.releve th { font-weight: 600; background: #f4f4f4; }
.releve td.num, .releve th.num { text-align: right; font-variant-numeric: tabular-nums; }
.releve tfoot td { font-weight: 700; border-top: 2px solid #111; border-bottom: none; }
.releve-foot { margin-top: 24px; font-size: 12px; color: #444; }
.releve-actions { max-width: 760px; margin: 16px auto 0; display: flex; gap: 8px; justify-content: flex-end; }
@media print {
  .releve-actions, .topbar, .sidebar { display: none !important; }
  body { background: #fff; }
  .releve { padding: 0; }
}