/* ============ TOKENS — palette dérivée des deux logos (rouge/grenat + or) ============ */
:root{
  --bg:#f2f2f5;
  --surface:#ffffff;
  --surface-2:#f8f6ef;
  --surface-3:#efece1;
  --border:#dcdcdf;
  --border-strong:#c7c6c2;
  --text:#201a18;
  --text-muted:#645d54;
  --text-faint:#928a7e;
  --accent:#8a0e0c;
  --accent-hover:#6e0b09;
  --accent-contrast:#ffffff;
  --accent-soft:#f5e0df;
  --gold:#a37a12;
  --gold-soft:#f7ecd2;
  --gold-bright:#ffde59;
  --focus:#2a5fb0;
  --good:#2c6b40;
  --good-soft:#e1f0e4;
  --warn:#a15d0a;
  --warn-soft:#f8edd6;
  --neutral:#5c5650;
  --neutral-soft:#ece8e0;
  --teal:#0d6e6f;
  --teal-soft:#dcf0ef;
  --deceased:#4d4650;
  --deceased-soft:#e7e4ea;
  --npai:#b3261e;
  --npai-soft:#fbe4e2;
  --danger:#c81e1e;
  --danger-hover:#a8180f;
  --shadow-s:0 1px 2px rgba(30,20,15,.06);
  --shadow-m:0 6px 24px -10px rgba(30,20,15,.28);
  --radius-s:6px;
  --radius-m:10px;
  --radius-l:18px;
  --font-display:Georgia,'Iowan Old Style','Times New Roman',serif;
  --font-body:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#171512; --surface:#211d19; --surface-2:#2a251e; --surface-3:#332c22;
    --border:#3c352b; --border-strong:#4b4235; --text:#f1ece1; --text-muted:#c2b8a7; --text-faint:#8e8375;
    --accent:#e2716c; --accent-hover:#ea8a85; --accent-contrast:#2a0f0d; --accent-soft:#3c211f;
    --gold:#e2b654; --gold-soft:#3a2f18; --gold-bright:#ffde59;
    --focus:#8fb4f0;
    --good:#79c592; --good-soft:#1f3324;
    --warn:#e3b45a; --warn-soft:#3a2f16;
    --neutral:#bdb4a6; --neutral-soft:#33302a;
    --teal:#5fc9c9; --teal-soft:#173231;
    --deceased:#b6adc0; --deceased-soft:#302a37;
    --npai:#f08b85; --npai-soft:#3a1917;
    --danger:#e5534b; --danger-hover:#ef6f68;
    --shadow-s:0 1px 2px rgba(0,0,0,.3); --shadow-m:0 10px 30px -12px rgba(0,0,0,.6);
  }
}
:root[data-theme="dark"]{
  --bg:#171512; --surface:#211d19; --surface-2:#2a251e; --surface-3:#332c22;
  --border:#3c352b; --border-strong:#4b4235; --text:#f1ece1; --text-muted:#c2b8a7; --text-faint:#8e8375;
  --accent:#e2716c; --accent-hover:#ea8a85; --accent-contrast:#2a0f0d; --accent-soft:#3c211f;
  --gold:#e2b654; --gold-soft:#3a2f18; --gold-bright:#ffde59;
  --focus:#8fb4f0;
  --good:#79c592; --good-soft:#1f3324;
  --warn:#e3b45a; --warn-soft:#3a2f16;
  --neutral:#bdb4a6; --neutral-soft:#33302a;
  --teal:#5fc9c9; --teal-soft:#173231;
  --deceased:#b6adc0; --deceased-soft:#302a37;
  --npai:#f08b85; --npai-soft:#3a1917;
  --danger:#e5534b; --danger-hover:#ef6f68;
  --shadow-s:0 1px 2px rgba(0,0,0,.3); --shadow-m:0 10px 30px -12px rgba(0,0,0,.6);
}
@media (prefers-reduced-motion: reduce){ *{ animation:none !important; transition:none !important; } }

*{box-sizing:border-box;}
[hidden]{display:none !important;}
html,body{height:100%;}
body{
  background:var(--bg); color:var(--text); font-family:var(--font-body);
  font-size:14px; line-height:1.45; margin:0; padding:0 20px 60px;
}
h1,h2,h3{font-family:var(--font-display); font-weight:600; margin:0; text-wrap:balance;}
button, input, select, textarea{font-family:inherit; font-size:inherit; color:inherit;}
table{font-variant-numeric:tabular-nums;}
a{color:var(--accent);}

