/* ============================================================================
   CRM Autech Expert — charte graphique unique du CRM.
   Base reprise À L'IDENTIQUE de C:\RemoteExpert\site\app.css (service technique
   Remote), par décision de Guillaume (24/10/2026 soir) : tout le CRM doit
   ressembler « comme deux gouttes d'eau » à Remote. Voir design/CHARTE-REMOTE.md
   pour la liste des classes à utiliser par les développeurs.
   Ne pas modifier les règles ci-dessous (jusqu'au marqueur « COMPATIBILITÉ »)
   sans les reporter aussi dans Remote : elles doivent rester identiques.

   --accent (bleu ardoise) = TOUTE l'interaction : boutons principaux, sélection, focus, onglets actifs.
   --rouge = UNIQUEMENT danger / erreur / échec / suppression / non lus (+ logo de la marque). Appeler = --appel (vert), raccrocher = --danger. */
:root{
  --nav:#23272e;--nav-ok:#4cc285;--nav-retard:#f0a640;--nav-ko:#ff4d5e;--nav-champ:#31363e;--nav-txt:#e9ebee;--nav-txt2:#a3a9b1;--nav-survol:rgba(255,255,255,.08);
  --accent:#3b5b80;--accent-d:#2d4766;--accent-f:#eaf0f6;--accent-t:#2d4766;--appel:#1e7f49;--appel-d:#17663a;--danger:#c4122f;--danger-d:#9e0e26;
  --fond:#ecece7;--fond2:#f7f7f4;--carte:#fff;--bord:#d3d3cb;--bord2:#e4e4dd;--ombre-c:0 1px 3px rgba(26,29,33,.08),0 1px 1px rgba(26,29,33,.04);
  --txt:#1a1d21;--txt2:#3a3f45;--txt3:#5f656c;
  --vert:#1e7f49;--vert-f:#e6f5ec;--rouge:#e2001a;--rouge-f:#fdecec;--jaune:#a87500;--orange:#b26a00;--orange-f:#fff4e0;
  --bleu:#2a5bd7;--bleu-f:#e9effc;--violet:#6b46c1;--violet-f:#f1ecfb;--cyan:#0e7490;--cyan-f:#e3f3f6;--rose:#be185d;--brun:#8a5a2b;
  --r:12px;--blanc:#fff;--ombre-f:0 8px 32px rgba(16,27,40,.18);--ombre-h:0 14px 30px -12px rgba(26,29,33,.28);
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){color-scheme:dark;--accent:#4b74a6;--accent-d:#3d6390;--accent-f:#1f2a37;--accent-t:#9dbbe0;--appel:#23774a;--appel-d:#1d6b40;--danger:#c93a47;--danger-d:#a8303c;--fond:#101215;--fond2:#1b1f24;--carte:#1f2328;--bord:#3a4048;--bord2:#2d3238;--ombre-c:0 1px 3px rgba(0,0,0,.45);--txt:#e9ebee;--txt2:#c9cdd2;--txt3:#9aa1a9;--vert:#4cc285;--vert-f:#173326;--rouge:#ff4d5e;--rouge-f:#3a1a1e;--jaune:#f5c542;--orange:#f0a640;--orange-f:#3a2c14;--bleu:#7aa2ff;--bleu-f:#1d2740;--violet:#b49cf0;--violet-f:#2a2340;--cyan:#4fd1e0;--cyan-f:#14303a;--rose:#f472b6;--brun:#d6a26a;--ombre-f:0 8px 32px rgba(0,0,0,.5);--ombre-h:0 14px 30px -12px rgba(0,0,0,.6)}}
:root[data-theme=dark]{color-scheme:dark;
  --accent:#4b74a6;--accent-d:#3d6390;--accent-f:#1f2a37;--accent-t:#9dbbe0;--appel:#23774a;--appel-d:#1d6b40;--danger:#c93a47;--danger-d:#a8303c;
  --fond:#101215;--fond2:#1b1f24;--carte:#1f2328;--bord:#3a4048;--bord2:#2d3238;--ombre-c:0 1px 3px rgba(0,0,0,.45);
  --txt:#e9ebee;--txt2:#c9cdd2;--txt3:#9aa1a9;
  --vert:#4cc285;--vert-f:#173326;--rouge:#ff4d5e;--rouge-f:#3a1a1e;--jaune:#f5c542;--orange:#f0a640;--orange-f:#3a2c14;
  --bleu:#7aa2ff;--bleu-f:#1d2740;--violet:#b49cf0;--violet-f:#2a2340;--cyan:#4fd1e0;--cyan-f:#14303a;--rose:#f472b6;--brun:#d6a26a;--ombre-f:0 8px 32px rgba(0,0,0,.5);--ombre-h:0 14px 30px -12px rgba(0,0,0,.6);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;height:100%}
body{font-family:Inter,"Segoe UI",Roboto,system-ui,sans-serif;background:var(--fond);color:var(--txt);font-size:14px;line-height:1.45}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
h1{font-size:20px;margin:0}
h2{font-size:15px;margin:0 0 12px}
h3{font-size:13px;margin:0 0 8px;color:var(--txt3);text-transform:uppercase;letter-spacing:.04em;font-weight:600}

/* Layout */
.app{display:flex;min-height:100vh}
.side{width:232px;flex:none;background:var(--nav);color:var(--nav-txt);display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.brand{display:flex;gap:10px;align-items:center;padding:18px 16px 14px}
.brand img{width:52px;height:30px;object-fit:contain;background:var(--blanc);border-radius:6px;padding:2px}
.brand b{display:block;font-size:13px;letter-spacing:.01em;white-space:nowrap}
.side .brand>div{min-width:0}.side .brand b{overflow:hidden;text-overflow:ellipsis}
.brand small{color:var(--nav-txt2);font-size:10.5px;letter-spacing:.08em}
.nav{padding:6px 8px;flex:1;overflow:auto}
.nav a{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:6px;color:var(--nav-txt);margin-bottom:2px}
.nav a:hover{background:var(--nav-survol)}
.nav a.on{background:var(--accent);color:var(--blanc)}
.nav a .n{margin-left:auto;background:var(--nav-champ);border-radius:999px;padding:0 7px;font-size:11.5px}
/* bulle de notification (nouvelles demandes) : rouge = « non lu », réservé à cet usage */
.nav a .n.alerte{min-width:20px;text-align:center;background:var(--danger);color:var(--blanc);font-weight:700}
.nav a.on .n{background:color-mix(in srgb,var(--blanc) 25%,transparent)}
.nav a.on .n.alerte{background:var(--danger);box-shadow:0 0 0 2px color-mix(in srgb,var(--blanc) 35%,transparent)}
.nav svg{width:17px;height:17px;flex:none}
.sync{margin:8px;padding:10px;border-radius:6px;background:var(--nav-champ);font-size:11.5px;color:var(--nav-txt2)}
.sync b{color:var(--nav-txt)}
.dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--vert);margin-right:5px}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.top{display:flex;align-items:center;gap:12px;padding:14px 24px;background:var(--carte);border-bottom:1px solid var(--bord);position:sticky;top:env(safe-area-inset-top,0px);z-index:5}
.top .sp{flex:1}
.burger{display:none}
.user{display:flex;align-items:center;gap:8px;color:var(--txt2)}
.av{width:28px;height:28px;border-radius:50%;background:var(--accent);color:var(--blanc);display:grid;place-items:center;font-weight:600;font-size:12px;flex:none}
.content{padding:24px;width:100%}

/* Composants */
.card{background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);padding:16px;box-shadow:var(--ombre-c)}
.grid{display:grid;gap:16px}
.g4{grid-template-columns:repeat(4,1fr)}
.g2{grid-template-columns:1fr 1fr}
.g32{grid-template-columns:3fr 2fr}
/* Tableau de bord : planning à gauche, KPI 2×2 + parcours dans une colonne étroite */
.g-dash{grid-template-columns:minmax(0,1fr) minmax(260px,340px);align-items:start}
@media (max-width:1100px){.g-dash{grid-template-columns:1fr}}
.dash-plan{min-width:0}
/* tableau de bord : tout sur un écran */
.dash .dash-kpis{margin-bottom:0;gap:12px;grid-template-columns:1fr 1fr}
.dash .kpi{padding:10px 14px}
.dash .kpi .v{font-size:22px;margin-top:0;line-height:1.2}
.dash .kpi .l,.dash .kpi .d{font-size:12px}
.dash .dash-alerte{margin-bottom:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (max-width:1100px){.dash .dash-alerte{white-space:normal}}
.dash .g-dash{gap:12px}
.dash .g-dash>.grid{gap:12px}
.dash .g-dash .card{padding:12px 16px}
.dash .g-dash h2{margin-bottom:4px}
.dash .hbar{margin:3px 0;font-size:12.5px}
.dash .g-dash .list-item{padding:3px 0;min-height:44px}
.dash .g-dash .card p.small{margin-top:6px!important;font-size:11.5px}
.dash-plan-hd{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;margin-bottom:10px}
.dash-plan-hd h2{margin:0}
.dash-leg{margin:0}
.ag-riche .ag-grid{min-width:0!important;grid-template-columns:52px minmax(0,1fr)!important}
.ag-riche .ev{padding:6px 10px;font-size:12.5px;line-height:1.35;display:flex;flex-direction:column;gap:2px}
.evr-hd{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.evr-hd b{font-size:13.5px}
.evr-etat{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.evr-tech{margin-left:auto;font-weight:600}
.evr-l{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.evr-dem{color:var(--txt3);white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
/* lignes jamais écrasées les unes sur les autres : ce qui ne tient pas dans la hauteur du créneau est masqué proprement */
.ag-riche .ev{overflow:hidden}
.ag-riche .ev>*{flex-shrink:0}
/* Agenda, choix du créneau : les RDV déjà posés laissent passer le clic (deux RDV au même horaire = côte à côte) */
.ag.pick .ev{pointer-events:none;opacity:.8}
/* En-tête de case avec bouton vers la fiche concernée (fiche ticket) */
.card-hd{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;min-height:28px}
@media (pointer:coarse){.card-hd{min-height:44px}}
.card-hd h3{margin:0}
.card-go{display:inline-flex;align-items:center;gap:6px;flex:none}
.card-go svg{width:14px;height:14px;fill:currentColor}
.tk-distrib{font-size:13px;line-height:1.6}
/* Parcours : étape « Commande créée » (verte quand la commande de la tablette est synchronisée) */
.step.done.creee{border-color:var(--vert);color:color-mix(in srgb,var(--vert) 80%,var(--txt));font-weight:700}
.step.attente{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.step-sync{margin-top:2px}
.step-btns{display:flex;flex-wrap:wrap;gap:4px;width:100%}
.step-btns .btn{white-space:normal;text-align:left;line-height:1.25;max-width:100%}
.fc-l{border:0;padding:0;margin:0 0 10px;display:grid;gap:6px;max-height:50vh;overflow:auto}
.fc-o{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--bord);border-radius:10px;cursor:pointer;background:var(--carte);transition:border-color .15s,background .15s}
.fc-o:hover{border-color:color-mix(in srgb,var(--accent) 55%,var(--bord))}
.fc-o:has(input:checked){border-color:var(--accent);background:var(--accent-f)}
.fc-o:has(input:focus-visible){box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.fc-o input{accent-color:var(--accent);margin-top:3px}
.fc-o>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.fc-o .badge{align-self:flex-start}
/* Panneau « Commande terminée » */
.tm-choix{border:0;padding:0;margin:0 0 14px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tm-choix legend{margin-bottom:8px}
.tm-opt{position:relative;display:flex;gap:10px;align-items:center;padding:12px 14px;border:2px solid var(--bord);border-radius:10px;cursor:pointer;background:var(--carte);transition:border-color .15s,background .15s,transform .15s}
.tm-opt:hover{border-color:var(--txt3);transform:translateY(-1px)}
.kv dd .badge{white-space:normal;border-radius:10px;line-height:1.35;padding:3px 8px}
.tm-opt input{position:absolute;opacity:0;pointer-events:none}
.tm-opt>span:last-child{display:grid}
.tm-ic{width:32px;height:32px;border-radius:999px;display:grid;place-items:center;font-weight:800;flex:none;background:var(--fond2);color:var(--txt3)}
.tm-opt.ok:has(input:checked){border-color:var(--vert);background:var(--vert-f)}
.tm-opt.ok:has(input:checked) .tm-ic{background:var(--vert);color:var(--blanc)}
.tm-opt.ko:has(input:checked){border-color:var(--rouge);background:var(--rouge-f)}
.tm-opt.ko:has(input:checked) .tm-ic{background:var(--rouge);color:var(--blanc)}
.tm-opt:has(input:focus-visible){box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.tm-info:empty{display:none}
@media (max-width:480px){.tm-choix{grid-template-columns:1fr}}
/* Dictée vocale : micro en bas à droite des champs de commentaire */
.dictee-w{position:relative}
.dictee-w>textarea{resize:vertical;padding-right:68px;min-height:64px}
.dictee-btn{position:absolute;right:20px;bottom:8px;width:44px;height:44px;border-radius:999px;border:1px solid var(--bord);background:var(--carte);color:var(--txt3);display:grid;place-items:center;cursor:pointer;transition:background .15s,color .15s,border-color .15s,transform .15s}
.dictee-btn svg{width:18px;height:18px;fill:currentColor}
.dictee-btn:hover{color:var(--accent-t);border-color:var(--accent);transform:translateY(-1px)}
.dictee-btn:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.dictee-btn.on{background:var(--accent);border-color:var(--accent);color:var(--blanc);animation:dictee-pulse 1.4s ease-out infinite}
@keyframes dictee-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 45%,transparent)}100%{box-shadow:0 0 0 10px transparent}}
@media (prefers-reduced-motion:reduce){.dictee-btn.on{animation:none}}
/* Statut et options des appareils (repris de l'intranet) */
.app-etat{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 10px}
.app-opts{display:flex;flex-wrap:wrap;gap:4px;max-width:340px}
.app-b{font-weight:600;white-space:normal}
.app-nd{background:var(--fond2);color:var(--txt3);box-shadow:inset 0 0 0 1px var(--bord)}
.app-codes{margin-top:4px}
.app-note{white-space:pre-wrap;font-size:13px;background:var(--fond2);border-radius:6px;padding:8px 10px;margin-top:8px}
.app-maj{margin-top:8px}
.app-hist .list-item{cursor:default;align-items:flex-start;flex-wrap:wrap;row-gap:4px}
.app-tab{padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid var(--bord2)}
/* Présence sur les fiches */
#presence-z{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
#presence-z:empty{display:none}
@media (max-width:760px){.pres-vu{z-index:35}}   /* sous le menu latéral ouvert sur téléphone */
@media (max-width:600px){.toast{bottom:calc(env(safe-area-inset-bottom,0px) + 96px)}}
#presence-z:not(:has(.pres-appel)){margin:0}
.pres-appel{flex:1 1 100%;display:flex;gap:14px;align-items:center;padding:16px 20px;font-size:16px;line-height:1.4;border-radius:12px;background:var(--orange-f);color:color-mix(in srgb,var(--orange) 85%,var(--txt));border:2px solid color-mix(in srgb,var(--orange) 55%,transparent);font-weight:500}
.pres-appel svg{width:26px;height:26px;fill:currentColor;flex:none}
.pres-appel b{font-weight:800}
.pres-vu{position:fixed;right:20px;bottom:calc(env(safe-area-inset-bottom,0px) + 20px);z-index:45;display:inline-flex;gap:12px;align-items:center;max-width:calc(100% - 40px);padding:10px 22px 10px 10px;border-radius:999px;background:var(--accent-f);border:2px solid var(--accent);box-shadow:var(--ombre-f);font-size:16px;color:var(--txt);animation:pres-entree .3s ease both}
@keyframes pres-entree{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.pres-vu{animation:none}}
.pres-vu b{color:var(--accent-t);font-weight:800}
.pres-avs{display:inline-flex}
.pres-avs .av{width:38px;height:38px;font-size:14px;border:2px solid var(--accent-f)}
.pres-avs .av+.av{margin-left:-10px}
/* Réglages : comptes et rôles (administrateurs) */
.reg-info{margin:0 0 12px}
.cpt-intro{margin-top:-6px}
.cpt td{vertical-align:middle}
.cpt-act{text-align:right;white-space:nowrap}
.cpt-off td{color:var(--txt3)}
.cpt-adm{background:var(--accent-f);color:var(--accent-t)}
.cpt-nv{margin-top:10px}
.cpt-chk{display:grid;gap:8px}
.cpt-chk label{display:flex;gap:8px;align-items:center;text-transform:none;letter-spacing:0;font-weight:500;color:var(--txt);cursor:pointer}
.cpt-mdp{font-size:20px;letter-spacing:.08em;text-align:center;user-select:all}
.dash .dash-kpis .kpi .d{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--bord);background:var(--carte);padding:7px 12px;border-radius:6px;cursor:pointer;font-weight:500;white-space:nowrap}
.btn:hover{border-color:var(--txt3)}
.btn.p{background:var(--accent);border-color:var(--accent);color:var(--blanc)}
.btn.p:hover{background:var(--accent-d);border-color:var(--accent-d)}
.btn.s{padding:4px 9px;font-size:12.5px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.kpi .v{font-size:28px;font-weight:700;margin-top:4px}
.kpi .l{color:var(--txt3);font-size:12.5px}
.kpi .d{font-size:12px;color:var(--txt3);margin-top:2px}
.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap}
/* Parcours d'un Remote : 8 étapes (succès / échec à l'étape 6) */
.st-nouvelle{background:var(--bleu-f);color:var(--bleu)}
.st-rdv{background:var(--orange-f);color:color-mix(in srgb,var(--orange) 85%,var(--txt))}
.st-complete{background:var(--cyan-f);color:color-mix(in srgb,var(--cyan) 85%,var(--txt))}
.st-payee{background:var(--violet-f);color:var(--violet)}
.st-encours{background:var(--bleu);color:var(--carte)}
.st-encours::before,.st-rdv::before{content:"";width:6px;height:6px;border-radius:999px;background:currentColor;flex:none}
.st-reussie{background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.st-echec{background:var(--rouge-f);color:color-mix(in srgb,var(--rouge) 80%,var(--txt))}
.st-facturee{background:var(--violet);color:var(--carte)}
.st-cloturee{background:var(--fond2);color:var(--txt3);box-shadow:inset 0 0 0 1px var(--bord)}
.step.cur.echec{border-top-style:dashed;border-color:var(--rouge);background:var(--rouge-f);color:color-mix(in srgb,var(--rouge) 80%,var(--txt));border-radius:0 0 6px 6px}
.src{display:inline-block;white-space:nowrap;flex:none;line-height:1.5;font-size:10.5px;font-weight:700;letter-spacing:.04em;padding:1px 6px;border-radius:6px;border:1px solid var(--bord);color:var(--txt2)}
.src.autel{border-color:color-mix(in srgb,var(--accent) 50%,transparent);color:var(--accent-t)}
.src.secretariat{border-color:color-mix(in srgb,var(--bleu) 60%,transparent);color:color-mix(in srgb,var(--bleu) 85%,var(--txt))}
.tk-tbl td>.src+.cp-val{display:flex;width:fit-content}
@media (max-width:760px){.inp{min-height:44px}}
.muted{color:var(--txt3)}
.small{font-size:12.5px}
.mono{font-variant-numeric:tabular-nums;letter-spacing:.02em;font-size:12.5px}
.tblw{position:relative;overflow-x:auto;border:1px solid var(--bord);border-radius:var(--r);background:var(--carte)}
table{width:100%;border-collapse:collapse}
th{text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--txt3);font-weight:600;padding:10px 12px;border-bottom:1px solid var(--bord);background:var(--fond2);white-space:nowrap}
td{padding:10px 12px;border-bottom:1px solid var(--bord2);vertical-align:top}
tr:last-child td{border-bottom:0}
tr.clic{cursor:pointer}
tr.clic:hover td{background:var(--fond2)}
.tabs{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:14px}
.tab{padding:6px 12px;border-radius:6px;cursor:pointer;border:1px solid transparent;color:var(--txt2);font-weight:500}
.tab:hover{background:var(--carte);border-color:var(--bord)}
.tab.on{background:var(--carte);border-color:var(--accent);color:var(--accent-t)}
@media (max-width:560px){.tabs{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-16px;padding-inline:16px;padding-block:3px}.tabs::-webkit-scrollbar{display:none}.tab{flex:none}}
.tab .n{color:var(--txt3);font-weight:400;margin-left:3px}
.bar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.inp,select.inp,textarea.inp{border:1px solid var(--bord);background:var(--carte);border-radius:6px;padding:7px 10px;width:100%}
.inp:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent)}
.fld{margin-bottom:12px}
.rp-motifs{border:0;padding:0;min-width:0;display:flex;flex-wrap:wrap;gap:8px}
.rp-motifs legend{display:block;width:100%;padding:0;font-size:11.5px;font-weight:600;color:var(--txt3);text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px}
.fld .rp-opt{display:inline-flex;align-items:center;gap:6px;margin:0;padding:7px 12px;border:1px solid var(--bord);border-radius:999px;background:var(--carte);color:var(--txt);font-size:13.5px;font-weight:500;text-transform:none;letter-spacing:0;cursor:pointer;min-height:44px;transition:border-color .15s,background .15s}
.fld .rp-opt:hover{border-color:var(--txt3)}
.fld .rp-opt:has(input:checked){border-color:var(--accent);background:var(--accent-f);color:var(--accent-t);font-weight:600}
.fld .rp-opt:has(input:focus-visible){box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.rp-opt input{accent-color:var(--accent);margin:0}
.fld label{display:block;font-size:11.5px;font-weight:600;color:var(--txt3);text-transform:uppercase;letter-spacing:.04em;margin-bottom:4px}
.row{display:flex;gap:10px}
.row>*{flex:1;min-width:0}
.alert{border-radius:6px;padding:9px 12px;font-size:13px;margin-bottom:10px;background:var(--orange-f);color:color-mix(in srgb,var(--orange) 75%,var(--txt));border:1px solid color-mix(in srgb,var(--orange) 25%,transparent)}
.alert.info{background:var(--bleu-f);color:var(--bleu);border-color:color-mix(in srgb,var(--bleu) 25%,transparent)}
.kv{display:grid;grid-template-columns:130px 1fr;gap:6px 12px;font-size:13.5px}
.kv dt{color:var(--txt3)}
.kv dd{margin:0;word-break:break-word}
.hd{display:flex;align-items:flex-start;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.hd .sp{flex:1}
.list-item{display:flex;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--bord2);cursor:pointer}
.list-item:last-child{border-bottom:0}
.list-item[data-act]{min-height:44px}
.list-item:hover .t{color:var(--accent)}
.empty{color:var(--txt3);padding:18px 0;text-align:center}
.hbar{display:flex;align-items:center;gap:10px;margin:7px 0;font-size:13px}
.hbar .lb{width:84px;flex:none;color:var(--txt2)}
.hbar .tr{flex:1;height:10px;background:var(--bord2);border-radius:5px;overflow:hidden}
.hbar .fi{height:100%;background:var(--accent);border-radius:5px}
.hbar .vl{width:70px;text-align:right;font-variant-numeric:tabular-nums}

/* Étapes de statut */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));margin:0 0 18px}
@media (max-width:560px){.steps{grid-template-columns:repeat(2,1fr)}}
@media (min-width:561px) and (max-width:760px){.steps{grid-template-columns:repeat(3,1fr)}}
.step{padding:8px 10px;border-top:3px solid var(--bord);color:var(--txt3);font-size:12.5px;font-weight:500}
.step.done{border-color:var(--accent);color:var(--txt)}
.step.cur{border-color:var(--accent);color:var(--accent-t);font-weight:700}

