:root {
  --green-dark: #1f4d3a;
  --green: #2f7a53;
  --green-light: #e7f3ec;
  --amber: #b8770b;
  --amber-light: #fbf1de;
  --red: #b3261e;
  --red-light: #fbe9e8;
  --ink: #1c2320;
  --ink-soft: #55635c;
  --border: #dfe6e1;
  --bg: #f6f8f6;
  --card: #ffffff;
  --radius: 10px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
}

.topbar {
  background: linear-gradient(135deg, var(--green-dark), var(--green));
  color: #fff;
  padding: 1.5rem;
}
.topbar-inner {
  max-width: 1600px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: .75rem;
  min-height: 52px;
}
.topbar h1 { margin: 0; font-size: 1.5rem; }
.subtitle { margin: .25rem 0 0; opacity: .85; font-size: .95rem; }
.brand-siren { margin: .15rem 0 0; opacity: .65; font-size: .78rem; display: flex; align-items: center; gap: .35rem; }
.copy-btn {
  border: none;
  background: none;
  color: inherit;
  cursor: pointer;
  padding: 0;
  font-size: .85rem;
  line-height: 1;
  opacity: .85;
}
.copy-btn:hover { opacity: 1; }
/* Petite icône « copier » du SIREN dans le bandeau : blanche, sans cadre ni fond (comme sur l'accueil public) */
.topbar .brand-siren { opacity: 1; color: rgba(255, 255, 255, .78); gap: .4rem; }
.topbar .brand-siren .copy-btn { display: inline-block; opacity: 1; color: #fff; padding: 0; border: none; background: none; font-size: .8rem; font-weight: 700; line-height: 1; }
.topbar .brand-siren .copy-btn svg { display: block; }
.topbar .brand-siren .copy-btn:hover { transform: scale(1.15); }

.brand { display: flex; align-items: center; gap: .9rem; flex-shrink: 0; }
a.brand { color: inherit; text-decoration: none; }
@media (max-width: 600px) { .brand { flex-shrink: 1; min-width: 0; } }
.brand-logo {
  height: 52px;
  width: auto;
  flex-shrink: 0;
  background: #fff;
  border-radius: 8px;
  padding: .3rem .5rem;
}

.auth-card .brand-logo { height: 64px; display: block; margin: 0 auto .75rem; padding: .4rem .6rem; }

.topnav {
  display: flex;
  align-items: center;
  gap: 1rem;
  font-size: .88rem;
  flex-wrap: nowrap;
  white-space: nowrap;
  overflow-x: auto;
  scrollbar-width: thin;
}
.topnav a { color: #fff; text-decoration: none; opacity: .9; }
.topnav a:hover { text-decoration: underline; opacity: 1; }
.topnav .who { opacity: .9; white-space: nowrap; }

.topbar-split { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; column-gap: 1rem; }
.topbar-split .brand { grid-column: 1; justify-self: start; }
.topbar-left { grid-column: 1; justify-self: start; display: flex; align-items: center; gap: .9rem; }
.topbar-center {
  grid-column: 2;
  justify-self: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
}
.topbar-right {
  grid-column: 3;
  justify-self: end;
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  justify-content: flex-end;
}
.home-btn, .topbar-btn, .logout-btn {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .4rem .8rem;
  border-radius: 999px;
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.3);
  color: #fff;
  text-decoration: none;
  opacity: 1;
  font-weight: 600;
  font-size: .85rem;
  white-space: nowrap;
}
.home-btn:hover, .topbar-btn:hover { background: rgba(255,255,255,.28); text-decoration: none; }
.logout-btn:hover { background: var(--red); border-color: var(--red); text-decoration: none; }

@media (max-width: 960px) {
  .topbar-split {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .9rem;
  }
  .topbar-center, .topbar-right {
    align-items: flex-start;
    justify-content: flex-start;
    justify-self: unset;
  }
}
.home-icon { width: 16px; height: 16px; flex-shrink: 0; }
.role-badge {
  display: inline-block;
  padding: .1rem .5rem;
  border-radius: 999px;
  background: rgba(255,255,255,.2);
  font-size: .72rem;
  text-transform: uppercase;
  letter-spacing: .03em;
  margin-left: .35rem;
}

.container { max-width: 1600px; margin: 0 auto; padding: 1.5rem; }

.stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: .75rem;
  margin-bottom: 1.25rem;
}
.stat-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: .9rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.stat-card .value { font-size: 1.5rem; font-weight: 700; color: var(--green-dark); }
.stat-card .label { font-size: .8rem; color: var(--ink-soft); margin-top: .15rem; }
.small { font-size: .85rem; color: var(--ink-soft); }

.toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-bottom: 1rem;
  align-items: center;
}
.toolbar #search { flex: 1; min-width: 180px; }
.toolbar #montantSearch { flex: 0 1 120px; min-width: 100px; }

input, select, textarea, button {
  font: inherit;
}
input[type="text"], input[type="search"], input[type="email"], input[type="number"], input[type="password"], input[type="date"], select, textarea {
  padding: .55rem .7rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #fff;
  color: var(--ink);
}
textarea { width: 100%; resize: vertical; }