.app{max-width:1280px; margin:0 auto;}

/* ---------- topbar ---------- */
.topbar{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:22px 24px; margin:20px 0 18px;
  background:linear-gradient(180deg,var(--surface-2),var(--surface));
  border:1px solid var(--border); border-radius:var(--radius-l);
  box-shadow:var(--shadow-s); flex-wrap:wrap;
}
.brand{display:flex; align-items:center; gap:16px; flex-wrap:wrap;}
.brand-logos{display:flex; align-items:center; gap:10px;}
.brand-logos img{width:64px; height:64px; object-fit:contain; border-radius:8px; background:#fff; box-shadow:var(--shadow-s); border:1px solid var(--border);}
.brand-text h1{font-size:1.5rem; color:var(--accent); letter-spacing:.01em;}
.h1-sub{display:block; font-size:.62em; font-weight:400; color:var(--text-muted); letter-spacing:0; margin-top:2px;}
.brand-text p{margin:2px 0 0; color:var(--text-muted); font-size:.86rem;}
.topbar-actions{display:flex; align-items:center; gap:10px; position:relative;}
.whoami{font-size:.8rem; color:var(--text-muted); background:var(--surface-3); border:1px solid var(--border); border-radius:999px; padding:6px 12px; display:flex; gap:6px; align-items:center; cursor:pointer;}
.whoami:hover{border-color:var(--border-strong);}
.user-menu{position:absolute; right:0; top:calc(100% + 6px); background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m); box-shadow:var(--shadow-m); min-width:200px; z-index:60; overflow:hidden;}
.user-menu button{display:block; width:100%; text-align:left; background:none; border:none; padding:10px 14px; cursor:pointer; color:var(--text); font-size:.86rem; font-weight:500;}
.user-menu button:hover{background:var(--surface-3); color:var(--accent);}

/* ---------- stats ---------- */
.stats{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; margin-bottom:18px;}
.stat-tile{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m); padding:14px 16px; box-shadow:var(--shadow-s); display:flex; flex-direction:column; gap:4px;}
.stat-tile .n{font-family:var(--font-display); font-size:1.7rem; font-weight:600; line-height:1;}
.stat-tile .l{font-size:.76rem; color:var(--text-muted); text-transform:uppercase; letter-spacing:.05em; display:flex; align-items:center; gap:6px;}
.stat-tile img{width:22px; height:22px; object-fit:contain; border-radius:4px;}
.stat-tile.accent .n{color:var(--accent);}
.stat-tile.statuses{grid-column:span 2;}
.status-chip-row{display:flex; flex-wrap:wrap; gap:6px; margin-top:2px;}
.status-legend{font-size:.7rem; color:var(--text-faint); margin-top:6px; text-transform:none; letter-spacing:0;}

.stat-tile[data-stat]{position:relative; cursor:pointer; transition:border-color .15s, box-shadow .15s, background-color .15s;}
.stat-tile[data-stat]:hover{border-color:var(--accent);}
.stat-tile[data-stat]:focus-visible{outline:2px solid var(--focus); outline-offset:1px;}
.stat-tile[data-stat].active{
  background:var(--accent-soft);
  border-color:var(--accent);
  box-shadow:inset 4px 0 0 var(--accent), var(--shadow-s);
  padding-left:14px;
}
.stat-tile[data-stat].active .n{color:var(--accent);}
.stat-tile[data-stat].active .l{color:var(--accent); font-weight:700;}
.stat-tile[data-stat].active::after{
  content:"✓"; position:absolute; top:10px; right:10px; width:20px; height:20px;
  border-radius:50%; background:var(--accent); color:var(--accent-contrast);
  font-size:.7rem; font-weight:700; line-height:20px; text-align:center;
}
#stats .status-badge[data-statut]{cursor:pointer; border:1px solid transparent; transition:transform .1s, border-color .15s, box-shadow .15s;}
#stats .status-badge[data-statut]:hover{filter:brightness(0.95);}
#stats .status-badge[data-statut]:focus-visible{outline:2px solid var(--focus); outline-offset:1px;}
#stats .status-badge[data-statut].active{
  border-color:currentColor;
  box-shadow:0 0 0 2px currentColor;
  font-weight:800;
  transform:scale(1.08);
}