/* Agenda */
.ag-wrap{display:flex;gap:16px;align-items:flex-start}
.ag{flex:1;min-width:0;overflow-x:auto;background:var(--carte);border:1px solid var(--bord);border-radius:var(--r)}
.ag-grid{display:grid;grid-template-columns:52px repeat(6,minmax(130px,1fr));min-width:830px}
.ag-h{padding:8px;border-bottom:1px solid var(--bord);border-left:1px solid var(--bord2);font-size:12.5px;font-weight:600;text-align:center;background:var(--fond2)}
.ag-h.today{color:var(--accent)}
.ag-times{position:relative}
.ag-times div{height:var(--px,48px);font-size:11px;color:var(--txt3);text-align:right;padding-right:6px;transform:translateY(-7px)}
.ag-day{position:relative;border-left:1px solid var(--bord2);background:repeating-linear-gradient(to bottom,transparent 0 calc(var(--px,48px) - 1px),var(--bord2) calc(var(--px,48px) - 1px) var(--px,48px))}
.ag-day.today{background-color:color-mix(in srgb,var(--accent) 4%,transparent)}
.ag-day.over{background-color:color-mix(in srgb,var(--accent) 12%,transparent)}
.ev{position:absolute;left:3px;right:3px;border-radius:6px;padding:4px 6px;font-size:11.5px;line-height:1.3;cursor:pointer;overflow:hidden;border-left:3px solid;box-shadow:0 1px 2px color-mix(in srgb,var(--txt) 8%,transparent)}
.ev b{display:block;font-size:12px}
/* Code couleur des RDV : à venir (accent) / en cours d'appel (orange, point qui pulse) / traité (vert) ; divers (violet) */
.ev.et-avenir,.ag-mev.et-avenir{border-color:var(--accent);background:var(--accent-f);color:var(--accent-t)}
.ev.et-encours,.ag-mev.et-encours{border-color:var(--orange);background:var(--orange-f);color:color-mix(in srgb,var(--orange) 80%,var(--txt));box-shadow:0 0 0 2px color-mix(in srgb,var(--orange) 35%,transparent)}
.ev.et-traite,.ag-mev.et-traite{border-color:var(--vert);background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.ev-pt{display:inline-block;width:7px;height:7px;border-radius:999px;background:var(--orange);margin-right:4px;vertical-align:middle;animation:tk-pulse 1.5s ease-in-out infinite}
.ev.ev-div,.ag-mev.ev-div{border-color:var(--violet);background:var(--violet-f);color:color-mix(in srgb,var(--violet) 80%,var(--txt));text-align:left;font-family:inherit}
.ev.ev-div.t-conge,.ag-mev.ev-div.t-conge{border-color:var(--txt3);background:var(--fond2);color:var(--txt2)}
.ev.ev-div.g,.ag-mev.ev-div.g{border-left-style:dashed;border-color:var(--txt3);background:var(--fond2);color:var(--txt2)}
.ev-type{display:block;font-size:10.5px;opacity:.85}
.ev-notes{display:block;font-size:10.5px;opacity:.8;white-space:pre-line;overflow:hidden}
.ev:focus-visible,.ag-mev:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.ev{transition:transform .2s,box-shadow .2s}
.ev:hover{transform:translateY(-1px)}
.ag-mev{width:100%;border:0;border-left:3px solid var(--txt3);text-align:left}
.ag-leg{display:flex;gap:8px 14px;flex-wrap:wrap;align-items:center;margin:-4px 0 12px;font-size:12px}
.ag-leg-i{display:inline-flex;align-items:center;gap:6px;padding:2px 10px;border-radius:999px;border:0;font-weight:600}
.ag-leg-i::before{content:"";width:8px;height:8px;border-radius:999px;background:currentColor}
.ag-leg-i.et-encours::before{background:var(--orange);animation:tk-pulse 1.5s ease-in-out infinite}
.ag-leg-i.t-conge{background:var(--fond2);color:var(--txt2)}
.ag-leg-i.g{background:var(--fond2);color:var(--txt2);outline:1px dashed var(--txt3);outline-offset:-1px}
.ag-leg-i.et-avenir{border-color:var(--accent);background:var(--accent-f);color:var(--accent-t)}
.ag-leg-i.et-encours{border-color:var(--orange);background:var(--orange-f);color:color-mix(in srgb,var(--orange) 80%,var(--txt))}
.ag-leg-i.et-traite{border-color:var(--vert);background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.ag-leg-i.ev-div{border-color:var(--violet);background:var(--violet-f);color:color-mix(in srgb,var(--violet) 80%,var(--txt))}
.ev.st-rdv{border-color:var(--orange)}
.ev.st-complete{border-color:var(--cyan)}
.ev.st-payee{border-color:var(--violet)}
.ev.st-encours{border-color:var(--bleu);background:var(--bleu-f);color:var(--bleu)}
.ev.st-echec{border-color:var(--rouge);background:var(--rouge-f);color:color-mix(in srgb,var(--rouge) 80%,var(--txt))}
.ev.st-reussie{border-color:var(--vert);background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.ev.st-facturee{border-color:var(--violet);background:var(--violet-f);color:var(--violet)}
.ev.st-cloturee{border:0;border-left:3px solid var(--txt3);box-shadow:none;background:var(--fond2);color:var(--txt3)}
.now{position:absolute;left:0;right:0;height:2px;background:var(--accent);z-index:2}
.aplan{width:260px;flex:none}
.chip{background:var(--carte);border:1px dashed var(--txt3);border-radius:6px;padding:8px 10px;margin-bottom:8px;cursor:grab;font-size:12.5px}
.chip:hover{border-color:var(--accent)}

/* Modale */
.modal-bg{position:fixed;inset:0;background:rgba(10,12,16,.5);display:grid;place-items:center;z-index:50;padding:16px}
.modal{background:var(--carte);border-radius:10px;box-shadow:var(--ombre-f);width:min(640px,100%);max-height:90vh;overflow:auto;padding:20px}
.mailbox{max-height:52vh;overflow:auto;white-space:pre-wrap;background:var(--fond2);border:1px solid var(--bord);border-radius:6px;padding:12px;font-size:13px}
.toast{position:fixed;bottom:calc(env(safe-area-inset-bottom,0px) + 20px);left:50%;transform:translateX(-50%);background:var(--nav);color:var(--blanc);padding:10px 16px;border-radius:6px;z-index:60;box-shadow:var(--ombre-f)}

/* Connexion */
.login{min-height:100vh;display:grid;place-items:center;background:var(--nav);padding:16px}
.login .box{background:var(--carte);border-radius:12px;padding:32px;width:min(400px,100%);box-shadow:var(--ombre-f)}
.login .brand{padding:0 0 12px;color:var(--txt)}
.login .brand small{color:var(--txt3)}

@media (max-width:1100px){.g4{grid-template-columns:1fr 1fr}.g32,.g2{grid-template-columns:1fr}.aplan{display:none}}
@media (max-width:760px){
  .side{position:fixed;z-index:40;left:-240px;transition:left .2s}
  .side.open{left:0}
  .burger{display:inline-flex}
  .top{padding:10px 16px}
  .content{padding:16px}
  .user span{display:none}
  .g4{grid-template-columns:1fr 1fr}
  .kv{grid-template-columns:110px 1fr}
}

/* Ajouts version en ligne */
.err{color:var(--danger);font-size:13px;margin:-4px 0 10px;min-height:1em}
.chg{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--nav-txt2)}
.loading{min-height:100vh;display:grid;place-items:center;color:var(--txt3)}
.btn.danger{color:var(--danger)}
.btn.danger:hover{border-color:var(--danger);background:var(--rouge-f)}
.pj{display:flex;flex-wrap:wrap;gap:6px}
.pj a{font-size:12px}
/* Module Tickets (pont intranet) */
.pastille{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap;background:color-mix(in srgb,var(--c,var(--txt3)) 32%,var(--carte));color:var(--txt);border:1px solid color-mix(in srgb,var(--c,var(--txt3)) 70%,var(--carte))}
.pastille::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--c,var(--txt3))}
.tk-bandeau{display:flex;gap:10px;align-items:center;flex-wrap:wrap;background:var(--orange-f);color:var(--orange);border:1px solid color-mix(in srgb,var(--orange) 35%,transparent);border-radius:var(--r);padding:10px 14px;margin-bottom:16px;font-weight:600}
.tk-bandeau a{text-decoration:underline}
.chrono{font-variant-numeric:tabular-nums;font-weight:700}
.tk-hist{display:flex;flex-direction:column;gap:8px}
.tk-h{display:flex;gap:10px;align-items:flex-start;font-size:13px}
.tk-h .q{color:var(--txt3);font-size:11.5px;white-space:nowrap;min-width:92px}
.tk-h .com{background:var(--fond2);border:1px solid var(--bord);border-radius:6px;padding:8px 10px;white-space:pre-wrap;overflow-wrap:anywhere;flex:1;min-width:0}
.tk-h .com b{display:block;font-size:12px;margin-bottom:2px}
.tk-h .etat{flex:1;min-width:0;color:var(--txt2)}
.tk-chips{display:flex;flex-wrap:wrap;gap:6px}
.tk-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--bord);border-radius:999px;padding:3px 4px 3px 10px;font-size:12.5px;background:var(--fond2)}
.tk-chip button{border:0;background:none;cursor:pointer;color:var(--txt3);padding:0 4px}
.tk-res{border:1px solid var(--bord);border-radius:6px;margin-top:6px;max-height:220px;overflow:auto}
.tk-res div{padding:7px 10px;border-bottom:1px solid var(--bord2);cursor:pointer;font-size:13px}
.tk-res div:hover{background:var(--fond2)}
.tk-titre{overflow-wrap:anywhere}
/* Panneau de traitement du ticket (haut de fiche) */
.tk-trait{background:var(--carte);border:1px solid var(--bord);border-left:5px solid var(--accent);border-radius:var(--r);padding:18px 20px;margin-bottom:18px;display:grid;gap:16px}
.tk-trait.appel{border-left-color:var(--vert);background:radial-gradient(circle at 0 0,var(--vert-f),transparent 55%),var(--carte)}
.tk-trait .l{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--txt3);font-weight:600;margin-bottom:4px}
.tk-tr-grille{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.3fr) minmax(220px,1fr);gap:20px;align-items:start}
.tk-tr-cli .nom{font-size:20px;font-weight:700;line-height:1.2;overflow-wrap:anywhere}