.btn, a.btn {
  padding: .55rem 1rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #fff;
  color: var(--ink);
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
}
.btn:hover { background: #f0f2f0; }
/* a.btn-primary : sans lui, la règle « a.btn » (plus précise) rend blancs les liens-boutons principaux. */
.btn-primary, a.btn-primary {
  background: var(--green);
  border-color: var(--green);
  color: #fff;
}
.btn-primary:hover, a.btn-primary:hover { background: var(--green-dark); }
.btn-danger {
  background: #fff;
  border-color: var(--red);
  color: var(--red);
}
.btn-danger:hover { background: var(--red-light); }

.table-wrap {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow-x: auto;
}
table { width: 100%; border-collapse: collapse; table-layout: fixed; }
thead th {
  text-align: left;
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--ink-soft);
  padding: .75rem .5rem;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.filter-row th {
  padding: .35rem .35rem .6rem;
  border-bottom: 1px solid var(--border);
  text-transform: none;
}
.filter-row input, .filter-row select {
  width: 100%;
  min-width: 0;
  padding: .3rem .35rem;
  font-size: .78rem;
  font-weight: 400;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: #fff;
  color: var(--ink);
}
tbody td {
  padding: .65rem .5rem;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
  font-size: .88rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
tbody td.col-address {
  white-space: normal;
  overflow: hidden;
  text-overflow: clip;
  overflow-wrap: anywhere;
  word-break: break-word;
}
/* Adhérents : 9 colonnes, dont Téléphone lisible en entier et le bouton Modifier ;
   sous 1100 px le tableau défile horizontalement au lieu d'écraser les colonnes. */
#adherentsTable { min-width: 1100px; }
#adherentsTable th:nth-child(1), #adherentsTable td:nth-child(1) { width: 12%; }
#adherentsTable th:nth-child(2), #adherentsTable td:nth-child(2) { width: 11%; }
#adherentsTable th:nth-child(3), #adherentsTable td:nth-child(3) { width: 5%; }
#adherentsTable th:nth-child(4), #adherentsTable td:nth-child(4) { width: 17%; }
#adherentsTable th:nth-child(5), #adherentsTable td:nth-child(5) { width: 18%; }
#adherentsTable th:nth-child(6), #adherentsTable td:nth-child(6) { width: 11%; white-space: nowrap; }
#adherentsTable th:nth-child(7), #adherentsTable td:nth-child(7) { width: 11%; }
#adherentsTable th:nth-child(8), #adherentsTable td:nth-child(8) { width: 8%; text-align: center; }
#adherentsTable th:nth-child(9), #adherentsTable td:nth-child(9) { width: 7%; text-align: center; }

#ecrituresTable th:nth-child(1), #ecrituresTable td:nth-child(1) { width: 8%; }
#ecrituresTable th:nth-child(2), #ecrituresTable td:nth-child(2) { width: 7%; }
#ecrituresTable th:nth-child(3), #ecrituresTable td:nth-child(3) { width: 14%; }
#ecrituresTable th:nth-child(4), #ecrituresTable td:nth-child(4) { width: 18%; }
#ecrituresTable th:nth-child(5), #ecrituresTable td:nth-child(5) { width: 9%; }
#ecrituresTable th:nth-child(6), #ecrituresTable td:nth-child(6) { width: 9%; }
#ecrituresTable th:nth-child(7), #ecrituresTable td:nth-child(7) { width: 9%; }
#ecrituresTable th:nth-child(8), #ecrituresTable td:nth-child(8) { width: 10%; }
#ecrituresTable th:nth-child(9), #ecrituresTable td:nth-child(9) { width: 9%; }
#ecrituresTable th:nth-child(10), #ecrituresTable td:nth-child(10) { width: 7%; }

/* Mécènes : 10 colonnes dont Téléphone ; défilement horizontal sous 1100 px. */
#mecenesTable { min-width: 1100px; }
#mecenesTable th:nth-child(1), #mecenesTable td:nth-child(1) { width: 14%; }
#mecenesTable th:nth-child(2), #mecenesTable td:nth-child(2) { width: 12%; }
#mecenesTable th:nth-child(3), #mecenesTable td:nth-child(3) { width: 15%; }
#mecenesTable th:nth-child(4), #mecenesTable td:nth-child(4) { width: 10%; white-space: nowrap; }
#mecenesTable th:nth-child(5), #mecenesTable td:nth-child(5) { width: 9%; }
#mecenesTable th:nth-child(6), #mecenesTable td:nth-child(6) { width: 16%; }
#mecenesTable th:nth-child(7), #mecenesTable td:nth-child(7) { width: 9%; }
#mecenesTable th:nth-child(8), #mecenesTable td:nth-child(8) { width: 5%; text-align: center; }
#mecenesTable th:nth-child(9), #mecenesTable td:nth-child(9) { width: 6%; text-align: center; }
#mecenesTable th:nth-child(10), #mecenesTable td:nth-child(10) { width: 4%; text-align: center; }
tbody tr:last-child td { border-bottom: none; }
tbody tr:hover { background: #fafcfb; }
tbody tr { cursor: pointer; }

.badge {
  display: inline-block;
  padding: .2rem .55rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 600;
}
.badge-paid { background: var(--green-light); color: var(--green-dark); }
.badge-unpaid { background: var(--amber-light); color: var(--amber); }

.empty-state { text-align: center; padding: 2rem; color: var(--ink-soft); }

.row-edit-btn {
  border: 1px solid var(--green);
  background: #fff;
  color: var(--green);
  cursor: pointer;
  font-size: .78rem;
  font-weight: 600;
  padding: .3rem .5rem;
  border-radius: 6px;
  white-space: nowrap;
  transition: background .15s, color .15s;
}
.row-edit-btn:hover {
  background: var(--green);
  color: #fff;
}

.col-action {
  white-space: nowrap;
  overflow: visible;
}

.row-cerfa-btn {
  border: 1px solid var(--green-dark);
  background: var(--green-light);
  color: var(--green-dark);
  cursor: pointer;
  font-size: .78rem;
  font-weight: 600;
  padding: .3rem .45rem;
  border-radius: 6px;
  white-space: nowrap;
  transition: background .15s, color .15s;
}
.row-cerfa-btn:hover {
  background: var(--green-dark);
  color: #fff;
}

.row-delete-btn {
  border: 1px solid var(--border);
  background: #fff;
  color: var(--ink-soft);
  cursor: pointer;
  font-size: .8rem;
  line-height: 1;
  padding: .3rem .4rem;
  border-radius: 6px;
  transition: background .15s, color .15s, border-color .15s;
}
.row-delete-btn:hover {
  background: var(--red-light);
  color: var(--red);
  border-color: var(--red);
}

.modal-backdrop {
  position: fixed; inset: 0;
  background: rgba(20, 30, 24, .45);
  display: flex; align-items: flex-start; justify-content: center;
  padding: 3vh 1rem;
  overflow-y: auto;
  z-index: 50;
}
.modal-backdrop[hidden] { display: none; }
.modal {
  background: #fff;
  border-radius: var(--radius);
  width: 100%;
  max-width: 640px;
  max-height: 94vh;
  display: flex;
  flex-direction: column;
}
.modal-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border);
}
.modal-header h2 { margin: 0; font-size: 1.1rem; }
.icon-btn {
  border: none; background: none; font-size: 1.4rem; line-height: 1;
  cursor: pointer; color: var(--ink-soft);
}
.modal-body { padding: 1.25rem; overflow-y: auto; }
.modal-wide { max-width: 860px; height: 94vh; }
.modal-body-flush { padding: 0; flex: 1; display: flex; }
.modal-body-flush iframe { flex: 1; width: 100%; border: none; border-radius: 0 0 var(--radius) var(--radius); }

.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .8rem 1rem;
}
.form-grid label {
  display: flex; flex-direction: column; gap: .3rem;
  font-size: .82rem; color: var(--ink-soft); font-weight: 600;
}
.form-grid .span2 { grid-column: 1 / -1; }
.hint { font-weight: 400; text-transform: none; letter-spacing: 0; opacity: .8; }
.addr-line { white-space: normal; }

.ban-check { display: flex; flex-direction: column; gap: .5rem; margin-top: -.3rem; }
.ban-status { font-size: .82rem; color: var(--ink-soft); }
.ban-status.ban-ok { color: var(--green-dark); }
.ban-status.ban-warn { color: var(--amber); }
.ban-results { display: flex; flex-direction: column; gap: .3rem; border: 1px solid var(--border); border-radius: 8px; padding: .4rem; background: var(--bg); }
.ban-results[hidden] { display: none; }
.ban-result {
  display: flex; justify-content: space-between; align-items: center; gap: .6rem;
  padding: .5rem .6rem; border: 1px solid transparent; border-radius: 6px;
  background: var(--card); cursor: pointer; text-align: left; font: inherit; color: var(--ink);
}
.ban-result:hover { border-color: var(--green); background: var(--green-light); }
.ban-result-label { font-size: .85rem; }
.ban-result-score { font-size: .75rem; font-weight: 700; color: var(--ink-soft); flex-shrink: 0; }