/* ---------- toolbar ---------- */
.toolbar{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:12px;}
.search-wrap{flex:1 1 240px; min-width:180px;}
.search-wrap input{width:100%;}
.toolbar-actions{display:flex; gap:8px; flex-wrap:wrap; align-items:center; position:relative;}

input[type=text], input[type=search], input[type=date], input[type=password], input[type=number], input[type=email], input[type=tel], select, textarea{
  background:var(--surface); border:1px solid var(--border-strong); border-radius:var(--radius-s);
  padding:8px 10px; color:var(--text); outline-offset:1px;
}
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible{ outline:2px solid var(--focus); outline-offset:1px; }
textarea{resize:vertical; min-height:56px; font-family:inherit;}
label{font-size:.78rem; color:var(--text-muted); font-weight:600; text-transform:uppercase; letter-spacing:.03em; display:block; margin-bottom:4px;}

.btn{
  border:1px solid var(--border-strong); background:var(--surface); color:var(--text);
  border-radius:var(--radius-s); padding:9px 14px; cursor:pointer; font-weight:600; font-size:.86rem;
  display:inline-flex; align-items:center; gap:6px; white-space:nowrap;
}
.btn:hover{border-color:var(--accent); color:var(--accent);}
.btn-primary{background:var(--accent); border-color:var(--accent); color:var(--accent-contrast);}
.btn-primary:hover{background:var(--accent-hover); border-color:var(--accent-hover); color:var(--accent-contrast);}
.btn-outline{background:transparent;}
.btn-ghost{background:transparent; border-color:transparent;}
.btn-danger{background:var(--danger); border-color:var(--danger); color:#fff;}
.btn-danger:hover{background:var(--danger-hover); border-color:var(--danger-hover); color:#fff;}
.btn:disabled{opacity:.45; cursor:not-allowed;}
.btn:disabled:hover{color:var(--text); border-color:var(--border-strong);}
.btn-block{width:100%; justify-content:center;}
.count-pill{background:var(--accent); color:var(--accent-contrast); border-radius:999px; font-size:.68rem; padding:1px 7px; margin-left:2px;}

.menu-wrap{position:relative;}
.menu{position:absolute; right:0; top:calc(100% + 6px); background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m); box-shadow:var(--shadow-m); min-width:210px; z-index:40; overflow:hidden;}
.menu button{display:block; width:100%; text-align:left; background:none; border:none; padding:10px 14px; cursor:pointer; color:var(--text); font-size:.86rem; font-weight:500;}
.menu button:hover{background:var(--surface-3); color:var(--accent);}

/* ---------- filter panel ---------- */
.filter-panel{background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-m); padding:16px 18px; margin-bottom:14px; box-shadow:var(--shadow-s);}
.filter-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:14px;}
.chip-group{display:flex; flex-wrap:wrap; gap:6px;}
.chip{border:1px solid var(--border-strong); background:var(--surface); border-radius:999px; padding:5px 11px; font-size:.78rem; cursor:pointer; user-select:none;}
.chip.active{background:var(--accent); border-color:var(--accent); color:var(--accent-contrast);}
.filter-actions{display:flex; justify-content:space-between; align-items:center; margin-top:14px; padding-top:12px; border-top:1px solid var(--border);}
details.adv summary{cursor:pointer; font-size:.8rem; color:var(--text-muted); font-weight:600; margin-top:10px;}
.date-range{display:flex; gap:6px; align-items:center;}
.date-range input{width:100%; min-width:0;}

.results-meta{font-size:.82rem; color:var(--text-muted); margin:2px 0 10px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px;}