.tk-tr-num{font-size:20px;font-weight:600;letter-spacing:.02em;padding:9px 12px}
.tk-tr-nums{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.tk-tr-nums .tk-chip{cursor:pointer;padding:4px 12px;color:var(--txt);min-height:44px;max-width:100%}
.tk-tr-nums .tk-chip{flex-wrap:wrap;white-space:normal;text-align:left}.tk-tr-nums .tk-chip .muted{overflow-wrap:anywhere}
.tk-tr-nums .tk-chip.on{border-color:var(--accent);background:var(--accent-f)}
.tk-tr-nums .tk-chip.prio{flex-basis:100%;border-width:2px;border-color:var(--accent);padding:6px 14px}
.tk-tr-nums .tk-chip.prio .mono{font-size:17px;font-weight:800}
.tk-tr-nums .tk-chip.prio .prio-l{flex-basis:100%;font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-t)}
.tk-tr-nums .tk-chip:disabled{cursor:default;opacity:.6}
.tk-tr-act{display:flex;flex-direction:column;gap:8px;align-items:stretch}
.tk-tr-gros{font-size:17px;font-weight:700;padding:14px 18px;justify-content:center}
.tk-tr-fin{background:var(--danger);border-color:var(--danger);color:var(--blanc)}.tk-tr-fin:hover{background:var(--danger-d);border-color:var(--danger-d)}
.btn.p[data-act=tkAppelClient],.btn.p[data-act=rmAppeler]{background:var(--appel);border-color:var(--appel)}
.btn.p[data-act=tkAppelClient]:not(:disabled):hover,.btn.p[data-act=rmAppeler]:not(:disabled):hover{background:var(--appel-d);border-color:var(--appel-d)}
.tk-tr-chrono{display:flex;flex-direction:column;align-items:center}
.tk-tr-chrono .chrono{font-size:40px;line-height:1.1;color:var(--vert)}
.tk-tr-liens{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;font-size:12.5px;color:var(--txt3)}
.tk-tr-liens a{text-decoration:underline;display:inline-flex;align-items:center;min-height:44px;padding:0 4px}
.tk-tr-com{border-top:1px solid var(--bord2);padding-top:14px}
.tk-tr-com-hd{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.tk-tr-com-hd .l{margin:0;flex:1}
.tk-tr-com-hd select{width:auto;max-width:100%}
.tk-tr-com textarea:disabled{background:var(--fond2);cursor:not-allowed}
.tk-tr-save{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:6px}
.btn-remote{font-weight:700;border-color:color-mix(in srgb,var(--accent) 45%,var(--bord));color:var(--accent-t)}
.btn-remote:hover{border-color:var(--accent);background:var(--accent-f);transform:translateY(-1px)}
.tk-trait .btn:focus-visible,.tk-tr-nums .tk-chip:focus-visible,.tk-tr-liens a:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.tk-tr-gros,.tk-tr-nums .tk-chip{transition:transform .2s,background-color .2s,border-color .2s}
.tk-tr-gros:not(:disabled):hover,.tk-tr-nums .tk-chip:not(:disabled):hover{transform:translateY(-2px)}
.tk-tr-chrono .l::before{content:"";display:inline-block;width:8px;height:8px;border-radius:999px;background:var(--vert);margin-right:6px;vertical-align:middle;animation:tk-pulse 1.5s ease-in-out infinite}
@keyframes tk-pulse{50%{opacity:.35;transform:scale(.8)}}
@media (max-width:1000px){.tk-tr-grille{grid-template-columns:1fr}}
/* Liste des tickets : lignes en cartes séparées, bande de couleur de priorité, bandeaux de groupe colorés, filigrane */
.tk-liste{position:relative;isolation:isolate}
.tk-liste::before{content:"";position:fixed;inset:0 0 0 232px;z-index:-1;pointer-events:none;background:url(../icons/autech-512.png) center 55%/min(560px,55vw) auto no-repeat;opacity:.05;filter:grayscale(1)}
.tk-sec{margin:26px 0 4px;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.tk-sec:first-child{margin-top:4px}
.tk-sec .muted{text-transform:none;letter-spacing:0;font-weight:400}
.tk-tblw{border:0;background:transparent;border-radius:0;padding:4px 2px}
.tk-tbl{border-collapse:separate;border-spacing:0 8px;margin-top:-4px}
.tk-tbl th{background:transparent;border:0;padding:6px 14px 0}
.tk-tbl tr.tk-row td{background:var(--carte);border-top:1px solid var(--bord);border-bottom:1px solid var(--bord);padding:12px 14px;vertical-align:middle;transition:background-color .2s,border-color .2s,box-shadow .2s}
.tk-tbl tr.tk-row td:first-child{border-left:5px solid var(--p,var(--txt3));border-radius:10px 0 0 10px}
.tk-tbl tr.tk-row td:last-child{border-right:1px solid var(--bord);border-radius:0 10px 10px 0}
.tk-tbl tr.tk-row{transition:transform .2s}
.tk-tbl tr.tk-row:hover{transform:translateY(-2px)}
.tk-tbl tr.tk-row:hover td{background:color-mix(in srgb,var(--p,var(--txt3)) 7%,var(--carte));border-color:color-mix(in srgb,var(--p,var(--txt3)) 35%,var(--bord));box-shadow:0 6px 16px -10px color-mix(in srgb,var(--p,var(--txt3)) 60%,transparent)}
.tk-tbl tr.tk-row:hover td:first-child{border-left-color:var(--p,var(--txt3))}
.tk-ref{font-weight:600;color:var(--txt2);white-space:nowrap}
.tk-neutre{--p:var(--txt3)}
.tk-suj{display:inline-block;margin-top:4px;padding:1px 8px;border-radius:999px;font-size:11px;font-weight:600;letter-spacing:.03em;white-space:nowrap;color:color-mix(in srgb,var(--s) 78%,var(--txt));background:color-mix(in srgb,var(--s) 12%,var(--carte));border:1px solid color-mix(in srgb,var(--s) 30%,transparent)}
.tk-tbl tr.tk-grp td{padding:18px 0 0;background:transparent;border:0}
.tk-tbl tr.tk-grp:first-child td{padding-top:4px}
.tk-grp-hd{display:flex;align-items:center;gap:12px;padding:10px 16px;border-radius:10px;border-left:5px solid var(--p);background:color-mix(in srgb,var(--p) 13%,var(--carte));color:var(--txt)}
.tk-grp-hd .nom{font-weight:800;font-size:13.5px;letter-spacing:.05em;text-transform:uppercase;flex:1}
.tk-grp-hd .nom::before{content:"";display:inline-block;width:9px;height:9px;border-radius:999px;background:var(--p);margin-right:10px;vertical-align:1px}
.tk-grp-hd .nb{font-size:12px;font-weight:700;color:color-mix(in srgb,var(--p) 78%,var(--txt));background:var(--carte);border-radius:999px;padding:2px 10px}
.tk-lien{display:inline-flex;align-items:center;min-height:44px;color:inherit}
.tk-tbl tr.tk-row:focus-within td{border-top-color:var(--accent);border-bottom-color:var(--accent)}
.tk-tbl tr.tk-row:focus-within td:last-child{border-right-color:var(--accent)}
@media (max-width:760px){.tk-grp-hd{position:sticky;left:0;width:calc(100vw - 36px)}.tk-liste::before{left:0}.tk-tbl{min-width:820px}.tk-tbl .tk-titre{min-width:200px}.tk-tbl .empty{text-align:left;padding-left:14px}}/* Bouton Agenda de la fiche Remote + mode « choisir le créneau » */
.f-ag-fld{flex:none!important;display:flex;align-items:flex-end}
.btn-agenda{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:72px;height:56px;margin-bottom:-2px;border:0;border-radius:6px;background:var(--accent);color:var(--blanc);cursor:pointer;font-weight:700;font-size:11px;letter-spacing:.04em;text-transform:uppercase;box-shadow:0 6px 16px -10px color-mix(in srgb,var(--accent) 45%,transparent);transition:transform .2s,background-color .2s,box-shadow .2s}
.btn-agenda svg{width:28px;height:28px;fill:currentColor}
.btn-agenda:hover{transform:translateY(-2px);background:var(--accent-d);box-shadow:0 10px 22px -12px color-mix(in srgb,var(--accent) 55%,transparent)}
.f-ag-fld .btn-agenda:focus-visible{outline:2px solid var(--accent);outline-offset:2px;box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 25%,transparent)}
.ag-planif{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px;padding:12px 16px;border-radius:12px;border:1px solid color-mix(in srgb,var(--accent) 40%,var(--bord));background:radial-gradient(circle at 0 0,color-mix(in srgb,var(--accent) 14%,transparent),transparent 60%),var(--carte)}
.ag-planif svg{width:30px;height:30px;fill:var(--accent);flex:none}
.ag-planif>div{flex:1;min-width:0}
.ag.pick .ag-day{cursor:crosshair}
.ag-fantome{position:absolute;left:3px;right:3px;z-index:3;pointer-events:none;border:2px dashed var(--accent);border-radius:6px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent-t);font-weight:700;font-size:12px;padding:2px 6px}
/* Alerte RDV : bannière forte, fixe, jusqu'à prise en charge */
#alerte-rdv{position:fixed;top:calc(env(safe-area-inset-top,0px) + 12px);left:50%;transform:translateX(-50%);z-index:70;width:min(820px,calc(100% - 32px));max-height:70vh;overflow:auto;animation:ar-entree .25s ease both}
#alerte-rdv .ar-in{display:grid;gap:10px}
/* rappel déplaçable : on l'attrape n'importe où (sauf boutons) ; poignée en haut de chaque carte */
#alerte-rdv{cursor:grab}
#alerte-rdv.libre{animation:none}
#alerte-rdv.deplace{cursor:grabbing;user-select:none}
#alerte-rdv.deplace .ar-rdv{animation:none}
.ar-rdv{position:relative}
.ar-grip{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:36px;height:4px;border-radius:2px;background:color-mix(in srgb,var(--blanc) 45%,transparent);touch-action:none}
.ar-grip::before{content:"";position:absolute;left:50%;top:50%;width:88px;height:44px;transform:translate(-50%,-50%)}
#alerte-rdv .ar-rdv{padding:22px 18px 16px}
.ar-rdv{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:16px 18px;border-radius:14px;color:var(--blanc);background:radial-gradient(circle at 12% 0,color-mix(in srgb,var(--blanc) 10%,transparent),transparent 35%),linear-gradient(135deg,var(--accent),var(--accent-d));box-shadow:var(--ombre-f);animation:ar-halo 1.6s ease-out infinite}
.ar-cloche{width:52px;height:52px;flex:none;border-radius:999px;display:grid;place-items:center;background:color-mix(in srgb,var(--blanc) 18%,transparent)}
.ar-cloche svg{width:30px;height:30px;fill:var(--blanc);animation:ar-cloche 1.2s ease-in-out infinite;transform-origin:50% 10%}
.ar-txt{flex:1;min-width:200px}
.ar-h{font-size:22px;font-weight:800;letter-spacing:-.01em;line-height:1.15}
.ar-h span{font-size:13px;font-weight:600;margin-left:6px}
.ar-d{font-size:14.5px;font-weight:600;margin-top:2px;overflow-wrap:anywhere}
.ar-s{font-size:12.5px;margin-top:2px}
.ar-act{display:flex;flex-direction:column;align-items:stretch;gap:6px}
.ar-prendre{background:var(--blanc);color:var(--accent-d);border-color:var(--blanc);font-weight:800;font-size:15px;min-height:44px;padding:10px 18px;justify-content:center}
.ar-prendre:hover{background:var(--blanc);border-color:var(--blanc);transform:translateY(-2px)}
.ar-rdv .ar-prendre:focus-visible{border-color:var(--blanc);box-shadow:0 0 0 3px color-mix(in srgb,var(--blanc) 55%,transparent)}
.ar-voir{color:var(--blanc);text-decoration:underline;text-align:center;font-size:13px;min-height:44px;display:flex;align-items:center;justify-content:center}
.ar-rdv .ar-voir:focus-visible{outline:2px solid var(--blanc);outline-offset:2px;box-shadow:none;border-radius:6px}
@keyframes ar-entree{from{opacity:0;transform:translate(-50%,-16px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes ar-halo{0%{box-shadow:var(--ombre-f),0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent)}70%{box-shadow:var(--ombre-f),0 0 0 14px color-mix(in srgb,var(--accent) 0%,transparent)}100%{box-shadow:var(--ombre-f),0 0 0 0 color-mix(in srgb,var(--accent) 0%,transparent)}}
@keyframes ar-cloche{0%,100%{transform:rotate(0)}15%{transform:rotate(14deg)}30%{transform:rotate(-12deg)}45%{transform:rotate(8deg)}60%{transform:rotate(-4deg)}75%{transform:rotate(0)}}
@media (max-width:560px){.ar-act{width:100%}.ar-h{font-size:19px}}/* Référentiel (clients, appareils, distributeurs) */
.ech-ok{background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.ech-ko{background:var(--rouge-f);color:color-mix(in srgb,var(--rouge) 80%,var(--txt))}
.ech-txt-ko{color:color-mix(in srgb,var(--rouge) 80%,var(--txt));font-weight:700}
.lien-ref{color:var(--accent-t);font-weight:600;text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--accent) 30%,transparent);transition:border-color .2s}
.lien-ref:hover{border-bottom-color:var(--accent)}
@media (pointer:coarse){.lien-ref{display:inline-flex;align-items:center;min-height:44px}}
.tk-tbl tr.tk-row:not(.clic):hover{transform:none}
.tk-tbl tr.tk-row:not(.clic):hover td{box-shadow:none}
.badge-code{background:var(--fond2);border:1px solid var(--bord);color:var(--txt3)}
.hd>.badge{align-self:center}/* Temps réel dans la liste des tickets : technicien en ligne (appel en cours), nouveau ticket */
.tk-live{display:inline-flex;align-items:center;gap:6px;margin:0 0 4px;padding:2px 9px;border-radius:999px;font-family:Inter,"Segoe UI",system-ui,sans-serif;font-size:11px;font-weight:700;white-space:nowrap;color:color-mix(in srgb,var(--vert) 80%,var(--txt));background:var(--vert-f);border:1px solid color-mix(in srgb,var(--vert) 35%,transparent)}
.tk-live .pt{width:8px;height:8px;border-radius:999px;background:var(--vert);animation:tk-pulse 1.5s ease-in-out infinite}
.tk-tbl tr.tk-enligne td{background:color-mix(in srgb,var(--vert) 6%,var(--carte))}
.tk-new{display:inline-block;margin:0 0 4px;padding:2px 9px;border-radius:999px;font-family:Inter,"Segoe UI",system-ui,sans-serif;font-size:11px;font-weight:700;color:var(--blanc);background:var(--accent)}
.tk-tbl tr.tk-nouveau td{animation:tk-arrivee 2.4s ease-out 1}
.tk-ref .tk-live,.tk-ref .tk-new{display:flex;width:max-content}
@keyframes tk-arrivee{from{background:color-mix(in srgb,var(--accent) 16%,var(--carte))}}
/* Bouton « copier » (téléphones, e-mails, S/N, n° de commande, VIN, références) */
.cp-val{display:inline-flex;align-items:center;gap:2px;max-width:100%;overflow-wrap:anywhere;vertical-align:middle}
/* 32 px à la souris (zone compacte à côté du texte), 44 px au tactile */
.cp{display:inline-flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;padding:0;border:1px solid transparent;border-radius:6px;background:transparent;color:var(--txt3);cursor:pointer;transition:color .2s,background-color .2s,transform .2s}
.cp svg{width:15px;height:15px;fill:currentColor}
.cp:hover{color:var(--accent-t);background:var(--accent-f);transform:translateY(-1px)}
.tk-num-l{display:flex;gap:6px;align-items:center}
.tk-num-l .inp{flex:1;min-width:0}
.cp:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.cp.ok{color:color-mix(in srgb,var(--vert) 80%,var(--txt));background:var(--vert-f)}
@media (pointer:coarse){.cp{width:44px;height:44px}}
/* Commande Autel : vérifications automatiques */
.verifs{display:grid;gap:6px}
.verif{display:grid;grid-template-columns:22px 150px minmax(0,1fr);gap:8px;align-items:baseline;font-size:13px;min-width:0;overflow-wrap:anywhere}
.verif.info .pt{background:var(--bleu-f);color:color-mix(in srgb,var(--bleu) 80%,var(--txt))}
.verifs-t{margin-top:14px}
.verif .pt{width:20px;height:20px;border-radius:999px;display:inline-grid;place-items:center;font-size:12px;font-weight:800;align-self:center}
.verif.ok .pt{background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.verif.ko .pt{background:var(--rouge-f);color:color-mix(in srgb,var(--rouge) 80%,var(--txt))}
.verif.ko b{color:color-mix(in srgb,var(--rouge) 80%,var(--txt))}
@media (max-width:560px){.verif{grid-template-columns:22px minmax(0,1fr)}.verif .muted{grid-column:2}}
.btn-autel{border-color:color-mix(in srgb,var(--accent) 40%,var(--bord));color:var(--accent-t);font-weight:600}
.btn-autel:hover{border-color:var(--accent);background:var(--accent-f);transform:translateY(-1px)}
/* Collecte automatique : voyant + carte Réglages ; fusion tablette / secrétariat */
.dot.retard{background:var(--orange)}
.dot.ko{background:var(--rouge)}
.sync .dot{background:var(--nav-ok)}.sync .dot.retard{background:var(--nav-retard)}.sync .dot.ko{background:var(--nav-ko)}
.sync-l{display:flex;align-items:center;gap:0;color:var(--nav-txt2);min-height:32px;margin:-6px -6px 0;padding:0 6px;border:1px solid transparent;border-radius:6px;transition:background-color .2s,border-color .2s}.sync-l:hover{background:var(--nav-survol);color:var(--nav-txt)}
@media (pointer:coarse){.sync-l{min-height:44px}}
.sync-l b{margin-right:4px}
.sync-b{padding-left:12px}
.collecte{display:grid;gap:10px}
.col-bot{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--bord);border-radius:10px;background:var(--fond2)}
.col-bot .dot{margin-top:6px;flex:none}
.col-bot.ko{border-color:color-mix(in srgb,var(--rouge) 45%,var(--bord))}
.col-msg{margin-top:4px;color:var(--txt2);overflow-wrap:anywhere}
.fusion{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px;padding:8px 10px;border-radius:10px;background:var(--bleu-f)}
.fusion .small{flex:1;min-width:180px}
/* Historique d'une tablette (S/N) : Remotes + tickets */
.histo-t{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:6px}
.h-date{width:70px;flex:none}
.histo .list-item{flex-wrap:wrap;row-gap:4px}.histo .list-item>div{min-width:150px!important}
@media (max-width:560px){.histo .list-item>div{order:3;flex:1 1 100%!important}.histo .list-item>.badge,.histo .list-item>.pastille{margin-left:auto}}
.src.ticket{border-color:color-mix(in srgb,var(--violet) 60%,transparent);color:color-mix(in srgb,var(--violet) 85%,var(--txt))}
/* Avis de fin d'appel + indice de gentillesse */
.av-ctx{margin-top:-6px}
.av-notes{border:0;padding:0;margin:0 0 14px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.av-notes legend{margin-bottom:8px}
.av-note{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:72px;padding:8px 4px;border:1px solid var(--bord);border-radius:10px;background:var(--fond2);cursor:pointer;text-align:center;transition:transform .2s,border-color .2s,background-color .2s}
.av-note:hover{transform:translateY(-2px);border-color:var(--txt3)}
.av-note input{position:absolute;opacity:0;pointer-events:none}
.av-note .n{font-size:22px;font-weight:800;line-height:1}
.av-note .lb{font-size:11.5px;color:var(--txt2)}
.av-note:has(input:checked){border-color:var(--accent);background:var(--accent-f);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent)}
.av-note:has(input:focus-visible){border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.av-pied{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
@media (max-width:560px){.av-notes{gap:4px}.av-note .lb{font-size:10.5px}}
.gentil{display:inline-flex;align-items:baseline;gap:4px;padding:1px 8px;border-radius:999px;font-weight:700;font-size:12.5px;white-space:nowrap}
.gentil .nb{font-weight:500;font-size:11.5px}
.gentil.g1,.gentil.g2{background:var(--rouge-f);color:color-mix(in srgb,var(--rouge) 80%,var(--txt))}
.gentil.g3{background:var(--orange-f);color:color-mix(in srgb,var(--orange) 85%,var(--txt))}
.gentil.g4,.gentil.g5{background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.tk-tr-gentil{margin-top:4px}
/* Bouton « accueil » de la rubrique (barre du haut) */
.btn-home{flex:none;width:44px;height:44px;padding:0;justify-content:center}
.btn-home svg{width:24px;height:24px;fill:currentColor}
.btn.burger{display:none}
@media (max-width:760px){.btn.burger{display:inline-flex;min-width:44px;min-height:44px;justify-content:center}.btn-home{width:40px;height:40px}.btn-home svg{width:20px;height:20px}}
.btn-home:hover{color:var(--accent-t);border-color:var(--accent)}
/* Agenda : pôles, vues jour / semaine / mois / année (lundi → vendredi) */
.ag-bar .tabs{flex-wrap:wrap}
.ag-titre{text-transform:capitalize}
.ag-pole{display:inline-block;margin-left:4px;padding:0 5px;border-radius:999px;font-size:10.5px;font-weight:700;letter-spacing:.04em;vertical-align:1px}
.ag-pole.p-colmar{background:var(--bleu-f);color:color-mix(in srgb,var(--bleu) 85%,var(--txt))}
.ag-pole.p-lyon{background:var(--violet-f);color:color-mix(in srgb,var(--violet) 85%,var(--txt))}
.ag-mois{flex:1;min-width:0;overflow-x:auto;background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);box-shadow:var(--ombre-c)}
.ag-mois-g{display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));min-width:600px}
.ag-mois-h{padding:8px;text-align:center;font-size:12.5px;font-weight:600;background:var(--fond2);border-bottom:1px solid var(--bord)}
.ag-mois-c{min-height:112px;padding:6px;border-right:1px solid var(--bord2);border-bottom:1px solid var(--bord2);display:flex;flex-direction:column;gap:3px;min-width:0}
.ag-mois-c.hors{background:var(--fond2)}.ag-mois-c.hors .ag-num{color:var(--txt3)}
.ag-mois-c.today{background:color-mix(in srgb,var(--accent) 5%,var(--carte))}
.ag-num{transition:transform .2s,background-color .2s,color .2s;align-self:flex-start;border:0;background:none;font:inherit;font-weight:700;font-size:13px;color:var(--txt);cursor:pointer;padding:2px 6px;border-radius:6px;min-height:28px}
.ag-mois-c.today .ag-num{background:var(--accent);color:var(--blanc)}
.ag-num:hover{background:var(--accent-f)}
.ag-mev{transition:transform .2s,background-color .2s,color .2s;display:block;font-size:11.5px;padding:2px 6px;border-radius:6px;border-left:3px solid var(--txt3);background:var(--fond2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--txt)}
.ag-mev:hover{transform:translateY(-1px)}
.ag-plus{border:0;background:none;font:inherit;font-size:11.5px;color:var(--txt3);text-align:left;cursor:pointer;padding:2px 6px;text-decoration:underline}
.ag-annee{flex:1;min-width:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(230px,100%),1fr));gap:12px}
.ag-an-t{transition:transform .2s,background-color .2s,color .2s;display:flex;justify-content:space-between;align-items:baseline;width:100%;border:0;background:none;font:inherit;font-weight:700;text-transform:capitalize;color:var(--txt);cursor:pointer;padding:0 0 8px;min-height:32px}
.ag-an-t:hover{color:var(--accent-t)}
.ag-an-g{display:grid;grid-template-columns:repeat(5,1fr);gap:3px}
.ag-an-h{font-size:10.5px;text-align:center;color:var(--txt3);font-weight:600}
.ag-an-j{transition:transform .2s,background-color .2s,color .2s;border:0;font:inherit;font-size:11.5px;min-height:28px;border-radius:6px;cursor:pointer;background:var(--fond2);color:var(--txt)}
.ag-an-j.vide{background:none;cursor:default}
.ag-an-j.n1{background:color-mix(in srgb,var(--accent) 18%,var(--carte))}
.ag-an-j.n2{background:color-mix(in srgb,var(--accent) 35%,var(--carte))}
.ag-an-j.n3{background:var(--accent);color:var(--blanc);font-weight:700}
.ag-an-j.today{box-shadow:inset 0 0 0 2px var(--txt)}
.ag-an-j.today:focus-visible{box-shadow:inset 0 0 0 2px var(--txt),0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
@media (pointer:coarse){.btn-home{min-width:44px;justify-content:center}.ag-num,.ag-an-j,.ag-plus{min-height:44px}.ag-mev{min-height:44px;display:flex;align-items:center}}
.ag-an-j:not(.vide):hover{transform:translateY(-1px)}
.ag-mini{background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);box-shadow:var(--ombre-c);padding:10px}
.checkbox-row{display:flex;align-items:center;gap:8px;font-weight:400}
.bulle-chat{position:fixed;right:20px;bottom:20px;width:52px;height:52px;border-radius:999px;background:var(--accent);color:var(--blanc);display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 6px 18px rgba(0,0,0,.25);z-index:60;text-decoration:none}
.bulle-chat:hover{transform:translateY(-2px)}
.bulle-chat-badge{position:absolute;top:-4px;right:-4px;background:var(--rouge,#d4232b);color:#fff;border-radius:999px;font-size:11px;font-weight:700;padding:2px 6px;min-width:18px;text-align:center}
.presence-puce{display:inline-block;width:8px;height:8px;border-radius:999px;vertical-align:middle}
.presence-puce.presence-en-ligne{background:var(--vert)}
.presence-puce.presence-vu-recemment{background:var(--orange)}
.presence-puce.presence-hors-ligne{background:var(--txt3)}
/* Ticket : résumé du problème mis en avant (haut de fiche) + champs clés du formulaire */
.tk-pb{display:grid;gap:10px;padding-bottom:14px;border-bottom:1px solid var(--bord2)}
.tk-pb-titre{font-size:19px;font-weight:800;line-height:1.25;overflow-wrap:anywhere}
.tk-pb-tags{display:flex;flex-wrap:wrap;gap:8px}
.tk-pb-tag{display:inline-flex;flex-direction:column;gap:1px;padding:6px 10px;border-radius:10px;background:var(--bleu-f);border:1px solid color-mix(in srgb,var(--bleu) 30%,transparent);max-width:100%}
.tk-pb-tag .l{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;font-weight:600;color:color-mix(in srgb,var(--bleu) 80%,var(--txt))}
.tk-pb-tag b{font-size:15px}
.tk-pb-tag.mono b{font-variant-numeric:tabular-nums;letter-spacing:.04em}
.tk-pb-blocs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:8px}
.tk-pb-bloc{padding:8px 12px;border-radius:10px;background:var(--orange-f);border:1px solid color-mix(in srgb,var(--orange) 30%,transparent);white-space:pre-wrap;overflow-wrap:anywhere;font-size:13.5px}
.tk-pb-bloc .l{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;font-weight:600;color:color-mix(in srgb,var(--orange) 85%,var(--txt));margin-bottom:2px;white-space:normal}
.tk-pb-bloc.vide{background:var(--fond2);border-color:var(--bord2)}
.tk-pb-desig .tk-pb-bloc{background:var(--fond2);border-color:var(--bord);max-height:220px;overflow:auto}
.tk-pb-desig .tk-pb-bloc .l{color:var(--txt3)}
.tk-pb-bloc.vide .l{color:var(--txt3)}
.fld.cle label{color:var(--txt2)}
.fld.cle .inp{border-color:color-mix(in srgb,var(--bleu) 35%,var(--bord));background:color-mix(in srgb,var(--bleu) 4%,var(--carte));font-weight:600}
/* En-têtes de colonnes triables (A→Z / Z→A) */
.th-tri{display:inline-flex;align-items:center;gap:4px;border:0;background:none;padding:2px 4px;margin:-2px -4px;font:inherit;color:inherit;text-transform:inherit;letter-spacing:inherit;font-weight:inherit;cursor:pointer;border-radius:6px;white-space:nowrap;transition:color .2s,background-color .2s}
.th-tri .fl{font-size:10px;opacity:.55}
.th-tri:hover{color:var(--txt);background:var(--bord2)}
.th-tri:focus-visible{box-shadow:0 0 0 2px var(--accent),0 0 0 5px color-mix(in srgb,var(--accent) 25%,transparent)}
.th-tri.on{color:var(--accent-t)}
.th-tri.on .fl{opacity:1}
@media (pointer:coarse){.th-tri{min-height:44px}}
/* Photos des appareils (vignettes) */
.ph{width:40px;height:40px;flex:none;object-fit:contain;border-radius:6px;background:var(--blanc);border:1px solid var(--bord2)}
.ph-vide{display:inline-grid;place-items:center;background:var(--fond2);color:var(--txt3)}
.ph-vide svg{width:20px;height:20px;fill:currentColor}
.ph.ph-s{width:24px;height:24px}
.ph.ph-l{width:160px;height:160px;border-radius:10px}
.ph-l-wrap{display:flex;justify-content:center;margin-bottom:12px}
.ph-ligne{display:flex;align-items:center;gap:10px;min-width:0}
.ph-ligne>div{min-width:0}
.hbar .lb.ph-ligne{width:auto;min-width:130px;max-width:55%;flex:0 1 auto;gap:6px}
.ph-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
td .ph-ligne>div{min-width:auto}
.px-nv{margin-top:6px}
.tk-pb-desig:focus-visible{outline:none;border-radius:10px;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
/* Ticket : case « Suivi » + formulaire « Modifier le ticket » */
.tk-suivi-pied{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.tk-pb-hd{display:flex;gap:10px;align-items:flex-start}
.tk-pb-hd .tk-pb-titre{flex:1;min-width:0}
.tk-edit{width:min(860px,100%)}
.ph-ligne .muted.small{white-space:nowrap}
/* QuickSupport (TeamViewer) dans les panneaux d'appel */
.qs{display:grid;gap:8px;padding-top:12px;border-top:1px solid var(--bord2)}
.qs-t{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.qs-t .l{margin:0}
.qs-t select{width:auto;max-width:100%}
.qs-l{display:flex;gap:8px;flex-wrap:wrap}
.qs-l .inp{flex:1 1 220px;min-width:0;font-size:16px;font-weight:600;letter-spacing:.04em}
.qs-hist{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.qs-hist .tk-chip{cursor:pointer;padding:4px 12px;color:var(--txt);min-height:44px;max-width:100%;transition:transform .2s,background-color .2s,border-color .2s}
.qs-hist .tk-chip:hover{transform:translateY(-2px)}
/* Agenda : pleine largeur + hauteur adaptée ; deux groupes de choix bien distincts (Pôle / Affichage) */
.content.plein{max-width:none}
.ag-wrap>.ag{flex:1;min-width:0}
.seg{display:inline-flex;align-items:center;gap:2px;padding:3px;border:1px solid var(--bord);border-radius:10px;background:var(--carte);box-shadow:var(--ombre-c)}
.seg-l{font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--txt3);padding:0 8px 0 6px;border-right:1px solid var(--bord2);margin-right:2px}
.seg .tab{border:0;border-radius:6px;padding:5px 12px}
.seg .tab:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
@media (max-width:560px){.seg{flex-wrap:wrap;max-width:100%}.seg-l{flex-basis:100%;border-right:0;padding:2px 6px 4px}}
.seg .tab.on{background:var(--accent);color:var(--blanc);border-color:var(--accent)}
.seg .tab:not(.on):hover{background:var(--fond2)}
.ag-bar{gap:12px}
/* Messagerie instantanée */
.chat{display:grid;grid-template-columns:280px minmax(0,1fr) 250px;gap:16px;height:calc(100vh - 130px);min-height:420px}
.chat-liste{background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);box-shadow:var(--ombre-c);padding:12px;overflow:auto}
.chat-lt{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.chat-salon{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;color:var(--txt);min-height:52px;transition:background-color .2s}
.chat-salon:hover{background:var(--fond2)}
.chat-salon.on{background:var(--accent-f)}
.chat-av{width:34px;height:34px;flex:none;border-radius:999px;display:grid;place-items:center;font-weight:700;font-size:12px;background:var(--bleu-f);color:color-mix(in srgb,var(--bleu) 85%,var(--txt))}
.chat-av.groupe{background:var(--violet-f);color:var(--violet);font-size:16px}
.chat-sn{flex:1;min-width:0;display:flex;flex-direction:column}
.chat-sn .small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-nl{flex:none;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--danger);color:var(--blanc);font-size:11.5px;font-weight:700;display:grid;place-items:center}
.chat-lt h2{margin:0}
.chat-hd-t{flex:1;min-width:0}
.chat-fil-w{display:flex;flex-direction:column;background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);box-shadow:var(--ombre-c);min-height:0;transition:border-color .2s,box-shadow .2s}
.chat-fil-w.depot{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.chat-vide{justify-content:center}
.chat-hd{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--bord2);flex-wrap:wrap}
.chat-retour{display:none}
.chat-fil{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:8px;background:var(--fond2)}
.msg{display:flex}
.msg.moi{justify-content:flex-end}
.msg-b{max-width:min(560px,80%);padding:8px 12px;border-radius:12px;background:var(--carte);border:1px solid var(--bord2);overflow-wrap:anywhere}
.msg.moi .msg-b{background:color-mix(in srgb,var(--accent) 9%,var(--carte));border-color:color-mix(in srgb,var(--accent) 25%,var(--bord2))}
.msg-n{display:block;font-size:12px;color:color-mix(in srgb,var(--bleu) 85%,var(--txt))}
.msg-t{white-space:pre-wrap}
.msg-h{display:block;text-align:right;font-size:10.5px;color:var(--txt3);margin-top:2px}
.msg-f img{display:block;max-width:100%;max-height:260px;border-radius:10px;margin-bottom:6px}
.msg-doc{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;border:1px solid var(--bord);background:var(--fond2);color:var(--txt);min-height:44px}
.msg-doc:hover{border-color:var(--accent)}
.msg-doc svg{width:22px;height:22px;flex:none;fill:var(--accent-t)}
.msg-doc>span{display:flex;flex-direction:column;min-width:0}
.chat-form{display:flex;gap:8px;align-items:flex-end;padding:10px 14px 4px}
.chat-form textarea{flex:1;min-width:0;resize:none;max-height:160px}
.chat-pj{flex:none;padding:7px 10px;cursor:pointer;min-width:44px;min-height:44px;justify-content:center}
.chat-pj:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.chat-pj svg{width:18px;height:18px;fill:currentColor}
.chat-aide{padding:0 14px 10px}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cg-membres{border:0;padding:0;margin:0 0 12px;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(180px,100%),1fr));gap:6px}
.cg-membres label{display:flex;gap:8px;align-items:center;min-height:44px;cursor:pointer}
@media (max-width:760px){.chat{grid-template-columns:1fr;height:auto}.chat.ouvert .chat-liste{display:none}.chat:not(.ouvert) .chat-fil-w{display:none}.chat-retour{display:inline-flex}.chat-fil{max-height:60vh;min-height:300px}}
/* Panneau de traitement du ticket v2 : problème + commentaire | poste d'appel */
.tk-trait.tk2{display:block;padding:0;overflow:hidden}
.tk2-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,400px)}
.tk2-gauche{display:grid;gap:18px;align-content:start;padding:20px 22px;min-width:0}
.tk2 .tk-pb{padding:0;border:0;gap:12px}
.tk2 .tk-pb-titre{font-size:21px}
.tk2 .tk-pb-desig .tk-pb-bloc{font-size:14.5px;line-height:1.5;max-height:300px;background:var(--carte);border-color:var(--bord)}
.tk-pb-manque{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:6px 6px 6px 12px;border:1px dashed var(--bord);border-radius:10px;font-size:12.5px;color:var(--txt2)}
.tk-pb-manque>span{flex:1;min-width:0}
.tk-pb-manque b{font-weight:600}
.tk2-com{display:grid;gap:10px;padding-top:18px;border-top:1px solid var(--bord2)}
.tk2-com-hd{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.tk2-com-hd .l{margin:0;flex:1}
.tk2-phr{display:flex;gap:6px;overflow-x:auto;scrollbar-width:thin;padding:4px 4px 8px;margin:-4px -4px 0;-webkit-mask-image:linear-gradient(90deg,var(--txt) calc(100% - 32px),transparent);mask-image:linear-gradient(90deg,var(--txt) calc(100% - 32px),transparent)}
.tk2-phr.fin{-webkit-mask-image:none;mask-image:none}
.tk2-phr-b{flex:none;max-width:min(300px,100%);min-height:44px;padding:0 14px;border:1px solid var(--bord);border-radius:999px;background:var(--carte);color:var(--txt);font:inherit;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer;transition:transform .2s,border-color .2s,background-color .2s}
.tk2-phr-b:not(:disabled):hover{transform:translateY(-2px);border-color:var(--accent);background:var(--accent-f)}
.tk2-phr-b:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.tk2-phr-b:disabled{opacity:.55;cursor:not-allowed}
.tk2-com-txt{min-height:96px;resize:none;max-height:320px;overflow-y:auto;font-size:14.5px;line-height:1.5}
.tk2-com textarea:disabled{background:var(--fond2);cursor:not-allowed}
.tk2-save{display:flex;gap:8px;align-items:center;justify-content:flex-end;flex-wrap:wrap}
.tk2-raccourci{margin-right:auto}
.tk2-poste{display:grid;gap:18px;align-content:start;padding:20px;background:var(--fond2);border-left:1px solid var(--bord);min-width:0;transition:background-color .2s}
.tk-trait.appel .tk2-poste{background:color-mix(in srgb,var(--vert) 9%,var(--carte));border-left-color:color-mix(in srgb,var(--vert) 35%,var(--bord))}
.tk2-cli .nom{font-size:19px;font-weight:700;line-height:1.2;overflow-wrap:anywhere}
.tk2-cli{display:grid;gap:3px}
.tk2-poste .tk-tr-num{background:var(--carte)}
.tk2-poste .tk-tr-nums .tk-chip{background:var(--carte)}
.tk2-poste .tk-tr-nums .tk-chip.on{background:var(--accent-f)}
.tk2-poste .tk-tr-gros{width:100%;padding:16px 18px;font-size:18px}
.tk2-poste .qs{padding-top:16px;border-top:1px solid var(--bord)}
.tk2-poste .qs-l .inp{flex:1 1 150px;background:var(--carte)}
@media (max-width:1100px){.tk2-g{grid-template-columns:1fr}.tk2-poste{border-left:0;border-top:1px solid var(--bord)}.tk-trait.appel .tk2-poste{order:-1;border-top:0;border-bottom:1px solid var(--bord)}}
@media (max-width:760px){.tk2-gauche,.tk2-poste{padding:16px}.tk2-raccourci{display:none}}
/* Réglages en accordéon */
.reg-acc{display:grid;gap:10px;max-width:1100px}
.reg-sec{background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);box-shadow:var(--ombre-c);transition:border-color .2s,box-shadow .2s}
.reg-sec.on{border-color:color-mix(in srgb,var(--accent) 35%,var(--bord))}
.reg-h{margin:0;font-size:inherit}
.reg-hd{display:flex;align-items:center;gap:14px;width:100%;min-height:60px;padding:12px 18px;border:0;background:none;color:var(--txt);font:inherit;text-align:left;cursor:pointer;border-radius:var(--r);transition:background-color .2s}
.reg-hd:hover{background:var(--fond2)}
.reg-sec .reg-hd:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--accent),0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.reg-t{font-size:16px;font-weight:700;flex:0 1 auto}
.reg-r{flex:1;min-width:0;display:block;text-align:right;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.reg-r .dot{margin-right:6px;vertical-align:middle}
.reg-chev{width:22px;height:22px;flex:none;fill:var(--txt3);transition:transform .2s}
.reg-sec.on .reg-chev{transform:rotate(90deg)}
.reg-c{padding:4px 18px 18px;border-top:1px solid var(--bord2)}
.reg-c>.hd:first-child{margin-top:12px}
.reg-c>p:first-child,.reg-c>.exports-intro:first-child{margin-top:12px!important}
@media (max-width:760px){.reg-hd{flex-wrap:wrap;gap:4px 10px;padding:12px 14px}.reg-r{order:3;flex-basis:100%;justify-content:flex-start;text-align:left}.reg-chev{margin-left:auto}.reg-c{padding:4px 14px 14px}}
/* Suivi des tickets : étoile jaune (pleine = suivi) */
.tk-etoile{display:inline-grid;place-items:center;flex:none;width:32px;height:32px;margin-right:4px;padding:0;border:1px solid transparent;border-radius:6px;background:none;color:var(--txt3);cursor:pointer;vertical-align:middle;transition:color .2s,background-color .2s,transform .2s}
.tk-etoile svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.tk-etoile:hover{color:var(--jaune);background:var(--fond2);transform:translateY(-1px)}
.tk-etoile.on{color:var(--jaune)}
.tk-etoile.on svg{fill:currentColor}
.tk-etoile.grand{display:inline-flex;gap:6px;width:auto;height:auto;min-height:44px;margin:0;padding:6px 12px;border-color:var(--bord);background:var(--carte);color:var(--txt);font-weight:600}
.tk-etoile.grand svg{color:var(--jaune)}
.tk-etoile.grand.on{border-color:color-mix(in srgb,var(--jaune) 55%,var(--bord));background:color-mix(in srgb,var(--jaune) 12%,var(--carte))}
.tk-etoile:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
@media (pointer:coarse){.tk-etoile{width:44px;height:44px}}
.ic-tel{width:1.15em;height:1.15em;flex:none;fill:currentColor;vertical-align:-.2em;margin-right:.35em}
/* Champs de recherche (loupe, sans texte d'exemple) */
.inp-rech{padding-left:36px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%235f656c' d='M15.5 14h-.79l-.28-.27A6.47 6.47 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:10px center;background-size:18px}
:root[data-theme=dark] .inp-rech{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%239aa1a9' d='M15.5 14h-.79l-.28-.27A6.47 6.47 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E")}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .inp-rech{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%239aa1a9' d='M15.5 14h-.79l-.28-.27A6.47 6.47 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z'/%3E%3C/svg%3E")}}
/* Fiche véhicule (Autossimo) */
.fv{border:1px solid color-mix(in srgb,var(--bleu) 30%,var(--bord));border-radius:10px;background:var(--bleu-f);padding:12px 14px}
.fv.attente,.fv.vide{padding:10px 14px}
.fv.vide{background:var(--fond2);border-color:var(--bord2)}
.fv-etat{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--txt2)}
.fv-pt{width:8px;height:8px;border-radius:999px;background:var(--bleu);flex:none;animation:tk-pulse 1.5s ease-in-out infinite}
.fv-hd{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.fv-t{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:color-mix(in srgb,var(--bleu) 80%,var(--txt))}
.fv-g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.5fr);gap:8px 14px}
.fv-c.mono b{overflow-wrap:normal;word-break:keep-all}
.fv-c{display:flex;flex-direction:column;gap:1px;min-width:0}
.fv-c .l{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;font-weight:600;color:color-mix(in srgb,var(--bleu) 70%,var(--txt));margin:0}
.fv-c b{font-size:14.5px;overflow-wrap:anywhere}
.fv-c.mono b{font-variant-numeric:tabular-nums;letter-spacing:.04em}
@media (max-width:900px){.fv-g{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:480px){.fv-g{grid-template-columns:1fr}.fv-c.mono b{overflow-wrap:anywhere}}
/* Fenêtre d'avis : « Le client n'a pas répondu ? » */
.av-nr{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:12px 14px;margin-bottom:16px;border-radius:10px;background:var(--orange-f);border:1px solid color-mix(in srgb,var(--orange) 30%,transparent)}
.av-nr-t{flex:1 1 240px;min-width:0;display:flex;flex-direction:column;gap:2px;color:color-mix(in srgb,var(--orange) 75%,var(--txt))}
.av-nr-t>b{font-size:15px}
.av-nr-t .small{color:var(--txt2);overflow-wrap:anywhere}
.av-nr .btn{flex:none}
.av-nr-b{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.av-nr.on{background:var(--fond2);border-color:var(--bord)}
.av-nr.on .av-nr-t{color:var(--txt)}
.av-notes.off{opacity:.45;filter:grayscale(1)}
.av-notes.off .av-note{cursor:not-allowed}
/* Recherche générale (barre du haut) */
.rg{position:relative;flex:1 1 320px;max-width:460px;min-width:0;margin-left:8px}
.rg .inp{width:100%}
.rg-res{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:50;max-height:min(70vh,560px);overflow:auto;background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);box-shadow:var(--ombre-f);padding:6px}
.rg-g{font-size:11px;text-transform:uppercase;letter-spacing:.06em;font-weight:600;color:var(--txt3);padding:8px 8px 2px}
.rg-l{display:flex;flex-direction:column;gap:1px;padding:7px 10px;border-radius:8px;min-height:44px;justify-content:center;color:var(--txt);transition:background .15s;text-decoration:none}
.rg-l:focus-visible{outline:none;background:var(--accent-f);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.rg-l b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rg-l .small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rg-l:hover,.rg-l.on{background:var(--accent-f)}
.rg-l.on b{color:var(--accent-t)}
.rg-vide{padding:10px}
@media (max-width:760px){.rg{flex-basis:100%;max-width:none;margin-left:0;order:5}.top{flex-wrap:wrap}}
/* Partager dans la messagerie */
.top h1{display:flex;align-items:center;gap:10px;min-width:0;font-size:22px}
.top h1 .mono{font-size:inherit;font-weight:inherit}
.btn-partage{flex:none;gap:6px;font-size:12.5px;font-weight:600}
.btn-partage svg{width:16px;height:16px;fill:currentColor}
.btn-partage:hover{border-color:var(--accent);color:var(--accent-t)}
.pt-liste{display:grid;gap:2px;max-height:min(46vh,380px);overflow:auto;border:1px solid var(--bord2);border-radius:10px;padding:6px}
.pt-g{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--txt3);font-weight:600;padding:8px 8px 2px}
.pt-l{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:6px 8px;border:1px solid transparent;border-radius:10px;background:none;color:var(--txt);font:inherit;text-align:left;cursor:pointer;transition:background-color .2s,border-color .2s}
.pt-l:hover,.pt-l:focus-visible{background:var(--fond2);border-color:var(--bord2);outline:none}
.pt-l .chat-av{position:relative}
.msg-lien{color:color-mix(in srgb,var(--bleu) 85%,var(--txt));text-decoration:underline;overflow-wrap:anywhere}
@media (max-width:760px){.btn-partage span{display:none}}
/* Mails types (panneau + Réglages) */
.mt{display:grid;gap:8px;padding-top:16px;border-top:1px solid var(--bord)}
.mt .l{margin:0}
.mt-l{display:flex;gap:8px;flex-wrap:wrap}
.mt-l .inp{flex:1 1 170px;min-width:0;background:var(--carte)}
.mt-go{flex:none}
.mt-info{overflow-wrap:anywhere}
.mt-warn{color:color-mix(in srgb,var(--orange) 75%,var(--txt));font-weight:600}
.mt-reg{display:grid;gap:6px;margin-bottom:12px}
.mt-reg-l{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:8px 10px;border:1px solid var(--bord2);border-radius:10px}
.mt-reg-t{flex:1 1 220px;min-width:0;display:flex;flex-direction:column}
.mt-reg-t .small{overflow-wrap:anywhere}
.mt-reg-l select{width:auto;max-width:100%;flex:0 1 230px}
.mt-ajout-b{cursor:pointer}
.mt-ajout-b:focus-within{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
/* Dernier intervenant (listes Tickets / Remotes) */
.tk-interv{white-space:nowrap}
.interv{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--txt2)}
.interv .chat-av{width:26px;height:26px;font-size:10.5px}
/* Corbeille des listes (Remotes, Tickets) */
.td-corb{width:104px;white-space:nowrap;text-align:right}
.btn-corb{min-width:44px;min-height:44px;display:inline-grid;place-items:center;border:1px solid transparent;border-radius:6px;background:none;color:var(--txt3);cursor:pointer;transition:color .2s,background-color .2s,border-color .2s}
.btn-corb svg{width:18px;height:18px;fill:currentColor}
.btn-corb:hover{color:color-mix(in srgb,var(--rouge) 85%,var(--txt));background:var(--rouge-f)}
.btn-corb.conf{min-width:96px;padding:0 10px;font-size:12px;font-weight:700;color:color-mix(in srgb,var(--rouge) 85%,var(--txt));background:var(--rouge-f);border-color:color-mix(in srgb,var(--rouge) 40%,transparent)}
/* Messagerie : réactions rapides */
.msg{flex-direction:column;align-items:flex-start}
.msg.moi{align-items:flex-end}
.msg-b{position:relative;-webkit-user-select:text;user-select:text;-webkit-touch-callout:none}
.msg-rx{display:flex;gap:4px;flex-wrap:wrap;margin-top:3px}
.msg-rx:empty{display:none}
.rx{display:inline-flex;align-items:center;gap:4px;min-height:28px;padding:0 8px;border:1px solid var(--bord);border-radius:999px;background:var(--carte);font:inherit;font-size:13px;cursor:pointer;transition:transform .15s,border-color .15s,background-color .15s}
.rx span{font-size:11.5px;font-weight:600;color:var(--txt2)}
.rx.on{border-color:var(--accent);background:var(--accent-f)}
.rx:hover{transform:translateY(-1px)}
.rx-pop{position:absolute;bottom:calc(100% + 6px);left:0;z-index:20;display:flex;gap:2px;padding:4px;border:1px solid var(--bord);border-radius:999px;background:var(--carte);box-shadow:var(--ombre-f)}
.msg.moi .rx-pop{left:auto;right:0}
.rx-pop button{width:40px;height:40px;border:0;border-radius:999px;background:none;font-size:20px;cursor:pointer;transition:transform .15s,background-color .15s}
.rx-pop button:hover{background:var(--fond2);transform:scale(1.15)}
.rx-pop button:focus-visible{outline:none;background:var(--fond2);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.rx:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.rx-pop.bas{bottom:auto;top:calc(100% + 6px)}
@media (pointer:coarse){.rx{min-height:44px;padding:0 10px}.rx-pop button{width:44px;height:44px}}
/* Messagerie : colonne Contacts */
.chat-contacts{background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);box-shadow:var(--ombre-c);padding:12px;overflow:auto;min-height:0}
.chat-contacts h2{margin:0 0 2px}
.chat-ct-n{margin-bottom:8px}
.chat-ct{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:6px 8px;border:1px solid transparent;border-radius:10px;background:none;color:var(--txt);font:inherit;text-align:left;cursor:pointer;transition:background-color .2s,border-color .2s}
.chat-ct:hover{background:var(--fond2);border-color:var(--bord2)}
.chat-ct .chat-av{position:relative}
.chat-pres{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:999px;background:var(--txt3);border:2px solid var(--carte)}
.chat-pres.on{background:var(--vert)}
.chat-ct-st{flex:none;max-width:84px;text-align:right;font-size:11px;line-height:1.25;color:var(--txt3)}
.chat-ct-st.on{color:var(--vert);font-weight:600}
@media (max-width:1180px){.chat{grid-template-columns:280px minmax(0,1fr);grid-template-rows:minmax(0,1fr) minmax(0,42%)}.chat-liste{grid-row:1}.chat-contacts{grid-column:1;grid-row:2}.chat-fil-w{grid-column:2;grid-row:1/3}}
@media (max-width:760px){.chat{grid-template-columns:1fr;grid-template-rows:none}.chat-contacts{max-height:none}.chat-liste,.chat-contacts,.chat-fil-w{grid-column:auto;grid-row:auto}.chat.ouvert .chat-contacts{display:none}}
/* Messagerie : statut des messages, corbeille, emojis */
.msg-st{display:inline-flex;align-items:center;gap:3px;margin-left:8px;color:var(--txt3)}
.msg-st svg{width:14px;height:14px;fill:currentColor}
.msg-st.recu{color:var(--txt2)}
.msg-st.lu{color:color-mix(in srgb,var(--bleu) 85%,var(--txt));font-weight:600}
.chat-salon-w{display:flex;align-items:center;gap:2px;border-radius:10px}
.chat-salon-w .chat-salon{flex:1;min-width:0}
.chat-suppr{flex:none;min-width:44px;min-height:44px;display:grid;place-items:center;border:1px solid transparent;border-radius:10px;background:none;color:var(--txt3);cursor:pointer;opacity:.85;transition:opacity .2s,color .2s,background-color .2s,border-color .2s}
.chat-suppr svg{width:18px;height:18px;fill:currentColor}
.chat-salon-w:hover .chat-suppr,.chat-suppr:focus-visible{opacity:1}
.chat-suppr:hover{color:color-mix(in srgb,var(--rouge) 85%,var(--txt));background:var(--rouge-f)}
.chat-suppr.conf{opacity:1;padding:0 10px;font-size:12px;font-weight:700;color:color-mix(in srgb,var(--rouge) 85%,var(--txt));background:var(--rouge-f);border-color:color-mix(in srgb,var(--rouge) 40%,transparent)}
.chat-form{position:relative}
.chat-emo-w{position:static;flex:none}
.chat-emo{position:absolute;bottom:calc(100% + 8px);left:14px;z-index:30;width:min(340px,calc(100% - 28px));background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);box-shadow:var(--ombre-f);padding:8px}
.chat-emo-tabs{display:flex;gap:4px;overflow-x:auto;padding-bottom:6px;border-bottom:1px solid var(--bord2);margin-bottom:6px}
.chat-emo-tabs button{flex:none;min-height:44px;transition:background-color .2s;padding:0 10px;border:1px solid transparent;border-radius:999px;background:none;color:var(--txt2);font:inherit;font-size:12.5px;cursor:pointer}
.chat-emo-tabs button:not(.on):hover{background:var(--fond2)}
.chat-emo-tabs button.on{background:var(--accent-f);color:var(--txt);border-color:color-mix(in srgb,var(--accent) 30%,transparent);font-weight:600}
.chat-emo-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:2px;max-height:220px;overflow:auto}
.chat-emo-g button{min-height:44px;border:0;border-radius:8px;background:none;font-size:22px;line-height:1;cursor:pointer;transition:background-color .15s,transform .15s}
.chat-emo-g button:hover,.chat-emo-g button:focus-visible{background:var(--fond2);transform:translateY(-2px)}
/* Exports CSV (Réglages) */
.exports{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr));gap:10px}
.exports-intro{margin-top:-6px}
/* Historique des appels du panneau Remote */
.rm-hist{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--bord2);padding-top:14px}
.rm-hist .l{margin-bottom:0}
.export{display:flex;align-items:center;gap:12px;min-height:56px;padding:10px 14px;border:1px solid var(--bord);border-radius:10px;background:var(--fond2);color:var(--txt);transition:transform .2s,border-color .2s,background-color .2s}
.export svg{width:22px;height:22px;flex:none;fill:var(--accent-t)}
.export>span{display:flex;flex-direction:column;min-width:0;overflow-wrap:anywhere}
.export:hover{transform:translateY(-2px);border-color:var(--accent);background:var(--carte)}
.pager{display:flex;gap:8px;align-items:center;justify-content:flex-end;margin-top:12px;flex-wrap:wrap}
@media (max-width:760px){.top-mdp{display:none}.top h1{font-size:17px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top{gap:8px}}
/* Harmonisation charte (revue design 15/10) : transitions, focus visible, cibles tactiles, champs empilés en mobile */
.btn,.tab,.nav a{transition:background-color .2s,border-color .2s,transform .2s}
.btn:focus-visible,a:focus-visible,.tab:focus-visible,[data-act]:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
@media (pointer:coarse){.btn,.inp,.tab{min-height:44px}.tab{display:inline-flex;align-items:center}}
@media (max-width:560px){.row{flex-direction:column;gap:0}}
@media (prefers-reduced-motion:reduce){*,*::before{animation:none!important;transition:none!important}}

/* =====================================================================
   Refonte V2 — maquette validée « V2 — charte actuelle » (18/10/2026)
   Uniquement les variables de :root (clair et sombre). Animations coupées sous prefers-reduced-motion.
   ===================================================================== */
@keyframes v2-rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes v2-drift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(28px,-18px) scale(1.07)}}