.cotis-section { margin-top: 1.5rem; border-top: 1px solid var(--border); padding-top: 1rem; }
.cotis-section h3 { margin: 0 0 .6rem; font-size: .95rem; }
.cotis-table { width: 100%; border-collapse: collapse; margin-bottom: .8rem; }
.cotis-table th, .cotis-table td { text-align: left; padding: .4rem .5rem; font-size: .85rem; border-bottom: 1px solid var(--border); }
.cotis-add { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }

.modal-actions {
  display: flex;
  align-items: center;
  gap: .6rem;
  margin-top: 1.5rem;
  border-top: 1px solid var(--border);
  padding-top: 1rem;
}
.modal-actions .spacer { flex: 1; }

.link-btn {
  border: none; background: none; color: var(--red); cursor: pointer; font-size: .8rem;
}

/* ---- Auth pages ---- */
.auth-body {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}
.auth-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2rem;
  width: 100%;
  max-width: 380px;
}
.auth-card h1 { margin: 0; font-size: 1.3rem; color: var(--green-dark); }
.auth-form { display: flex; flex-direction: column; gap: .9rem; margin-top: 1.25rem; }
.auth-form label { display: flex; flex-direction: column; gap: .3rem; font-size: .85rem; color: var(--ink-soft); font-weight: 600; }
.auth-form button { margin-top: .3rem; }

.alert { padding: .7rem .9rem; border-radius: 8px; font-size: .85rem; margin: .9rem 0 0; }
.alert-error { background: var(--red-light); color: var(--red); }
.alert-info { background: var(--green-light); color: var(--green-dark); }

/* ---- Home tiles ---- */
.tiles {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1rem;
}
.tile {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .4rem;
  text-decoration: none;
  color: var(--ink);
  transition: border-color .15s, transform .15s;
}
.tile:hover {
  border-color: var(--green);
  transform: translateY(-2px);
}
.tile-icon { font-size: 1.8rem; }
.tile-title { font-size: 1.05rem; font-weight: 700; color: var(--green-dark); }
.tile-desc { font-size: .82rem; color: var(--ink-soft); }

/* ---- Simple admin pages (users) ---- */
.card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.25rem; margin-bottom: 1.25rem; }
.card h2 { margin-top: 0; font-size: 1.05rem; }
.inline-form { display: flex; flex-wrap: wrap; gap: .6rem; align-items: flex-end; }
.inline-form label { display: flex; flex-direction: column; gap: .3rem; font-size: .8rem; color: var(--ink-soft); font-weight: 600; }
.back-link { display: inline-block; margin-bottom: 1rem; color: var(--green-dark); font-size: .88rem; }

.pages-fieldset {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: .5rem .8rem .7rem;
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
}
.pages-fieldset legend { font-size: .78rem; color: var(--ink-soft); font-weight: 600; padding: 0 .3rem; }
.checkbox-label { display: inline-flex; align-items: center; gap: .3rem; font-size: .82rem; font-weight: 400; white-space: nowrap; }
/* Dans un formulaire « en ligne » (création de compte), la case reste à gauche de son libellé */
.inline-form .checkbox-label { flex-direction: row; align-items: center; color: var(--ink); font-weight: 400; }
.inline-form .checkbox-label.checkbox-sub { color: var(--ink-soft); }
.checkbox-sub { margin-left: 1.1rem; color: var(--ink-soft); font-size: .78rem; }
.checkbox-sub::before { content: '↳'; margin-right: .1rem; }
.access-form { display: flex; flex-wrap: wrap; gap: .5rem .9rem; align-items: center; }

/* ---- Comptabilité ---- */
.toolbar .spacer { flex: 1; }
.tabs { display: flex; flex-wrap: wrap; gap: .3rem; }  /* passe à la ligne sur téléphone au lieu de déborder */
#mainTabs { margin-bottom: 1.25rem; }
.tab-btn {
  padding: .5rem .9rem;
  border: 1px solid var(--border);
  background: #fff;
  color: var(--ink-soft);
  border-radius: 999px;
  cursor: pointer;
  font: inherit;
  font-size: .85rem;
  font-weight: 600;
}
.tab-btn:hover { background: #f0f2f0; }
.tab-btn.active { background: var(--green); border-color: var(--green); color: #fff; }
.tab-panel[hidden] { display: none; }

.badge-debit { background: var(--red-light); color: var(--red); }
.badge-credit { background: var(--green-light); color: var(--green-dark); }

.check-yes { color: var(--green-dark); font-weight: 700; }
.check-no { color: var(--ink-soft); }

.tresorerie-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1rem;
}
.tresorerie-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.1rem 1.25rem;
}
.tresorerie-card h3 { margin: 0 0 .8rem; font-size: 1rem; color: var(--green-dark); }
.tresorerie-card table { width: 100%; border-collapse: collapse; }
.tresorerie-card td { padding: .35rem 0; font-size: .88rem; border-bottom: 1px dashed var(--border); }
.tresorerie-card tr:last-child td { border-bottom: none; font-weight: 700; padding-top: .5rem; }
.tresorerie-card td:last-child { text-align: right; font-variant-numeric: tabular-nums; }

.tresorerie-card-wide { grid-column: 1 / -1; }
.reconciliation-table th { text-align: right; font-size: .76rem; text-transform: uppercase; letter-spacing: .02em; color: var(--ink-soft); padding-bottom: .5rem; }
.reconciliation-table th:first-child { text-align: left; }
.reconciliation-table td { text-align: right; }
.reconciliation-table td:first-child { text-align: left; }
.reconciliation-table tr.total td { border-top: 2px solid var(--border); border-bottom: none; padding-top: .6rem; }
.diff-ok { color: var(--green-dark); }
.diff-warn { color: var(--red); font-weight: 700; }