/* ---------- table ---------- */
.table-wrap{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m); box-shadow:var(--shadow-s); overflow:hidden;}
.table-scroll{overflow-x:auto;}
table{width:100%; border-collapse:collapse;}
#dataTable{min-width:920px;}
thead th{position:sticky; top:0; background:var(--surface-2); text-align:left; font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; color:var(--text-muted); padding:10px 12px; border-bottom:1px solid var(--border); white-space:nowrap; cursor:pointer;}
thead th:hover{color:var(--accent);}
thead th.nosort{cursor:default;}
thead th.nosort:hover{color:var(--text-muted);}
tbody td{padding:10px 12px; border-bottom:1px solid var(--border); vertical-align:middle;}
tbody tr:last-child td{border-bottom:none;}
tbody tr:hover{background:var(--surface-2);}
.row-clickable{cursor:pointer;}
.row-clickable:focus-visible{outline:2px solid var(--focus); outline-offset:-2px;}
.name-cell{font-weight:600;}
.muted-cell{color:var(--text-muted);}
.email-link{color:var(--accent); text-decoration:none;}
.email-link:hover{text-decoration:underline;}
.address-cell{color:var(--text-muted); max-width:240px;}
.bool-yes{color:var(--good); font-weight:700;}
.bool-no{color:var(--text-faint);}
.row-actions{display:flex; gap:6px;}
.icon-btn{background:none; border:1px solid transparent; border-radius:var(--radius-s); padding:5px 8px; cursor:pointer; color:var(--text-muted);}
.icon-btn:hover{background:var(--surface-3); color:var(--accent); border-color:var(--border);}

.status-badge{display:inline-flex; align-items:center; padding:3px 9px; border-radius:999px; font-size:.72rem; font-weight:700; letter-spacing:.02em; white-space:nowrap;}
.st-VALIDE{background:var(--good-soft); color:var(--good);}
.st-NPAI{background:var(--npai-soft); color:var(--npai);}
.st-DEMISSION{background:var(--neutral-soft); color:var(--neutral);}
.st-MEMBRE_HONORAIRE{background:var(--gold-soft); color:var(--gold);}
.st-PARRAIN_PROMO{background:var(--teal-soft); color:var(--teal);}
.st-DECEDE{background:var(--deceased-soft); color:var(--deceased); font-style:italic;}

.empty-state{padding:60px 20px; text-align:center; color:var(--text-muted);}
.empty-state h3{font-size:1.15rem; margin-bottom:6px; color:var(--text);}
.empty-state .btn{margin-top:14px;}

/* ---------- pagination ---------- */
.pagination{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; margin-top:14px;}
.pagination-size{display:flex; align-items:center; gap:8px;}
.pagination-size label{margin-bottom:0; white-space:nowrap;}
.pagination-size select{width:auto; padding:6px 8px;}
.pagination-nav{display:flex; align-items:center; gap:6px; flex-wrap:wrap;}
.pagination-nav .btn{padding:6px 10px; font-size:.8rem;}
.pagination-indicator{font-size:.82rem; color:var(--text-muted); padding:0 4px; white-space:nowrap;}

/* ---------- modal ---------- */
.modal-overlay{position:fixed; inset:0; background:rgba(20,16,12,.45); display:flex; align-items:flex-start; justify-content:center; padding:5vh 16px; z-index:100; overflow-y:auto;}
.modal{background:var(--surface); border-radius:var(--radius-l); border:1px solid var(--border); box-shadow:var(--shadow-m); width:100%; max-width:640px; padding:24px; margin-bottom:40px;}
.modal.wide{max-width:820px;}
.modal.narrow{max-width:420px;}
.modal.form-wide{max-width:920px;}
.modal-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; gap:10px;}
.modal-head h2{font-size:1.2rem; color:var(--accent);}
.modal-close{background:none; border:none; font-size:1.3rem; cursor:pointer; color:var(--text-muted); line-height:1; padding:4px;}
.modal-close:hover{color:var(--accent);}
.form-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:14px;}
.form-grid .span2{grid-column:1/-1;}
#formFieldsGrid{grid-template-columns:repeat(3,1fr); column-gap:20px;}
.field-check{display:flex; align-items:center; gap:8px; margin-top:6px;}
.field-check input{width:16px; height:16px;}
.field-check label{margin:0; text-transform:none; font-weight:500; color:var(--text);}
.adherent-group{display:flex; align-items:center; gap:12px; border:1px solid var(--border); border-radius:var(--radius-m); background:var(--surface-2); padding:10px 14px;}
.adherent-group-main{flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:6px;}
.adherent-group .field-check{margin-top:0;}
.adherent-date-label{margin:0;}
.adherent-date{width:100%;}
.adherent-logo{width:42px; height:42px; object-fit:contain; flex:none;}
.modal-foot{display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px; margin-top:20px; padding-top:16px; border-top:1px solid var(--border);}
#btnDeleteFromForm{margin-right:auto;}
.form-meta{font-size:.76rem; color:var(--text-faint); margin-top:16px;}