/* --- Partout : menu latéral --- */
.side{background-image:radial-gradient(380px 240px at 0 0,color-mix(in srgb,var(--accent) 38%,transparent),transparent 70%)}
.nav a{border-radius:10px;transition:background .18s,color .18s,box-shadow .18s}
.nav a.on{font-weight:600;box-shadow:0 8px 20px -8px color-mix(in srgb,var(--accent) 70%,transparent)}
.nav a[href*="messagerie"] .n{background:var(--danger);color:var(--blanc);font-weight:700}
.sync{border-radius:12px;background:color-mix(in srgb,var(--nav-txt) 5%,transparent);border:1px solid color-mix(in srgb,var(--nav-txt) 9%,transparent)}

/* --- Partout : barre du haut translucide --- */
.top{background:color-mix(in srgb,var(--carte) 85%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}

/* --- Partout : cartes (arrondi 14 px, soulèvement au survol, fondu à l'arrivée) --- */
.card{border-radius:14px;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.card:hover{transform:translateY(-3px);box-shadow:var(--ombre-h);border-color:color-mix(in srgb,var(--accent) 35%,var(--bord))}
.content.entree .card,.content.entree .rw{animation:v2-rise .45s ease both}
.content.entree .card:nth-child(2),.content.entree .rw:nth-child(3){animation-delay:.05s}
.content.entree .card:nth-child(3),.content.entree .rw:nth-child(4){animation-delay:.1s}
.content.entree .card:nth-child(4),.content.entree .rw:nth-child(5){animation-delay:.15s}
.content.entree .card:nth-child(5),.content.entree .rw:nth-child(6){animation-delay:.2s}
.content.entree .card:nth-child(n+6),.content.entree .rw:nth-child(n+7){animation-delay:.25s}

/* --- Panneau d'accueil --- */
.dash2{display:flex;flex-direction:column;gap:16px}
.dash-hd{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:flex-end;justify-content:space-between}
.dash-date{font-size:13px;color:var(--txt3);font-weight:500}
.dash-bjr{margin:2px 0 0;font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.2;text-wrap:balance}
.dash-act{display:flex;gap:8px;flex-wrap:wrap}
.dash-act .btn{min-height:44px;padding:0 14px;border-radius:6px;font-weight:600}
.dash-act svg,.da-b svg{width:16px;height:16px}
.dash-alerte2{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:12px 16px;border-radius:12px;background:var(--orange-f);color:color-mix(in srgb,var(--orange) 82%,var(--txt));border:1px solid color-mix(in srgb,var(--orange) 30%,transparent);font-size:13.5px}
.dash-alerte2 .da-ic{width:30px;height:30px;border-radius:999px;flex:none;display:grid;place-items:center;background:color-mix(in srgb,var(--orange) 18%,transparent)}
.dash-alerte2 .da-ic svg{width:16px;height:16px}
.dash-alerte2 .tx{flex:1 1 320px}
.dash-alerte2 a{font-weight:700;text-decoration:underline;display:inline-flex;align-items:center;min-height:44px}
.dash-appel{position:relative;overflow:hidden;display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;padding:18px 22px;border-radius:var(--r);background:var(--carte);border:1px solid color-mix(in srgb,var(--vert) 40%,var(--bord));box-shadow:var(--ombre-c)}
.dash-appel::before{content:"";position:absolute;inset:0;background:radial-gradient(520px 200px at 0 0,var(--vert-f),transparent 70%);pointer-events:none}
.dash-appel>*{position:relative}
.da-g{display:flex;flex-direction:column;gap:4px;flex:1 1 280px;min-width:0}
.da-l{display:inline-flex;align-items:center;gap:8px;font-size:11.5px;font-weight:700;letter-spacing:.08em;color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.da-pt{width:8px;height:8px;border-radius:999px;background:var(--vert);animation:tk-pulse 1.5s ease-in-out infinite}
.da-t{font-size:19px;font-weight:800;letter-spacing:-.01em}
.da-s{font-size:13px;color:var(--txt3);display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.da-c{display:flex;flex-direction:column;align-items:center}
.da-c .l{font-size:11px;font-weight:600;letter-spacing:.06em;color:var(--txt3)}
.da-c .chrono{font-size:34px;font-weight:800;color:color-mix(in srgb,var(--vert) 85%,var(--txt));font-variant-numeric:tabular-nums;line-height:1.1}
.da-b{display:flex;gap:8px;flex-wrap:wrap}
.da-b .btn{min-height:44px;padding:0 16px;border-radius:10px;font-weight:600}
.da-b .da-fin{background:var(--appel);border-color:var(--appel);color:var(--blanc);font-weight:700}
.da-b .da-fin:hover{background:var(--appel-d);border-color:var(--appel-d)}
.dash-kpis2{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px}
.kpi2{display:flex;flex-direction:column;gap:8px;padding:16px 18px;color:var(--txt)}
.kpi2 .k-hd{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12.5px;color:var(--txt3);font-weight:500}
.kpi2 .k-ic{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;flex:none}
.kpi2 .k-ic svg{width:15px;height:15px}
.k-ic.c-bleu{background:var(--bleu-f);color:var(--bleu)}
.k-ic.c-accent{background:var(--accent-f);color:var(--accent-t)}
.k-ic.c-vert{background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.k-ic.c-violet{background:var(--violet-f);color:color-mix(in srgb,var(--violet) 85%,var(--txt))}
.k-ic.c-cyan{background:var(--cyan-f);color:color-mix(in srgb,var(--cyan) 85%,var(--txt))}
.kpi2 .v{font-size:30px;font-weight:800;letter-spacing:-.02em;line-height:1;margin:0}
.kpi2 .v.k-bleu{color:var(--bleu)}
.kpi2 .v.k-vert{color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.kpi2 .d{font-size:12px;color:var(--txt3);display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.k-bar{display:flex;gap:4px;height:6px}
.k-bar>span{border-radius:999px}
.k-bar2{gap:3px;border-radius:999px;overflow:hidden}
.k-bar2>span{border-radius:0}
/* Tableau de bord : tuiles compactes (chiffre à gauche du libellé) pour laisser la hauteur au planning du jour */
.dash2 .kpi2{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 12px;padding:10px 14px}
.dash2 .kpi2 .v{order:-1;flex:none;font-size:24px}
.dash2 .kpi2 .k-hd{flex:1 1 120px;min-width:0}
.dash2 .kpi2 .k-bar,.dash2 .kpi2 .d{flex:1 0 100%}
.dash2 .kpi2 .k-bar{height:4px}
.dash2 .kpi2 .k-ic{width:26px;height:26px;border-radius:8px}
.dash2 .kpi2 .k-ic svg{width:14px;height:14px}
.b-vert{background:var(--vert)}.b-orange{background:var(--orange)}.b-accent{background:var(--accent)}.b-cyan{background:var(--cyan)}
.dash-bas{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start}
.dash2 .dash-plan{flex:999 1 560px;min-width:0;padding:16px 18px 18px;border-radius:16px}
.dash-droite{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:18px}
.dash-droite .card{padding:16px 18px;border-radius:16px}
.dash-droite.dr-defil{overflow-y:auto;overscroll-behavior:contain;padding:4px 12px 28px;margin:-4px -12px 0;scrollbar-width:thin}
.dash-droite.dr-defil>.card{flex:none}
/* fondu en bas tant qu'il reste des cartes plus bas */
.dash-droite.dr-defil.dr-suite{-webkit-mask-image:linear-gradient(to bottom,var(--txt) calc(100% - 56px),transparent);mask-image:linear-gradient(to bottom,var(--txt) calc(100% - 56px),transparent)}
.dash2 h2{font-size:16px;font-weight:700}
.dash2 .ag{border-radius:12px}
.dash2 .now{box-shadow:0 0 10px color-mix(in srgb,var(--accent) 55%,transparent)}
.dash2 .now::before{content:"";position:absolute;left:-5px;top:-4px;width:10px;height:10px;border-radius:999px;background:var(--accent)}
.dash2 .ev{border-radius:10px;border-left-width:4px}
.dash2 .ev:hover{box-shadow:var(--ombre-h)}
.pc-l{display:grid!important;grid-template-columns:150px minmax(0,1fr) 28px;gap:10px;border-bottom:0!important;border-radius:10px;padding:0 8px!important;min-height:36px;transition:background .18s}
.pc-l:hover{background:var(--fond2)}
.pc-l .badge{justify-self:start}
.pc-l b{text-align:right;font-variant-numeric:tabular-nums}
.pc-bar{height:8px;border-radius:999px;background:var(--bord2);overflow:hidden}
.pc-fi{display:block;height:100%;border-radius:999px}
.pc-nouvelle{background:var(--bleu)}.pc-rdv{background:var(--orange)}.pc-complete{background:var(--cyan)}.pc-reussie{background:var(--vert)}
.pc-echec{background:var(--rouge)}.pc-facturee{background:var(--violet)}.pc-cloturee{background:var(--txt3)}.pc-tous{background:var(--txt3)}
.df-hd{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px}
.df-hd h2{margin:0}
.df-hd a{font-size:12.5px;font-weight:600;display:inline-flex;align-items:center;min-height:44px}
.df-l{border-bottom:0!important;border-radius:10px;padding:4px 8px!important;min-height:44px;transition:background .18s}
.pc-l.list-item[data-act]{min-height:36px}
@media (pointer:coarse){.pc-l.list-item[data-act]{min-height:44px}}
.df-l:hover{background:var(--fond2)}
.df-l:focus-visible,.pc-l:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.df-c{flex:1;min-width:0;display:flex;flex-direction:column}
.df-c b{font-size:13.5px}
.df-c .small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.df-q{white-space:nowrap}

/* --- Remotes : onglets segmentés, puces de source, lignes en cartes --- */
.seg-tabs{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:12px;background:color-mix(in srgb,var(--txt) 6%,transparent);max-width:100%;margin-bottom:14px}
.seg-tabs .tab.seg{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 12px;border:0;border-radius:10px;color:var(--txt2);font-size:13px;font-weight:600;transition:background .18s,color .18s,box-shadow .18s}
.seg-tabs .tab.seg:hover{background:var(--carte);border:0}
.seg-tabs .tab.seg.on{background:var(--carte);color:var(--accent-t);box-shadow:var(--ombre-c),inset 0 0 0 1px color-mix(in srgb,var(--accent) 45%,transparent)}
.seg-tabs .tab.seg:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.seg-pt{width:7px;height:7px;border-radius:999px;flex:none}
.seg-tabs .tab .n{font-size:11.5px;font-weight:700;color:var(--txt2);margin-left:0}
.rw-bar .inp-rech{flex:1 1 320px;max-width:520px;min-height:44px;border-radius:6px}
.chips-src{display:flex;gap:6px;flex-wrap:wrap}
.chip-src{min-height:44px;padding:0 14px;border-radius:999px;border:1px solid var(--bord);background:var(--carte);color:var(--txt2);font-size:13px;font-weight:600;cursor:pointer;transition:background .18s,border-color .18s,color .18s}
.chip-src:hover{border-color:var(--txt3)}
.chip-src.on{background:var(--accent);border-color:var(--accent);color:var(--blanc)}
.chip-src:focus-visible{outline:none;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.rw-liste{display:flex;flex-direction:column;gap:6px}
.rw-grp{display:flex;flex-direction:column;gap:8px}
.rw-grp-hd{margin:10px 0 2px;display:flex;align-items:baseline;gap:8px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--txt3)}
.rw-grp-hd span{font-weight:500;letter-spacing:0;text-transform:none}
.rw-vide{padding:48px 16px;text-align:center;color:var(--txt3);border:1px dashed var(--bord);border-radius:14px}
.rw{--c:var(--txt3);position:relative;display:grid;grid-template-columns:6px minmax(170px,1.2fr) minmax(140px,1fr) minmax(130px,1fr) minmax(80px,.5fr) minmax(150px,auto) 24px;align-items:center;gap:14px;padding:12px 14px 12px 0;border-radius:12px;background:var(--carte);border:1px solid var(--bord);box-shadow:var(--ombre-c);color:var(--txt);overflow:hidden;cursor:pointer;min-width:0;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.rw:hover{transform:translateY(-2px);box-shadow:var(--ombre-h);border-color:color-mix(in srgb,var(--accent) 35%,var(--bord))}
.rw:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}
.rw-bande{align-self:stretch;margin:-12px 0;background:var(--c)}
.rw-nouvelle{--c:var(--bleu)}.rw-rdv{--c:var(--orange)}.rw-complete{--c:var(--cyan)}.rw-reussie{--c:var(--vert)}.rw-echec{--c:var(--rouge)}.rw-facturee{--c:var(--violet)}.rw-cloturee{--c:var(--txt3)}
.rw-c{display:flex;flex-direction:column;gap:3px;min-width:0}
.rw-l1{display:flex;align-items:center;gap:8px;min-width:0}
.rw-l1 b{font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rw-e{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rw-p{font-weight:500;font-size:13px;color:var(--txt2)}
.rw-s{font-size:12px;color:var(--txt3);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rw-s.cp-val{display:flex;align-items:center;gap:4px}
.rw-st{flex-direction:row;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.rw-tech{width:28px;height:28px;border-radius:999px;background:var(--accent-f);color:var(--accent-t);display:grid;place-items:center;font-size:11px;font-weight:700;flex:none}
.rw-go{color:var(--accent-t);opacity:0;transform:translateX(-4px);transition:opacity .2s,transform .2s}
.rw-go svg{width:18px;height:18px}
.rw:hover .rw-go,.rw:focus-visible .rw-go{opacity:1;transform:none}
@media (max-width:1100px){.rw{grid-template-columns:6px minmax(0,1fr) minmax(0,1fr) auto auto}.rw-pre,.rw-go{display:none}}
@media (max-width:760px){.rw{grid-template-columns:6px minmax(0,1fr) auto;gap:10px}.rw-cli,.rw-tkc{display:none}.rw-st{flex-direction:column;align-items:flex-end}}

/* --- Connexion : deux panneaux --- */
.login.lg2{display:flex;place-items:normal;padding:0;background:var(--fond);min-height:100vh}
.lg-g{position:relative;overflow:hidden;flex:0 0 min(760px,53%);box-sizing:border-box;padding:56px clamp(32px,5vw,72px);background:var(--nav);color:var(--nav-txt);display:flex;flex-direction:column;justify-content:space-between;gap:32px}
.lg-g::after{content:"";position:absolute;inset:0;background-image:linear-gradient(color-mix(in srgb,var(--nav-txt) 4%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--nav-txt) 4%,transparent) 1px,transparent 1px);background-size:32px 32px;pointer-events:none}
.lg-orb{position:absolute;border-radius:999px;pointer-events:none;animation:v2-drift 13s ease-in-out infinite}
.lg-orb.o1{right:-200px;top:-200px;width:600px;height:600px;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 50%,transparent) 0%,transparent 65%)}
.lg-orb.o2{left:-220px;bottom:-220px;width:520px;height:520px;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 25%,transparent) 0%,transparent 65%);animation-delay:-6s}
.lg-g>*:not(.lg-orb){position:relative;z-index:1}
.lg-brand{display:flex;align-items:center;gap:14px}
.lg-brand img{width:76px;height:46px;object-fit:contain;background:var(--blanc);border-radius:10px;padding:4px}
.lg-brand b{display:block;font-size:17px;letter-spacing:.02em}
.lg-brand small{font-size:12px;letter-spacing:.16em;color:var(--nav-txt2)}
.lg-mid{display:flex;flex-direction:column;gap:24px}
.lg-pill{display:inline-flex;align-self:flex-start;align-items:center;gap:10px;padding:8px 14px;border-radius:999px;background:color-mix(in srgb,var(--nav-txt) 6%,transparent);border:1px solid color-mix(in srgb,var(--nav-txt) 12%,transparent);font-size:13px}
.lg-pt{width:8px;height:8px;border-radius:999px;background:var(--nav-ok);animation:tk-pulse 1.5s ease-in-out infinite}
.lg-titre{margin:0;font-size:clamp(34px,3.4vw,50px);line-height:1.08;font-weight:800;letter-spacing:-.03em;max-width:580px;text-wrap:balance}
.lg-titre span{color:color-mix(in srgb,var(--accent) 45%,var(--nav-txt))}
.lg-sous{margin:0;font-size:17px;line-height:1.55;color:var(--nav-txt2);max-width:520px}
.lg-feats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:610px}
.lg-feat{padding:16px;border-radius:14px;background:color-mix(in srgb,var(--nav-txt) 4%,transparent);border:1px solid color-mix(in srgb,var(--nav-txt) 9%,transparent);display:flex;flex-direction:column;gap:10px;font-size:14px;font-weight:600;transition:background .2s,border-color .2s,transform .2s}
.lg-feat:hover{background:color-mix(in srgb,var(--nav-txt) 8%,transparent);border-color:color-mix(in srgb,var(--nav-txt) 18%,transparent);transform:translateY(-2px)}
.lg-feat svg{width:22px;height:22px;color:color-mix(in srgb,var(--accent) 45%,var(--nav-txt))}
.lg-pied{font-size:13px;color:var(--nav-txt2)}
.lg-d{flex:1;display:flex;align-items:center;justify-content:center;padding:48px 16px;min-width:0}
.lg2 .box{width:min(440px,100%);border:1px solid var(--bord);border-radius:16px;padding:40px;display:flex;flex-direction:column;gap:18px;box-shadow:var(--ombre-f);animation:v2-rise .6s ease both}
.lg2 .box .fld{margin:0}
.lg2 .box .inp{min-height:48px;border-radius:10px;background:var(--fond2);font-size:15px}
.lg2 .box .inp:focus{background:var(--carte)}
.lg-tt h1{margin:0;font-size:26px;font-weight:800;letter-spacing:-.02em}
.lg-tt p{margin:8px 0 0;font-size:14px}
.lg2 .err{margin:0;min-height:0}
.lg2 .err:not(:empty){display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:10px;background:var(--rouge-f);color:color-mix(in srgb,var(--rouge) 80%,var(--txt));font-size:13px;font-weight:500}
.lg-btn{justify-content:center;width:100%;min-height:50px;border-radius:10px;font-size:15px;font-weight:700;gap:10px;box-shadow:0 10px 24px -10px color-mix(in srgb,var(--accent) 60%,transparent);transition:transform .18s,box-shadow .18s,background .18s}
.lg-btn:hover{transform:translateY(-1px)}
.lg-btn svg{width:18px;height:18px}
.lg-note{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:10px;background:var(--fond2);font-size:12px;color:var(--txt3)}
.lg-note svg{width:16px;height:16px;flex:none}
.lg-quit{text-align:center;margin:0}
.lg-quit a{text-decoration:underline;display:inline-flex;align-items:center;min-height:44px}
.lg-mob{display:none;padding:0;color:var(--txt)}
.lg-mob small{color:var(--txt3)}
@media (max-width:900px){.lg-g{display:none}.lg-mob{display:flex}}
@media (max-width:480px){.lg2 .box{padding:28px 20px}}

/* --- Mouvements réduits : aucune animation --- */
@media (prefers-reduced-motion:reduce){
  .content.entree .card,.content.entree .rw,.lg-orb,.lg-pt,.da-pt,.lg2 .box{animation:none}
  .card,.card:hover,.rw,.rw:hover,.lg-feat:hover,.lg-btn:hover{transition:none;transform:none}
}
.dash-plan-hd .ag-leg{margin:0}
.dash-plan-hd .ag-leg-i{min-height:32px;padding:0 12px}
.dash-plan-hd .btn.s{min-height:32px}

/* Réglages → Rapports : formulaire en 3 étapes à gauche, envoi automatique et derniers rapports à droite */
.rap-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);gap:18px;align-items:start;margin-top:14px}
.rap-form{border:1px solid var(--bord);border-radius:var(--r);background:var(--carte);padding:20px 24px}
.rap-h{margin:0 0 4px;font-size:15px;font-weight:700;color:var(--txt);text-transform:none;letter-spacing:0}
.rap-titre{font-size:18px}
.rap-intro{margin:0 0 16px;padding-bottom:16px;border-bottom:1px solid var(--bord2)}
.rap-etape{display:grid;grid-template-columns:28px minmax(0,1fr);gap:14px;padding:16px 0;border-bottom:1px solid var(--bord2)}
.rap-num{width:26px;height:26px;border-radius:50%;background:var(--txt);color:var(--carte);display:grid;place-items:center;font-size:12.5px;font-weight:700;margin-top:1px}
.rap-et{margin:3px 0 12px;font-size:14.5px;font-weight:700}
.rap-seg{margin-bottom:12px}
.rap-dates{max-width:420px}
.rap-dates .fld{margin-bottom:10px}
.rap-per b{font-weight:600}
.rap-dons{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:12px}
.rap-don{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border:1px solid var(--bord);border-radius:10px;background:var(--carte);cursor:pointer;transition:border-color .2s,background-color .2s}
.rap-don:hover{border-color:var(--txt3)}
.rap-don:has(input:checked){border-color:var(--accent);background:var(--accent-f)}
.rap-don:has(input:focus-visible){box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.rap-don input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--accent);flex:none}
.rap-don>span{display:flex;flex-direction:column;gap:3px;min-width:0}
.rap-don .badge{align-self:flex-start;margin-top:4px}
.rap-sw{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;margin-bottom:8px}
.rap-sw input{position:absolute;opacity:0;width:1px;height:1px}
.rap-sw-i{position:relative;width:40px;height:22px;border-radius:999px;background:var(--bord);flex:none;transition:background-color .2s}
.rap-sw-i::after{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--blanc);box-shadow:0 1px 2px color-mix(in srgb,var(--nav) 30%,transparent);transition:transform .2s}
.rap-sw input:checked+.rap-sw-i{background:var(--accent)}
.rap-sw input:checked+.rap-sw-i::after{transform:translateX(18px)}
.rap-sw input:focus-visible+.rap-sw-i{box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.rap-dests{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.rap-dest{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:4px 12px 4px 5px;border:1px solid var(--txt3);border-radius:999px;background:var(--fond2);cursor:pointer;max-width:100%;transition:border-color .2s,opacity .2s}
.rap-dest:hover{border-color:var(--accent)}
.rap-dest>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rap-dest.off{opacity:.55;border-style:dashed;background:none}
.rap-dest.off>span:not(.rap-av){text-decoration:line-through}
.rap-av{width:24px;height:24px;border-radius:50%;background:var(--txt);color:var(--carte);display:grid;place-items:center;font-size:11px;font-weight:700;flex:none}
.rap-dest.off .rap-av{background:var(--txt3)}
.rap-aj{display:flex;gap:8px;align-items:flex-end;max-width:520px;margin-bottom:6px}
.rap-aj .fld{flex:1;margin:0;min-width:0}
.rap-aj .btn{min-height:44px;flex:none}
.rap-aj .inp{min-height:44px}
.rap-sans{margin:0}
.rap-go{padding-top:18px}
.rap-lancer{min-height:44px;padding:10px 22px;font-size:14.5px;font-weight:600}
.rap-ko{color:color-mix(in srgb,var(--rouge) 80%,var(--txt))}
.rap-cote{display:grid;gap:14px}
.rap-bloc{border:1px solid var(--bord);border-radius:var(--r);background:var(--carte);padding:16px 18px}
.rap-bloc .rap-h{margin-bottom:12px}
.rap-auto{display:flex;gap:8px;align-items:flex-start;margin-bottom:8px}
.rap-auto .dot{margin-top:6px;flex:none}
.rap-ligne{color:var(--txt2);margin-top:4px}
.rap-plus{margin:14px 0 0}
.rap-liste{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.rap-li{display:flex;gap:12px;align-items:flex-start;padding:8px 10px;border-radius:10px;color:var(--txt);transition:background-color .2s}
a.rap-li:hover{background:var(--fond2)}
.rap-li.rap-att{opacity:.75}
.rap-li-t{display:flex;flex-direction:column;min-width:0;gap:1px}
.rap-li-t b{font-size:13px}
.rap-pdf{flex:none;width:36px;height:40px;border-radius:6px;display:grid;place-items:center;font-size:10px;font-weight:800;letter-spacing:.03em;color:var(--accent-t);background:var(--accent-f);border:1px solid color-mix(in srgb,var(--accent) 30%,var(--bord))}
.tv-sous{margin:20px 0 6px;font-size:14px;color:var(--txt);text-transform:none;letter-spacing:0;font-weight:700}
@media (prefers-reduced-motion:reduce){.rap-don,.rap-sw-i,.rap-sw-i::after,.rap-dest,.rap-li,.seg-tabs .tab.seg{transition:none}}
@media (max-width:900px){.rap-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:560px){.rap-form{padding:16px}.rap-etape{grid-template-columns:minmax(0,1fr);gap:8px}.rap-aj{flex-direction:column;align-items:stretch}.rap-lancer{width:100%;justify-content:center}}
.rap-seg .tab.seg{background:none;cursor:pointer}
.rap-seg .tab.seg.on{background:var(--carte)}
.rap-seg .tab.seg:not(.on){border:0;box-shadow:none;background:none}
.rap-seg .tab.seg:not(.on):hover{background:color-mix(in srgb,var(--txt) 6%,transparent)}

/* Réglages → Mon téléphone (3CX) : application ou navigateur (PWA), choix de chaque technicien */
.tel-modes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:10px;margin-bottom:12px}
.tel-mode{display:flex;gap:12px;align-items:flex-start;min-height:44px;padding:12px 14px;border:1px solid var(--bord);border-radius:10px;background:var(--carte);cursor:pointer;transition:border-color .2s,background-color .2s}
.tel-mode:hover{border-color:color-mix(in srgb,var(--accent) 55%,var(--bord))}
.tel-mode:has(input:checked){border-color:var(--accent);background:var(--accent-f)}
.tel-mode:has(input:focus-visible){box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 30%,transparent)}
.tel-mode input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--accent);flex:none}
.tel-mode>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.tel-ko{color:color-mix(in srgb,var(--orange) 85%,var(--txt));margin:0 0 10px}
@media (prefers-reduced-motion:reduce){.tel-mode{transition:none}}
.tel-test{min-height:44px;max-width:100%;white-space:normal;text-align:left}

