:root{
  --ink:#1a1c33; --ink-soft:#3f4264; --muted:#7c7f9a;
  --paper:#eef0f7; --surface:#ffffff; --surface-2:#f4f5fb;
  --line:#dde0ee; --line-soft:#e8eaf5;
  --petrol:#36309c; --petrol-2:#2a2580; --petrol-soft:#e8e7f8;
  --gold:#f7cf07; --gold-2:#dcb500; --gold-soft:#fdf3c2;
  --signal:#e07a17; --signal-soft:#fbe9d2;
  --danger:#cc2e3e; --danger-soft:#f9dde0;
  --ok:#1f8a4c; --ok-soft:#dcf0e2;
  --amber:#c98a00; --amber-soft:#fbeecd;
  --shadow:0 1px 2px rgba(26,28,51,.06),0 8px 24px -12px rgba(26,28,51,.24);
  --shadow-lg:0 24px 60px -20px rgba(54,48,156,.45);
  --shadow-md:0 4px 14px -6px rgba(26,28,51,.18);
  --r:16px; --r-sm:11px; --r-lg:18px;
  --surface-3:#f8f9fd;
  --space:16px;
  --tap:44px;
  /* Échelle typographique — voir RAPPORT.md I1. Utilisée dans les écrans
     refondus (Suivi curatif, Historique, Paramètres). L'existant en dur
     reste inchangé pour borner le diff. */
  --fs-xs:11px; --fs-sm:12.5px; --fs-md:14px; --fs-lg:16px; --fs-xl:20px;
  /* Icônes/logos de la nav interne Paramètres (I7/P1). */
  --icon-size:18px; --logo-size:34px;
  /* Statut warm (préventif « à faire », soon…) — voir I7. */
  --warm:#c98a00; --warm-soft:#fbeecd;
  /* Statut neutre (pastille « 0 ouverte » etc.) — voir I4/S3. */
  --neutral:#5b6072; --neutral-soft:#e8eaf2;
  /* Statut « en cours » (indigo profond, pastille .en_cours). */
  --info:#3730a3; --info-soft:#e0e7ff;
  /* Statut « à finaliser » (violet, pastille .a_finaliser). */
  --purple:#a21caf; --purple-soft:#fae8ff;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;padding:0;overflow-x:hidden;max-width:100vw}
body{font-family:'IBM Plex Sans',system-ui,sans-serif;background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased;line-height:1.45}
button{font-family:inherit}
a{color:var(--petrol)}
/* Icônes inline (UI.I.*) : les SVG n'ont pas d'attribut width/height, donc
   sans règle CSS ciblée le navigateur retombe sur 300x150 par défaut. Ce
   fallback à 1em couvre les usages "à la volée" (headers de card, boutons
   fermeture ×, notes inline). Toutes les règles spécifiques (.btn svg,
   .navlink svg, .empty svg, .note svg, .icon-btn svg, .sheet-head .x svg,
   etc.) ont une spécificité supérieure et gagnent. */
svg{width:1em;height:1em;flex:none}
.sheet-head .x svg{width:16px;height:16px}

/* ============ LOGIN ============ */
.login{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(1200px 600px at 50% -10%, #3a34a4 0%, #2a2580 60%, #221d6e 100%)}
.login-card{width:100%;max-width:380px;background:var(--surface);border-radius:20px;box-shadow:var(--shadow-lg);overflow:hidden}
.login-head{background:linear-gradient(135deg,#3a34a4,#2a2580);color:#fff;padding:28px 26px 22px;text-align:center}
.login-head .mk{width:54px;height:54px;border-radius:var(--r);background:var(--gold);display:grid;place-items:center;margin:0 auto 14px}
.login-head .mk svg{width:30px;height:30px;color:var(--petrol)}
.login-head h1{font-family:'Archivo';font-weight:800;font-size:21px;margin:0;letter-spacing:.02em}
.login-head p{margin:5px 0 0;font-size:12.5px;color:#bcb9ea}
.login-body{padding:24px}
.login .err{background:var(--danger-soft);color:var(--danger);border-radius:9px;padding:10px 12px;font-size:13px;font-weight:600;margin-bottom:14px;display:none}
.login .err.show{display:block}
.login .demo{margin-top:16px;font-size:11.5px;color:var(--muted);background:var(--surface-2);border-radius:10px;padding:11px 13px;line-height:1.6}

/* ============ APP SHELL ============ */
.shell{display:flex;min-height:100vh}
.sidebar{width:240px;flex:0 0 auto;background:linear-gradient(180deg,#36309c,#2a2580);color:#fff;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;padding:18px 14px;overflow-y:auto}
.sidebar .brand{display:flex;align-items:center;gap:11px;padding:6px 8px 18px}
.sidebar .mk{width:38px;height:38px;border-radius:var(--r-sm);background:var(--gold);display:grid;place-items:center;flex:0 0 auto}
.sidebar .mk svg{width:22px;height:22px;color:var(--petrol)}
.sidebar .brand b{font-family:'Archivo';font-weight:800;font-size:15px;letter-spacing:.03em;display:block;line-height:1.1}
.sidebar .brand span{font-size:10.5px;color:#bcb9ea;letter-spacing:.1em;text-transform:uppercase}
.navlink{display:flex;align-items:center;gap:11px;padding:11px 12px;border-radius:10px;color:#cfcdef;font-size:14px;font-weight:600;cursor:pointer;border:none;background:none;width:100%;text-align:left;margin-bottom:2px}
.navlink svg{width:20px;height:20px;flex:0 0 auto}
.navlink:hover{background:rgba(255,255,255,.08);color:#fff}
.navlink.on{background:var(--gold);color:var(--petrol-2)}
.sidebar .foot{margin-top:auto;border-top:1px solid rgba(255,255,255,.15);padding-top:14px}
.sidebar .who{font-size:13px;font-weight:700;display:flex;align-items:center;gap:8px}
.sidebar .who .av{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;font-size:12px}
.sidebar .who small{display:block;font-weight:500;color:#bcb9ea;font-size:11px;text-transform:capitalize}
.sidebar .logout{margin-top:10px;width:100%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);color:#fff;border-radius:9px;padding:9px;font-size:12.5px;font-weight:600;cursor:pointer}

.main{flex:1;min-width:0;max-width:100%;display:flex;flex-direction:column}
.topbar{display:none}
.mob-user-menu{display:none}
.content{padding:26px 30px 60px;max-width:1180px;width:100%;margin:0 auto;animation:rise .25s ease}
@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* mobile */
.bottomnav{display:none}
@media(max-width:880px){
  .sidebar{display:none}
  .icon-btn{width:36px;height:36px}
  .topbar{display:flex;position:sticky;top:0;z-index:40;align-items:center;gap:11px;padding:13px 15px;color:#fff;background:linear-gradient(135deg,#3a34a4,#2a2580)}
  .topbar .mk{width:34px;height:34px;border-radius:var(--r-sm);background:var(--gold);display:grid;place-items:center}
  .topbar .mk svg{width:20px;height:20px;color:var(--petrol)}
  .topbar b{font-family:'Archivo';font-weight:800;font-size:15px;letter-spacing:.03em}
  .topbar .who{margin-left:auto;font-size:12px;background:rgba(255,255,255,.14);padding:6px 11px;border-radius:99px;font-weight:600;display:flex;gap:7px;align-items:center;cursor:pointer;border:none;color:inherit;max-width:55vw}
  .topbar .who:hover,.topbar .who:focus-visible{background:rgba(255,255,255,.22);outline:none}
  .topbar .who .d{width:7px;height:7px;border-radius:50%;background:#7fe0a6;flex:0 0 auto}
  .topbar .who .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
  .topbar .who .chv{width:14px;height:14px;flex:0 0 auto;opacity:.85}
  .mob-user-menu{display:block;position:fixed;top:60px;right:12px;z-index:60;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:var(--shadow-lg);padding:10px;width:240px;animation:rise .18s ease}
  .mob-user-menu[hidden]{display:none}
  .mob-user-menu .mob-user-info{display:flex;align-items:center;gap:11px;padding:6px 6px 10px;border-bottom:1px solid var(--line-soft);margin-bottom:8px}
  .mob-user-menu .av{width:38px;height:38px;border-radius:50%;background:var(--petrol-soft);color:var(--petrol);display:grid;place-items:center;font-size:13px;font-weight:700;flex:0 0 auto}
  .mob-user-menu .mob-user-txt{min-width:0;flex:1}
  .mob-user-menu strong{display:block;font-size:13.5px;color:var(--ink);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .mob-user-menu small{display:block;font-size:11.5px;color:var(--muted);font-weight:500;margin-top:2px;text-transform:capitalize}
  .mob-logout{display:flex;align-items:center;gap:9px;width:100%;min-height:44px;background:var(--danger-soft);color:var(--danger);border:1px solid #f3c8cd;border-radius:10px;padding:10px 12px;font-size:13.5px;font-weight:700;cursor:pointer;font-family:inherit}
  .mob-logout:hover,.mob-logout:focus-visible{background:#f5cdd2;outline:none}
  .mob-logout svg{width:18px;height:18px;flex:0 0 auto}
  .content{padding:18px 15px 110px;max-width:100vw;min-width:0;overflow-x:hidden}
  .kpis{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
  .kpi{padding:14px}
  .kpi .n{font-size:26px}
  .bottomnav{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:50;background:rgba(255,255,255,.95);backdrop-filter:blur(14px);border-top:1px solid var(--line);padding:6px 4px calc(6px + env(safe-area-inset-bottom,0))}
  /* Cible tactile min 44px (WCAG 2.5.5 / Apple HIG) : bottomnav était à ~32 px */
  .bottomnav button{flex:1;background:none;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:6px 2px;min-height:48px;color:var(--muted)}
  .bottomnav button svg{width:22px;height:22px}
  .bottomnav button span{font-size:10px;font-weight:600}
  .bottomnav button.on{color:var(--petrol)}
  /* Boutons quantité (formulaires pièces) et icônes de ligne : agrandis sur tactile */
  .qty button{width:44px;height:44px}
  .qty span{width:42px}
  .icon-btn{width:40px;height:40px}
  .icon-btn svg{width:17px;height:17px}
}

/* ============ HEADINGS ============ */
.page-head{margin-bottom:20px}
.page-head .eyebrow{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--petrol);background:var(--gold);padding:4px 11px;border-radius:999px;margin-bottom:9px}
.page-head h1{font-family:'Archivo';font-weight:800;font-size:27px;margin:0;letter-spacing:-.01em}
.page-head p{margin:5px 0 0;color:var(--muted);font-size:14px}

/* ============ CARDS / KPI ============ */
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
.card.pad{padding:18px}
.grid{display:grid;gap:14px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:13px;margin-bottom:8px}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;min-width:0;overflow:hidden}
.kpi .n{font-family:'Archivo';font-weight:800;font-size:32px;line-height:1;letter-spacing:-.02em;overflow-wrap:anywhere}
.kpi .l{font-size:12.5px;color:var(--muted);margin-top:6px;font-weight:500}
.kpi.alert{background:var(--signal-soft);border-color:#f3d9bd}.kpi.alert .n{color:var(--signal)}
.kpi.good{background:var(--ok-soft);border-color:#c2e3cd}.kpi.good .n{color:var(--ok)}
.kpi.brand{background:var(--petrol-soft);border-color:#cfcdf2}.kpi.brand .n{color:var(--petrol)}

.section-title{font-family:'Archivo';font-weight:700;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft);margin:26px 2px 11px;display:flex;align-items:center;gap:10px}
.section-title .ln{flex:1;height:1px;background:var(--line)}
.section-title:first-child{margin-top:0}

/* ============ PILLS / TAGS ============ */
.pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap}
.pill .d{width:6px;height:6px;border-radius:50%}
.pill.service{background:var(--ok-soft);color:var(--ok)}.pill.service .d{background:var(--ok)}
.pill.panne{background:var(--danger-soft);color:var(--danger)}.pill.panne .d{background:var(--danger)}
.pill.maintenance{background:var(--amber-soft);color:var(--amber)}.pill.maintenance .d{background:var(--amber)}
/* Statuts intervention — dégradé logique "à traiter -> terminé".
   Couleurs vives réservées aux statuts (pas aux types) pour éviter les confusions. */
.pill.ouvert{background:#fee2e2;color:#cc2e3e}.pill.ouvert .d{background:#cc2e3e}
.pill.en_cours{background:var(--info-soft);color:var(--info)}.pill.en_cours .d{background:var(--info)}
.pill.a_finaliser{background:var(--purple-soft);color:var(--purple)}.pill.a_finaliser .d{background:var(--purple)}
.pill.cloture{background:var(--ok-soft);color:var(--ok)}.pill.cloture .d{background:var(--ok)}
.pill.annule{background:var(--surface-2);color:var(--muted)}.pill.annule .d{background:var(--muted)}
.pill.attente_piece{background:#fff8e1;color:#92400e}.pill.attente_piece .d{background:#f59e0b}
.pill.urgent{background:var(--danger);color:#fff}
/* Variantes neutres/ambre pour métrique "ouvertes" quand la valeur = 0 ou 1-2.
   Voir I4/S3 du RAPPORT.md — évite l'effet "alerte" quand 0 = très bon signe. */
.pill.neutral{background:var(--neutral-soft);color:var(--neutral)}.pill.neutral .d{background:var(--neutral)}
.pill.warm{background:var(--warm-soft);color:var(--warm)}.pill.warm .d{background:var(--warm)}
.pill.xs{font-size:var(--fs-xs);padding:2px 7px}
.pill-neutral{background:var(--surface-2);color:var(--ink);border-radius:999px;font-weight:700;display:inline-flex;align-items:center;gap:5px;padding:3px 9px;font-size:var(--fs-xs);white-space:nowrap}
/* Types — teintes sobres (ne concurrencent pas les statuts). Utilisé aussi dans
   les exports et l'existant. Version "sober" pour les listes de supervision. */
.pill.type-signalement{background:#e8e7f8;color:var(--petrol)}
.pill.type-curative{background:var(--signal-soft);color:var(--signal)}
.pill.type-preventive{background:var(--ok-soft);color:var(--ok)}
.pill.type-preventif_ponctuel{background:#f3ecff;color:#7c3aed}
.pill.pill-type-sober{background:var(--surface-2);color:var(--ink-soft);border:1px solid var(--line);font-weight:600}
.pill.pill-type-sober.type-curative{border-left:3px solid var(--signal)}
.pill.pill-type-sober.type-preventive{border-left:3px solid var(--ok)}
.pill.pill-type-sober.type-preventif_ponctuel{border-left:3px solid #7c3aed}
.pill.pill-type-sober.type-signalement{border-left:3px solid var(--petrol)}
.tag{display:inline-flex;align-items:center;gap:5px;background:var(--surface-2);border:1px solid var(--line);font-size:12.5px;padding:5px 11px;border-radius:8px;font-weight:500}
.tag.ok{background:var(--ok-soft);border-color:#c2e3cd;color:var(--ok)}
.taglist{display:flex;flex-wrap:wrap;gap:7px}

/* ============ TASK ROWS ============ */
.list{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);max-width:100%}
.task{display:flex;gap:13px;padding:14px 16px;border-bottom:1px solid var(--line-soft);cursor:pointer;transition:background .12s}
.task:last-child{border:none}.task:hover{background:var(--surface-2)}
.task .ty{width:42px;height:42px;border-radius:var(--r-sm);flex:0 0 auto;display:grid;place-items:center}
.task .ty svg{width:21px;height:21px}
.ty.signalement{background:#e8e7f8;color:var(--petrol)}.ty.curative{background:var(--signal-soft);color:var(--signal)}.ty.preventive{background:var(--ok-soft);color:var(--ok)}.ty.preventif_ponctuel{background:#f3ecff;color:#7c3aed}
.task .body{flex:1;min-width:0}
.task .t1{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.task .code{font-family:'IBM Plex Mono';font-weight:600;font-size:13.5px;color:var(--petrol)}
.task .t2{font-size:13.5px;color:var(--ink-soft);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.task .t3{font-size:11.5px;color:var(--muted);margin-top:4px;display:flex;gap:10px;flex-wrap:wrap}
.task .chev{align-self:center;color:var(--muted);flex:0 0 auto}
.empty{text-align:center;padding:36px 18px;color:var(--muted)}
.empty svg{width:38px;height:38px;opacity:.4;margin-bottom:8px}.empty p{margin:0;font-size:13.5px}

/* ============ TABLES ============ */
.tablewrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{text-align:left;font-weight:700;font-size:11.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);padding:12px 14px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:12px 14px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
tr:last-child td{border:none}
tbody tr{cursor:pointer;transition:background .1s}
tbody tr:hover{background:var(--surface-2)}
.mono{font-family:'IBM Plex Mono';font-weight:600;color:var(--petrol)}
.row-actions{display:flex;gap:6px}
.icon-btn{width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:var(--surface);cursor:pointer;display:grid;place-items:center;color:var(--ink-soft)}
.icon-btn svg{width:15px;height:15px}
.icon-btn:hover{background:var(--surface-2)}
.icon-btn.danger{color:var(--danger);border-color:#eccccf}

/* ============ FORM ============ */
.field{margin-bottom:16px}
.field>label{display:block;font-weight:600;font-size:13px;margin-bottom:7px}
.field .hint{font-weight:400;color:var(--muted);font-size:12px}
.req{color:var(--signal)}
input,textarea,select{width:100%;font-family:inherit;font-size:15px;color:var(--ink);background:var(--surface);border:1.5px solid var(--line);border-radius:var(--r-sm);padding:12px 13px;outline:none;transition:border-color .15s,box-shadow .15s}
textarea{resize:vertical;min-height:80px;line-height:1.5}
input:focus,textarea:focus,select:focus{border-color:var(--petrol);box-shadow:0 0 0 3px var(--petrol-soft)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media(max-width:520px){.row2{grid-template-columns:1fr}}

.seg{display:flex;gap:7px;flex-wrap:wrap}
.seg button{flex:1;min-width:120px;font-size:13.5px;font-weight:600;padding:12px 10px;border-radius:var(--r-sm);border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;gap:7px}
.seg button svg{width:17px;height:17px}
.seg button.on{border-color:var(--petrol);background:var(--petrol);color:#fff}
.seg button.on.danger{background:var(--danger);border-color:var(--danger)}
.seg button.on.ok{background:var(--ok);border-color:var(--ok)}
@media(max-width:380px){.seg button{min-width:0}}

.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-size:13px;font-weight:500;padding:9px 13px;border-radius:999px;border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;transition:all .12s;display:inline-flex;align-items:center;gap:6px}
.chip:active{transform:scale(.96)}
.chip.on{background:var(--petrol);border-color:var(--petrol);color:#fff}
.chip.on::before{content:"✓";font-weight:700;font-size:11px}

.checklist{display:flex;flex-direction:column}
.check{display:flex;align-items:center;gap:12px;padding:12px 4px;border-bottom:1px solid var(--line-soft);cursor:pointer}
.check:last-child{border:none}
.check .box{width:24px;height:24px;border-radius:7px;border:2px solid var(--line);flex:0 0 auto;display:grid;place-items:center;transition:all .15s}
.check .box svg{width:15px;height:15px;color:#fff;opacity:0;transform:scale(.5);transition:all .15s}
.check.on .box{background:var(--ok);border-color:var(--ok)}
.check.on .box svg{opacity:1;transform:scale(1)}
.check .txt{font-size:14.5px;font-weight:500}
.catgroup{margin-bottom:14px}
.catgroup .cat{font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--petrol);margin:10px 0 6px}

.part-line{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.part-line:last-child{border:none}.part-line .nm{flex:1;font-size:14px;font-weight:500}
.qty{display:flex;align-items:center;border:1.5px solid var(--line);border-radius:var(--r-sm);overflow:hidden}
.qty button{width:34px;height:34px;border:none;background:var(--surface-2);font-size:18px;font-weight:700;color:var(--petrol);cursor:pointer}
.qty span{width:36px;text-align:center;font-weight:700;font-family:'IBM Plex Mono';font-size:14px}

.photogrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:9px}
.photo{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--surface-2)}
.photo img{width:100%;height:100%;object-fit:cover;display:block}
.photo img[data-zoom]{cursor:zoom-in}
.photo .rm{position:absolute;top:5px;right:5px;width:24px;height:24px;border-radius:50%;background:rgba(0,0,0,.6);border:none;color:#fff;cursor:pointer;display:grid;place-items:center}
.photo .rm svg{width:13px;height:13px}
.addphoto{aspect-ratio:1;border:2px dashed var(--line);border-radius:var(--r-sm);background:var(--surface-2);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;color:var(--muted);font-size:11px;font-weight:600}
.addphoto svg{width:24px;height:24px}

/* ============ BUTTONS ============ */
.btn{font-weight:700;font-size:15px;padding:14px;border-radius:var(--r-sm);border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:9px;transition:transform .1s,filter .15s}
.btn:active{transform:scale(.985)}
.btn svg{width:18px;height:18px}
.btn.block{width:100%}
.btn-primary{background:var(--petrol);color:#fff;box-shadow:var(--shadow)}
.btn-primary:hover{filter:brightness(1.07)}
.btn-gold{background:var(--gold);color:var(--petrol-2);box-shadow:0 8px 18px -8px rgba(247,207,7,.8)}
.btn-gold:hover{filter:brightness(.98)}
.btn-ghost{background:var(--surface);color:var(--petrol);border:1.5px solid var(--line)}
.btn-ghost:hover{background:var(--surface-2)}
.btn-danger{background:var(--danger);color:#fff}
.btn-sm{padding:10px 14px;font-size:13.5px}
.btn-row{display:flex;gap:10px;flex-wrap:wrap}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:16px}
.toolbar .grow{flex:1;min-width:180px}
.toolbar .search{position:relative}
.toolbar .search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--muted)}
.toolbar .search input{padding-left:40px}

/* ============ HD PICKER / SELECTED ============ */
.selected-hd{display:flex;align-items:center;gap:12px;padding:14px;background:var(--petrol-soft);border:1.5px solid #cfcdf2;border-radius:var(--r-sm)}
.selected-hd .icn{width:38px;height:38px;border-radius:10px;background:var(--petrol);display:grid;place-items:center;flex:0 0 auto}
.selected-hd .icn svg{width:20px;height:20px;color:#fff}
.selected-hd .meta b{font-family:'IBM Plex Mono';font-size:15px;color:var(--petrol);display:block}
.selected-hd .meta span{font-size:12.5px;color:var(--ink-soft)}
.selected-hd .chg{margin-left:auto;font-size:12px;font-weight:700;color:var(--signal);background:none;border:none;cursor:pointer}
.hd-result{display:flex;align-items:center;gap:11px;padding:13px 14px;border-bottom:1px solid var(--line-soft);cursor:pointer}
.hd-result:hover{background:var(--surface-2)}.hd-result:last-child{border:none}
.hd-result .code{font-family:'IBM Plex Mono';font-weight:600;font-size:14px;color:var(--petrol)}
.hd-result .ad{flex:1;font-size:13px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ============ DETAIL ============ */
.detail-meta{display:flex;flex-wrap:wrap;gap:9px;margin:14px 0}
.kv{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:9px 12px;flex:1;min-width:130px}
.kv .k{font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:600}
.kv .v{font-size:14px;font-weight:600;margin-top:2px}
.detail-block{margin-bottom:16px}
.detail-block .lab{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.detail-block .val{font-size:14.5px}
/* Bloc de lien SIG↔INT : accent subtil (fond pétrole pâle + bordure gauche) */
.detail-block.link-block{background:var(--petrol-soft);border-left:3px solid var(--petrol);padding:10px 12px;border-radius:6px}
.detail-block.link-block .lab{color:var(--petrol);margin-bottom:8px;display:inline-flex;align-items:center;gap:6px}
.detail-block.link-block .lab svg{width:13px;height:13px}
.detail-block.link-block .val{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.detail-block.link-block .link-by{font-size:12.5px;color:var(--muted);font-weight:500}
.detail-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px}
.detail-photos img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px}
.detail-photo{cursor:zoom-in}
.detail-photo img{border-radius:10px}
.lightbox-overlay{position:fixed;inset:0;z-index:9999;background:rgba(10,10,20,.92);display:grid;place-items:center;padding:24px;cursor:zoom-out;animation:lb-fade .12s ease-out}
.lightbox-overlay img{max-width:100%;max-height:100%;border-radius:8px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lightbox-close{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.15);border:none;color:#fff;cursor:pointer;display:grid;place-items:center}
.lightbox-close:hover{background:rgba(255,255,255,.25)}
.lightbox-close svg{width:18px;height:18px}
@keyframes lb-fade{from{opacity:0}to{opacity:1}}

/* ============ STATS ============ */
.charts{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:760px){.charts{grid-template-columns:1fr}}
.chartcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);padding:18px}
.chartcard h3{font-family:'Archivo';font-weight:700;font-size:15px;margin:0 0 14px}
.chartcard .cwrap{position:relative;height:240px}

/* ============ SHEET / MODAL ============ */
.scrim{position:fixed;inset:0;background:rgba(26,28,51,.5);z-index:60;opacity:0;pointer-events:none;transition:opacity .25s;display:flex;align-items:flex-end;justify-content:center}
.scrim.open{opacity:1;pointer-events:auto}
.sheet{width:100%;max-width:560px;background:var(--paper);border-radius:22px 22px 0 0;max-height:92vh;max-height:92dvh;overflow-y:auto;transform:translateY(100%);transition:transform .3s cubic-bezier(.32,.72,0,1)}
.scrim.open .sheet{transform:none}
@media(min-width:560px){.scrim{align-items:center}.sheet{border-radius:18px;max-height:88vh;max-height:88dvh}}
.sheet-head{position:sticky;top:0;background:var(--paper);padding:16px 18px 12px;border-bottom:1px solid var(--line);z-index:2}
.sheet-head .grab{width:38px;height:4px;border-radius:99px;background:var(--line);margin:0 auto 12px}
@media(min-width:560px){.sheet-head .grab{display:none}}
.sheet-head .row{display:flex;align-items:center;gap:10px}
.sheet-head h2{font-family:'Archivo';font-weight:800;font-size:19px;margin:0;flex:1}
.sheet-head .x{width:32px;height:32px;border-radius:50%;background:var(--surface);border:1px solid var(--line);cursor:pointer;display:grid;place-items:center;color:var(--ink-soft)}
.sheet-body{padding:18px}

/* ============ MISC ============ */
.note{font-size:12.5px;color:var(--muted);background:var(--surface-2);border:1px solid var(--line-soft);border-radius:10px;padding:11px 13px;display:flex;gap:9px}
.note svg{width:16px;height:16px;flex:0 0 auto;color:var(--petrol);margin-top:1px}
.divider{height:1px;background:var(--line);margin:18px 0}
.spacer{height:10px}
.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);z-index:90;background:var(--ink);color:#fff;padding:13px 18px;border-radius:12px;font-size:13.5px;font-weight:600;box-shadow:var(--shadow-lg);opacity:0;transition:all .3s;display:flex;align-items:center;gap:9px;max-width:90%}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast svg{width:18px;height:18px;color:#7fe0a6;flex:0 0 auto}
.toast.err svg{color:#ff9a9a}
@media(max-width:880px){.toast{bottom:calc(72px + env(safe-area-inset-bottom,0px) + 12px)}}
.loadwrap{display:grid;place-items:center;height:60vh;height:60dvh;color:var(--muted)}
.spin{width:34px;height:34px;border:3px solid var(--line);border-top-color:var(--petrol);border-radius:50%;animation:sp 1s linear infinite;margin:0 auto 12px}
@keyframes sp{to{transform:rotate(360deg)}}
/* Libellé enrichi « repris du signalement SIG-XXXX » — abrège sur mobile
   en « repris de SIG-XXXX ». Voir Passe UX signalement (2026-07-16). */
.repris-from{color:var(--muted);font-weight:500}
.repris-short{display:none}
@media (max-width:480px){ .repris-full{display:none} .repris-short{display:inline} }
/* Kebab menu (modale détail signalement/intervention) — introduit dans la
   passe UX signalement pour recentrer sur le bouton Traiter. */
.kebab-wrap{position:relative;display:inline-flex;margin-right:4px}
.kebab-btn{width:36px;height:36px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink-soft);cursor:pointer;display:grid;place-items:center;transition:background .12s}
.kebab-btn:hover,.kebab-btn:focus-visible{background:var(--surface-2);outline:none}
.kebab-menu{position:absolute;top:calc(100% + 6px);right:0;z-index:60;min-width:200px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px rgba(30,30,60,.14);padding:6px;display:flex;flex-direction:column;gap:2px;animation:rise .12s ease-out}
.kebab-menu[hidden]{display:none}
.kebab-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border:none;background:transparent;color:var(--ink);cursor:pointer;font-size:14px;font-weight:500;text-align:left;border-radius:8px;font-family:inherit}
.kebab-item:hover,.kebab-item:focus-visible{background:var(--surface-2);outline:none}
.kebab-item svg{width:16px;height:16px;flex:0 0 auto;color:var(--ink-soft)}
.kebab-item.danger{color:var(--danger)}
.kebab-item.danger svg{color:var(--danger)}
/* Action primaire isolée (Traiter / Voir l'intervention) sous le corps
   de la modale — bandeau visuellement dominant. */
.primary-action-row{margin:14px 0 6px}
.primary-action-row .btn{min-height:48px;font-size:15.5px}
/* Spinner inline pour boutons (14x14, hérite de currentColor). */
.spin-inline{display:inline-block;vertical-align:-2px;width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:sp 0.8s linear infinite;margin-right:8px;opacity:.9}
.btn[disabled],.btn:disabled{cursor:progress}
.muted{color:var(--muted)}
.center{text-align:center}

/* ============ Formulaire dynamique (technicien) ============ */
.formsection{ border:1px solid var(--line); border-radius:var(--r); padding:14px 16px; margin:14px 0; background:var(--surface-3); }
.formsection .fs-head{ font-family:'Archivo',sans-serif; font-weight:800; font-size:15px; color:var(--petrol); margin-bottom:2px; }
.formsection .fs-desc{ font-size:13px; color:var(--muted,#6b6f8c); margin-bottom:10px; }
.formsection .field:last-child{ margin-bottom:0; }

/* paires clé/valeur dans le détail */
.kvlist{ display:flex; flex-direction:column; gap:2px; }
.kvrow{ display:flex; justify-content:space-between; gap:14px; padding:6px 0; border-bottom:1px solid #f1f1f7; }
.kvrow:last-child{ border-bottom:none; }
.kvrow .kk{ color:var(--muted,#6b6f8c); font-weight:600; font-size:13.5px; }
.kvrow .vv{ font-weight:600; font-size:13.5px; text-align:right; }

/* ============ Carte du parc ============ */
.map{ height:440px; width:100%; border-radius:var(--r); overflow:hidden; border:1px solid var(--line); z-index:0; }
.map-legend{ display:flex; flex-wrap:wrap; gap:16px; margin-top:12px; font-size:13px; color:var(--muted,#6b6f8c); font-weight:600; }
.map-legend span{ display:inline-flex; align-items:center; gap:7px; }
.map-legend i{ width:12px; height:12px; border-radius:50%; display:inline-block; border:2px solid #fff; box-shadow:0 0 0 1px var(--line); }
.leaflet-popup-content{ font-family:'IBM Plex Sans',sans-serif; font-size:13px; line-height:1.5; }
.leaflet-popup-content a{ color:var(--petrol); font-weight:700; }

/* ============ Constructeur de formulaire (form builder) ============ */
.fb-section{ border:1px solid var(--line); border-radius:var(--r); padding:12px 14px; margin-bottom:12px; background:#fff; }
.fb-sec-head{ display:flex; align-items:center; gap:6px; margin-bottom:8px; }
.fb-sec-head .grip{ color:#b6b8d0; display:inline-flex; cursor:grab; }
.fb-sec-head .grip svg{ width:18px; height:18px; }
.fb-sec-head b{ font-family:'Archivo',sans-serif; font-size:15px; }
.fb-fields{ display:flex; flex-direction:column; gap:6px; }
.fb-field{ display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface-3); }
.fb-field .ft{ font-size:11px; font-weight:800; letter-spacing:.4px; text-transform:uppercase; color:var(--petrol); background:var(--petrol-soft); border-radius:6px; padding:3px 8px; white-space:nowrap; }
.fb-field .fl{ flex:1; font-weight:600; font-size:14px; }
.fb-field .icon-btn{ width:30px; height:30px; }
.fb-field .icon-btn[disabled]{ opacity:.3; cursor:default; }
.fb-sec-head .icon-btn[disabled]{ opacity:.3; cursor:default; }
.fb-field.has-cond{ border-left:3px solid #f59e0b; }
.fb-field .fc-cond{ font-size:10px; font-weight:700; letter-spacing:.3px; text-transform:uppercase; color:#92400e; background:#fef3c7; border-radius:6px; padding:2px 7px; white-space:nowrap; }
.fb-field .fc-cond::before{ content:"⚡ "; }

/* Champ conditionnel — saisie terrain */
.field.cond-hidden{ display:none !important; }
.field.cond-visible{ border-left:3px solid #f59e0b; padding-left:10px; }

/* Étoiles de notation */
.rating{ display:inline-flex; gap:4px; align-items:center; }
.rating .star{ background:none; border:none; padding:2px; cursor:pointer; font-size:24px; line-height:1; color:#d1d5db; transition:transform .1s, color .12s; }
.rating .star:hover{ transform:scale(1.1); }
.rating .star.on{ color:var(--gold,#f7cf07); }
.rating .star:focus{ outline:none; }
.rating .lbl{ margin-left:8px; font-size:13px; color:var(--ink-soft); font-weight:600; }

/* ============ Sélecteur de prestations — cat-block ============ */
.cat-block{margin-bottom:12px}
.cat-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}
.cat-head .cat-name{font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--petrol);flex:1}
.cat-head.clickable{cursor:pointer;padding:7px 10px;border-radius:var(--r-sm);background:var(--petrol-soft);border:1.5px solid var(--line);margin-bottom:0;user-select:none;transition:background .12s}
.cat-head.clickable:hover{background:var(--petrol-soft)}
.cat-content{padding-top:8px}
.cat-block.collapsed .cat-content{display:none}
.cat-block.open .cat-content{display:block}
.cat-selected-count{font-size:11px;font-weight:700;background:#e6e6f2;color:#7c7f9a;border-radius:999px;padding:2px 7px;white-space:nowrap}
.caret{font-style:normal;font-size:11px;color:var(--petrol);transition:transform .2s;display:inline-block;flex:0 0 auto}
.cat-block.open .caret{transform:rotate(90deg)}
.act-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.act-toolbar .search{position:relative;flex:1;min-width:150px}
.act-toolbar .search svg{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--muted)}
.act-toolbar .search input{padding-left:40px}
.act-links{display:flex;gap:8px;font-size:12.5px;font-weight:600;white-space:nowrap;align-items:center}
.act-links a{color:var(--petrol);text-decoration:none}
.act-links a:hover{text-decoration:underline}

/* ============ Sélecteur de tags — sections par famille ============ */
.tags-selector{display:flex;flex-direction:column;gap:14px}
.tags-fam{display:flex;flex-direction:column;gap:6px}
.tags-fam-label{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.tags-freq{padding-bottom:12px;border-bottom:1px dashed var(--line);display:flex;flex-direction:column;gap:6px}
.tags-freq .tags-fam-label{color:var(--petrol)}
.chips-tags{display:flex;flex-wrap:wrap;gap:8px}
.chip-tag{
  display:inline-flex;align-items:center;gap:7px;
  min-height:40px;padding:8px 13px;border-radius:999px;
  border:1.5px solid var(--line);background:var(--surface);color:var(--ink-soft);
  font-size:13px;font-weight:600;cursor:pointer;transition:all .12s;
  font-family:inherit;user-select:none;
}
.chip-tag:active{transform:scale(.97)}
.chip-tag .chip-dot{width:8px;height:8px;border-radius:50%;background:var(--muted);flex:0 0 auto}
.chip-tag .chip-lbl{line-height:1.1}
/* Repos : bg soft coloré + texte foncé + point de couleur */
.chip-tag.t-indigo{background:var(--petrol-soft);border-color:#cfcdf2;color:var(--petrol)}
.chip-tag.t-indigo .chip-dot{background:var(--petrol)}
.chip-tag.t-green{background:var(--ok-soft);border-color:#c2e3cd;color:var(--ok)}
.chip-tag.t-green .chip-dot{background:var(--ok)}
.chip-tag.t-red{background:var(--danger-soft);border-color:#f0c4c8;color:var(--danger)}
.chip-tag.t-red .chip-dot{background:var(--danger)}
.chip-tag.t-amber{background:var(--amber-soft);border-color:#f3d9a4;color:var(--amber)}
.chip-tag.t-amber .chip-dot{background:var(--amber)}
.chip-tag.t-gray{background:var(--surface-2);border-color:var(--line);color:var(--ink-soft)}
.chip-tag.t-gray .chip-dot{background:var(--muted)}
/* Sélectionné : fond plein, texte blanc, coche */
.chip-tag.on{color:#fff}
.chip-tag.on::before{content:"✓";font-weight:700;font-size:12px;margin-right:-1px}
.chip-tag.on .chip-dot{display:none}
.chip-tag.t-indigo.on{background:var(--petrol);border-color:var(--petrol)}
.chip-tag.t-green.on{background:var(--ok);border-color:var(--ok)}
.chip-tag.t-red.on{background:var(--danger);border-color:var(--danger)}
.chip-tag.t-amber.on{background:var(--amber);border-color:var(--amber)}
.chip-tag.t-gray.on{background:var(--muted);border-color:var(--muted)}

/* ============ Étiquettes (intervention tags) ============ */
.tag.t-indigo{color:var(--petrol);border-color:#cfcdf2;background:var(--petrol-soft)}
.tag.t-green{color:var(--ok);border-color:#c2e3cd;background:var(--ok-soft)}
.tag.t-red{color:var(--danger);border-color:#f0c4c8;background:var(--danger-soft)}
.tag.t-amber{color:var(--amber);border-color:#f3d9a4;background:var(--amber-soft)}
.tag.t-gray{color:var(--muted);border-color:var(--line);background:var(--surface-2)}
.tag.clickable{cursor:pointer;transition:all .12s;user-select:none}
.tag.clickable:hover{filter:brightness(.92)}
.tag.t-indigo.selected{background:var(--petrol);color:#fff;border-color:var(--petrol)}
.tag.t-green.selected{background:var(--ok);color:#fff;border-color:var(--ok)}
.tag.t-red.selected{background:var(--danger);color:#fff;border-color:var(--danger)}
.tag.t-amber.selected{background:var(--amber);color:#fff;border-color:var(--amber)}
.tag.t-gray.selected{background:var(--muted);color:#fff;border-color:var(--muted)}

/* ============ DRAG & DROP ============ */
.drag-item { user-select: none; transition: opacity .15s; }
.drag-item.dragging { opacity: .4; }
.drag-item.drag-over { outline: 2px dashed var(--petrol); background: var(--petrol-soft); border-radius: var(--r-sm); }
.drag-handle { cursor: grab; color: var(--muted); padding: 0 6px; flex-shrink: 0; display: inline-flex; align-items: center; touch-action: none; }
.drag-handle svg { width: 16px; height: 16px; }
.drag-handle:active { cursor: grabbing; }
.drag-desktop { display: inline-flex; }
.drag-mobile { display: none !important; }
@media(max-width:880px) {
  .drag-desktop { display: none !important; }
  .drag-mobile { display: inline-flex !important; }
}
/* ============ BADGE AUTO ============ */
.badge-auto {
  display: inline-block; font-size: 10.5px; font-weight: 700;
  padding: 2px 6px; border-radius: 4px;
  background: #e8e7f8; color: #36309c;
  margin-left: 5px; vertical-align: middle; line-height: 1.4;
}
/* ============ MAINTENANCE PRÉVENTIVE ============ */
.prev-status {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 11.5px; font-weight: 700; padding: 3px 9px;
  border-radius: 999px; white-space: nowrap;
}
.prev-status.afaire { background: #fff0e6; color: #c2530a; }
.prev-status.ajour  { background: var(--ok-soft); color: var(--ok); }
.prev-row { cursor: default; }
.prev-row.clickable { cursor: pointer; }
.prev-row.clickable:hover { background: var(--surface-2); }

/* Compteur par secteur dans la tournée */
.sector-header {
  display: flex; align-items: center; gap: 10px;
  font-family: 'Archivo'; font-weight: 700; font-size: 13px;
  letter-spacing: .04em; text-transform: uppercase;
  color: var(--ink-soft); margin: 22px 2px 10px;
}
.sector-header .sec-name { flex: 0 0 auto; }
.sector-header .sec-count {
  font-size: 11px; font-weight: 700; letter-spacing: 0;
  text-transform: none; padding: 2px 9px; border-radius: 999px;
  background: var(--surface-2); color: var(--ink-soft);
}
.sector-header .sec-count.done { background: var(--ok-soft); color: var(--ok); }
.sector-header .sec-count.todo { background: #fff0e6; color: #c2530a; }
.sector-header .ln { flex: 1; height: 1px; background: var(--line); }

/* ============ 3 CARTES D'ACTION (page Interventions) ============ */
.action-cards {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 14px; margin-bottom: 22px;
}
@media (max-width: 900px) { .action-cards { grid-template-columns: 1fr; } }
.action-card {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 16px 18px;
  background: var(--surface); border: 1px solid var(--line);
  border-radius: var(--r); box-shadow: var(--shadow);
  cursor: pointer; text-align: left; width: 100%;
  transition: transform .12s, box-shadow .12s, border-color .12s;
  position: relative; overflow: hidden;
}
.action-card:hover { transform: translateY(-1px); box-shadow: var(--shadow-md); }
.action-card::before {
  content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
}
.action-card .ac-ic {
  width: 46px; height: 46px; border-radius: 12px;
  display: grid; place-items: center; flex: 0 0 auto;
}
.action-card .ac-ic svg { width: 22px; height: 22px; }
.action-card .ac-title {
  font-family: 'Archivo'; font-weight: 700; font-size: 15px;
  color: var(--ink); line-height: 1.25;
}
.action-card .ac-sub {
  font-size: 12.5px; color: var(--muted); margin-top: 4px; line-height: 1.4;
}
/* Variantes */
.action-card.ac-curative::before { background: var(--signal); }
.action-card.ac-curative .ac-ic { background: var(--signal-soft); color: var(--signal); }
.action-card.ac-curative:hover { border-color: var(--signal); }

.action-card.ac-prev-ponct::before { background: #7c3aed; }
.action-card.ac-prev-ponct .ac-ic { background: #f3ecff; color: #7c3aed; }
.action-card.ac-prev-ponct:hover { border-color: #7c3aed; }

.action-card.ac-prev-bimens::before { background: var(--ok); }
.action-card.ac-prev-bimens .ac-ic { background: var(--ok-soft); color: var(--ok); }
.action-card.ac-prev-bimens:hover { border-color: var(--ok); }

/* ============ DRAG GROUP ============ */
.drag-group { min-height: 20px; }
.prst-cat-group { margin-bottom: 8px; }

/* ============ PERMISSIONS — PROFILS ============ */
.profile-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 14px; margin: 14px 0; }
.profile-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 16px; position: relative; overflow: hidden; cursor: pointer; transition: box-shadow .15s; }
.profile-card:hover { box-shadow: var(--shadow-md); }
.profile-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px; }
.profile-card.role-agent::before { background: var(--amber); }
.profile-card.role-technicien::before { background: var(--petrol); }
.profile-card.role-superviseur::before { background: var(--ok); }
.profile-card.role-boutique::before { background: var(--muted); }
.profile-card .pc-head { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 8px; }
.profile-card .pc-name { font-weight: 700; font-size: 14px; flex: 1; line-height: 1.3; }
.profile-card .pc-role { font-size: 10.5px; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); white-space: nowrap; }
.profile-card .pc-desc { font-size: 12.5px; color: var(--muted); margin-bottom: 10px; min-height: 28px; line-height: 1.4; }
.profile-card .pc-foot { display: flex; align-items: center; justify-content: space-between; }
.profile-card .pc-count { font-size: 12px; background: var(--surface-2); border-radius: 4px; padding: 3px 8px; }

/* ============ PERMISSIONS — ACCORDION ============ */
.perm-accordion { border: 1px solid var(--line); border-radius: var(--r-sm); margin-bottom: 6px; overflow: hidden; }
.perm-accordion > summary { padding: 9px 14px; font-weight: 600; font-size: 12.5px; cursor: pointer; list-style: none; display: flex; align-items: center; justify-content: space-between; background: var(--surface-2); user-select: none; }
.perm-accordion > summary::-webkit-details-marker { display: none; }
.perm-accordion[open] > summary { border-bottom: 1px solid var(--line); }
.perm-accordion > summary .pa-badge { font-size: 11px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: var(--petrol-soft); color: var(--petrol); }
.perm-row { display: flex; align-items: center; padding: 8px 14px; border-bottom: 1px solid var(--line); gap: 10px; }
.perm-row:last-child { border-bottom: none; }
.perm-row .pr-label { flex: 1; font-size: 13px; }
.perm-row .pr-profile-val { font-size: 11px; color: var(--muted); min-width: 64px; text-align: right; }
.perm-toggle { display: inline-flex; border: 1px solid var(--line); border-radius: 5px; overflow: hidden; flex-shrink: 0; }
.perm-toggle button { font-size: 11.5px; padding: 3px 9px; background: var(--surface); border: none; cursor: pointer; border-right: 1px solid var(--line); transition: background .1s, color .1s; }
.perm-toggle button:last-child { border-right: none; }
.perm-toggle button.active-inherit { background: var(--surface-2); color: var(--ink); font-weight: 600; }
.perm-toggle button.active-grant  { background: var(--ok); color: #fff; font-weight: 600; }
.perm-toggle button.active-deny   { background: var(--danger); color: #fff; font-weight: 600; }
.perm-bool { display: inline-flex; border: 1px solid var(--line); border-radius: 5px; overflow: hidden; flex-shrink: 0; }
.perm-bool button { font-size: 11.5px; padding: 3px 10px; background: var(--surface); border: none; cursor: pointer; border-right: 1px solid var(--line); transition: background .1s; }
.perm-bool button:last-child { border-right: none; }
.perm-bool button.active-on  { background: var(--ok); color: #fff; font-weight: 600; }
.perm-bool button.active-off { background: var(--surface-2); color: var(--muted); }

/* ============ LOCK BANNER ============ */
.lock-banner { border-left: 4px solid; border-radius: 0 var(--r-sm) var(--r-sm) 0; padding: 10px 14px; margin: 12px 0 6px; font-size: 13px; line-height: 1.5; }
.lock-banner.locked   { background: #fdf3df; border-color: var(--amber, #f59e0b); color: #7c5302; }
.lock-banner.unlocked { background: #edf7f0; border-color: var(--ok,   #22c55e); color: #1a5e36; }

/* ============ PREV COVERAGE / RATTRAPAGE BADGE ============ */
.prev-coverage { display:flex; align-items:center; gap:14px; padding:10px 14px; border-radius:10px;
  margin:0 0 14px; background:var(--surface-2); border:1px solid var(--line-soft); font-size:13px; flex-wrap:wrap; }
.prev-coverage .cov-title { font-weight:600; color:var(--petrol); }
.prev-coverage .cov-num { font-variant-numeric:tabular-nums; font-weight:700; }
.prev-coverage select { padding:3px 8px; border-radius:6px; border:1px solid var(--line); background:var(--surface); font-size:12.5px; }
.prev-coverage .cov-bar { flex:1; min-width:100px; height:6px; background:var(--surface); border-radius:99px; overflow:hidden; }
.prev-coverage .cov-bar-inner { height:100%; background:var(--ok); border-radius:99px; }
.badge-rattrapage { display:inline-block; font-size:10.5px; font-weight:700; padding:1px 6px; border-radius:8px;
  background:#fde9eb; color:#cc2e3e; border:1px solid #f2b8bf; margin-left:6px; }

/* ============ COMMENTAIRES ============ */
.comments-section { margin-top: 20px; border-top: 1px solid var(--line); padding-top: 16px; }
.comments-section .cs-title { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); margin-bottom: 12px; }
.comment { display: flex; gap: 10px; margin-bottom: 14px; }
.comment .av { width: 28px; height: 28px; border-radius: 50%; background: var(--petrol-soft); color: var(--petrol); display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; flex-shrink: 0; margin-top: 1px; }
.comment .cc { flex: 1; min-width: 0; }
.comment .meta { display: flex; align-items: baseline; gap: 8px; margin-bottom: 4px; }
.comment .meta .who { font-weight: 600; font-size: 13px; }
.comment .meta .when { font-size: 11px; color: var(--muted); }
.comment .body { font-size: 13px; background: var(--surface-2); border-radius: 0 var(--r-sm) var(--r-sm) var(--r-sm); padding: 8px 11px; white-space: pre-wrap; word-break: break-word; line-height: 1.5; }
.new-comment-area { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
.new-comment-area textarea { min-height: 68px; resize: vertical; font-size: 13px; }

/* ============ NOTIFICATIONS ============ */
.notif-bell { position:relative; cursor:pointer; color:rgba(255,255,255,.75); width:30px; height:30px; display:flex; align-items:center; justify-content:center; border-radius:50%; flex-shrink:0; transition:background .15s,color .15s; }
.notif-bell:hover { color:#fff; background:rgba(255,255,255,.12); }
.notif-bell svg { width:17px; height:17px; }
.notif-badge { position:absolute; top:-4px; right:-4px; background:var(--danger); color:#fff; border-radius:50%; font-size:9.5px; font-weight:700; min-width:15px; height:15px; text-align:center; padding:0 3px; line-height:15px; display:none; pointer-events:none; }
.notif-badge.show { display:block; }
.topbar-right { margin-left:auto; display:flex; align-items:center; gap:8px; }
.topbar-right .who { margin-left:0; }
.foot-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:8px; }
.notif-panel { position:fixed; top:60px; right:16px; width:340px; max-height:480px; background:#fff; border-radius:12px; box-shadow:0 8px 30px rgba(0,0,0,.18); overflow-y:auto; z-index:1000; display:none; }
.notif-panel.open { display:block; }
.notif-item { padding:12px 16px; border-bottom:1px solid #f3f3f9; cursor:pointer; transition:background .12s; }
.notif-item.unread { background:var(--surface-3); border-left:3px solid var(--petrol); }
.notif-item:hover { background:#f5f5fa; }
.notif-item .ntitle { font-weight:700; font-size:13.5px; color:var(--ink); }
.notif-item .nbody { color:#6b6f8c; font-size:12.5px; margin-top:2px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.notif-item .ntime { color:#9a9cb5; font-size:11px; margin-top:3px; }
.notif-read-all { padding:10px 16px; text-align:center; color:var(--petrol); font-weight:600; cursor:pointer; border-top:1px solid var(--line); font-size:13px; }
.notif-read-all:hover { background:#f5f5fa; }
.notif-panel-head { padding:12px 16px 8px; border-bottom:1px solid #f3f3f9; font-weight:700; font-size:13px; color:var(--ink); }
.notif-toggle { display:inline-flex; align-items:center; gap:6px; cursor:pointer; }
.notif-toggle input[type=checkbox] { width:36px; height:20px; appearance:none; background:var(--line); border-radius:10px; cursor:pointer; transition:background .2s; position:relative; flex-shrink:0; }
.notif-toggle input[type=checkbox]:checked { background:var(--petrol); }
.notif-toggle input[type=checkbox]::after { content:''; position:absolute; width:14px; height:14px; border-radius:50%; background:#fff; top:3px; left:3px; transition:left .2s; }
.notif-toggle input[type=checkbox]:checked::after { left:19px; }
.notif-toggle span { font-size:12px; font-weight:600; min-width:26px; }

/* ============ RECHERCHE GLOBALE ============ */
.gsearch-wrap{position:relative;margin:4px 0 10px;padding:0 2px}
.gsearch-wrap input{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);color:#fff;border-radius:10px;padding:9px 12px 9px 36px;font-size:13px;width:100%;outline:none;transition:background .15s,border-color .15s}
.gsearch-wrap input::placeholder{color:rgba(255,255,255,.4)}
.gsearch-wrap input:focus{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.4);box-shadow:none}
.gsearch-ico{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:rgba(255,255,255,.55);pointer-events:none}
.gsearch-dropdown{position:absolute;top:calc(100% + 5px);left:0;right:0;background:#fff;border-radius:12px;box-shadow:0 8px 32px rgba(26,28,51,.3);z-index:300;max-height:360px;overflow-y:auto;display:none}
.gsearch-dropdown.open{display:block}
.gsearch-grp{padding:4px 0}
.gsearch-grp-title{font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:8px 14px 3px}
.gsearch-item{display:flex;align-items:center;gap:8px;padding:8px 14px;cursor:pointer;border-top:1px solid var(--line-soft)}
.gsearch-item:hover{background:var(--surface-2)}
.gsearch-item .gi-code{font-family:'IBM Plex Mono';font-weight:600;font-size:12.5px;color:var(--petrol);flex-shrink:0}
.gsearch-item .gi-sub{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.gsearch-empty{padding:16px;font-size:12.5px;color:var(--muted);text-align:center}
/* Recherche mobile (topbar) */
.topbar-search{flex:1;position:relative;min-width:0;margin:0 6px}
.topbar-search input{background:rgba(255,255,255,.15);border:none;color:#fff;border-radius:8px;padding:7px 10px 7px 30px;font-size:13px;width:100%;outline:none}
.topbar-search input:-webkit-autofill,.topbar-search input:-webkit-autofill:hover,.topbar-search input:-webkit-autofill:focus{-webkit-text-fill-color:#fff;-webkit-box-shadow:0 0 0 1000px var(--petrol) inset;caret-color:#fff}
.topbar-search input::placeholder{color:rgba(255,255,255,.5)}
.topbar-search .ts-ico{position:absolute;left:8px;top:50%;transform:translateY(-50%);width:15px;height:15px;color:rgba(255,255,255,.6);pointer-events:none}
.topbar-search .gsearch-dropdown{top:calc(100% + 8px);left:-60px;right:-80px}

/* ============ KPI CLIQUABLE ============ */
.kpi.lnk{cursor:pointer;transition:box-shadow .15s,transform .12s}
.kpi.lnk:hover{box-shadow:var(--shadow-md);transform:translateY(-1px)}
.kpi.lnk:active{transform:none;box-shadow:none}

/* ============ MINI GRAPHIQUE SEMAINES ============ */
.week-chart{display:flex;align-items:flex-end;gap:6px;height:60px}
.week-col{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;flex:1;height:100%}
.week-bar{width:100%;background:var(--petrol);border-radius:3px 3px 0 0;flex-shrink:0;min-height:3px;transition:height .3s}
.week-lbl{font-size:9px;color:var(--muted);white-space:nowrap;flex-shrink:0}

/* ============ TRI COLONNES ============ */
th.sort-th{cursor:pointer;user-select:none;transition:color .1s}
th.sort-th:hover{color:var(--petrol)}
th.sort-th.asc::after,th.sort-th.desc::after{content:'';display:inline-block;width:12px;height:12px;margin-left:5px;vertical-align:-1px;background:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") no-repeat center/contain;mask:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") no-repeat center/contain;color:var(--petrol)}
th.sort-th.asc::after{transform:rotate(-90deg)}
th.sort-th.desc::after{transform:rotate(90deg)}

/* ============ ÉTAT VIDE AVEC ACTION ============ */
.empty-cta{margin-top:12px;display:inline-flex;align-items:center;gap:7px;background:var(--petrol);color:#fff;border:none;border-radius:9px;padding:9px 16px;font-size:13px;font-weight:700;cursor:pointer;transition:filter .15s}
.empty-cta svg{width:16px;height:16px}
.empty-cta:hover{filter:brightness(1.1)}

/* ============ DASHBOARD 2 COLONNES ============ */
.dash-grid{display:grid;grid-template-columns:1fr 260px;gap:18px;align-items:start;margin-top:4px}
.dash-grid>*{min-width:0}
@media(max-width:960px){.dash-grid{grid-template-columns:1fr}}
.week-chart{max-width:100%;overflow:hidden}
.week-col{min-width:0}
.week-lbl{overflow:hidden;text-overflow:ellipsis;max-width:100%}

/* ============ ZONES CURATIVES ============ */
.cz-task .cz-action{display:flex;align-items:center;padding-right:10px}
.cz-task .cz-action .btn{white-space:nowrap}
@media(max-width:480px){
  .cz-task{flex-wrap:wrap}
  .cz-task .cz-action{width:100%;padding:6px 0 2px}
  .cz-task .cz-action .btn{width:100%}
}
.cz-zone{display:inline-flex;align-items:center;gap:4px;background:var(--amber-soft);color:var(--amber);padding:2px 8px;border-radius:999px;font-size:11.5px;font-weight:600}
.cz-secteur{display:inline-flex;align-items:center;gap:4px;background:var(--surface-2);color:var(--ink-soft);padding:2px 8px;border-radius:999px;font-size:11.5px;font-weight:600}
.cz-locked{display:inline-flex;align-items:center;gap:5px;background:var(--surface-2);color:var(--muted);padding:6px 11px;border-radius:9px;font-size:12px;font-weight:600}
.badge-count{background:var(--petrol-soft);color:var(--petrol);font-size:11.5px;font-weight:700;padding:2px 9px;border-radius:999px}

.cz-zone-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin-bottom:14px;box-shadow:var(--shadow)}
.cz-zone-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.cz-avatar{width:42px;height:42px;border-radius:50%;background:var(--gold);color:var(--petrol-2);display:grid;place-items:center;font-family:'Archivo';font-weight:800;font-size:15px;flex:0 0 auto}
.cz-zone-head .titre{font-weight:700;font-size:15px;color:var(--ink)}
.cz-zone-head .sub{font-size:12px;color:var(--muted)}
.cz-zone-head .actions{margin-left:auto;display:flex;gap:6px}
.cz-zone-row{display:grid;grid-template-columns:130px 1fr;gap:12px;align-items:start;padding:8px 0;border-top:1px solid var(--line)}
.cz-zone-row .lab{font-size:12px;color:var(--muted);font-weight:600;padding-top:6px}
.cz-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.cz-chip{display:inline-flex;align-items:center;gap:5px;background:var(--surface-2);color:var(--ink);border:1px solid var(--line);font-size:12.5px;padding:4px 9px;border-radius:8px;font-weight:500}
.cz-chip.secours{background:var(--amber-soft);color:var(--amber);border-color:#f5d99a}
.cz-chip .rm{background:none;border:none;color:inherit;cursor:pointer;font-size:13px;line-height:1;padding:0 0 0 2px;opacity:.65}
.cz-chip .rm:hover{opacity:1}
.cz-chip.add{background:var(--surface);border:1px dashed var(--line);color:var(--muted);cursor:pointer}
.cz-chip.add:hover{color:var(--petrol);border-color:var(--petrol)}
.cz-stat{font-size:12px;color:var(--muted);font-weight:600;margin-left:auto}
.cz-empty{padding:18px;text-align:center;background:var(--surface-2);border:1px dashed var(--line);border-radius:10px;color:var(--muted);font-size:13px}

/* === LOT 12 — Champs système configurables (refonte) === */
.sysf-group{display:flex;flex-direction:column;gap:6px;padding:4px}
.sysf-item{display:flex;flex-direction:column;gap:4px}
.sysf-item.sysf-item-off .sysf-row{opacity:.55;background:#fafafa}
.sysf-row{display:flex;align-items:center;gap:12px;padding:10px 12px;background:#fff;border:1px solid var(--line);border-radius:10px;transition:background .15s ease;flex-wrap:wrap}
.sysf-reorder{display:flex;flex-direction:column;gap:2px;flex-shrink:0}
.sysf-arrow{background:none;border:1px solid var(--line);border-radius:4px;padding:1px 6px;font-size:11px;line-height:1.5;cursor:pointer;color:var(--muted);transition:background .1s,color .1s}
.sysf-arrow:hover:not(:disabled){background:var(--petrol-soft);color:var(--petrol)}
.sysf-arrow:disabled{opacity:.3;cursor:default}
.sysf-icon{font-size:20px;flex-shrink:0;width:28px;text-align:center}
.sysf-info{flex:1;min-width:120px}
.sysf-lib{font-size:14px;color:var(--ink);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.sysf-meta{font-size:12px;color:var(--muted);margin-top:2px}
.sysf-controls{display:flex;align-items:center;gap:14px;flex-shrink:0;flex-wrap:wrap}
.sysf-tog{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:12px;color:var(--muted);white-space:nowrap;user-select:none}
.sysf-tog input{cursor:pointer}
.sysf-tog-visible input{accent-color:#16a34a}
.sysf-tog-oblig input{accent-color:var(--danger)}
.sysf-badge-oblig{background:var(--danger);color:#fff;font-size:10px;font-weight:700;padding:1px 7px;border-radius:10px;white-space:nowrap}
.sysf-edit-btn{flex-shrink:0}
.sysf-edit-panel{background:#f8f8ff;border:1px solid #ccd0ee;border-radius:8px;padding:14px 16px;margin:0 4px}
.sysf-edit-panel .field{margin-bottom:10px}
.sysf-edit-panel .field:last-of-type{margin-bottom:0}
.sysf-locked-note{display:flex;align-items:flex-start;gap:10px;padding:10px 14px;background:#fff9e6;border:1px solid #ffd58a;border-radius:8px;margin-bottom:12px;font-size:13px}
.sysf-panel-actions{display:flex;gap:8px;margin-top:12px}
.sysf-sep-item{display:flex;align-items:center;gap:8px;margin:4px 0}
.sysf-sep{flex:1;padding:10px 14px;background:linear-gradient(90deg,transparent 0%,#e8eaff 50%,transparent 100%);color:#36309c;font-weight:600;font-size:13px;text-align:center;letter-spacing:.5px;border-radius:6px;border:2px dashed #8886d4}

/* ─── Confirm danger (LOT13 : double confirmation actions destructrices) ─── */
body.modal-open{overflow:hidden;touch-action:none}
.confirm-danger-overlay{position:fixed;inset:0;background:rgba(15,18,42,.62);backdrop-filter:blur(4px);z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px;animation:cdgFade .15s ease}
@keyframes cdgFade{from{opacity:0}to{opacity:1}}
.confirm-danger-card{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow-lg);max-width:460px;width:100%;border-top:4px solid var(--danger);overflow:hidden;animation:cdgPop .18s ease}
@keyframes cdgPop{from{transform:translateY(8px) scale(.98);opacity:0}to{transform:none;opacity:1}}
.confirm-danger-head{display:flex;gap:14px;align-items:center;padding:18px 20px 12px}
.confirm-danger-icon{width:44px;height:44px;border-radius:50%;background:var(--danger-soft);color:var(--danger);display:grid;place-items:center;flex:0 0 auto}
.confirm-danger-icon svg{width:24px;height:24px}
.confirm-danger-title{font-weight:700;font-size:17px;color:var(--ink);line-height:1.2}
.confirm-danger-sub{font-size:12px;color:var(--danger);font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-top:2px}
.confirm-danger-body{padding:4px 20px 16px;color:var(--ink-soft);font-size:14px;line-height:1.5}
.confirm-danger-body p{margin:0 0 12px}
.confirm-danger-target{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm);padding:10px 12px;margin-bottom:12px;font-size:13.5px;color:var(--ink)}
.confirm-danger-target-lbl{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.04em;font-weight:600;margin-right:6px}
.confirm-danger-conseq{display:flex;gap:9px;align-items:flex-start;background:#fff6e0;border:1px solid #f5d68a;border-radius:var(--r-sm);padding:9px 11px;font-size:13px;color:#7a5400;margin-bottom:12px}
.confirm-danger-conseq svg{width:18px;height:18px;flex:0 0 auto;margin-top:1px}
.confirm-danger-field{margin-bottom:12px}
.confirm-danger-field label{display:block;font-size:13px;margin-bottom:6px;color:var(--ink-soft)}
.confirm-danger-field input{font-size:14.5px}
.confirm-danger-check{display:flex;align-items:flex-start;gap:9px;cursor:pointer;font-size:13.5px;color:var(--ink);padding:10px 12px;background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm)}
.confirm-danger-check input{width:auto;margin-top:2px;flex:0 0 auto;accent-color:var(--danger)}
.confirm-danger-actions{display:flex;gap:10px;justify-content:flex-end;padding:14px 20px 18px;border-top:1px solid var(--line-soft);background:var(--surface-2)}
.confirm-danger-actions .btn{padding:11px 18px;font-size:14px}
.confirm-danger-btn{background:var(--danger);color:#fff;border:none;box-shadow:var(--shadow)}
.confirm-danger-btn:hover:not(:disabled){filter:brightness(1.08)}
.confirm-danger-btn:disabled{background:#e0a4a9;cursor:not-allowed;box-shadow:none;color:#fff}

/* Confirmation légère (UI.confirm) */
.confirm-lite-overlay{position:fixed;inset:0;background:rgba(15,18,42,.55);backdrop-filter:blur(3px);z-index:10001;display:flex;align-items:center;justify-content:center;padding:20px;animation:cdgFade .12s ease}
.confirm-lite-card{background:var(--surface);border-radius:var(--r);box-shadow:var(--shadow-lg);max-width:380px;width:100%;padding:20px 22px 16px;animation:cdgPop .15s ease}
.confirm-lite-title{font-weight:700;font-size:15.5px;color:var(--ink);line-height:1.3;margin-bottom:8px}
.confirm-lite-msg{font-size:13.5px;color:var(--ink-soft);line-height:1.5;margin-bottom:16px}
.confirm-lite-actions{display:flex;gap:8px;justify-content:flex-end}
.confirm-lite-actions .btn{padding:9px 16px;font-size:13.5px}
@media (max-width:520px){.confirm-lite-card{max-width:100%}.confirm-lite-actions{flex-direction:column-reverse}.confirm-lite-actions .btn{width:100%}}

/* ============ ZONE D'EXPORT (3 sections) ============ */
.exports-zone{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden}
.exp-sec{padding:14px 18px;border-bottom:1px solid var(--line-soft)}
.exp-sec:last-child{border-bottom:none}
.exp-sec-rapide{background:linear-gradient(135deg,#fafaff,#fff)}
.exp-sec-perso{background:linear-gradient(135deg,#fffdf5,#fff)}
.exp-sec-ville{background:linear-gradient(135deg,#f6fbff,#fff)}
.exp-sec-head{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.exp-sec-ic{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;font-size:15px;flex-shrink:0;line-height:1}
.exp-ic-rapide{background:var(--petrol-soft)}
.exp-ic-perso{background:var(--gold-soft)}
.exp-ic-ville{background:#e7f0ff}
.exp-sec-title{font-weight:700;font-size:13.5px;color:var(--ink);line-height:1.2}
.exp-sec-sub{font-size:11.5px;color:var(--muted);font-weight:500;margin-top:2px}
.exp-sec-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-left:39px}
.exp-count{font-size:11.5px;color:var(--muted)}

/* Cartes "document" PDF de la section ville */
.exp-doc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;padding-left:39px}
.exp-doc-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:10px;padding:12px 13px 13px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:5px;box-shadow:0 1px 2px rgba(54,48,156,0.04);transition:border-color .15s,box-shadow .15s,transform .15s}
.exp-doc-card:hover{border-color:var(--petrol);box-shadow:0 3px 10px rgba(54,48,156,0.12);transform:translateY(-1px)}
.exp-doc-card:active{transform:translateY(0)}
.exp-doc-tag{position:absolute;top:10px;right:10px;font-size:9.5px;font-weight:800;letter-spacing:.5px;color:#fff;background:#cc2e3e;padding:2px 7px;border-radius:9px;line-height:1.4}
.exp-doc-title{font-weight:700;font-size:13px;color:var(--ink);line-height:1.25;padding-right:42px}
.exp-doc-desc{font-size:11.5px;color:var(--muted);line-height:1.35}

@media (max-width:640px){
  .exp-sec-actions{padding-left:0}
  .exp-doc-grid{padding-left:0;grid-template-columns:1fr}
}
@media (max-width:520px){.confirm-danger-card{max-width:100%}.confirm-danger-actions{flex-direction:column-reverse}.confirm-danger-actions .btn{width:100%}}

/* ============ Bloc "À finaliser" (vue sup/admin) ============ */
.finaliser-card{background:linear-gradient(180deg,#fdf4ff,#fff);border:1px solid #f0abfc;border-radius:var(--r);padding:16px 18px 12px;margin-bottom:18px;box-shadow:0 2px 12px rgba(162,28,175,.08)}
.finaliser-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.finaliser-ic{width:38px;height:38px;border-radius:10px;background:#fae8ff;color:#a21caf;display:grid;place-items:center;flex:0 0 auto}
.finaliser-ic svg{width:20px;height:20px}
.finaliser-title{font-family:'Archivo';font-weight:700;font-size:15px;color:#a21caf}
.finaliser-sub{font-size:12.5px;color:var(--muted);margin-top:1px}
.finaliser-list{display:flex;flex-direction:column;gap:8px}
.finaliser-row{background:#fff;border:1px solid #f0abfc;border-radius:var(--r-sm);padding:12px 14px;cursor:pointer;transition:box-shadow .12s,transform .12s}
.finaliser-row:hover{box-shadow:0 3px 10px rgba(162,28,175,.13);transform:translateY(-1px)}
.fr-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.fr-ref{font-weight:600;font-size:13px;color:var(--ink)}
.fr-hd{font-size:13px;color:var(--ink)}
.fr-meta{font-size:12px;flex:1;min-width:0}
.fr-missing{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.miss-chip{display:inline-block;font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;background:#fef3c7;color:#92400e;border:1px solid #fde68a}
.miss-chip.miss-ok{background:var(--ok-soft);color:var(--ok);border-color:#c2e3cd}

/* ============ Onglets par statut + puces type ============ */
.status-tabs{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:5px;box-shadow:var(--shadow)}
.status-tab{border:none;background:transparent;padding:8px 12px;border-radius:var(--r-sm);font-size:13px;font-weight:600;color:var(--ink-soft);cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:background .1s,color .1s}
.status-tab:hover{background:var(--surface-2)}
.status-tab.on{background:var(--petrol);color:#fff}
.status-tab .tab-count{background:rgba(0,0,0,.08);color:inherit;font-size:11.5px;font-weight:700;padding:1px 7px;border-radius:999px;line-height:1.4}
.status-tab.on .tab-count{background:rgba(255,255,255,.22)}

.type-chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
.type-chip{border:1px solid var(--line);background:var(--surface);padding:6px 12px;border-radius:999px;font-size:12.5px;font-weight:500;color:var(--ink-soft);cursor:pointer;transition:background .1s,color .1s,border-color .1s}
.type-chip:hover{background:var(--surface-2)}
.type-chip.on{background:var(--ink);color:#fff;border-color:var(--ink)}

/* Tableau intervention list (sup/admin) */
.intlist-wrap{margin-bottom:20px}
.intlist-table tbody tr{cursor:pointer}
.intlist-table tbody tr:hover{background:var(--surface-2)}
.intlist-table td{padding:10px 12px;border-bottom:1px solid var(--line-soft);vertical-align:middle}

/* Bouton photo "Choisir" (sup/admin) */
.addphoto.pick{background:var(--surface-2);color:var(--ink-soft)}
.addphoto.pick:hover{background:var(--surface);border-color:var(--petrol);color:var(--petrol)}

/* Ligne de sauvegarde éditeur (Enregistrer + Enregistrer à finaliser) */
.ed-save-row{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.ed-save-af{border:1px dashed var(--muted)}

@media (max-width:640px){
  .fr-head{flex-direction:column;align-items:flex-start}
  .fr-meta{white-space:normal}
  .status-tab{padding:7px 10px;font-size:12.5px}
  .type-chip{padding:5px 10px;font-size:12px}
}

/* ============ REFONTE VISUELLE (Suivi curatif · Historique · Paramètres) ============ */

/* -------- Suivi curatif : bandeau KPI + row par technicien -------- */
.suivicur-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:0 0 18px}
.suivicur-kpi-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;min-width:0;box-shadow:var(--shadow)}
.suivicur-kpi-card .k-lbl{font-size:var(--fs-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.suivicur-kpi-card .k-val{font-family:'Archivo';font-weight:800;font-size:26px;line-height:1.1;margin-top:6px;color:var(--ink);overflow-wrap:anywhere}
.suivicur-kpi-card .k-sub{font-size:var(--fs-xs);color:var(--muted);margin-top:5px;font-weight:600}
.suivicur-kpi-card.t-ok    .k-val{color:var(--ok)}
.suivicur-kpi-card.t-warm  .k-val{color:var(--warm)}
.suivicur-kpi-card.t-signal .k-val{color:var(--signal)}
.suivicur-kpi-card.t-signal{background:var(--signal-soft);border-color:#f3d9bd}
.suivicur-kpi-card.t-warm  {background:var(--warm-soft);border-color:#f0dfad}
.suivicur-kpi-card.t-ok    {background:var(--ok-soft);border-color:#c2e3cd}

.suivicur-row{padding:14px 16px;margin-bottom:10px}
.suivicur-row.is-zero{opacity:.72}
.suivicur-row-head{display:flex;align-items:center;gap:14px;cursor:pointer}
.suivicur-av{background:var(--surface-2);color:var(--ink);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:var(--fs-sm)}
.suivicur-row-body{flex:1;min-width:0}
.suivicur-row-title{display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.suivicur-row-title .muted{font-size:var(--fs-sm)}
.suivicur-row-pills{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.suivicur-row .prev-chev{transition:transform .18s;color:var(--muted);display:grid;place-items:center;width:24px;height:24px}
.suivicur-row .prev-chev.is-open{transform:rotate(90deg)}
.suivicur-det{margin-top:12px;border-top:1px solid var(--line);padding-top:10px}
.suivicur-det-actions{margin-top:10px;text-align:right}
.pill.taux-clot{background:var(--surface-2);color:var(--ink);border:1px solid var(--line)}
.pill.taux-clot.t-ok    {background:var(--ok-soft);color:var(--ok);border-color:#c2e3cd}
.pill.taux-clot.t-warm  {background:var(--warm-soft);color:var(--warm);border-color:#f0dfad}
.pill.taux-clot.t-signal{background:var(--signal-soft);color:var(--signal);border-color:#f3d9bd}

@media (max-width:640px){
  .suivicur-kpi{grid-template-columns:repeat(2,1fr);gap:10px}
  .suivicur-kpi-card{padding:12px 13px}
  .suivicur-kpi-card .k-val{font-size:22px}
  .suivicur-row-head{gap:10px}
}

/* -------- Historique : thead sticky, étiquettes tronquées + toolbar sticky + cartes mobile -------- */
.hist-toolbar{position:sticky;top:0;z-index:15;background:var(--paper);padding:8px 0;margin-bottom:6px}
@media (max-width:880px){.hist-toolbar{top:56px}}
.hist-table thead th{position:sticky;top:0;background:var(--surface);z-index:2;box-shadow:inset 0 -1px 0 var(--line)}
.hist-tags{display:flex;flex-wrap:nowrap;gap:4px;align-items:center;max-width:180px}
.hist-tags .tag{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:80px}
.hist-tags .tag-more{background:var(--surface-2);color:var(--muted);border:1px solid var(--line);font-size:var(--fs-xs);padding:2px 7px;border-radius:8px;font-weight:600}
.hist-crit{display:inline-block;font-size:10px;font-weight:700;padding:1px 4px;margin-left:4px;border-radius:3px;background:#efefef;color:var(--muted)}
.hist-crit.a{background:#fde9eb;color:var(--danger)}
/* Marqueur de lien SIG↔INT sous la réf (histo desktop + card mobile) */
.hist-link{display:inline-flex;align-items:center;gap:3px;margin-top:3px;font-family:'IBM Plex Mono';font-weight:500;font-size:11px;color:var(--petrol);opacity:.75;cursor:pointer;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.hist-link svg{width:10px;height:10px;flex:0 0 auto}
.hist-link:hover{opacity:1;text-decoration:underline}
/* Sur desktop, forcer le retour à la ligne sous la réf */
.hist-table td.mono .hist-link{display:flex}
.hist-cards{display:none}

@media (max-width:768px){
  .hist-tablewrap{display:none}
  .hist-cards{display:flex;flex-direction:column;gap:10px}
  .hist-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px 13px;box-shadow:var(--shadow);cursor:pointer;display:flex;flex-direction:column;gap:8px}
  .hist-card:active{background:var(--surface-2)}
  .hist-card-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
  .hist-card-ref{font-family:'IBM Plex Mono';font-weight:600;font-size:var(--fs-sm);color:var(--ink)}
  .hist-card-body{font-size:var(--fs-sm);color:var(--ink-soft);line-height:1.35}
  .hist-card-meta{display:flex;flex-wrap:wrap;gap:8px 12px;font-size:var(--fs-xs);color:var(--muted);align-items:center}
  .hist-card-meta .hd{font-family:'IBM Plex Mono';color:var(--ink);font-weight:600}
  .hist-card-actions{display:flex;gap:6px;align-items:center;margin-left:auto}
}

/* -------- Paramètres : sidebar interne + harmonisation icônes/logos -------- */
.adm-shell{display:grid;grid-template-columns:220px 1fr;gap:18px;align-items:start}
.adm-nav{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:8px;box-shadow:var(--shadow);position:sticky;top:8px}
.adm-nav-group{padding:10px 10px 4px}
.adm-nav-group-lbl{font-size:var(--fs-xs);color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-weight:700}
.adm-nav-item{display:flex;align-items:center;gap:10px;width:100%;background:none;border:none;text-align:left;padding:9px 10px;border-radius:9px;font-size:var(--fs-md);font-weight:600;color:var(--ink-soft);cursor:pointer;font-family:inherit}
.adm-nav-item svg{width:var(--icon-size);height:var(--icon-size);flex:0 0 auto;color:var(--muted)}
.adm-nav-item:hover{background:var(--surface-2);color:var(--ink)}
.adm-nav-item.on{background:var(--petrol-soft);color:var(--petrol)}
.adm-nav-item.on svg{color:var(--petrol)}
.adm-body-wrap{min-width:0}
.adm-body-head{display:flex;align-items:center;gap:12px;margin-bottom:14px}
.adm-body-head .logo{width:var(--logo-size);height:var(--logo-size);border-radius:10px;background:var(--petrol-soft);color:var(--petrol);display:grid;place-items:center;flex:0 0 auto}
.adm-body-head .logo svg{width:calc(var(--logo-size) * .58);height:calc(var(--logo-size) * .58)}
.adm-body-head h3{font-family:'Archivo';font-weight:800;font-size:var(--fs-lg);margin:0;color:var(--ink)}
.adm-body-head .sub{font-size:var(--fs-sm);color:var(--muted);margin-top:2px}

@media (max-width:900px){
  .adm-shell{grid-template-columns:1fr;gap:12px}
  .adm-nav{position:relative;top:auto;padding:6px}
  .adm-nav-group{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:6px;padding:6px}
  .adm-nav-group-lbl{grid-column:1/-1;padding:6px 4px 0}
  .adm-nav-item{padding:10px 12px;font-size:var(--fs-sm)}
}

/* -------- Popover déconnexion sidebar (déco discrète) -------- */
.sidebar button.who{background:none;border:none;color:inherit;font:inherit;text-align:left;width:100%;cursor:pointer;padding:6px 8px;border-radius:9px;transition:background .15s}
.sidebar button.who:hover,.sidebar button.who:focus-visible{background:rgba(255,255,255,.08);outline:none}
.user-popover{position:absolute;bottom:calc(100% + 8px);left:8px;right:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);box-shadow:var(--shadow-lg);padding:10px;z-index:80;animation:rise .18s ease}
.user-popover[hidden]{display:none}
.user-popover .up-info{display:flex;align-items:center;gap:10px;padding:6px 6px 10px;border-bottom:1px solid var(--line-soft);margin-bottom:8px}
.user-popover .up-info .av{width:36px;height:36px;border-radius:50%;background:var(--petrol-soft);color:var(--petrol);display:grid;place-items:center;font-weight:700;flex:0 0 auto;font-size:var(--fs-sm)}
.user-popover .up-info strong{display:block;font-size:var(--fs-md);color:var(--ink);font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:170px}
.user-popover .up-info small{display:block;font-size:var(--fs-xs);color:var(--muted);text-transform:capitalize;margin-top:2px}
.user-popover .up-logout{display:flex;align-items:center;gap:9px;width:100%;min-height:40px;background:var(--danger-soft);color:var(--danger);border:1px solid #f3c8cd;border-radius:9px;padding:9px 11px;font-size:var(--fs-sm);font-weight:700;cursor:pointer;font-family:inherit}
.user-popover .up-logout:hover,.user-popover .up-logout:focus-visible{background:#f5cdd2;outline:none}
.user-popover .up-logout svg{width:16px;height:16px}
.sidebar .foot{position:relative}

/* ─── Onglet Parc : pulsation pour états actifs (hors_service/signalement/alarme) ─── */
@keyframes parcPulseBorder {
  0%   { box-shadow: 0 0 0 0 color-mix(in srgb, var(--pulse-color) 55%, transparent); }
  70%  { box-shadow: 0 0 0 8px color-mix(in srgb, var(--pulse-color) 0%, transparent); }
  100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--pulse-color) 0%, transparent); }
}
.parc-card.pulse { animation: parcPulseBorder 2.1s ease-out infinite; }
.parc-etat-tag.pulse::after {
  content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%;
  background: var(--pulse-color); margin-left: 6px; vertical-align: middle;
  animation: parcDotBlink 1.4s ease-in-out infinite;
}
@keyframes parcDotBlink { 0%,100% { opacity: 1; } 50% { opacity: .25; } }

/* Marker Leaflet pulsant : halo qui se dilate */
@keyframes parcMarkerHalo {
  0%   { box-shadow: 0 0 0 0 color-mix(in srgb, var(--pulse-color) 60%, transparent), 0 1px 4px rgba(0,0,0,.35); }
  70%  { box-shadow: 0 0 0 10px color-mix(in srgb, var(--pulse-color) 0%, transparent), 0 1px 4px rgba(0,0,0,.35); }
  100% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--pulse-color) 0%, transparent), 0 1px 4px rgba(0,0,0,.35); }
}
.parc-marker-pulse { animation: parcMarkerHalo 1.8s ease-out infinite; }

/* Respect utilisateurs sensibles aux animations */
@media (prefers-reduced-motion: reduce) {
  .parc-card.pulse, .parc-etat-tag.pulse::after, .parc-marker-pulse { animation: none; }
}

/* KPI actif (filtre par état) */
.kpi.is-active { outline: 2px solid var(--petrol, #0d6e6e); outline-offset: 2px; }

/* Hover carte parc : légère élévation, cohérent avec les autres cartes cliquables */
.parc-card:hover { box-shadow: 0 4px 14px rgba(30, 30, 60, .10); transform: translateY(-1px); }
.parc-card:focus-visible { outline: 2px solid var(--petrol, #0d6e6e); outline-offset: 2px; }

/* ─── Robustesse UX (passe 2026-07-19) ─── */

/* Table du mapping Presto (admin › Alarmes/signalements parc) :
   colonnes prévisibles + scroll H maîtrisé, sans impacter les autres .tablewrap. */
.presto-mapping-table { table-layout: fixed; min-width: 1050px; }
.presto-mapping-table th,
.presto-mapping-table td { overflow: hidden; text-overflow: ellipsis; }
.presto-mapping-table td select,
.presto-mapping-table td input { max-width: 100%; }
.presto-mapping-table .badge-prev {
  display:inline-block; margin-top:4px; font-size:10.5px; font-weight:700;
  padding:1px 7px; border-radius:8px;
  background:var(--amber-soft, #fff4d6); color:var(--amber, #8a6300);
  border:1px solid rgba(138,99,0,.2);
}

/* Marquage sobre d'un champ en erreur (validation client).
   Bordure d'alerte fine + halo très discret, cohérent avec le focus indigo.
   S'efface au premier 'input' via UI.markInvalid → JS. */
.field-invalid > input,
.field-invalid > select,
.field-invalid > textarea,
input.field-invalid,
select.field-invalid,
textarea.field-invalid {
  border-color: var(--danger, #cc2e3e);
  box-shadow: 0 0 0 2px rgba(204, 46, 62, .10);
}

/* Cibles tactiles mobile (WCAG 2.5.5) : hitbox invisible ≥44×44
   via pseudo-élément, sans modifier la taille visible du bouton
   (esthétique desktop et layout intacts). */
@media (max-width: 880px) {
  /* .photo .rm garde position:absolute (défini plus haut) pour rester
     en overlay haut-droite ; le pseudo-élément suffit à étendre la
     hitbox à 44×44 sans casser le positionnement visible. */
  .icon-btn, .sheet-head .x, .qty button {
    position: relative;
  }
  .icon-btn::after, .sheet-head .x::after, .photo .rm::after, .qty button::after {
    content: '';
    position: absolute;
    inset: 50% 50% 50% 50%;
    width: 44px; height: 44px;
    margin: -22px 0 0 -22px;
    left: 50%; top: 50%;
  }
  .notif-toggle input[type=checkbox] {
    min-height: 24px;
    height: 24px;
  }
  .notif-toggle input[type=checkbox]::after { top: 5px; }
}

/* Page Signaler : formulaire seul en mobile/tablette, formulaire + carte
   Leaflet en desktop (≥1024px). La carte est plus visuelle pour les comptes
   boutique qui connaissent le parc par emplacement plutôt que par code. */
.sig-layout { display: block; }
.sig-form { max-width: 620px; }
.sig-map-card { display: none; }
@media (min-width: 1024px) {
  .sig-layout {
    display: grid;
    grid-template-columns: minmax(0, 620px) minmax(0, 1fr);
    gap: 16px;
    align-items: start;
  }
  .sig-form { max-width: none; }
  .sig-map-card { display: block; }
}
