/* ════════════════════════════════════════════════════════════════════════════
   admin.css — refonte admin phase 2 (modifs145). Tout est scopé sous .admin-rail
   pour ne rien casser du reste du site. Tokens : css/tokens.css (--teal, --n*, …).
   ════════════════════════════════════════════════════════════════════════════ */
.admin-rail{--hdr:0px;--px:16px;--divider:var(--border)}
body.is-desktop .scroll-page.admin-wide{max-width:none}   /* admin en PLEINE LARGEUR desktop (rail collé à gauche) — modifs153, demande Paul */
.admin-rail *{box-sizing:border-box}
.admin-rail .shell{display:grid;grid-template-columns:220px 1fr;gap:0;max-width:none;margin:0;padding-left:26px;min-height:calc(100vh - 60px)}
.admin-rail .rail{background:var(--teal-800);color:#fff;padding:16px 12px 70px;display:flex;flex-direction:column;gap:3px;position:sticky;top:0;align-self:start;height:calc(100vh - 60px);overflow:visible}
.admin-rail .rt-title{font-family:var(--font-d);font-weight:800;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:rgba(255,255,255,.55);padding:2px 10px 7px}
.admin-rail .rt-sub{margin-top:11px}
.admin-rail .rail>button{display:flex;align-items:center;gap:10px;border:none;background:none;cursor:pointer;font-family:var(--font);font-size:13.5px;font-weight:600;color:rgba(255,255,255,.92);padding:10px 11px;border-radius:10px;text-align:left;width:100%;border-left:3px solid transparent}
.admin-rail .rail>button.sub{padding-left:26px;font-size:13px}
.admin-rail .rail>button .ic{width:18px;flex-shrink:0;display:inline-flex;color:#fff}
.admin-rail .rail>button .ic svg{width:18px;height:18px}
.admin-rail .rail>button:hover{background:rgba(255,255,255,.09)}
.admin-rail .rail>button.on{background:rgba(255,255,255,.14);color:#fff;font-weight:800;border-left-color:var(--yellow)}
.admin-rail .rail-foot{margin-top:auto;border-top:1px solid rgba(255,255,255,.16);padding-top:12px}
.admin-rail .main{background:#fff;padding:18px 22px 40px;min-width:0}

.admin-rail .page-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.admin-rail .page-head h1{font-family:var(--font-d);font-weight:800;font-size:19px;text-transform:uppercase;letter-spacing:.03em;color:var(--teal-800);margin:0}
.admin-rail .spacer{flex:1}

.admin-rail .btn2{height:36px;padding:0 15px;border-radius:9999px;border:none;font-family:var(--font);font-size:13px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:6px;justify-content:center;white-space:nowrap}
.admin-rail .btn-teal2{background:var(--teal);color:#fff}
.admin-rail .btn-yellow2{background:var(--yellow);color:var(--teal-800)}
.admin-rail .btn-outline2{background:#fff;color:var(--teal);border:1.5px solid oklch(0.70 0.08 183)}
.admin-rail .btn-sm2{height:30px;font-size:12px;padding:0 11px}
.admin-rail .field{font-family:var(--font);font-size:13px;padding:8px 11px;border:1.5px solid var(--border);border-radius:9px;background:#fff;color:var(--n900)}
.admin-rail .seg{display:inline-flex;background:var(--n100);border-radius:9999px;padding:3px;gap:2px;flex-wrap:wrap}
.admin-rail .seg button{border:none;background:none;height:30px;padding:0 13px;border-radius:9999px;font-family:var(--font);font-size:12.5px;font-weight:700;color:var(--n600);cursor:pointer}
.admin-rail .seg button.on{background:var(--teal);color:#fff}
.admin-rail .filterwrap{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.admin-rail .daterange{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.admin-rail .daterange .dr-l{font-size:12px;font-weight:700;color:var(--n600)}
.admin-rail .daterange .dr-days{font-size:11.5px;font-weight:800;color:var(--teal-800);background:var(--teal-lite);border:1.5px solid var(--teal-100);border-radius:9999px;padding:3px 10px}

.admin-rail .switch{display:inline-block;width:42px;height:24px;border-radius:9999px;border:none;position:relative;cursor:pointer;flex:0 0 auto;background:var(--n200);padding:0}
.admin-rail .switch.on{background:var(--teal)}
.admin-rail .switch i{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.3);transition:left .15s}
.admin-rail .switch.on i{left:21px}

/* Table */
.admin-rail .tbl-wrap{border:1.5px solid var(--border);border-radius:13px;overflow:auto;background:#fff}
.admin-rail table.tbl{width:100%;border-collapse:collapse;min-width:540px}
.admin-rail .tbl thead th{background:var(--n100);text-align:left;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--n600);font-weight:800;padding:9px 11px;white-space:nowrap}
.admin-rail .tbl tbody td{padding:9px 11px;border-top:1px solid var(--divider);font-size:12.5px;vertical-align:middle}
.admin-rail .tbl tbody tr.clickrow{cursor:pointer}
.admin-rail .tbl tbody tr.clickrow:hover>td{background:var(--teal-lite)}
.admin-rail .tbl tbody tr.bad{background:var(--red-bg)}
.admin-rail .pill{display:inline-block;font-size:10.5px;font-weight:800;border-radius:9999px;padding:2px 9px;white-space:nowrap}
.admin-rail .pill.g{background:var(--green-bg);color:var(--green-text)}
.admin-rail .pill.r{background:var(--red-bg);color:var(--red-text)}
.admin-rail .pill.mute{background:var(--n100);color:var(--n500)}
.admin-rail .pill.teal{background:var(--teal);color:#fff}
.admin-rail .pill.yel{background:var(--yellow-bg);color:var(--yellow-text)}
.admin-rail .em{color:var(--n600);word-break:break-all}
.admin-rail .num{font-variant-numeric:tabular-nums}
.admin-rail .dots{width:30px;height:30px;border:1.5px solid var(--border);background:#fff;border-radius:8px;cursor:pointer;color:var(--n600);font-size:16px;line-height:1}
/* A4 : « … » de ligne SANS contour + « vous » (self) + icône d'action borderless (A5/A6) */
.admin-rail .rowmenu-btn{width:30px;height:30px;border:none;background:none;border-radius:8px;cursor:pointer;color:var(--n500);font-size:19px;line-height:1;display:inline-flex;align-items:center;justify-content:center}
.admin-rail .rowmenu-btn:hover{background:var(--n100);color:var(--n800)}
.admin-rail .selfmark{color:var(--n400);font-size:11.5px}
.admin-rail .rowico{border:none;background:none;color:var(--n500);cursor:pointer;display:inline-flex;align-items:center;padding:5px;border-radius:7px;font-size:15px;line-height:1}
.admin-rail .rowico:hover{color:var(--n800);background:var(--n100)}
/* A4 : popover d'actions de ligne (posé au body, positionné en JS — HORS .admin-rail) */
.rowmenu-pop{position:fixed;z-index:6000;min-width:214px;background:#fff;border:1.5px solid var(--border);border-radius:13px;box-shadow:var(--shadow-pop,0 12px 34px rgba(0,0,0,.16));padding:6px;font-family:var(--font)}
.rowmenu-pop button{display:flex;align-items:center;gap:10px;width:100%;border:none;background:none;text-align:left;font-family:var(--font);font-size:13px;font-weight:600;color:var(--n800);padding:9px 10px;border-radius:9px;cursor:pointer}
.rowmenu-pop button:hover{background:var(--n100)}
.rowmenu-pop button.sep{border-top:1px solid var(--divider);margin-top:4px;padding-top:11px}
.rowmenu-pop button.danger{color:var(--red-text,oklch(0.5 0.18 25))}
.rowmenu-pop button .rmi{width:18px;flex:0 0 auto;display:inline-flex;justify-content:center}
.rowmenu-pop button .rmi svg{width:16px;height:16px}

/* Cards + KPIs + charts */
.admin-rail .card{background:#fff;border:1.5px solid var(--border);border-radius:12px;padding:12px 14px;margin-bottom:10px}
.admin-rail .card-hd{display:flex;align-items:center;gap:10px;margin-bottom:4px;flex-wrap:wrap}
.admin-rail .card-hd h2{font-family:var(--font-d);font-weight:800;font-size:13px;color:var(--teal-800);margin:0;text-transform:uppercase;letter-spacing:.02em}
.admin-rail .card-note{font-size:11px;color:var(--n500);font-weight:600}
.admin-rail .card-sub{font-size:11px;color:var(--n500);font-weight:700;width:100%;margin:-2px 0 8px}
.admin-rail .kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:10px}
.admin-rail .kpi{background:#fff;border:1.5px solid var(--border);border-radius:12px;padding:10px 12px}
.admin-rail .kpi .k-l{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--n600);font-weight:800}
.admin-rail .kpi .k-v{font-family:var(--font-d);font-weight:800;font-size:19px;color:var(--n900);margin-top:3px;font-variant-numeric:tabular-nums;line-height:1}
.admin-rail .kpi .k-d{font-size:11px;font-weight:800;margin-top:5px}
.admin-rail .kpi .k-up{color:var(--green-text)} .admin-rail .kpi .k-mut{color:var(--n500)}
.admin-rail .chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.admin-rail .chart-svg{width:100%;height:auto;display:block;overflow:visible;font-family:var(--font)}
.admin-rail .chart-svg .bar{fill:var(--teal)}
.admin-rail .chart-svg .barlbl{fill:var(--n700);font-size:9.5px;font-weight:800}
.admin-rail .chart-svg .axlbl{fill:var(--n500);font-size:9px;font-weight:700}
.admin-rail .chart-svg .grid-ln{stroke:var(--divider);stroke-width:1}
.admin-rail .chart-svg .area-fill{fill:var(--teal);opacity:.13}
.admin-rail .chart-svg .area-ln{stroke:var(--teal);stroke-width:2;fill:none;stroke-linejoin:round;stroke-linecap:round}
.admin-rail .chart-svg .dot-o{fill:#fff;stroke:var(--teal);stroke-width:2}
.admin-rail .hbars{display:flex;flex-direction:column;gap:7px;margin-top:2px}
.admin-rail .hbar-row{display:flex;align-items:center;gap:10px}
.admin-rail .hbar-row .hb-l{width:170px;flex:0 0 auto;font-size:12px;font-weight:600;color:var(--n900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-rail .hbar-track{flex:1;height:16px;background:var(--n100);border-radius:6px;overflow:hidden}
.admin-rail .hbar-fill{display:block;height:100%;background:var(--teal);border-radius:6px;min-width:3px}
.admin-rail .hbar-row .hb-v{width:74px;flex:0 0 auto;text-align:right;font-size:12px;font-weight:800;color:var(--n700);font-variant-numeric:tabular-nums}
.admin-rail .srch-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.admin-rail .srch-row{display:flex;align-items:center;gap:9px;font-size:12px;padding:3px 0}
.admin-rail .srch-mode{flex:0 0 auto;font-size:9.5px;font-weight:800;text-transform:uppercase;border-radius:6px;padding:2px 7px}
.admin-rail .srch-mode.autour{background:var(--teal-lite);color:var(--teal-800)}
.admin-rail .srch-mode.trajet{background:var(--yellow-bg);color:var(--yellow-text)}
.admin-rail .srch-name{flex:1;font-weight:600;color:var(--n900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-rail .srch-v{flex:0 0 auto;font-weight:800;color:var(--n700)}

/* Feature pages (collapsibles) */
.admin-rail .feat-grid{display:grid;gap:9px;grid-template-columns:1fr 1fr}
.admin-rail details.feat-page{border:1.5px solid var(--border);border-radius:12px;background:#fff;overflow:hidden;min-width:0}
.admin-rail details.feat-page>summary{list-style:none;display:flex;align-items:center;gap:9px;padding:9px 12px;cursor:pointer;font-family:var(--font-d);font-weight:800;font-size:13px;color:var(--teal-800)}
.admin-rail details.feat-page>summary::-webkit-details-marker{display:none}
.admin-rail details.feat-page>summary .pg-name{flex:1}
.admin-rail details.feat-page>summary .chev{color:var(--n500);font-size:11px;transition:transform .15s}
.admin-rail details.feat-page[open]>summary .chev{transform:rotate(180deg)}
.admin-rail details.feat-page.pg-off>summary .pg-name{color:var(--n400)}
.admin-rail details.feat-page.pg-off .fp-body{opacity:.45;pointer-events:none}
.admin-rail .fp-body{border-top:1px solid var(--divider)}
.admin-rail .fp-body td,.admin-rail .fp-body th{padding:6px 12px;font-size:12px}
.admin-rail .acc-btn{height:26px;padding:0 12px;border-radius:9999px;border:1.5px solid var(--border);background:#fff;color:var(--n600);font-family:var(--font);font-size:11.5px;font-weight:800;cursor:pointer}
.admin-rail .acc-btn.prem{background:var(--teal);color:#fff;border-color:var(--teal)}
.admin-rail .page-lock{display:inline-flex;align-items:center;gap:5px;font-family:var(--font);font-weight:700;font-size:10.5px;color:var(--n500)}

/* Fiche compte (modale) */
.admin-rail-sheet-back{position:fixed;inset:0;z-index:5000;background:oklch(0.17 0.006 183/.45);display:flex;align-items:flex-start;justify-content:center;padding:34px 16px;overflow:auto}
.admin-rail-sheet-back .sheet{width:100%;max-width:540px;background:#fff;border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.25);display:flex;flex-direction:column;overflow:hidden}
.admin-rail-sheet-back .sheet-hd{display:flex;align-items:flex-start;gap:12px;padding:15px 18px;border-bottom:1px solid var(--divider)}
.admin-rail-sheet-back .sheet-title{font-family:var(--font-d);font-weight:800;font-size:16px;color:var(--teal-800)}
.admin-rail-sheet-back .sheet-sub{font-size:11.5px;color:var(--n500);font-weight:700;margin-top:3px}
.admin-rail-sheet-back .sheet-x{margin-left:auto;width:32px;height:32px;border:1.5px solid var(--border);background:#fff;border-radius:8px;cursor:pointer;color:var(--n600);font-size:14px}
.admin-rail-sheet-back .sheet-body{padding:15px 18px;display:flex;flex-direction:column;gap:12px}
.admin-rail-sheet-back .fld-l{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--n600);font-weight:800;margin-bottom:5px}
.admin-rail-sheet-back .fld-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.admin-rail-sheet-back .sheet-actions{display:flex;flex-wrap:wrap;gap:8px;padding:2px 18px 16px}
.admin-rail-sheet-back .mini{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border:1.5px solid var(--border);background:#fff;border-radius:9999px;cursor:pointer;font-family:var(--font);font-size:12px;font-weight:700;color:var(--n700)}
.admin-rail-sheet-back .mini.danger{color:var(--red-text);border-color:var(--red-bg)}
.admin-rail-sheet-back details.acc{border:1.5px solid var(--border);border-radius:12px;background:var(--n50)}
.admin-rail-sheet-back details.acc>summary{list-style:none;display:flex;align-items:center;gap:8px;padding:11px 13px;cursor:pointer}
.admin-rail-sheet-back details.acc>summary::-webkit-details-marker{display:none}
.admin-rail-sheet-back .acc-body{padding:2px 13px 13px;display:flex;flex-direction:column;gap:10px}

/* Panneau du bas (2FA + inscriptions) */
.admin-rail .foot-card{background:#fff;border-radius:12px;padding:8px}
.admin-rail .foot-row{display:flex;align-items:center;gap:9px;padding:7px 8px;font-size:12.5px;font-weight:600;color:var(--n900)}
.admin-rail .foot-row .sp{margin-left:auto}
.admin-rail .foot-hd{font-family:var(--font-d);font-weight:800;font-size:9.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--n500);padding:6px 8px 4px}
.admin-rail .sel-insc{width:calc(100% - 16px);margin:2px 8px;font-family:var(--font);font-size:12.5px;font-weight:700;color:var(--n900);border:1.5px solid var(--border);border-radius:9px;padding:8px 10px;background:#fff;cursor:pointer}
.admin-rail .code-row{display:flex;align-items:center;gap:6px;margin:6px 8px}
.admin-rail .code-row .code{white-space:nowrap;letter-spacing:.06em;font-size:12.5px;font-weight:800;color:var(--teal-800);background:var(--teal-lite);border:1.5px solid var(--teal-100);padding:5px 8px;border-radius:7px}

/* Plans éditables */
.admin-rail .plan-f{width:100%;max-width:150px;padding:7px 9px;font-size:12.5px}
.admin-rail .unit-wrap{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--n600);font-weight:700;white-space:nowrap}
.admin-rail .unit-wrap .plan-f{max-width:76px;text-align:right}
.admin-rail .plan-note{margin-top:5px;font-size:10.5px;font-weight:800;color:var(--yellow-text);background:#fff;border:1px solid var(--yellow-bdr);border-radius:8px;padding:3px 8px;display:inline-block}
.admin-rail .infocard{display:flex;align-items:flex-start;gap:11px;border-radius:12px;padding:11px 13px;margin-bottom:12px}
.admin-rail .infocard.warn{border:1.5px solid var(--yellow-bdr);background:var(--yellow-bg)}
.admin-rail .infocard .t{font-size:13px;font-weight:800;color:var(--n900)}
.admin-rail .infocard .d{font-size:11.5px;color:var(--n700);line-height:1.45;margin-top:2px}

/* #21 · Carte des utilisateurs (Leaflet) */
.admin-rail .adm-usermap{height:340px;margin-top:8px;border:1.5px solid var(--border);border-radius:12px;overflow:hidden;background:var(--n50)}
.admin-rail .adm-usermap .leaflet-container{height:100%;font-family:var(--font)}

/* #22 · colonnes masquables sur petit écran (tableau Plans : Durée, Abonnés) — base visible, masquée en mobile */
.admin-rail .hide-sm{display:table-cell}

/* Mobile : rail → onglets lisibles ; tableau COMPTES en cartes ; sheets plein écran ; grilles 1 col */
@media(max-width:760px){
  .admin-rail{--px:12px}
  .admin-rail .shell{grid-template-columns:1fr;padding-left:0;min-height:0}
  /* Onglets : barre horizontale à DÉFILEMENT, une seule rangée, icône + libellé visibles (l'icône seule était
     illisible). Le panneau du bas (2FA + inscriptions) repasse en pleine largeur SOUS les onglets. */
  .admin-rail .rail{flex-direction:row;flex-wrap:wrap;align-items:center;gap:6px;padding:9px 10px;border-radius:14px 14px 0 0;height:auto;position:static;align-self:auto;overflow:visible}
  .admin-rail .rail>button{width:auto;flex:0 0 auto;gap:7px;padding:8px 12px;font-size:12.5px;border-left:none;border-radius:9999px;background:rgba(255,255,255,.10)}
  .admin-rail .rail>button.sub{padding-left:12px;font-size:12.5px}
  .admin-rail .rail>button.on{background:var(--yellow);color:var(--teal-800)}
  .admin-rail .rail>button.on .ic{color:var(--teal-800)}
  .admin-rail .rail .lbl{display:inline;white-space:nowrap}
  .admin-rail .rail .rt-title,.admin-rail .rail .rt-sub{display:none}
  .admin-rail .rail-foot{width:100%;order:99;margin-top:6px;border-top:1px solid rgba(255,255,255,.16);padding-top:10px}
  .admin-rail .main{border-left:1.5px solid var(--border);border-radius:0 0 14px 14px;padding:14px 13px 34px}
  .admin-rail .page-head h1{font-size:16px}
  .admin-rail .card{padding:11px 12px}
  .admin-rail .kpis{grid-template-columns:1fr 1fr;gap:8px}
  .admin-rail .kpi{padding:9px 11px}
  .admin-rail .chart-grid,.admin-rail .srch-grid,.admin-rail .feat-grid,.admin-rail-sheet-back .fld-2{grid-template-columns:1fr}
  .admin-rail .adm-usermap{height:270px}
  /* Barres horizontales / listes de recherche : plus AUCUNE largeur fixe ne déborde (min-width:0 partout,
     libellé rétréci, valeur au contenu) → « Les plus fréquentes » & co. tiennent dans la carte. */
  /* Les CELLULES de grille (.srch-grid/.chart-grid > div) ont min-width:auto par défaut → elles refusent de
     rétrécir sous la largeur de leur contenu (une adresse/URL longue), et poussent la valeur hors écran.
     min-width:0 débloque l'ellipsis des .srch-name/.hb-l en dessous. (Cause du débordement « Les plus fréquentes ».) */
  .admin-rail .srch-grid>div,.admin-rail .chart-grid>div{min-width:0}
  .admin-rail .hbar-row,.admin-rail .srch-row{min-width:0}
  .admin-rail .hbar-row .hb-l{width:44%;min-width:0}
  .admin-rail .hbar-track{min-width:0}
  .admin-rail .hbar-row .hb-v{width:auto;min-width:40px}
  .admin-rail .srch-name{min-width:0}
  .admin-rail-sheet-back{padding:0}
  .admin-rail-sheet-back .sheet{max-width:none;min-height:100%;border-radius:0}
}
@media(max-width:600px){
  /* Colonnes secondaires du tableau Plans masquées (le reste tient sans coupe) */
  .admin-rail .hide-sm{display:none}
  /* Tableau COMPTES → CARTES empilées : plus de scroll horizontal ni de colonnes coupées.
     Chaque ligne devient un bloc ; chaque cellule affiche son intitulé (data-th) à gauche, la valeur à droite. */
  .admin-rail table.tbl-accts{min-width:0;display:block}   /* table.tbl-accts : même specificite que la base table.tbl (min-width:540) + plus loin dans le fichier → gagne */
  .admin-rail .tbl-accts thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .admin-rail .tbl-accts tbody{display:block}
  .admin-rail .tbl-accts tbody tr{display:block;border:1.5px solid var(--border);border-radius:12px;background:#fff;padding:11px 13px;margin-bottom:9px;position:relative}
  .admin-rail .tbl-accts tbody tr.bad{background:var(--red-bg);border-color:var(--red-bg)}
  .admin-rail .tbl-accts tbody td{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:none;padding:5px 0;font-size:13px}
  .admin-rail .tbl-accts tbody td[data-th]::before{content:attr(data-th);flex:0 0 auto;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--n500)}
  .admin-rail .tbl-accts tbody td.cell-acct{display:block;padding:0 30px 8px 0;margin-bottom:5px;border-bottom:1px solid var(--divider)}
  /* #21bis : le ⋯ (actions) passe en HAUT À DROITE de la carte (position absolue) → plus de ligne vide en
     bas, carte compacte. cell-acct réserve 30px à droite pour ne pas passer sous le ⋯. */
  .admin-rail .tbl-accts tbody td.cell-act{position:absolute;top:9px;right:11px;padding:0;width:auto}
}