/* Bulle rouge en bas à droite : messages non lus de la messagerie (sans aperçu) ; rouge = « non lu » */
.chat-bulle{position:fixed;right:20px;bottom:calc(env(safe-area-inset-bottom,0px) + 20px);z-index:46;width:56px;height:56px;border-radius:50%;border:0;display:grid;place-items:center;background:var(--danger);color:var(--blanc);box-shadow:var(--ombre-f);cursor:pointer;transition:transform .2s,background-color .2s}
.chat-bulle svg{width:26px;height:26px}
.chat-bulle:hover{background:var(--danger-d);transform:translateY(-2px)}
.chat-bulle:focus-visible{outline:none;box-shadow:var(--ombre-f),0 0 0 3px var(--carte),0 0 0 6px var(--danger)}
.chat-bulle-n{position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:var(--carte);color:color-mix(in srgb,var(--danger) 60%,var(--txt));border:2px solid var(--danger);font-size:11.5px;font-weight:800;line-height:18px;text-align:center}
.chat-bulle.arrive{animation:chat-bulle-arrive .6s ease}
@keyframes chat-bulle-arrive{0%{transform:scale(.6)}50%{transform:scale(1.15)}100%{transform:scale(1)}}
body.avec-bulle .pres-vu{right:90px;max-width:calc(100% - 110px)}
@media (prefers-reduced-motion:reduce){.chat-bulle,.chat-bulle.arrive{transition:none;animation:none}}
@media print{.chat-bulle{display:none}}
@media (max-width:760px){.chat-bulle{z-index:36}}
.mt-go{min-height:44px}
@media (max-width:560px){.mt-go{flex:1 1 140px;justify-content:center}}

