:root {
  --rouge: #8a1526;        /* rouge Ordre de Malte */
  --rouge-fonce: #6b0f1d;
  --or: #b8963e;
  --fond: #f6f4ef;
  --carte: #ffffff;
  --encre: #23201c;
  --encre-2: #6b655c;
  --trait: #e3ded4;
  --ok: #2e7d46;
  --alerte: #b3261e;
  --info: #205a86;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: 'Avenir Next', 'Segoe UI', system-ui, sans-serif; background: var(--fond); color: var(--encre); font-size: 15px; }
a { color: var(--rouge); text-decoration: none; }
a:hover { text-decoration: underline; }

.topbar { background: var(--rouge); color: #fff; display: flex; align-items: center; gap: 18px; padding: 0 18px; flex-wrap: wrap; }
.brand a { color: #fff; font-weight: 700; font-size: 17px; letter-spacing: .3px; }
.brand-sub { display: block; font-size: 11px; color: #e8c9cf; }
.topbar nav { display: flex; flex-wrap: wrap; gap: 2px; flex: 1; }
.topbar nav a { color: #f2dfe2; padding: 14px 10px; font-size: 13.5px; border-bottom: 3px solid transparent; }
.topbar nav a:hover { color: #fff; text-decoration: none; }
.topbar nav a.actif { color: #fff; border-bottom-color: var(--or); font-weight: 600; }
.nav-groupe { color: var(--or); font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; padding: 17px 6px 0 14px; border-left: 1px solid rgba(255,255,255,.25); margin-left: 8px; }
.user-zone { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.user-nom { color: #e8c9cf; }

.contenu { max-width: 1180px; margin: 0 auto; padding: 22px 16px 60px; }
h1 { font-size: 22px; margin: 4px 0 16px; }
h2 { font-size: 16px; margin: 22px 0 10px; }
.sous-titre { color: var(--encre-2); margin-top: -10px; margin-bottom: 16px; font-size: 13.5px; }

.flash { padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; font-size: 14px; }
.flash-succes { background: #e5f2e9; color: var(--ok); border: 1px solid #bfe0ca; }
.flash-erreur { background: #fbe9e7; color: var(--alerte); border: 1px solid #f2c4c0; }
.flash-info { background: #e7f0f7; color: var(--info); border: 1px solid #c3d9ea; }

.cartes { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 20px; }
.carte-stat { background: var(--carte); border: 1px solid var(--trait); border-radius: 10px; padding: 14px 16px; }
.carte-stat .valeur { font-size: 26px; font-weight: 700; color: var(--rouge); }
.carte-stat .libelle { font-size: 12.5px; color: var(--encre-2); margin-top: 2px; }

.bloc { background: var(--carte); border: 1px solid var(--trait); border-radius: 10px; padding: 16px 18px; margin-bottom: 18px; }
.deux-colonnes { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
@media (max-width: 900px) { .deux-colonnes { grid-template-columns: 1fr; } }

table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
th { text-align: left; color: var(--encre-2); font-weight: 600; font-size: 12px; text-transform: uppercase; letter-spacing: .4px; padding: 8px 10px; border-bottom: 2px solid var(--trait); }
td { padding: 8px 10px; border-bottom: 1px solid var(--trait); vertical-align: top; }
tr:hover td { background: #faf8f3; }

.badge { display: inline-block; padding: 2px 9px; border-radius: 20px; font-size: 11.5px; font-weight: 600; background: #eee7d8; color: #6b5d33; white-space: nowrap; }
.badge-confirme, .badge-encaisse, .badge-rapproche, .badge-arrive, .badge-envoye { background: #e0f0e5; color: var(--ok); }
.badge-refuse, .badge-annule, .badge-echec, .badge-absent { background: #f9e3e1; color: var(--alerte); }
.badge-invite, .badge-reponse_attendue, .badge-demande, .badge-simule { background: #ece9e2; color: var(--encre-2); }
.badge-promis, .badge-engage, .badge-confirme_sous_reserve, .badge-en_attente, .badge-recu_non_encaisse { background: #f4ecd7; color: #8a6d1f; }

form.inline { display: inline; }
label { display: block; font-size: 12.5px; color: var(--encre-2); font-weight: 600; margin: 10px 0 4px; }
input, select, textarea { width: 100%; padding: 8px 10px; border: 1px solid #cfc8ba; border-radius: 7px; font-size: 14px; font-family: inherit; background: #fff; }
input:focus, select:focus, textarea:focus { outline: 2px solid rgba(138,21,38,.25); border-color: var(--rouge); }
.grille-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 0 16px; }

.btn { display: inline-block; padding: 8px 16px; border-radius: 7px; border: 1px solid transparent; background: var(--rouge); color: #fff; font-size: 13.5px; font-weight: 600; cursor: pointer; font-family: inherit; }
.btn:hover { background: var(--rouge-fonce); }
.btn-secondaire { background: #fff; color: var(--rouge); border-color: var(--rouge); }
.btn-secondaire:hover { background: #faf0f1; }
.btn-petit { padding: 4px 10px; font-size: 12px; }
.btn-lien { background: none; border: none; color: #f2dfe2; cursor: pointer; font-size: 13px; padding: 4px; font-family: inherit; }
.btn-lien:hover { color: #fff; text-decoration: underline; }
.btn-ok { background: var(--ok); }
.btn-ok:hover { background: #226237; }

.barre-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }
.barre-actions form { display: flex; gap: 8px; align-items: center; }
.barre-actions input, .barre-actions select { width: auto; }

.filtres { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.filtres a { padding: 5px 12px; border-radius: 20px; background: #efe9dd; color: var(--encre-2); font-size: 12.5px; }
.filtres a.actif { background: var(--rouge); color: #fff; }
.filtres a:hover { text-decoration: none; filter: brightness(.96); }

.vide { color: var(--encre-2); font-style: italic; padding: 18px 0; text-align: center; }
.note { font-size: 12.5px; color: var(--encre-2); }
.mono { font-family: ui-monospace, Menlo, monospace; font-size: 12.5px; }

/* Connexion */
.page-connexion { max-width: 400px; margin: 8vh auto; }
.logo-connexion { text-align: center; font-size: 40px; color: var(--rouge); }
.page-connexion h1 { text-align: center; }

/* Plan de salle */
.plan-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px; }
.table-carte { background: var(--carte); border: 1px solid var(--trait); border-radius: 10px; padding: 12px 14px; }
.table-carte.pleine { border-color: var(--alerte); }
.table-carte.verrouillee { background: #f4f1ea; }
.table-carte h3 { margin: 0 0 6px; font-size: 15px; display: flex; justify-content: space-between; }
.jauge { height: 6px; background: #eee7d8; border-radius: 4px; margin: 6px 0 10px; overflow: hidden; }
.jauge > div { height: 100%; background: var(--or); }
.jauge.rouge > div { background: var(--alerte); }
.membre { font-size: 13px; padding: 3px 0; border-bottom: 1px dashed var(--trait); display: flex; justify-content: space-between; gap: 6px; }

/* RSVP public */
.page-rsvp { max-width: 620px; margin: 5vh auto; }
.rsvp-entete { text-align: center; margin-bottom: 22px; }
.rsvp-entete .croix { font-size: 44px; color: var(--rouge); }
.radio-groupe { display: flex; gap: 10px; flex-wrap: wrap; margin: 6px 0; }
.radio-groupe label { flex: 1; min-width: 130px; border: 1.5px solid var(--trait); border-radius: 9px; padding: 12px; text-align: center; cursor: pointer; font-weight: 600; color: var(--encre); margin: 0; }
.radio-groupe input { display: none; }
.radio-groupe input:checked + span { color: var(--rouge); }
.radio-groupe label:has(input:checked) { border-color: var(--rouge); background: #faf0f1; }

/* Impression */
@media print {
  .topbar, .barre-actions, .btn, .flash { display: none !important; }
  body { background: #fff; }
  .contenu { max-width: none; padding: 0; }
}