.cr-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
@media (max-width: 900px) { .cr-grid { grid-template-columns: 1fr; } }
.cr-col {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1rem 1.25rem;
}
.cr-col h3 { margin: 0 0 .6rem; font-size: 1rem; color: var(--green-dark); }
.cr-compte { margin-top: .8rem; }
.cr-compte-title {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: .5rem;
  font-size: .8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .02em;
  color: var(--green-dark);
  background: var(--green-light);
  border-radius: 6px;
  padding: .4rem .6rem;
  margin-bottom: .25rem;
}
.cr-compte-title .cr-compte-label { grid-column: 1; justify-self: start; }
.cr-compte-title .amt { grid-column: 2; justify-self: center; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cr-ligne { display: flex; justify-content: space-between; gap: .5rem; font-size: .86rem; padding: .3rem 0; border-bottom: 1px dashed var(--border); }
.cr-ligne .amt { font-variant-numeric: tabular-nums; white-space: nowrap; }
.cr-ligne.zero { color: var(--ink-soft); }
.cr-total { display: flex; justify-content: space-between; font-weight: 700; padding-top: .8rem; margin-top: .5rem; border-top: 2px solid var(--border); }
.cr-resultat { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem; border-radius: var(--radius); font-size: 1.1rem; font-weight: 700; }
.cr-resultat.positif { background: var(--green-light); color: var(--green-dark); }
.cr-resultat.negatif { background: var(--red-light); color: var(--red); }

.panel-actions { display: flex; justify-content: flex-end; margin-bottom: .75rem; }
.print-header { display: none; }
.print-header h2 { margin: 0 0 .15rem; font-size: 1.05rem; color: var(--green-dark); }
.print-header .print-meta { margin: 0; font-size: .75rem; color: var(--ink-soft); }

/* ---- Impression : Trésorerie et Compte de résultat tiennent sur une page A4 ---- */
@media print {
  @page { size: A4 portrait; margin: 12mm; }

  body { background: #fff; }
  .topbar, .toolbar, .stats, .panel-actions, .no-print { display: none !important; }
  main.container { max-width: 100%; padding: 0; margin: 0; }

  .tab-panel[hidden] { display: none !important; }
  .print-header { display: block; margin-bottom: .5rem; }

  /* Trésorerie */
  .tresorerie-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .5rem; }
  .tresorerie-card { padding: .5rem .6rem; border-color: #ccc; box-shadow: none; break-inside: avoid; }
  .tresorerie-card h3 { font-size: .78rem; margin-bottom: .3rem; }
  .tresorerie-card td { font-size: .68rem; padding: .15rem 0; }
  .reconciliation-table th { font-size: .6rem; padding-bottom: .3rem; }
  .tresorerie-card .hint { font-size: .62rem; margin-top: .3rem; }

  /* Compte de résultat */
  .cr-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
  .cr-col { padding: .5rem .6rem; border-color: #ccc; box-shadow: none; break-inside: avoid; }
  .cr-col h3 { font-size: .78rem; margin-bottom: .3rem; }
  .cr-compte { margin-top: .4rem; }
  .cr-compte-title { font-size: .62rem; padding: .2rem .4rem; margin-bottom: .15rem; }
  .cr-ligne { font-size: .66rem; padding: .1rem 0; }
  .cr-total { font-size: .72rem; padding-top: .35rem; margin-top: .3rem; }
  .cr-resultat { font-size: .82rem; padding: .5rem .7rem; break-inside: avoid; }
}

.adherent-link { position: relative; }
.adherent-link .ban-results { position: absolute; z-index: 5; width: 100%; max-height: 220px; overflow-y: auto; margin-top: .3rem; }

/* ---- Entrepôt de fichiers ---- */
.container-wide { max-width: 1900px; }

.explorer {
  display: grid;
  grid-template-columns: 420px minmax(0, 1.1fr) minmax(0, .6fr);
  gap: 1.25rem;
  align-items: start;
}
@media (max-width: 1150px) {
  .explorer { grid-template-columns: 1fr; }
}

.explorer-tree {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: .9rem;
  position: sticky;
  top: 1rem;
}
@media (max-width: 1150px) { .explorer-tree { position: static; } }
.explorer-tree-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; }
.explorer-tree-header h2 { margin: 0; font-size: .95rem; color: var(--green-dark); }
.explorer-tree-header .icon-btn { font-size: 1.1rem; line-height: 1; border: 1px solid var(--border); border-radius: 6px; width: 1.8rem; height: 1.8rem; }

.folder-tree, .folder-tree ul { list-style: none; margin: 0; padding: 0; }
.folder-tree .tree-children { padding-left: 1.1rem; }
.tree-row {
  display: flex;
  align-items: center;
  gap: .3rem;
  padding: .3rem .35rem;
  border-radius: 6px;
  cursor: pointer;
  font-size: .88rem;
}
.tree-row:hover { background: #f0f2f0; }
.tree-row.tree-selected { background: var(--green-light); color: var(--green-dark); font-weight: 600; }
.tree-row.tree-drop-active { outline: 2px dashed var(--green); background: var(--green-light); }
.tree-row[draggable="true"] { cursor: grab; }
.tree-toggle {
  border: none; background: none; cursor: pointer; color: var(--ink-soft);
  width: 1.1rem; flex-shrink: 0; font-size: .75rem; padding: 0;
}
.tree-toggle-spacer { width: 1.1rem; flex-shrink: 0; display: inline-block; }
.tree-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-del {
  border: none; background: none; cursor: pointer; opacity: .35; font-size: .8rem;
  flex-shrink: 0; padding: 0 .2rem;
}
.tree-row:hover .tree-del { opacity: .7; }
.tree-del:hover { opacity: 1 !important; }
.tree-count {
  flex-shrink: 0;
  font-size: .72rem;
  color: var(--ink-soft);
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0 .45rem;
  line-height: 1.5;
}

.explorer-list { min-width: 0; }

.dropzone {
  border: 2px dashed var(--border);
  border-radius: var(--radius);
  background: var(--card);
  padding: 1.75rem 1.25rem;
  text-align: center;
  cursor: pointer;
  margin: .8rem 0;
  transition: border-color .15s, background .15s;
}
.dropzone:hover { border-color: var(--green); }
.dropzone-active { border-color: var(--green); background: var(--green-light); }
.dropzone-text { margin: 0 0 .4rem; color: var(--ink); }
.dropzone-hint { margin: 0; font-size: .8rem; color: var(--ink-soft); }

.upload-status { font-size: .85rem; padding: .5rem 0; margin: 0 0 1rem; }
.upload-status.upload-ok { color: var(--green-dark); }
.upload-status.upload-error { color: var(--red); }

#fichiersTable th:nth-child(1), #fichiersTable td:nth-child(1) { width: 42%; }
#fichiersTable td:nth-child(1) { white-space: normal; overflow-wrap: anywhere; }
#fichiersTable th:nth-child(2), #fichiersTable td:nth-child(2) { width: 16%; white-space: normal; }
#fichiersTable th:nth-child(3), #fichiersTable td:nth-child(3) { width: 10%; }
#fichiersTable th:nth-child(4), #fichiersTable td:nth-child(4) { width: 18%; white-space: nowrap; font-size: .82rem; }
#fichiersTable th:nth-child(5), #fichiersTable td:nth-child(5) { width: 7%; }
#fichiersTable th:nth-child(6), #fichiersTable td:nth-child(6) { width: 7%; }
#fichiersTable tbody tr { cursor: default; }

.breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; font-size: .92rem; margin-bottom: .8rem; }
.breadcrumb .crumb { cursor: pointer; color: var(--green-dark); padding: .2rem .4rem; border-radius: 6px; }
.breadcrumb .crumb:hover { background: var(--green-light); }
.breadcrumb .crumb-current { color: var(--ink); font-weight: 700; cursor: default; }
.breadcrumb .crumb-current:hover { background: none; }
.breadcrumb .crumb-sep { color: var(--ink-soft); }

.row-icon { margin-right: .3rem; }
.file-name-link { cursor: pointer; }
.file-name-link:hover { text-decoration: underline; color: var(--green-dark); }
#fichiersTable tbody tr[data-file-row][draggable="true"] { cursor: grab; }
#fichiersTable tr:hover .file-rename { opacity: .7; }
@media (hover: none) { .file-rename { opacity: .7; } }

.icon-only-btn,
a.btn.icon-only-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.1rem;
  height: 2.1rem;
  padding: 0;
}
.icon-only-btn svg { display: block; }

.explorer-viewer {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  min-height: 320px;
  position: sticky;
  top: 1rem;
  display: flex;
  flex-direction: column;
}
@media (max-width: 1150px) { .explorer-viewer { position: static; } }
.viewer-placeholder { margin: auto; color: var(--ink-soft); font-size: .9rem; padding: 2rem; text-align: center; }
.viewer-content { display: flex; flex-direction: column; height: 100%; }
.viewer-header {
  display: flex; align-items: center; gap: .5rem;
  padding: .8rem 1rem; border-bottom: 1px solid var(--border);
}
.viewer-header h3 { margin: 0; font-size: .95rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.viewer-body { flex: 1; display: flex; align-items: center; justify-content: center; padding: 1rem; overflow: auto; }
.viewer-body img { max-width: 100%; max-height: 70vh; display: block; }
.viewer-body iframe { width: 100%; height: 70vh; border: 0; }
.viewer-no-preview { text-align: center; color: var(--ink-soft); font-size: .88rem; line-height: 1.6; }
.viewer-no-preview-icon { font-size: 2.5rem; }

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #121813;
    --card: #1a221c;
    --border: #2b352e;
    --ink: #eaf0ea;
    --ink-soft: #9aab9f;
    --green-light: #17301f;
    --amber-light: #33260c;
    --red-light: #331a17;
  }
  input[type="text"], input[type="search"], input[type="email"], input[type="number"], input[type="password"], input[type="date"], select, textarea, .btn, .tab-btn {
    background: #1e2620;
    color: var(--ink);
  }
  .btn-primary { background: var(--green); }
  .tab-btn.active { background: var(--green); color: #fff; }
}

/* Annuaire : nature du contact (liste ouverte) */
.nature-tag { display: inline-block; padding: .1rem .5rem; border-radius: 999px; background: #efe7da; color: #5b4330; font-size: .78rem; font-weight: 600; white-space: nowrap; }
.filter-row select.col-filter { width: 100%; font: inherit; font-size: .8rem; padding: .25rem .3rem; border: 1px solid #d6cab6; border-radius: 4px; background: #fff; }
/* Annuaire : largeurs de colonnes (dont Nature, assez large pour son menu de filtre) ;
   en dessous de 1000 px le tableau défile horizontalement au lieu d'écraser les colonnes. */
#contactsTable { min-width: 1000px; }
#contactsTable th:nth-child(1), #contactsTable td:nth-child(1) { width: 12%; }
#contactsTable th:nth-child(2), #contactsTable td:nth-child(2) { width: 10%; }
#contactsTable th:nth-child(3), #contactsTable td:nth-child(3) { width: 12%; }
#contactsTable th:nth-child(4), #contactsTable td:nth-child(4) { width: 14%; }
#contactsTable th:nth-child(5), #contactsTable td:nth-child(5) { width: 16%; }
#contactsTable th:nth-child(6), #contactsTable td:nth-child(6) { width: 15%; }
#contactsTable th:nth-child(7), #contactsTable td:nth-child(7) { width: 8%; }
#contactsTable th:nth-child(8), #contactsTable td:nth-child(8) { width: 7%; }
#contactsTable th:nth-child(9), #contactsTable td:nth-child(9) { width: 6%; }

/* Accueil : rappel de la revue annuelle RGPD (administrateurs) */
.rgpd-revue { background: var(--amber-light); color: var(--ink); border: 1px solid #e8c874; border-left: 5px solid #d9a21b; border-radius: var(--radius); padding: 1rem 1.3rem; margin: 0 0 1.5rem; }
.rgpd-revue h2 { margin: 0 0 .4rem; font-size: 1.1rem; }
.rgpd-revue p { margin: 0 0 .5rem; }
.rgpd-revue ul { margin: 0 0 .9rem; padding-left: 1.2rem; }
.rgpd-revue li { margin: .25rem 0; }
.rgpd-revue a { color: inherit; }
@media (prefers-color-scheme: dark) { .rgpd-revue { border-color: #6b5320; border-left-color: #d9a21b; } }

/* Graphiques du tableau de bord (administration/app/includes/graphiques.php) */
.tb-graph-wrap { max-width: 820px; margin: .6rem 0 1.8rem; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 1rem 1rem .6rem; }
.tb-graph { width: 100%; height: auto; display: block; }
.tb-graph-grille { stroke: var(--border); stroke-width: 1; }
.tb-graph-axe { font-size: 11px; fill: var(--ink-soft); }
.tb-graph-valeur { font-size: 10px; font-weight: 600; }
.tb-graph-legende { display: flex; flex-wrap: wrap; gap: .3rem 1.2rem; font-size: .8rem; color: var(--ink-soft); padding: .3rem .4rem 0; }
.tb-graph-legende i, .tb-camembert-legende i { display: inline-block; width: 12px; height: 12px; border-radius: 3px; margin-right: .4rem; vertical-align: -1px; }
.tb-camembert-wrap { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.8rem; margin: 0; background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.2rem 1.5rem; }
.tb-camembert { width: 160px; height: 160px; flex: none; }
.tb-camembert-legende { list-style: none; margin: 0; padding: 0; line-height: 1.9; font-size: .88rem; }
.tb-annees { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin: .3rem 0 .6rem; font-size: .9rem; }
.tb-annees .tab-btn { text-decoration: none; }
.tb-legende-pointille { opacity: .7; font-style: italic; }
.tb-legende-pointille i { opacity: .55; }
.tb-fidelite { margin: .2rem 0 .4rem; font-size: .95rem; }
.tb-graph-etiquette { font-size: 11px; font-weight: 700; paint-order: stroke; stroke: var(--card); stroke-width: 4px; stroke-linejoin: round; }
/* Détail par ville et camembert côte à côte (l'un sous l'autre sur petit écran) */
.tb-cote-a-cote { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1.5rem; align-items: start; margin-bottom: 2rem; }
.tb-cote-a-cote h3 { margin-top: .4rem; }
@media (max-width: 900px) { .tb-cote-a-cote { grid-template-columns: 1fr; } }
/* Courbes de la visite 3D côte à côte : graphiques à la largeur de leur colonne, phrase de synthèse en légende */
.tb-courbes-3d { margin-bottom: 1.2rem; }
.tb-courbes-3d .tb-graph-wrap { max-width: none; margin-bottom: .5rem; }
.tb-courbes-3d .tb-fidelite { font-size: .88rem; margin: 0; }
/* Onglet Fréquentation plus compact, pour voir les trois graphiques sur un même écran */
.tb-visites-site .tb-courbes-3d { margin-bottom: .5rem; }
#tb-panel-visiteurs h3 sup { line-height: 0; }
/* Bas de l'onglet : camembert seul, centré ; un clic affiche le détail par ville en dessous */
.tb-centre { text-align: center; }
.tb-camembert-clic { max-width: 560px; margin: 0 auto 1rem; cursor: pointer; border-radius: var(--radius); }
.tb-camembert-clic .tb-camembert-wrap { justify-content: center; transition: box-shadow .15s ease, border-color .15s ease; }
.tb-camembert-clic:hover .tb-camembert-wrap, .tb-camembert-clic:focus-visible .tb-camembert-wrap { border-color: var(--green); box-shadow: 0 4px 14px rgba(0, 0, 0, .08); }
.tb-camembert-clic:focus-visible { outline: 2px solid var(--green); outline-offset: 3px; }
.tb-camembert-indice { text-align: center; font-size: .85rem; color: var(--ink-soft); margin: .5rem 0 0; }
.tb-camembert-vide { cursor: default; }
.tb-villes-detail { max-width: 640px; margin: 0 auto 2rem; }
.tb-villes-detail .tb-villes-wrap { max-width: none; }
.tb-visites-site > .small { margin: 0 0 1rem; }
#tb-panel-visiteurs h2 { margin: .8rem 0 .4rem; }
#tb-panel-visiteurs .subtitle { margin-bottom: .6rem; }
#tb-panel-visiteurs h3 { margin: .2rem 0 .3rem; }

/* Journal de comptabilité sur téléphone : une fiche par écriture (les 10 colonnes ne tiennent pas
   dans la largeur d'un écran de téléphone : elles étaient écrasées et illisibles). */
@media (max-width: 720px) {
  #ecrituresTable thead { display: none; }
  #ecrituresTable, #ecrituresTable tbody { display: block; }
  #ecrituresTable tr { display: grid; grid-template-columns: auto auto 1fr; column-gap: .5rem; row-gap: .2rem; align-items: center; padding: .7rem .8rem; border-bottom: 1px solid var(--border); }
  #ecrituresTable td { display: block; width: auto !important; padding: 0; border: none; white-space: normal; overflow: visible; }
  #ecrituresTable td:empty { display: none; }
  #ecrituresTable td:nth-child(1) { grid-row: 1; grid-column: 1; color: var(--ink-soft); font-size: .82rem; }
  #ecrituresTable td:nth-child(2) { grid-row: 1; grid-column: 2; }
  #ecrituresTable td:nth-child(7) { grid-row: 1; grid-column: 3; text-align: right; font-weight: 700; font-size: 1rem; white-space: nowrap; }
  #ecrituresTable td:nth-child(3) { grid-row: 2; grid-column: 1 / -1; font-weight: 600; }
  #ecrituresTable td:nth-child(4) { grid-row: 3; grid-column: 1 / -1; }
  #ecrituresTable td:nth-child(5), #ecrituresTable td:nth-child(6), #ecrituresTable td:nth-child(8),
  #ecrituresTable td:nth-child(9), #ecrituresTable td:nth-child(10) { grid-column: 1 / -1; font-size: .82rem; color: var(--ink-soft); }
  #ecrituresTable td:nth-child(5)::before { content: "Adhérent : "; }
  #ecrituresTable td:nth-child(6)::before { content: "Mécène : "; }
  #ecrituresTable td:nth-child(8)::before { content: "Règlement : "; }
  #ecrituresTable td:nth-child(9)::before { content: "Titulaire : "; }
  #ecrituresTable td:nth-child(10)::before { content: "Pointé banque : "; }
}

/* ---- Téléphone : listes Adhérents, Mécènes et Annuaire en fiches (05/10/2026) ----
   Les tableaux de 9 à 10 colonnes (1 000 à 1 100 px) obligeaient à faire glisser de côté.
   Chaque ligne devient une fiche ; la ligne de filtres reste utilisable, en petit formulaire
   à deux colonnes avec le nom de chaque colonne au-dessus de sa case. */
@media (max-width: 720px) {
  #adherentsTable, #mecenesTable, #contactsTable { min-width: 0 !important; display: block; }
  #adherentsTable thead tr:first-child, #mecenesTable thead tr:first-child, #contactsTable thead tr:first-child { display: none; }
  #adherentsTable thead, #mecenesTable thead, #contactsTable thead { display: block; }
  #adherentsTable thead tr, #mecenesTable thead tr, #contactsTable thead tr { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem .6rem; padding: .7rem .8rem; border-bottom: 1px solid var(--border); }
  #adherentsTable thead th, #mecenesTable thead th, #contactsTable thead th { display: block; width: auto !important; padding: 0; border: none; background: none; position: static; }
  #adherentsTable thead th:empty, #mecenesTable thead th:empty, #contactsTable thead th:empty { display: none; }
  #adherentsTable thead th::before, #mecenesTable thead th::before, #contactsTable thead th::before { display: block; font-size: .72rem; color: var(--ink-soft); text-transform: none; letter-spacing: 0; margin-bottom: .1rem; }
  #adherentsTable thead th input, #adherentsTable thead th select, #mecenesTable thead th input, #mecenesTable thead th select,
  #contactsTable thead th input, #contactsTable thead th select { width: 100%; }

  #adherentsTable tbody, #mecenesTable tbody, #contactsTable tbody { display: block; }
  #adherentsTable tbody tr, #mecenesTable tbody tr, #contactsTable tbody tr { display: block; padding: .75rem .9rem; border-bottom: 1px solid var(--border); }
  #adherentsTable tbody td, #mecenesTable tbody td, #contactsTable tbody td { display: block; width: auto !important; padding: .1rem 0; border: none; white-space: normal; overflow: visible; overflow-wrap: anywhere; text-align: left; }
  #adherentsTable thead th, #mecenesTable thead th, #contactsTable thead th { text-align: left; }
  #adherentsTable tbody td:empty, #mecenesTable tbody td:empty, #contactsTable tbody td:empty { display: none; }
  #adherentsTable tbody td[colspan], #mecenesTable tbody td[colspan], #contactsTable tbody td[colspan] { text-align: center; }
  /* Nom + prénom (ou société) en tête de fiche, sur une ligne */
  #adherentsTable tbody td:nth-child(1), #contactsTable tbody td:nth-child(1), #mecenesTable tbody td:nth-child(1) { display: inline; font-weight: 700; font-size: 1rem; }
  #adherentsTable tbody td:nth-child(2), #contactsTable tbody td:nth-child(2) { display: inline; font-weight: 700; font-size: 1rem; margin-left: .35rem; }
  #adherentsTable tbody td:nth-child(3), #contactsTable tbody td:nth-child(3), #mecenesTable tbody td:nth-child(2) { margin-top: .3rem; }
  #adherentsTable .row-edit-btn, #mecenesTable .row-edit-btn, #contactsTable .row-edit-btn { margin-top: .4rem; }
  #mecenesTable tbody td.col-action { display: inline-block; margin-right: .5rem; }

  #adherentsTable thead tr:nth-child(2) th:nth-child(1)::before { content: "Nom"; }
  #adherentsTable thead tr:nth-child(2) th:nth-child(2)::before { content: "Prénom"; }
  #adherentsTable thead tr:nth-child(2) th:nth-child(3)::before { content: "Foyer"; }
  #adherentsTable thead tr:nth-child(2) th:nth-child(4)::before { content: "E-mail"; }
  #adherentsTable thead tr:nth-child(2) th:nth-child(5)::before { content: "Adresse"; }
  #adherentsTable thead tr:nth-child(2) th:nth-child(6)::before { content: "Téléphone"; }
  #adherentsTable thead tr:nth-child(2) th:nth-child(7)::before { content: "Statut"; }
  #adherentsTable thead tr:nth-child(2) th:nth-child(8)::before { content: "Rôle"; }
  #adherentsTable tbody td:nth-child(3)::before { content: "Personnes au foyer : "; color: var(--ink-soft); font-size: .82rem; }

  #mecenesTable thead tr:nth-child(2) th:nth-child(1)::before { content: "Société"; }
  #mecenesTable thead tr:nth-child(2) th:nth-child(2)::before { content: "Dirigeant"; }
  #mecenesTable thead tr:nth-child(2) th:nth-child(3)::before { content: "E-mail"; }
  #mecenesTable thead tr:nth-child(2) th:nth-child(4)::before { content: "Téléphone"; }
  #mecenesTable thead tr:nth-child(2) th:nth-child(5)::before { content: "SIREN"; }
  #mecenesTable thead tr:nth-child(2) th:nth-child(6)::before { content: "Adresse"; }
  #mecenesTable thead tr:nth-child(2) th:nth-child(7)::before { content: "Statut"; }
  #mecenesTable tbody td:nth-child(2)::before { content: "Dirigeant : "; color: var(--ink-soft); font-size: .82rem; }
  #mecenesTable tbody td:nth-child(5)::before { content: "SIREN : "; color: var(--ink-soft); font-size: .82rem; }

  #contactsTable thead tr:nth-child(2) th:nth-child(1)::before { content: "Nom"; }
  #contactsTable thead tr:nth-child(2) th:nth-child(2)::before { content: "Prénom"; }
  #contactsTable thead tr:nth-child(2) th:nth-child(3)::before { content: "Société"; }
  #contactsTable thead tr:nth-child(2) th:nth-child(4)::before { content: "Nature"; }
  #contactsTable thead tr:nth-child(2) th:nth-child(5)::before { content: "E-mail"; }
  #contactsTable thead tr:nth-child(2) th:nth-child(6)::before { content: "Adresse"; }
  #contactsTable thead tr:nth-child(2) th:nth-child(7)::before { content: "Mobile"; }
  #contactsTable thead tr:nth-child(2) th:nth-child(8)::before { content: "Fixe"; }
  #contactsTable tbody td:nth-child(3)::before { content: "Société : "; color: var(--ink-soft); font-size: .82rem; }
  #contactsTable tbody td:nth-child(7)::before { content: "Mobile : "; color: var(--ink-soft); font-size: .82rem; }
  #contactsTable tbody td:nth-child(8)::before { content: "Fixe : "; color: var(--ink-soft); font-size: .82rem; }

  /* Entrepôt : la colonne des dossiers se rétrécit à la largeur de l'écran */
  .explorer { grid-template-columns: minmax(0, 1fr); }
  .explorer > * { min-width: 0; }
  /* Gestion des comptes : les cadres de cases à cocher passent à la ligne */
  fieldset { min-width: 0; }
  .checkbox-label { white-space: normal; }
  .pages-fieldset input[type="text"], .pages-fieldset input[type="email"] { max-width: 100%; }
  /* Menus déroulants des barres d'outils (ex. « Nature » de la Comptabilité, aux libellés longs) */
  .toolbar select { max-width: 100%; }
  /* Fenêtres de saisie (Modifier un adhérent, un contact, une écriture…) : une seule colonne,
     cases à la largeur de l'écran (en deux colonnes, elles dépassaient et étaient coupées). */
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .form-grid label > input, .form-grid label > select, .form-grid label > textarea { width: 100%; min-width: 0; }
  .modal-backdrop { padding: 2vh .5rem; }
  .modal-header, .modal-body { padding-left: .9rem; padding-right: .9rem; }
  .modal-actions { flex-wrap: wrap; }
  /* Gestion des comptes : un compte par fiche (le tableau à 7 colonnes était écrasé et illisible) */
  .comptes-table, .comptes-table tbody, .comptes-table tr, .comptes-table td { display: block; width: auto !important; }
  .comptes-table colgroup, .comptes-table thead { display: none; }
  .comptes-table tr { padding: .8rem .9rem; border-bottom: 1px solid var(--border); }
  .comptes-table td { padding: .2rem 0; border: none; white-space: normal; overflow: visible; text-overflow: clip; text-align: left; }
  .comptes-table td:nth-child(1) { font-weight: 700; font-size: 1rem; }
  .comptes-table td:nth-child(2) { overflow-wrap: anywhere; color: var(--ink-soft); }
  .comptes-table td:nth-child(3)::before { content: "Rôle : "; }
  .comptes-table td:nth-child(4)::before { content: "Pages accessibles"; display: block; margin-top: .3rem; }
  .comptes-table td:nth-child(5)::before { content: "Créé le "; }
  .comptes-table td:nth-child(6)::before { content: "Mot de passe"; display: block; margin-top: .3rem; }
  .comptes-table td::before { color: var(--ink-soft); font-size: .8rem; font-weight: 600; }
  .comptes-table .inline-form input[type="password"] { flex: 1 1 160px; min-width: 0; }
  /* Cases « Pages accessibles » (fiche et formulaire de création) : une par ligne, case à gauche du libellé */
  .access-form, .pages-fieldset { flex-direction: column; align-items: flex-start; gap: .35rem; }
  .checkbox-label { display: flex; align-items: flex-start; gap: .4rem; }
  .checkbox-label input { flex: none; margin-top: .15rem; }
  .inline-form .checkbox-label, .form-grid .checkbox-label { align-items: flex-start; }
  /* Tableau des cotisations / dons dans la fenêtre : resserré, boutons Modif. / Suppr. l'un sous l'autre */
  .cotis-table { table-layout: auto; }
  .cotis-table th, .cotis-table td { padding: .35rem .25rem; font-size: .8rem; white-space: normal; overflow: visible; text-overflow: clip; }
  .cotis-table td:last-child { white-space: normal !important; text-align: right; }
  .cotis-table td:last-child .link-btn { display: block; margin-left: auto; padding: .1rem 0; }
}


/* Fil d'Ariane (fil_ariane() dans app/includes/functions.php) : « Administration › page » */
.fil-ariane { font-size: .84rem; margin: -.3rem 0 1rem; }
.fil-ariane ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .45rem; }
.fil-ariane li { display: flex; align-items: center; gap: .45rem; color: var(--ink-soft); }
.fil-ariane li + li::before { content: "›"; color: var(--ink-soft); font-size: 1rem; line-height: 1; }
.fil-ariane a { color: var(--green-dark); text-decoration: none; }
.fil-ariane a:hover { text-decoration: underline; }
.fil-ariane [aria-current] { color: var(--ink); font-weight: 600; }
@media print { .fil-ariane { display: none; } }

/* ---- Comptabilité, onglet Stocks (livres et autres articles) ---- */
#panel-stocks .panel-actions { gap: .5rem; flex-wrap: wrap; }
.stock-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.stock-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 1.1rem 1.25rem; display: flex; flex-direction: column; }
.stock-card header { margin-bottom: .3rem; }
.stock-card h3 { margin: .1rem 0 0; font-size: 1.05rem; color: var(--green-dark); }
.stock-categorie { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-soft); }
.stock-nombre { display: flex; align-items: baseline; gap: .5rem; margin: .3rem 0 .6rem; }
.stock-nombre strong { font-size: 2.2rem; line-height: 1; color: var(--green-dark); font-variant-numeric: tabular-nums; }
.stock-nombre span { color: var(--ink-soft); font-size: .9rem; }
.stock-ligne { display: flex; justify-content: space-between; gap: 1rem; padding: .3rem 0; font-size: .88rem; border-bottom: 1px dashed var(--border); }
.stock-ligne span { color: var(--ink-soft); }
.stock-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-top: auto; padding-top: .9rem; }
.stock-alerte { border-color: #d9a21b; border-left: 5px solid #d9a21b; }
.stock-avert { margin: 0 0 .5rem; font-size: .85rem; font-weight: 600; color: #8a5a00; }
.stock-inactif { opacity: .6; }
.stock-titre { margin: 0 0 .5rem; font-size: 1rem; }
/* Stocks : inventaire, article pas encore compté, courbe d'évolution, rappel dans le Journal */
.stock-inventaire { margin: -.3rem 0 .5rem; font-size: .8rem; color: var(--ink-soft); }
.stock-a-compter { color: #8a5a00; }
.stock-non-compte strong { color: var(--ink-soft); }
.stock-courbe { margin: 0 0 .5rem; }
.stock-courbe svg { width: 100%; height: auto; display: block; }
.stock-courbe figcaption { font-size: .7rem; color: var(--ink-soft); text-align: center; }
.stock-courbe-zero { stroke: var(--border); stroke-width: 1; stroke-dasharray: 3 3; }
.stock-courbe-trait { stroke: var(--green-dark); stroke-width: 2; stroke-linejoin: round; }
.stock-courbe-point { fill: var(--green-dark); }
.stock-courbe-valeur { font-size: 9px; font-weight: 700; fill: var(--green-dark); }
.stock-courbe-mois { font-size: 7px; fill: var(--ink-soft); }
.stock-ecart { font-size: .78rem; font-weight: 600; margin-left: .3rem; color: var(--ink-soft); }
.stock-ligne-inventaire td { background: rgba(0, 0, 0, .025); }
.stock-rappel { margin: -.3rem 0 0; padding: .5rem .7rem; background: var(--amber-light); border-radius: 8px; color: var(--ink); opacity: 1; }
.stock-rappel[hidden] { display: none; }
.stock-plus { color: var(--green-dark); font-weight: 700; }
.stock-moins { color: var(--red); font-weight: 700; }
#stockMvtTable td { white-space: normal; overflow: visible; text-overflow: clip; }
#stockMvtTable td:nth-child(4), #stockMvtTable th:nth-child(4) { text-align: right; white-space: nowrap; }
.stock-vente { background: var(--bg); border: 1px solid var(--border); border-radius: 8px; padding: .7rem .8rem; }
.stock-vente .form-grid { margin-top: .6rem; }
/* Case « Créer l'écriture » : case à gauche de son libellé (et non centrée au-dessus) */
.form-grid .stock-creer { flex-direction: row; align-items: center; justify-content: flex-start; gap: .5rem; color: var(--ink); font-size: .9rem; font-weight: 600; white-space: normal; }
.form-grid .stock-creer input { flex: none; width: auto; margin: 0; }
.stock-vente[hidden], .stock-vente .form-grid[hidden] { display: none; }

/* Téléphone : un mouvement par fiche */
@media (max-width: 720px) {
  #stockMvtTable thead { display: none; }
  #stockMvtTable, #stockMvtTable tbody, #stockMvtTable tr, #stockMvtTable td { display: block; width: auto !important; }
  #stockMvtTable tr { padding: .7rem .8rem; border-bottom: 1px solid var(--border); }
  #stockMvtTable td { padding: .1rem 0; border: none; text-align: left !important; white-space: normal; overflow-wrap: anywhere; }
  #stockMvtTable td:empty { display: none; }
  #stockMvtTable td:nth-child(1) { color: var(--ink-soft); font-size: .82rem; }
  #stockMvtTable td[data-label]::before { content: attr(data-label) " : "; color: var(--ink-soft); font-size: .82rem; font-weight: 400; }
  #panel-stocks .panel-actions { justify-content: flex-start; }
}

@media print {
  .stock-grid { grid-template-columns: repeat(3, 1fr); gap: .5rem; }
  .stock-card { padding: .5rem .6rem; border-color: #ccc; break-inside: avoid; opacity: 1; }
  .stock-card h3 { font-size: .85rem; }
  .stock-nombre strong { font-size: 1.4rem; }
  .stock-ligne { font-size: .7rem; padding: .15rem 0; }
  #stockMvtTable th, #stockMvtTable td { font-size: .7rem; padding: .2rem .3rem; }
  #panel-stocks .subtitle { display: none; }
}

/* Entrepôt : fichiers cochés pour « Envoyer par mail » */
.file-check { width: 1.05rem; height: 1.05rem; vertical-align: middle; margin: 0 .35rem 0 0; cursor: pointer; }
.selection-bar { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; padding: .7rem .9rem; margin: 0 0 1rem;
  background: var(--green-light); border-radius: 10px; }
.selection-bar #selectionInfo { font-weight: 600; margin-right: auto; }
.selection-hint { flex-basis: 100%; margin: 0; font-size: .85rem; }
#fichiersTable tbody tr.file-checked { background: var(--green-light); }