/* E-mail non distribué (retour de la boîte noreply) : alerte en tête de page — rouge = échec */
.mail-ko-z{display:grid;gap:8px;margin-bottom:12px}
.mail-ko{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 14px;border:1px solid color-mix(in srgb,var(--rouge) 40%,var(--bord));border-left:4px solid var(--danger);border-radius:10px;background:var(--rouge-f);color:var(--txt)}
.mail-ko b{color:color-mix(in srgb,var(--danger) 70%,var(--txt))}
.mail-ko span{flex:1 1 260px;min-width:0;overflow-wrap:anywhere}
.mail-ko .btn{min-height:44px;flex:none}.av-nr-mail{flex:1 1 100%;min-width:0;margin:0}
.rw-tk{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
.rw-tkn{font-size:12.5px;color:var(--txt2)}
.rw-tk .pastille{flex:none;padding:0 7px;font-size:11px;line-height:16px}

/* Agenda : créneaux fermés aux rendez-vous (avant 9 h, pause 12 h – 14 h) */
.ag-off{position:absolute;left:0;right:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(135deg,color-mix(in srgb,var(--txt) 7%,transparent) 0 6px,transparent 6px 12px),color-mix(in srgb,var(--txt) 4%,transparent)}
.ag .ev{z-index:1}
.ag-fantome.ko{border-style:dashed;border-color:var(--txt3);background:color-mix(in srgb,var(--txt) 8%,transparent);color:var(--txt3);cursor:not-allowed}.av-nr-b{flex:1 1 100%;min-width:0}
.av-nr-b .btn{flex:0 1 auto;min-height:44px;white-space:normal;text-align:center;justify-content:center}
@media (max-width:480px){.av-nr-b .btn{flex:1 1 100%}}
/* bandeau « Appel en cours » affiché en tête de toutes les pages (comme sur le tableau de bord) */
.content>.dash-appel{margin-bottom:14px}

/* Agenda : rendez-vous « toute la journée » en bande au-dessus des heures */
.ag-jr-l{display:flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:700;text-transform:none;letter-spacing:0;padding:0 2px;color:var(--txt3);border-bottom:1px solid var(--bord);background:var(--fond2)}
.ag-jr{display:flex;flex-direction:column;gap:3px;padding:4px;border-left:1px solid var(--bord2);border-bottom:1px solid var(--bord);background:var(--fond2);min-width:0}
.ag-jr-ev{display:flex;flex-direction:column;align-items:flex-start;width:100%;min-width:0;padding:3px 7px;border:0;border-left:3px solid var(--violet);border-radius:6px;background:var(--violet-f);color:color-mix(in srgb,var(--violet) 80%,var(--txt));font:inherit;font-size:11.5px;text-align:left;cursor:pointer;transition:filter .2s}
.ag-jr-ev.t-conge{border-color:var(--txt3);background:var(--carte);color:var(--txt2)}
.ag-jr-ev b,.ag-jr-ev span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ag-jr-ev span{opacity:.8;font-size:10.5px}
.ag-jr-ev:hover{filter:brightness(.97)}
.ag-jr-ev:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.agv-jour{display:flex;gap:10px;align-items:flex-start;min-height:44px;margin:0 0 12px;padding:10px 12px;border:1px solid var(--bord);border-radius:10px;cursor:pointer}
.agv-jour:has(input:checked){border-color:var(--accent);background:var(--accent-f)}
.agv-jour input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--accent);flex:none}
.agv-jour>span{display:flex;flex-direction:column;gap:2px}
.agv-off{opacity:.45}
@media (pointer:coarse){.ag-jr-ev{min-height:44px;justify-content:center}}
@media (prefers-reduced-motion:reduce){.ag-jr-ev{transition:none}}
.agv-jour:has(input:focus-visible){border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent)}