.step-title{font-weight:700; margin:0 0 10px; font-size:.95rem; color:var(--accent);}
.import-table{width:100%; border-collapse:collapse; font-size:.82rem; margin-bottom:6px;}
.import-table th, .import-table td{padding:6px 8px; border-bottom:1px solid var(--border); text-align:left;}
.import-table select{width:100%;}
.radio-row{display:flex; gap:18px; margin:10px 0;}
.radio-row label{display:flex; align-items:center; gap:6px; text-transform:none; font-weight:500; color:var(--text); font-size:.86rem;}
.progress-bar{height:8px; background:var(--surface-3); border-radius:999px; overflow:hidden; margin:10px 0;}
.progress-bar > div{height:100%; background:var(--accent); width:0%; transition:width .2s;}
.col-checks{display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:8px; margin:10px 0 4px;}
.col-checks label{display:flex; align-items:center; gap:6px; text-transform:none; font-weight:500; color:var(--text); font-size:.84rem;}
.banner{padding:10px 14px; border-radius:var(--radius-s); font-size:.82rem; margin-bottom:14px;}
.banner.warn{background:var(--warn-soft); color:var(--warn);}
.banner.good{background:var(--good-soft); color:var(--good);}
#maintenanceAdminBanner{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.btn-banner{margin-left:auto; padding:4px 12px; font-size:.78rem;}

.filter-active-note{color:var(--danger); font-weight:700;}

.users-table{width:100%; border-collapse:collapse; font-size:.86rem; margin-bottom:14px;}
.users-table th, .users-table td{padding:8px 10px; border-bottom:1px solid var(--border); text-align:left;}
.badge-admin{background:var(--gold-soft); color:var(--gold); font-size:.68rem; padding:2px 7px; border-radius:999px; font-weight:700;}

.toast{position:fixed; bottom:22px; left:50%; transform:translateX(-50%); background:var(--text); color:var(--bg); padding:11px 18px; border-radius:999px; font-size:.85rem; box-shadow:var(--shadow-m); z-index:200;}

footer.page-footer{text-align:center; color:var(--text-faint); font-size:.74rem; margin-top:26px;}

@media (max-width:960px){
  #formFieldsGrid{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:640px){
  body{padding:0 12px 40px;}
  .form-grid{grid-template-columns:1fr;}
  #formFieldsGrid{grid-template-columns:1fr;}
  .stat-tile.statuses{grid-column:1/-1;}
  .topbar{padding:16px;}
  .brand-text h1{font-size:1.25rem;}
  #btnDeleteFromForm{width:100%; margin-right:0; order:-1; margin-bottom:6px;}
  .col-hide-mobile{display:none;}
  #dataTable{width:100%; min-width:0;}
  #dataTable th{white-space:normal;}
  .pagination{justify-content:center; text-align:center;}
  .pagination-size{width:100%; justify-content:center;}
  .pagination-nav{width:100%; justify-content:center;}
}

/* ---------- login page ---------- */
.login-wrap{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;}
.login-card{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); box-shadow:var(--shadow-m); padding:32px; width:100%; max-width:380px;}
.login-logos{display:flex; justify-content:center; gap:12px; margin-bottom:16px;}
.login-logos img{width:78px; height:78px; object-fit:contain; border-radius:10px; border:1px solid var(--border); background:#fff;}
.login-card h1{font-size:1.3rem; color:var(--accent); text-align:center; margin-bottom:4px;}
.login-card p.sub{text-align:center; color:var(--text-muted); font-size:.84rem; margin:0 0 22px;}
.login-version{text-align:center; color:var(--text-faint); font-size:.72rem; margin:-14px 0 18px;}
.login-field{margin-bottom:14px;}
.login-field input{width:100%;}
.login-error{background:var(--warn-soft); color:var(--warn); border-radius:var(--radius-s); padding:9px 12px; font-size:.82rem; margin-bottom:14px;}

/* ---------- maintenance screen ---------- */
.maintenance-screen{position:fixed; inset:0; background:var(--bg); z-index:500; display:flex; align-items:center; justify-content:center; padding:24px;}
.maintenance-box{background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-l); box-shadow:var(--shadow-m); padding:36px 32px; width:100%; max-width:420px; text-align:center;}
.maintenance-box h1{font-size:1.3rem; color:var(--accent); margin-bottom:14px;}
.maintenance-box p{color:var(--text-muted); font-size:.9rem; margin-bottom:20px; white-space:pre-wrap;}