/* Fiche Remote : journal fusionné avec l'historique du ticket intranet ; état du ticket modifiable */
.jr-hd{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:8px}
.jr-etat{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;min-width:0;max-width:100%}
.jr-etat .inp{width:auto;max-width:100%;min-height:36px;padding:4px 8px}
.jr-l{padding:6px 0;border-bottom:1px solid var(--bord2)}
.jr-intra{padding-left:10px;border-left:3px solid color-mix(in srgb,var(--accent) 55%,var(--bord))}
.jr-src{display:inline-block;margin-left:4px;padding:0 6px;border-radius:999px;background:var(--accent-f);color:var(--accent-t);font-size:10.5px;font-weight:700}
@media (pointer:coarse){.jr-etat .inp{min-height:44px}}
/* bascule « Remote / Ticket » en tête des fiches */
.seg-tabs.vue-bascule{margin:0;padding:3px}
.vue-bascule .tab.seg{min-height:36px;background:none;cursor:pointer}
.vue-bascule .tab.seg.on{background:var(--carte)}
@media (pointer:coarse){.vue-bascule .tab.seg{min-height:44px}}
/* En-tête des fiches Remote / Ticket : boutons, bascule, étiquettes et état à la même hauteur, mêmes arrondis, même texte */
.hd-fiche{align-items:center;gap:8px}
.hd-fiche>.btn,.hd-fiche>.src,.hd-fiche>.cp-val,.hd-fiche>.badge,.hd-fiche>.pastille,.hd-fiche>.vue-bascule{box-sizing:border-box;height:36px;border-radius:6px;font-size:13px;font-weight:600;vertical-align:middle}
.hd-fiche>.badge,.hd-fiche>.pastille{border-radius:999px}
.hd-fiche>.btn{padding:0 12px}
.hd-fiche>.tk-etoile.grand{min-height:0}
.hd-fiche>.src,.hd-fiche>.badge,.hd-fiche>.pastille{display:inline-flex;align-items:center;padding:0 12px;line-height:1}
.hd-fiche>.src{font-size:11.5px;letter-spacing:.05em;background:var(--fond2);border-color:var(--bord2)}
.hd-fiche>.cp-val{height:auto;min-height:36px;padding:0 2px 0 12px;border:1px solid var(--bord2);background:var(--fond2);color:var(--txt2)}
.hd-fiche>.cp-val .mono,.hd-fiche>.cp-val.mono{font-size:13px}
.hd-fiche>.cp-val .cp{width:30px;height:30px}
.hd-fiche>.vue-bascule{display:inline-flex;align-items:center;gap:2px;padding:3px}
.hd-fiche>.vue-bascule .tab.seg{min-height:0;height:28px;padding:0 12px;border-radius:4px;font-size:13px}
@media (pointer:coarse){
  .hd-fiche>.btn,.hd-fiche>.src,.hd-fiche>.badge,.hd-fiche>.pastille,.hd-fiche>.vue-bascule{height:44px}
  .hd-fiche>.cp-val{min-height:44px}
  .hd-fiche>.vue-bascule .tab.seg{height:38px}
  .hd-fiche>.cp-val .cp{width:38px;height:38px}
}
/* Messagerie sans conversation ouverte : conversations et contacts sur toute la largeur (pas de case vide) */
.chat.sans-fil{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:none}
.chat.sans-fil .chat-liste,.chat.sans-fil .chat-contacts{grid-column:auto;grid-row:auto;max-height:none}
@media (max-width:760px){.chat.sans-fil{grid-template-columns:1fr}}

/* =====================================================================
   COMPATIBILITÉ — écrans existants du CRM Autech Expert (24/10/2026)
   ---------------------------------------------------------------------
   Au-dessus : feuille de style identique à C:\RemoteExpert\site\app.css.
   Ci-dessous : les écrans déjà construits dans crm\resources\views utilisent
   encore d'anciens noms de classe (.button, .card, .table, .stat-card…),
   posés avant la décision de Guillaume du 24/10 au soir. Pour que CHAQUE
   écran existant rende EXACTEMENT comme Remote sans attendre la réécriture
   de chaque vue, ces anciennes classes sont ici habillées avec les mêmes
   variables/valeurs que les classes Remote équivalentes.
   RÈGLE POUR LES DÉVELOPPEURS (voir design/CHARTE-REMOTE.md) : plus aucune
   classe ci-dessous ne doit être utilisée dans du code NEUF — toujours les
   classes Remote d'origine (.btn, .card, .badge .st-xxx, table nu dans un
   .tblw, etc.). Au fur et à mesure qu'un écran est réécrit (tâches
   « Reconstruire à l'identique »), ses anciennes classes sont retirées du
   blade ET de cette section peut être allégée quand plus personne n'en a besoin.
   ===================================================================== */

/* Authentification (resources/views/auth/*, components/guest-layout) */
.auth-page{background:var(--nav);min-height:100vh}
.auth-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;gap:48px;max-width:1100px;margin:auto;padding:32px;flex-wrap:wrap}
.auth-brand{color:var(--nav-txt);max-width:480px}
.auth-brand h1{font-size:clamp(28px,4vw,40px);font-weight:800;letter-spacing:-.02em}
.auth-brand p{color:var(--nav-txt2);font-size:15px;line-height:1.55}
.auth-brand .eyebrow{color:color-mix(in srgb,var(--accent) 55%,var(--nav-txt))}
.auth-card{background:var(--carte);border:1px solid var(--bord);border-radius:16px;box-shadow:var(--ombre-f);padding:32px;max-width:420px;width:100%}
.brand-mark{display:grid;place-items:center;width:52px;height:52px;margin-bottom:18px;border-radius:12px;background:var(--accent);color:var(--blanc);font-weight:800;font-size:22px}
.brand-mark.small{width:40px;height:40px;margin:0;font-size:16px;border-radius:10px}
.eyebrow{margin:0 0 6px;text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:700;color:var(--accent-t)}
.form-stack{display:grid;gap:16px;margin-top:20px}
.form-stack label{display:block;margin-bottom:6px;font-size:12px;font-weight:600;color:var(--txt2)}
.form-stack input[type="email"],.form-stack input[type="password"],.form-stack input[type="search"]{width:100%;min-height:44px;padding:9px 12px;border:1px solid var(--bord);border-radius:6px;color:var(--txt);background:var(--carte)}
.form-stack input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent)}
.checkbox-row{display:flex;align-items:center;gap:8px;min-height:32px;margin:0;font-weight:500;color:var(--txt2)}
.checkbox-row input{width:18px;height:18px;accent-color:var(--accent)}
.field-error{color:var(--danger);margin:6px 0 0;font-size:12.5px}
.text-link{display:inline-block;min-height:44px;padding-top:10px;font-weight:600;color:var(--accent-t)}

/* Boutons, cartes, badges, tableaux (toutes les vues) */
.button{min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:6px;padding:7px 14px;border:1px solid var(--bord);background:var(--carte);color:var(--txt);font-weight:600;cursor:pointer;transition:background-color .2s,border-color .2s}
.button:hover{border-color:var(--txt3)}
.button-primary{background:var(--accent);border-color:var(--accent);color:var(--blanc)}
.button-primary:hover{background:var(--accent-d);border-color:var(--accent-d)}
.button-secondary{background:var(--carte);color:var(--txt);border-color:var(--bord)}
.button.compact,.button.btn.compact{min-height:36px;padding:4px 12px;font-size:12.5px}
.button.danger,a.button.danger{color:var(--danger);border-color:color-mix(in srgb,var(--danger) 45%,var(--bord))}
.button.danger:hover{background:var(--rouge-f)}
.button:disabled{opacity:.45;cursor:not-allowed}

.card{background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);padding:20px;box-shadow:var(--ombre-c)}
.card+.card{margin-top:16px}

table.table{width:100%;border-collapse:collapse;background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);overflow:hidden}
table.table th,table.table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--bord2)}
table.table th{background:var(--fond2);font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--txt3);font-weight:600}
table.table tr:last-child td{border-bottom:0}
table.table tr:hover td{background:var(--fond2)}

.badge{display:inline-flex;align-items:center;gap:4px;padding:2px 10px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap}
.badge-success{background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt))}
.badge-danger{background:var(--rouge-f);color:color-mix(in srgb,var(--rouge) 80%,var(--txt))}
.badge-info{background:var(--bleu-f);color:color-mix(in srgb,var(--bleu) 85%,var(--txt))}
.badge-warning{background:var(--orange-f);color:color-mix(in srgb,var(--orange) 85%,var(--txt))}
.badge-muted{background:var(--fond2);color:var(--txt3);box-shadow:inset 0 0 0 1px var(--bord)}
.badge-jaune{background:color-mix(in srgb,var(--jaune) 18%,transparent);color:var(--jaune)}

.alert{border-radius:6px;padding:10px 14px;font-size:13px;margin-bottom:12px;background:var(--orange-f);color:color-mix(in srgb,var(--orange) 75%,var(--txt));border-left:4px solid var(--orange)}
.alert-success{background:var(--vert-f);color:color-mix(in srgb,var(--vert) 75%,var(--txt));border-left-color:var(--vert)}
.alert-info{background:var(--bleu-f);color:var(--bleu);border-left-color:var(--bleu)}

/* Mise en page des contenus (page-heading, stats, formulaires, assistants) */
.page-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:24px;flex-wrap:wrap}
.page-heading h1{font-size:22px}
.empty-state{max-width:760px;padding:40px;text-align:center;border:1px dashed var(--bord);border-radius:var(--r);background:var(--carte)}
.empty-icon{display:grid;place-items:center;width:48px;height:48px;margin:0 auto 16px;border-radius:50%;background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt));font-size:1.3rem;font-weight:800}
.actions-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.search-form{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.search-form input[type="search"]{min-width:240px;margin:0}
.fiche-liste{display:grid;grid-template-columns:150px 1fr;gap:8px 14px;margin:0;font-size:13.5px}
.fiche-liste dt{font-weight:600;color:var(--txt3)}
.fiche-liste dd{margin:0}
.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin-bottom:20px}
.stat-card{background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);padding:14px 18px;box-shadow:var(--ombre-c)}
.stat-card .stat-value{display:block;font-size:26px;font-weight:800;color:var(--txt)}
.stat-card .stat-label{color:var(--txt3);font-size:12px}
.wizard-steps{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}
.wizard-steps .step-pill{padding:5px 12px;border-radius:999px;background:var(--fond2);color:var(--txt3);font-weight:600;font-size:12.5px}
.wizard-steps .step-pill.is-current{background:var(--accent);color:var(--blanc)}
.wizard-step h2{font-size:17px}
.wizard-nav{display:flex;justify-content:space-between;margin-top:8px}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px 18px}
.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--bord);border:1px solid var(--bord);border-radius:var(--r);overflow:hidden}
.calendar-grid .calendar-head{background:var(--fond2);padding:8px;text-align:center;font-size:11.5px;font-weight:600;text-transform:uppercase;color:var(--txt3)}
.calendar-grid .calendar-cell{background:var(--carte);min-height:100px;padding:8px}
.calendar-grid .calendar-cell.is-outside{background:var(--fond2);color:var(--txt3)}
.calendar-grid .calendar-cell .day-number{font-weight:600;font-size:12.5px;margin-bottom:6px}
.calendar-event{display:block;margin-bottom:4px;padding:3px 6px;border-radius:4px;background:var(--rouge-f);color:var(--danger);font-size:11.5px;font-weight:600;text-decoration:none}
.week-block{margin-bottom:18px}
.week-block h3{font-size:14px;margin-bottom:8px;color:var(--txt)}
.offline-section{margin-top:24px}
.offline-cards,.liaisons-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px}
.offline-card,.liaison-card{background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);padding:16px;box-shadow:var(--ombre-c)}
.offline-card p{margin:5px 0;color:var(--txt2)}
.pwa-status{flex:none;padding:6px 12px;border-radius:999px;background:var(--vert-f);color:color-mix(in srgb,var(--vert) 80%,var(--txt));font-size:11.5px;font-weight:700}
.pwa-status.offline{background:var(--rouge-f);color:color-mix(in srgb,var(--rouge) 80%,var(--txt))}
.pwa-status.pending{background:var(--orange-f);color:color-mix(in srgb,var(--orange) 85%,var(--txt))}
.search-resultats{position:absolute;top:calc(100% + 6px);left:0;max-width:520px;width:100%;background:var(--carte);border:1px solid var(--bord);border-radius:var(--r);box-shadow:var(--ombre-f);list-style:none;margin:0;padding:6px;z-index:50}
.search-resultats li a{display:block;padding:8px 10px;border-radius:6px;color:var(--txt);text-decoration:none}
.search-resultats li a:hover{background:var(--fond2)}

@media (max-width:760px){
  .auth-shell{padding:20px 16px}
  .auth-card{padding:24px 20px}
  .page-heading{flex-direction:column}
  .offline-cards,.liaisons-grid{grid-template-columns:1fr}
  .stat-grid{grid-template-columns:1fr 1fr}
}

/* Portail Salons : grille calendrier desktop / agenda vertical mobile (écart B de la spec). */
.calendrier-table{width:100%;border-collapse:collapse}
.calendrier-table th,.calendrier-table td{border:1px solid var(--bord);padding:6px;vertical-align:top}
.cal-agenda-mobile{display:none}
@media (max-width:760px){
  .cal-grille{display:none}
  .cal-agenda-mobile{display:block}
}
/* Planning équipe (écart B) : tableau timeline tech-co x jours. */
.planning-table{width:100%;border-collapse:collapse;font-size:12.5px}
.planning-table th,.planning-table td{border:1px solid var(--bord);padding:4px 6px;text-align:center;white-space:nowrap}
.planning-table td.conflit{background:var(--rouge-f);font-weight:700;color:var(--rouge)}
/* Logistique : mini Gantt matériel 12 semaines (écart F). */
.gantt-ligne{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.gantt-barre{height:16px;border-radius:4px;background:var(--accent-f)}
.gantt-barre.surreservation{background:var(--rouge-f);outline:1px solid var(--rouge)}