:root{
  --bg:#f4f6f8; --panel:#ffffff; --ink:#1a1d21; --muted:#6b7280;
  --line:#e5e7eb; --line-soft:#eef1f4; --border:#e5e7eb;
  --brand:#e2001a; --brand-soft:#fdebed; --orange:#f39200;
  --good:#0a8f5b; --good-soft:#e7f6ef; --danger:#dc2626;
  --radius:11px;
  --shadow:0 1px 2px rgba(20,20,25,.05);
  --shadow-lg:0 1px 2px rgba(20,20,25,.05),0 8px 26px rgba(20,20,25,.07);
  --font:'IBM Plex Sans',system-ui,'Segoe UI',Roboto,Arial,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:var(--font);color:var(--ink);background:var(--bg);font-size:14px;line-height:1.5}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.num{font-family:var(--font);font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}

/* ---- Boutons ---- */
.btn{display:inline-flex;align-items:center;gap:8px;justify-content:center;padding:9px 15px;border:1px solid transparent;border-radius:9px;background:var(--brand);color:#fff;font-weight:600;cursor:pointer;font-size:13px;font-family:var(--font);transition:filter .15s}
.btn:hover{filter:brightness(.94);text-decoration:none}
.btn.ghost{background:#fff;color:#3b4149;border-color:var(--line)}
.btn.ghost:hover{background:#f8fafc;filter:none}
.btn.danger{background:var(--danger)}
.btn.sm{padding:6px 12px;font-size:12.5px}
.btn.block{width:100%}

/* ================= Shell bureau — barre à deux niveaux ================= */
.app{min-height:100vh;display:flex;flex-direction:column}

/* Barre unique : logo + onglets + recherche + compte */
.brandbar{display:flex;align-items:stretch;gap:14px;padding:0 22px;height:82px;background:#fff;border-bottom:1px solid var(--line)}
.brandbar .logo{display:flex;align-items:center;height:100%;margin-right:20px}
.brandbar .logo img{height:56px;width:auto;display:block}
.brandbar .logo a{display:inline-flex;align-items:center}
.brandbar .sp{flex:1}
.brandbar .gs{align-self:center;display:flex;align-items:center;gap:8px;background:#f4f6f8;border:1px solid #e7e9ee;border-radius:9px;padding:0 12px;min-width:220px}
.brandbar .gs input{border:none;background:transparent;padding:9px 2px;font-size:13px;font-family:var(--font);width:100%;outline:none;color:var(--ink)}
.brandbar .who{align-self:center;display:flex;align-items:center;gap:12px;font-size:12.5px}
.brandbar .who .nm{color:#3b4149;font-weight:600;line-height:1.2}
.brandbar .who .rl{color:#9aa0a6;font-size:11.5px}
.brandbar .av{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--brand),var(--orange));color:#fff;display:grid;place-items:center;font-size:13px;font-weight:700}

/* Onglets modules (dans la barre) */
.tabs{display:flex;align-items:stretch;gap:2px;height:100%;flex-wrap:wrap}
.tabs > a,.tabs .menu > a{display:flex;align-items:center;gap:6px;padding:0 15px;height:100%;color:#61686f;font-size:15px;font-weight:500;text-decoration:none;border-bottom:2px solid transparent;white-space:nowrap;cursor:pointer}
.tabs > a:hover,.tabs .menu > a:hover{color:var(--ink);text-decoration:none}
.tabs > a.on,.tabs .menu > a.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
/* Pastille rouge en exposant (legacy notify-bubble) : devis à valider, missions à facturer. */
.tabs .bubble{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;margin:0 0 14px -2px;border-radius:9px;background:#e2001a;color:#fff;font-size:11px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums}
/* Menu déroulant */
.tabs .menu{position:relative}
.tabs .menu > a::after{content:'▾';font-size:10px;color:#9aa0a6;margin-left:1px}
.tabs .menu .drop{display:none;position:absolute;top:100%;left:0;min-width:210px;background:#fff;border:1px solid var(--line);border-top:none;border-radius:0 0 10px 10px;box-shadow:0 10px 26px rgba(20,20,25,.12);padding:6px;z-index:40}
.tabs .menu:hover .drop{display:block}
.tabs .menu .drop a{display:block;padding:9px 12px;border-radius:7px;color:#4b5259;font-size:13px;font-weight:500;border:none;height:auto;text-decoration:none}
.tabs .menu .drop a:hover{background:#f4f6f8;color:var(--ink)}
.tabs .menu .drop a.on{color:var(--brand);font-weight:600;background:var(--brand-soft)}
.tabs .env{align-self:center;font-family:var(--mono);font-size:11px;color:#98a0a8;background:#fff;border:1px solid var(--line);border-radius:999px;padding:3px 11px;white-space:nowrap}

/* Contenu — largeur maîtrisée et centrée (évite l'étirement sur grands écrans).
   .wide = pleine largeur (dashboard). */
.content{padding:22px 26px;width:100%;max-width:1400px;margin:0 auto}
.content.wide{max-width:none}
@media(max-width:900px){.content{padding:16px}}
@media(max-width:760px){.content{padding:12px}.tabs{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch}}
.phead{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px;flex-wrap:wrap}
.phead .crumb{font-size:12px;color:#9aa0a6;font-family:var(--mono);margin-bottom:3px}
.phead h1{margin:0;font-size:20px;font-weight:600;letter-spacing:-.01em}
.phead h1 .cnt{font-size:14px;color:#9aa0a6;font-weight:500}

/* ---- Sous-onglets (navigation secondaire dans une section) ---- */
.subtabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:0 0 18px}
.subtabs a{display:inline-flex;align-items:center;padding:9px 14px;color:#61686f;font-size:13.5px;font-weight:500;text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px}
.subtabs a:hover{color:var(--ink);text-decoration:none}
.subtabs a.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}

/* ---- Cartes ---- */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.card .card-body{padding:18px}
.grp-title{font-weight:600;margin:22px 0 10px;font-size:15px}
.sub{color:var(--muted);font-size:13px;margin:4px 0}

/* ---- Files d'attente (tableau de bord) : 3 colonnes remplissant la hauteur ---- */
.dash3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;height:calc(100vh - 186px);align-items:stretch}
.dash3 .dcol{display:flex;flex-direction:column;gap:16px;min-height:0}
.dash3 .dcol .queue{flex:1;min-height:0}
@media(max-width:1100px){.dash3{grid-template-columns:1fr;height:auto}.dash3 .dcol .queue{flex:none}.queue .qlist{max-height:60vh}}
.queues{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:16px}
.queue{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;display:flex;flex-direction:column}
.queue .qhead{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid var(--line-soft);font-weight:600}
.queue .qhead .cnt{font-family:var(--mono);font-size:13px;font-weight:700;color:#fff;background:var(--brand);border-radius:999px;padding:2px 10px;min-width:26px;text-align:center}
.queue .qhead .cnt.zero{background:#cfd4da}
.queue .qlist{flex:1;min-height:0;overflow:auto}
.queue .qitem{display:block;padding:11px 14px;border-bottom:1px solid #f0f1f4;text-decoration:none;color:var(--ink)}
.queue .qitem:last-child{border-bottom:none}
.queue .qitem:hover{background:#fcfcfd;text-decoration:none}
.queue .qitem .qtop{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:5px}
.queue .qitem .qtop b{font-size:13.5px;color:#0275d8}
.queue .qitem .qtop .qid{font-family:var(--mono);color:#0275d8;font-size:12px;font-weight:600}
.queue .qitem .act{font-size:10.5px;font-weight:700;color:#fff;border-radius:5px;padding:3px 10px;white-space:nowrap;text-transform:uppercase;letter-spacing:.03em}
.queue .qitem .act.facturer{background:var(--brand)}
.queue .qitem .act.deviser{background:var(--orange)}
.queue .qitem .qline{display:flex;gap:8px;font-size:12.5px;color:#6b7280;padding:1px 0;align-items:baseline}
.queue .qitem .qline .ic{width:16px;flex:none;text-align:center;opacity:.85}
/* Liste de cartes « modèle tableau de bord » hors du tableau de bord (pages Devis et Facturation, Antonio 04/10/2026) : la
   classe .queue apporte toutes les tailles des cartes ; .queue-liste retire l'ombre, laisse défiler la liste dans sa hauteur
   maximale et empêche les cartes de se tasser. Les pastilles restent groupées à droite. */
.queue.queue-liste{box-shadow:none;overflow:auto;gap:0}
.queue.queue-liste > .qitem{flex:none}
.queue.queue-liste .qbadges{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.queue .qempty{padding:26px;text-align:center;color:var(--muted);font-size:13px}

/* ---- KPI (tableau de bord) ---- */
.kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.kpi .card .card-body{padding:15px 16px}
.kpi .l{font-size:11.5px;color:#8a9098;text-transform:uppercase;letter-spacing:.05em;font-weight:600}
.kpi .n{font-size:25px;font-weight:600;margin-top:7px;letter-spacing:-.01em}

/* ---- Tables ---- */
.tbl-wrap{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.tbl-scroll{overflow-x:auto}
table.tbl{width:100%;border-collapse:collapse}
table.tbl th{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:#8a929c;text-align:left;padding:11px 16px;font-weight:600;background:#fafbfc;border-bottom:2px solid #dfe3e9}
table.tbl td{padding:11px 16px;border-bottom:1px solid #e4e7ec;font-size:13.5px}
table.tbl tbody tr:last-child td{border-bottom:none}
table.tbl tbody tr.clickable{cursor:pointer}
table.tbl tbody tr:hover{background:#fcfcfd}
table.tbl td a{color:var(--ink);font-weight:500}
table.tbl td a:hover{color:var(--brand)}
table.tbl td .id{font-family:var(--mono);color:#a7abb1;font-size:12px}

/* ---- Barre d'outils / recherche ---- */
.tbar{display:flex;align-items:center;gap:10px;padding:11px 14px;border-bottom:1px solid var(--line-soft);background:#fff}
.tbar input[type=text],.tbar input:not([type]){flex:1;min-width:200px;padding:8px 12px;border:1px solid var(--line);border-radius:8px;font-size:13px;font-family:var(--font)}
.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.toolbar input[type=text],.toolbar input:not([type]){flex:1;min-width:220px;padding:9px 12px;border:1px solid var(--line);border-radius:9px;font-size:14px;font-family:var(--font)}

/* ---- Pagination simple ---- */
.pager{display:flex;align-items:center;gap:12px;justify-content:flex-end;margin-top:14px;font-size:13px;color:var(--muted)}
.pager a,.pager span.cur{display:inline-flex;align-items:center;padding:6px 12px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink)}
.pager a:hover{background:#f8fafc;text-decoration:none}
.pager .disabled{opacity:.4;pointer-events:none}
.pager a.cur{background:var(--brand);color:#fff;border-color:var(--brand);font-weight:600}
/* En-têtes de tableau triables (listes façon DataTables) */
.tbl.datatable thead th a{color:inherit;text-decoration:none;cursor:pointer;white-space:nowrap}
.tbl.datatable thead th a:hover{color:var(--brand)}
/* Modale (création rapide par-dessus la page) */
.modal-overlay{position:fixed;inset:0;background:rgba(20,20,25,.45);display:flex;align-items:flex-start;justify-content:center;z-index:100;padding:48px 16px;overflow:auto}
.modal-overlay[hidden]{display:none}
.modal-card{background:#fff;border-radius:14px;box-shadow:0 24px 64px rgba(0,0,0,.32);padding:26px 30px;width:100%;max-width:760px;position:relative}
.modal-x{position:absolute;top:14px;right:16px;width:28px;height:28px;border-radius:50%;border:none;background:#2b8cf0;color:#fff;cursor:pointer;font-size:14px;line-height:1;display:grid;place-items:center}
.modal-x:hover{background:#1f7ad6}

/* ---- Fiche (paires clé/valeur) ---- */
table.kv{width:100%;border-collapse:collapse}
table.kv th{text-align:left;width:200px;padding:9px 10px;color:var(--muted);font-weight:600;vertical-align:top}
table.kv td{padding:9px 10px}
.crumb{font-size:12px;color:#9aa0a6;font-family:var(--mono);margin-bottom:6px}

/* ---- Formulaires ---- */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 18px;max-width:860px}
.form-grid .fld.full{grid-column:1/-1}
.form-grid.wide{max-width:none}
@media(max-width:640px){.form-grid{grid-template-columns:1fr}}
.form-actions{display:flex;gap:10px;align-items:center;padding:16px;border-top:1px solid var(--line-soft);flex-wrap:wrap}
.fld{margin-bottom:14px}
.fld label{display:block;font-weight:600;font-size:13px;margin-bottom:5px}
.fld input,.fld select,.fld textarea{width:100%;padding:9px 11px;border:1px solid var(--line);border-radius:9px;font-size:14px;background:#fff;font-family:var(--font)}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px rgba(226,0,26,.12)}
.req{color:var(--danger)}

/* ---- Alertes / pills ---- */
.alert{padding:11px 14px;border-radius:9px;margin-bottom:16px;font-size:13px}
.alert.error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}
.alert.ok{background:var(--good-soft);color:#065f46;border:1px solid #a7f3d0}
.pill{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:600}
.pill.on,.pill.pep,.pill.ok{background:var(--good-soft);color:var(--good)}
.pill.syn{background:var(--brand-soft);color:var(--brand)}
.pill.info{background:#e8f1fd;color:#1a6fd4}
.pill.amber{background:#fbf1de;color:#b06d00}
.pill.off{background:#eef0f2;color:#6b7280}
.pill.bad{background:#fde8e6;color:#c0392b}

/* Fiche document en 2 parties : infos/actions à gauche, document à droite (comme legacy) */
.doc-show{display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:20px;align-items:start}
.doc-show-doc{position:sticky;top:16px}
@media(max-width:1000px){.doc-show{grid-template-columns:1fr}.doc-show-doc{position:static}}

/* ================= Visionneur PDF (PDF.js) ================= */
.pdfv{background:#eef1f4;border:1px solid var(--line);border-radius:var(--radius);padding:18px;display:flex;flex-direction:column;align-items:center;gap:16px;max-height:80vh;overflow:auto}
.pdfv .pdfv-page{width:100%;max-width:820px;height:auto;background:#fff;border-radius:3px;box-shadow:0 1px 3px rgba(20,20,25,.12),0 10px 28px rgba(20,20,25,.10)}
.pdfv .pdfv-msg{color:var(--muted);padding:28px;text-align:center}
.pdfv .pdfv-loading{color:var(--muted);padding:28px;text-align:center;font-size:13px}

/* ================= Login ================= */
.auth-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;background:linear-gradient(135deg,#161d27,#1f2836)}
.auth-card{width:100%;max-width:390px;background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(0,0,0,.4);overflow:hidden}
.auth-head{padding:30px 30px 6px;text-align:center}
.auth-head .logo{height:44px;width:auto}
.auth-head .sub{color:var(--muted);margin-top:12px}
.auth-body{padding:16px 30px 30px}

/* --- Menu Administration (burger + tiroir latéral) --- */
.burger{background:#fff;border:1px solid var(--line);border-radius:9px;width:38px;height:38px;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:15px;color:var(--ink);flex:none}
.burger:hover{background:#f4f6f8}
.burger.on{border-color:var(--brand);color:var(--brand)}
.admin-ov{position:fixed;inset:0;background:rgba(15,20,30,.35);opacity:0;pointer-events:none;transition:opacity .18s;z-index:80}
.admin-ov.open{opacity:1;pointer-events:auto}
.admin-drawer{position:fixed;top:0;right:-310px;width:290px;height:100vh;background:#fff;box-shadow:-8px 0 30px rgba(0,0,0,.14);z-index:81;transition:right .2s ease;display:flex;flex-direction:column}
.admin-drawer.open{right:0}
.ad-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);font-size:15px}
.ad-head b{display:flex;align-items:center;gap:10px}
.ad-close{background:none;border:none;font-size:16px;cursor:pointer;color:var(--muted);padding:4px 6px}
.ad-close:hover{color:var(--ink)}
.ad-nav{padding:10px;overflow:auto}
.ad-nav a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:9px;color:var(--ink);text-decoration:none;font-size:14px}
.ad-nav a i{width:18px;text-align:center;color:var(--muted)}
.ad-nav a:hover{background:#f4f6f8;text-decoration:none}
.ad-nav a.on{background:#fde8e6;color:var(--brand);font-weight:600}
.ad-nav a.on i{color:var(--brand)}
.ad-sep{height:1px;background:var(--line);margin:8px 4px}

/* ---- Classes communes sorties des pages (refonte visuelle, 15/09/2026) : mêmes valeurs que les anciens styles en ligne,
       restylées par ui2.css en nouvelle interface. ---- */
.brandbar .gs .gs-ic{display:none}
.brandbar .who .who-tenant{display:none}
.brandbar .logo-erp img{height:34px}
.phead-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.cnt-pill{background:#c0392b;color:#fff;font-size:11px}
.list-tools{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.list-tools .sp{flex:1}
.list-per{margin:0;font-size:13px;color:var(--muted)}
.list-per select{padding:5px 8px;border:1px solid var(--line);border-radius:7px;margin:0 4px;font-family:var(--font)}
.list-search{margin:0;min-width:280px;background:#f4f6f8;border:1px solid #e7e9ee;border-radius:9px;padding:0 12px;display:flex;align-items:center;position:relative}
.list-search .gs-ic{display:none}
.list-search input[type=text],.list-search input[type=search]{border:none;background:transparent;padding:8px 2px;font-size:13px;width:100%;outline:none;font-family:var(--font);color:var(--ink)}
.list-search .clear{color:var(--muted);text-decoration:none;padding-left:6px}
.list-filter{margin:0;display:flex;align-items:center;gap:6px;font-size:13px}
.list-filter > i{color:#0275d8}
.list-filter select{font-size:13px;padding:7px 8px;border:1px solid #e7e9ee;border-radius:9px;background:#f4f6f8;font-family:var(--font)}
.list-filter select.on{border-color:#0275d8;font-weight:600}
.flag{display:inline-block;width:22px;height:14px;border:1px solid #d5d9e0;border-radius:2px;vertical-align:middle}
.flag.fr{background:linear-gradient(90deg,#0055A4 33%,#fff 33% 66%,#EF4135 66%)}
.flag.nl{background:linear-gradient(180deg,#AE1C28 33%,#fff 33% 66%,#21468B 66%)}
.nowrap{white-space:nowrap}
.center{text-align:center}
.empty-row{padding:24px;text-align:center}
.pager.between{justify-content:space-between}
.pager .pages{display:flex;gap:4px;align-items:center}
.modal-actions{text-align:center;margin-top:16px}
.inline-fields{display:flex;gap:6px}
.inline-fields > input{flex:1}

/* ---- Tableau de bord (styles sortis de dashboard.blade.php / queue-card) ---- */
.phead.left{justify-content:flex-start}
.btn.good{background:#0a8f5b;border-color:#0a8f5b;color:#fff}
.dash-kpis{display:grid;grid-template-columns:repeat(var(--kpi-cols,4),1fr);gap:14px;margin-bottom:20px}
.dash-kpis .kpi{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 16px;text-decoration:none;color:inherit;box-shadow:0 1px 2px rgba(20,30,50,.04);transition:box-shadow .12s}
.dash-kpis .kpi:hover{box-shadow:0 3px 10px rgba(20,30,50,.09);text-decoration:none}
.dash-kpis .kpi-ico{width:44px;height:44px;border-radius:11px;display:flex;align-items:center;justify-content:center;font-size:20px;flex:none}
.dash-kpis .kpi-txt{display:flex;flex-direction:column;line-height:1.2}
.dash-kpis .kpi-txt b{font-size:24px;color:#111}
.dash-kpis .kpi-txt span{font-size:12.5px;color:var(--muted)}
@media (max-width:760px){.dash-kpis{grid-template-columns:1fr}}
.qtop{gap:8px}
.qbadges{display:inline-flex;align-items:center;gap:5px;flex:none;flex-wrap:wrap;justify-content:flex-end}
.bon-b{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;line-height:1;padding:4px 7px;border-radius:7px;white-space:nowrap}
.bon-b.montant{background:#e3f6ea;color:#0a7a44}
.bon-b.attest{background:#fde8e6;color:#c0392b}
.bon-b.devis{background:#fdecc8;color:#8a5a1e}
.bon-b.devisfait{background:#ede9fb;color:#4b2ca8}
.bon-b.acompte{background:#e8f1fb;color:#1a4fb0}
/* 05/10/2026 : « Bon » (envoi du bon demandé) distinct de « Attestation ». Le bon d'un client créé sur le terrain, à valider par le
   bureau, se distingue par le FOND mauve clair de sa carte — pas de pastille (« la pastille fait de trop », Antonio). */
.bon-b.bi{background:#e9edf5;color:#142D52}
.queue .qitem.q-terrain,.queue .qitem.q-terrain:hover{background:#F1E9FC}
.qtable tr.q-terrain > td{background:#F1E9FC}
.queue .qline .ic.cal{color:#2b6cb0}
.queue .qline .ic.cli{color:#8a5a1e}
.queue .qline .ic.site{color:#0a7a44}
.queue .qline .ic.tech{color:#c0562b}

/* ---- Fiche site (styles sortis de sites/show.blade.php, mêmes valeurs) ---- */
.content.site-w{max-width:1550px}
.site-head{align-items:center}
.site-title{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.site-back{color:#0275d8;font-size:20px}
.site-toggle{cursor:pointer;display:inline-flex;align-items:center;gap:8px;border:none;background:none;padding:0;font-weight:600;font-size:13.5px;font-family:inherit}
.site-toggle.on{color:#0a7a44}.site-toggle.on i{color:#0a8f5b}
.site-toggle.off,.site-toggle.off i{color:#c0392b}
.site-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.site-menu{position:relative}
.site-gear{list-style:none;cursor:pointer;min-height:40px;min-width:48px;color:#e08a1e}
.site-gear::-webkit-details-marker{display:none}
.site-menu-drop{position:absolute;z-index:20;top:calc(100% + 6px);right:0;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 10px 26px rgba(20,20,25,.12);padding:8px;display:flex;flex-direction:column;gap:4px;min-width:220px}
.lnk-blue{color:#0275d8}
.lnk-danger{color:#e2001a}
.site-badge{padding:9px 14px;font-size:13px;border-radius:9px;gap:8px}
.site-badge.ok{background:#d7f5e3;color:#0a7a44}
.site-badge.due{background:#fde8e6;color:#c0392b}
.site-top{margin-bottom:18px}
.site-top.inactive{background:#fdeeee;border:2px solid #e0483a}
.site-top-body{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-start}
.site-inactive-banner{flex:1 1 100%;color:#c0392b;font-weight:700}
.site-info{flex:0 1 330px;min-width:270px;font-size:13.5px;display:flex;flex-direction:column;gap:8px}
.ico{color:#0275d8;width:22px}
.ico.sm{width:16px}
.site-co{border-left:3px solid #0275d8;padding:6px 0 6px 12px;margin-top:6px;line-height:1.6}
.site-co .co-name{color:#0275d8;font-weight:600}
.site-sv{flex:0 0 250px}
.site-sv-img{border-radius:10px;max-width:100%;display:block;border:1px solid var(--line)}
.site-msgs{flex:1.8;min-width:340px;display:flex;gap:16px;flex-wrap:wrap}
.site-msg{flex:1;min-width:230px;margin:0}
.site-msg-lbl{color:#0275d8;font-size:13.5px}
.site-msg-ta{width:100%;margin-top:6px;padding:9px 11px;border:1px solid var(--line);border-radius:9px;font:inherit;font-size:13px;resize:vertical;box-sizing:border-box}
.site-msg-save{margin-top:6px}
.site-contacts{max-width:calc(50% - 8px)}
.site-contacts > .tbl-wrap,.site-contacts .tbl-wrap{border:none;box-shadow:none;background:transparent;border-radius:0}
.site-contacts .modal-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.site-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 14px;align-items:center}
.st-btn{background:#2b6cb0;border-color:#2b6cb0;color:#fff;min-width:132px;height:36px;padding:0 14px;justify-content:center;font-size:13px;font-weight:600}
.st-btn:hover{filter:brightness(1.06)}
.st-btn.on{background:#0a8f5b;border-color:#0a8f5b}
.st-btn i{display:none}
.mat-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.mat-layout .tbl-wrap{border:none;box-shadow:none;background:transparent;border-radius:0}
.mat-layout table.tbl th{color:#1a1d21;background:transparent}
.mat-layout table.tbl td,.mat-layout table.tbl td.muted,.mat-layout .muted{color:#1a1d21}
.mat-layout table.tbl tbody tr:hover{background:#f2f5f8}
.mat-layout table.tbl tfoot td{border-bottom:none}
#matDetail{display:none;min-width:0}
.mat-layout.has-d #matDetail{display:block}
.mat-row.on-row{background:#e8f1fb}
@media(max-width:1100px){.mat-layout.has-d{grid-template-columns:1fr}}

/* ---- Fiche client (styles sortis de clients/show.blade.php, mêmes valeurs) ---- */
.content.site-w.client-w{max-width:1700px}
.site-back-lbl{font-size:12px;margin-left:6px;vertical-align:middle}
.client-toggle{cursor:pointer;display:inline-flex;align-items:center;gap:9px;border:2px solid #0a8f5b;border-radius:999px;background:#e3f6ea;color:#0a7a44;padding:6px 14px;font-weight:700;font-size:13.5px;font-family:inherit}
.client-toggle i{color:#0a8f5b}
.client-toggle.off{border-color:#c0392b;background:#fde8e6;color:#c0392b}
.client-toggle.off i{color:#c0392b}
.site-gear-full{list-style:none;cursor:pointer;background:#e08a1e;border-color:#e08a1e;color:#fff}
.site-gear-full::-webkit-details-marker{display:none}
.client-top-body{gap:22px}
.client-kv{flex:1;min-width:320px}
.kv-sep{display:none}
.client-msg{flex:1;min-width:300px}
.site-tabs .st-sp{flex:1}
.st-logs{height:36px}
dialog::backdrop{background:rgba(20,20,25,.45)}

/* ---- Éditeur de documents (styles sortis de doc-form / devis & factures from_mission, mêmes valeurs) ---- */
.doc-sec-title{font-weight:700;color:#0275d8;text-transform:uppercase;font-size:12.5px;letter-spacing:.04em;border-bottom:2px solid #0275d8;padding:0 0 6px}
.doc-sec-title.inset{padding:16px 0 6px;margin:0 16px}
.doc-sec-title.warn{color:var(--orange);border-bottom-color:var(--orange)}
.doc-hdr{padding:16px 16px 8px;font-size:12.5px;line-height:1.55;border-bottom:1px solid var(--border)}
.btn.blue{background:#0275d8;border-color:#0275d8;color:#fff}
.doc-head-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;width:880px;max-width:100%}
.doc-head-actions .sp{flex:1}
.doc-close-btn{min-height:42px;min-width:52px}

/* ---- Listes (styles récurrents sortis des index) ---- */
.sp{flex:1}
.list-tools{gap:var(--g,12px);margin-bottom:var(--mb,12px)}
.list-select{padding:7px 10px;border:1px solid var(--line);border-radius:8px;font-size:13px;font-family:var(--font)}
.list-per-select{padding:5px 8px;border:1px solid var(--line);border-radius:7px;margin:0 2px;font-family:var(--font)}
.list-lbl{font-size:13px;color:var(--muted)}
.empty-row.sm{padding:16px}
.tenant-sel{padding:8px 10px;border:1px solid var(--line);border-radius:9px;font-size:13px;font-family:var(--font);background:#f4f6f8;max-width:190px}
.qhead-r{display:inline-flex;align-items:center;gap:10px}
.qmore{display:none}
.qico{display:none}

/* ---- Fiches site / client : compléments (ancienne interface : mêmes rendus qu'avant) ---- */
.site-back-txt,.site-gear-txt,.site-del-form,.ct-ico,.card-h{display:none}
.lbl-old{display:inline}
.small{font-size:11.5px}
.txt-ok{color:#0a7a44}
.txt-danger{color:#c0392b}
.pill.amber.sm{font-size:10px}
.pill.off.sm{background:#eef2f7;color:#41526b;font-size:10.5px}
.ct-head{display:flex;align-items:center;gap:10px;cursor:pointer}
.ct-head .sp{flex:1}
.site-info > div > .v{display:inline}
.queue .qitem .qtop .qmois{font-weight:400;color:var(--ink)}
.queue .qitem .qtop .qid{font-weight:700;font-size:13.5px}
.queue .qitem .qtop .qmois{font-weight:400 !important;font-size:13px}
.bce-ico{display:none}
.grp-title .grp-note{font-weight:400;font-size:.8em}
.grp-title .grp-note{font-size:12px !important;font-weight:400 !important}
.cs-head{display:flex;align-items:center;gap:10px}
.cs-head .sp{flex:1}
.cs-filter{font-size:13px;font-weight:400}
/* Numéro devant le nom dans les titres de fiche : plus petit, léger espace */
.phead h1 .h-num{font-size:.7em;font-weight:500;color:var(--muted);margin-right:8px;font-variant-numeric:tabular-nums}
/* Dièse devant le numéro du titre : plus petit, léger espace ; le numéro garde la taille du titre */
.phead h1 .h-hash{font-size:.6em;font-weight:500;color:var(--muted);margin-right:3px}
/* Onglet Maintenance : détail des équipements un peu plus large que la liste (icônes d actions dégagées de l ascenseur) */
.mat-layout{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)}
.mat-layout .tbl-scroll{overflow-y:auto;scrollbar-gutter:stable}

/* Menu Administration : titres de catégorie (affichés par la nouvelle interface seulement) */
/* Thèmes du menu Administration (Antonio, 29/09/2026) : visibles dans les deux interfaces, un filet au-dessus de chaque thème. */
.ad-cat{display:block;margin:10px 0 2px;padding:10px 12px 4px;border-top:1px solid var(--line);font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brand)}
.ad-nav .ad-cat:first-child{border-top:0;margin-top:0}
/* §97 (09/10/2026) : titres de catégorie cliquables (replier / déplier), avec leur pictogramme et un chevron. */
/* Classe neutre « mcat » : les bloqueurs de publicité masquent les classes en « ad-… » (titres invisibles chez Antonio). */
.ad-nav .mcat{display:flex;align-items:center;gap:9px;width:100%;margin:10px 0 2px;padding:10px 12px 4px;background:none;border:0;border-top:1px solid var(--line);font-family:inherit;font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--brand);cursor:pointer;text-align:left}
html.ui2 .ad-nav .mcat{color:var(--brand-ink)}
.ad-nav .mcat:first-child{border-top:0;margin-top:0}
.ad-nav .mcat .mcat-ic{font-size:12px;width:16px;text-align:center;flex:none}
.ad-nav .mcat span{flex:1;min-width:0}
.ad-nav .mcat .mcat-chev{font-size:11px;color:var(--muted);transition:transform .15s;flex:none}
.ad-nav .mcat[aria-expanded="false"] .mcat-chev{transform:rotate(-90deg)}
.ad-nav .mcat:focus-visible{outline:2px solid var(--brand);outline-offset:2px;border-radius:6px}

/* Courrier : dossier ouvert en lecture seule (lecteur sur les fiches) — aucun formulaire d'action */
.cs-lecture form{display:none}

/* Courrier : fil du plus récent au plus ancien, réponse au-dessus (retour Antonio 16/09) */
.cs-fil{display:flex;flex-direction:column-reverse}
.cs-fil > .card{margin-bottom:0;margin-top:10px}
#cs-editor:empty::before{content:attr(data-placeholder);color:#9aa0a6}
#cs-editor[contenteditable=false]{background:#f4f6f8;color:#9aa0a6}

/* Courrier : messages repliés (seul le dernier ouvert) */
.cs-msg-h{cursor:pointer;user-select:none}
.cs-msg.cs-collapsed .card-body > :not(.cs-msg-h){display:none}
.cs-msg .cs-snip{display:none}
.cs-msg.cs-collapsed .cs-snip{display:inline-block;max-width:520px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom;font-size:12px}
.cs-msg.cs-collapsed .cs-chev{transform:rotate(-90deg)}
.cs-msg .cs-chev{transition:transform .15s}

/* Files du tableau de bord (Antonio, 25/09/2026) : le nombre à faire devant le titre, en rouge, sans pastille. */
.queue .qhead .cnt-av{font-family:var(--mono);font-size:15px;font-weight:700;color:#c0392b;margin-right:8px;font-variant-numeric:tabular-nums}
.queue .qhead .cnt-av.zero{color:#9aa0a6}

/* Bouton plein dans une cellule de tableau (Antonio, 25/09/2026) : la règle « lien de tableau » le repeignait en noir,
   illisible sur le violet. Le bouton garde sa couleur de texte ; le bouton bordé garde la sienne. */
table.tbl td a.btn{color:#fff}
table.tbl td a.btn.ghost{color:#3b4149}
table.tbl td a.btn.ghost[style*="c0392b"]{color:#c0392b}

/* Crayon de modification posé à côté du nom de la fiche (Antonio, 25/09/2026). */
.site-title .fiche-pen{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:1px solid var(--line);
    border-radius:8px;color:#0275d8;background:#fff;font-size:14px;flex:none;text-decoration:none}
.site-title .fiche-pen:hover{background:#f3f7fc;border-color:#0275d8}

/* Liens vers une fiche depuis un contact (Antonio, 25/09/2026 : « on doit pouvoir revenir sur le site ou le client en
   cliquant dessus » — les liens existaient, ils ne se voyaient pas, écrits en noir comme le reste du tableau). */
a.lien-fiche,table.tbl td a.lien-fiche{color:var(--brand)}
a.lien-fiche:hover,table.tbl td a.lien-fiche:hover{color:var(--brand);text-decoration:underline}

/* ---- Bon d'intervention, vue épurée (guide codeur du 27/09/2026) : cartes à bandeau gris clair, titres bleu foncé,
        textes noirs, rubriques vides sur une ligne, contour vert dès qu'une ligne existe, aucun compteur. -------------- */
.bi-v2{color:#202124}
.bi-v2 .bi-card{background:#fff;border:1px solid #DDE3EA;border-radius:8px;box-shadow:none;margin-bottom:24px;overflow:hidden}
.bi-v2 .bi-card > .card-body{padding:16px 18px}
.bi-v2 .bi-h{display:flex;align-items:center;gap:10px;background:#F3F5F7;color:#172B4D;font-weight:700;font-size:16px;padding:10px 16px;border-bottom:1px solid #DDE3EA;line-height:1.3}
.bi-v2 .bi-h i{color:#172B4D;width:18px;text-align:center}
.bi-v2 .bi-h .bi-h-act{margin-left:auto;color:#0075D9;font-weight:500;font-size:13px}
.bi-v2 .bi-h .bi-h-pill{font-size:11px;font-weight:600;margin-left:auto}
.bi-v2 .bi-h .bi-h-pill + .bi-h-act{margin-left:8px}
.bi-v2 .bi-h .bi-h-pill.ok,.bi-v2 .pill.ok{background:#E5F5EC;color:#008751}
.bi-v2 .grp-title{color:#172B4D}
.bi-v2 .bi-texte{white-space:pre-wrap;line-height:1.5;font-size:14px;color:#202124}
.bi-v2 .bi-sous{font-size:13px;margin-bottom:8px;color:#202124}
/* Informations du bon : lignes rapprochées (22-24 px), libellés à gauche, valeurs sur un second axe */
.bi-v2 .bi-infos table.kv th{color:#202124;font-weight:500;padding:3px 10px 3px 0;width:120px;font-size:14px;line-height:1.3;vertical-align:baseline}
.bi-v2 .bi-infos table.kv td{padding:3px 0;font-size:14px;line-height:1.3;color:#202124}
.bi-v2 .bi-infos table.kv td a{color:#172B4D;font-style:italic;font-weight:500}
.bi-v2 .bi-infos table.kv tr:nth-child(1) td a,.bi-v2 .bi-infos table.kv td a[href*="/clients/"]{color:#7B3FC6;font-style:normal}
.bi-v2 .bi-infos details summary{color:#0075D9}
/* Rubriques (extras, articles pour devis) */
.bi-v2 .bi-subs{display:flex;flex-direction:column;gap:12px}
.bi-v2 .bi-sub{border:1px solid #DDE3EA;border-radius:8px;background:#fff;padding:0}
.bi-v2 .bi-sub.bi-filled{border:2px solid #16A34A}
.bi-v2 .bi-sum{list-style:none;display:flex;align-items:center;gap:10px;min-height:46px;padding:0 12px;cursor:pointer;user-select:none;color:#172B4D;font-weight:700;font-size:15px}
.bi-v2 .bi-sum::-webkit-details-marker{display:none}
.bi-v2 .bi-chev{color:#0075D9;font-size:12px;width:12px;transition:transform .15s}
.bi-v2 .bi-sub[open] .bi-chev{transform:rotate(90deg)}
.bi-v2 .bi-sum-vide{color:#6b7280;font-weight:400;font-style:italic;font-size:13.5px}
.bi-v2 .bi-sum-m{margin-left:auto;color:#202124;font-weight:700;font-size:14px;font-variant-numeric:tabular-nums}
.bi-v2 .bi-plus{width:32px;height:32px;border:none;background:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;margin:0 -6px 0 0}
.bi-v2 .bi-plus span{width:20px;height:20px;border-radius:50%;background:#0075D9;color:#fff;font-size:14px;line-height:20px;text-align:center;font-weight:700}
.bi-v2 .bi-plus:hover span{background:#005fb0}
.bi-v2 .bi-etablir{display:inline-flex;align-items:center;gap:5px;background:#FEF2F2;color:#B91C1C;border:1px solid #DC2626;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:600}
.bi-v2 .bi-tbl{margin:0 12px 12px;width:calc(100% - 24px)}
.bi-v2 .bi-tbl th{font-size:12px;color:#5f6b7a;font-weight:600;background:none;border-bottom:1px solid #DDE3EA;padding:8px 10px;text-transform:uppercase;letter-spacing:.02em}
.bi-v2 .bi-tbl td{height:36px;padding:6px 10px;font-size:14px;color:#202124;border-bottom:1px solid #eef1f5}
.bi-v2 .bi-tbl tfoot td{font-weight:700;color:#172B4D;border-bottom:none}
.bi-v2 .bi-total-htva{text-align:right;font-size:15px;color:#172B4D;margin-top:4px}
.bi-v2 .bi-alerte{display:flex;align-items:center;gap:12px;flex-wrap:wrap;background:#FFF4E5;border:1px solid #f3d9b0;color:#B45309;border-radius:8px;padding:10px 14px;margin:-6px 0 18px;font-size:14px}
.bi-v2 .bi-alerte i{color:#B45309}
.bi-v2 .bi-alerte-btn{margin-left:auto;color:#0075D9}
/* Historique : dates, auteurs et descriptions en noir ; cinq événements, le reste sur demande */
.bi-v2 .bi-hist-l{display:grid;grid-template-columns:96px 80px minmax(0,1fr);gap:10px;padding:7px 0;border-bottom:1px solid #eef1f5;font-size:13px;color:#202124;align-items:baseline}
.bi-v2 .bi-hist-d{white-space:nowrap;font-variant-numeric:tabular-nums}
.bi-v2 .bi-hist-u{white-space:nowrap;font-weight:600;overflow:hidden;text-overflow:ellipsis;min-width:0}   /* un nom trop long se coupe (…) au lieu de recouvrir le texte (Antonio, 06/10/2026) ; le nom entier au survol */
.bi-v2 .bi-lnk{background:none;border:none;color:#0075D9;cursor:pointer;font:inherit;font-size:13.5px;padding:8px 0 0}
.bi-v2 .bi-lnk:hover{text-decoration:underline}
/* Paiement : détail, puis Total TTC et Reste à facturer en évidence */
.bi-v2 .bi-pay th{color:#202124;font-weight:500;padding:5px 0;font-size:14px}
.bi-v2 .bi-pay td{color:#202124;padding:5px 0;font-size:14px;font-variant-numeric:tabular-nums}
.bi-v2 .bi-pay tr.bi-ttc th,.bi-v2 .bi-pay tr.bi-ttc td{background:#F3F5F7;padding:9px 8px;font-size:15px}
.bi-v2 .bi-pay tr.bi-ttc th{color:#172B4D;font-weight:700}
.bi-v2 .bi-pay tr.bi-ttc td{color:#202124;font-weight:700}
.bi-v2 .bi-pay tr.bi-reste th,.bi-v2 .bi-pay tr.bi-reste td{background:#F3F5F7;padding:9px 8px;font-size:15px;font-weight:700}
.bi-v2 .bi-pay tr.bi-reste th{color:#172B4D}
.bi-v2 .bi-pay tr.bi-reste.zero td{color:#008751}
.bi-v2 .bi-pay tr.bi-reste.du td{color:#202124}
.bi-v2 .bi-paiement.bi-immediat{border-color:#16A34A}
.bi-v2 .bi-save,.bi-v2 .bi-save:hover{background:#5030AE;border-color:#5030AE;color:#fff}
/* Boutons d'action des tableaux : suppression rouge, action bleue */
.bi-v2 .bi-tbl button[title="Retirer du bon"],.bi-v2 .bi-tbl button[title="Retirer du devis"]{color:#DC2626 !important}
@media (max-width:1300px){.bi-v2.mshow{grid-template-columns:1fr 1fr}.bi-v2 .mshow-side{grid-column:1/-1;flex-direction:row;flex-wrap:wrap}.bi-v2 .mshow-side>.card{flex:1;min-width:320px}}
@media (max-width:900px){.bi-v2.mshow{grid-template-columns:1fr}.bi-v2 .mshow-side{flex-direction:column}}

/* ---- Haut de la fiche site : version retenue le 26/09/2026 (guide de Magali). Palette : bleu foncé #142D52, texte #202124,
   mauve #7020C0 (liens clés), mauve doux #8050A0 (client, Enregistrer), bleu clair #2799E6 (e-mail), vert #00A85A, rouge #D32F2F,
   bandeaux #F3F5F8, bordures #DDE3EB. Six blocs alignés, contacts en dessous sur toute la largeur. */
.fs-head .site-title h1.fs-h1{color:#142D52;font-weight:800;display:inline-flex;align-items:center;gap:8px;margin:0}
.fs-head .fs-num{display:inline-flex;align-items:center;gap:3px;background:#F3EAF8;color:#7020C0;border:1px solid #E3D3F0;border-radius:7px;padding:2px 9px;font-size:.72em;font-weight:600;line-height:1.4}
.fs-head .fs-num .h-hash{font-size:1em;color:#7020C0;margin:0;font-weight:600}
.fs-head .fs-tiret{color:#142D52;font-weight:400}
.fs-head .fiche-pen{color:#2799E6}
.fs-head .site-toggle,.fs-head .site-toggle.on,.fs-head .site-toggle.off{color:#142D52;background:none;border:none;padding:0;font-weight:600}
.fs-head .site-toggle i{color:var(--fs-sym,#142D52)}
.fs-head .site-toggle::before{content:none}
.fs-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:16px;color:#202124;font-size:13.5px}
@media (max-width:1000px){.fs-top{grid-template-columns:1fr}}
.fs-banner{grid-column:1 / -1;background:#FEF2F2;border:1px solid #f3b8b8;color:#B91C1C;border-radius:8px;padding:10px 14px;font-weight:700}
.fs-bloc{background:#fff;border:1px solid #DDE3EB;border-radius:8px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.fs-t{margin:0;background:#F3F5F8;color:#142D52;font-size:13.5px;font-weight:700;padding:8px 14px;border-bottom:1px solid #DDE3EB;display:flex;align-items:center;gap:8px}
.fs-t i{color:#142D52;width:16px;text-align:center}
.fs-body{padding:12px 14px;flex:1;min-width:0}
.fs-kv{display:flex;flex-direction:column;gap:7px;min-width:0}
.fs-row{display:flex;align-items:baseline;gap:9px;line-height:1.4;min-width:0}
.fs-row > i{color:#142D52;width:16px;flex:none;text-align:center;font-size:13px;position:relative;top:1px}
.fs-row .fs-v{min-width:0;color:#202124}
.fs-row .fs-lbl{color:#142D52}
/* Toutes les adresses, partout, ont exactement la même présentation (Antonio, 03/10/2026) : « Rue et n°, CP Ville »
   (virgule après le numéro, produite par Ui::adresseAffichee), bleu foncé, italique, même icône de localisation.
   Une seule règle pour les deux fiches : .fs-adr (site) et .fc-adr (client) ne doivent jamais diverger. */
.fs-adr,.fc-adr{color:#142D52 !important;font-style:italic;font-weight:600;text-decoration:none}
.fs-adr:hover,.fc-adr:hover{text-decoration:underline}
.fs-mail{color:#2799E6 !important;text-decoration:none}
.fs-mail:hover{text-decoration:underline}
.fs-tel{color:#202124 !important;text-decoration:none}
.fs-cles{color:#7020C0 !important;font-weight:600;text-decoration:none}
.fs-cles:hover{text-decoration:underline}
.fs-alerte{margin:4px 0 0;font-size:12.5px}
.fs-alerte-sm{font-size:12.5px;margin-top:2px}
.fs-site-body{display:flex;gap:14px;align-items:flex-start}
.fs-site-body .fs-kv{flex:1 1 auto}
.fs-photo{flex:0 0 150px;display:block}
.fs-photo-img{width:150px;height:112px;object-fit:cover;border-radius:6px;border:1px solid #DDE3EB;display:block}
.fs-client-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.fs-client-fact{border-left:1px solid #DDE3EB;padding-left:14px}
.fs-client-nom{color:#8050A0 !important;font-weight:700;font-size:15.5px;text-decoration:none;display:inline-block;margin-bottom:2px}
.fs-client-nom:hover{text-decoration:underline}
.fs-regen{color:#142D52;border-color:#DDE3EB;background:#fff;padding:2px 8px;font-size:12px}
.fs-msg-form{display:flex;flex-direction:column;gap:8px;align-items:flex-start;margin:0}
.fs-ta{width:100%;box-sizing:border-box;min-height:58px;height:auto;padding:8px 10px;border:1px solid #DDE3EB;border-radius:7px;font:inherit;font-size:13px;line-height:1.4;resize:vertical;color:#202124}
.fs-ta:focus{outline:none;border-color:#142D52;box-shadow:0 0 0 3px rgba(20,45,82,.12)}
.fs-save,.btn.fs-save{background:#8050A0;border-color:#8050A0;color:#fff;font-weight:600;height:28px;padding:0 12px;font-size:12.5px}
.fs-save:hover,.btn.fs-save:hover{background:#6c3f8c;border-color:#6c3f8c}
.fs-save.fs-save-dirty,.btn.fs-save.fs-save-dirty{background:#C0392B;border-color:#C0392B;font-weight:700}
.fs-save.fs-save-dirty:hover,.btn.fs-save.fs-save-dirty:hover{background:#a53125;border-color:#a53125}
.site-contacts.fs-contacts{max-width:none}
.fs-contacts .ct-sect{background:#fff;border:1px solid #DDE3EB;border-radius:8px;padding:0 14px}
@media (max-width:640px){.fs-site-body{flex-direction:column}.fs-client-body{grid-template-columns:1fr}.fs-client-fact{border-left:none;padding-left:0;border-top:1px solid #DDE3EB;padding-top:10px}}

/* ---- Refonte fiches Site et Client (Antonio, 03/10/2026) : davantage d'air, hiérarchie à 3 niveaux, pictogrammes
   discrets, mêmes règles des deux côtés (adresse, BCE, e-mails, obligatoire manquant). Les cadres .fs-bloc restent à
   leur place ; seule la présentation à l'intérieur change. ---- */
.fs-top{gap:18px}
.fs-bloc{border-radius:10px}
.fs-t{font-size:15.5px;padding:12px 18px;letter-spacing:.1px}
.fs-body{padding:17px 18px}
.fs-kv{gap:10px}
.fs-row{font-size:13.5px}
.fs-row.fs-n3{font-size:12.5px;color:#6b7280}
.fs-row.fs-n3 > i{color:#9aa4b2}
.fs-sep{border:none;border-top:1px solid #EEF1F5;margin:12px 0}
.fs-mois{color:#2799E6;font-weight:600}
.fs-mode{font-weight:600}
/* Pictogramme BCE (dessin fourni par Antonio le 03/10/2026) : carré à coins très arrondis, trait épais, « BCE » en
   gras au centre. Il n'existe pas d'icône BCE toute faite — il est donc dessiné en CSS plutôt qu'en image, pour
   suivre la taille du texte et changer de couleur tout seul. Tout est en `currentColor` : il suffit de changer
   `color` pour le passer en rouge. Jamais une autre icône devant.
   ROUGE quand il s'agit d'un syndic et que le n° BCE n'est pas rempli (classe fs-manque-ico) : c'est alors une
   information obligatoire manquante, pas une case facultative vide. */
/* 04/10/2026 — nouveau logo fourni par Antonio (« à remplacer sur l'ensemble de Go4 ») : le mot BCE seul, très gras, bleu
   foncé, SANS cadre. Le cadre arrondi du 03/10 disparaît. Toujours en currentColor : rouge par .fs-manque-ico, couleur de
   gravité dans la liste des clients. La même classe sert partout où Go4 représente la BCE. */
.fs-ico-bce{display:inline-flex;align-items:center;justify-content:center;align-self:center;box-sizing:border-box;
  font-size:10px;font-weight:900;letter-spacing:-.3px;color:#142D52;border:none;border-radius:0;
  padding:0;line-height:1;height:19px;width:auto;min-width:19px;flex:none;text-align:center;font-family:inherit;font-style:normal}
.fs-ico-bce.fs-manque-ico{color:#D32F2F;background:none}
/* Pictogramme balance : forme juridique (fiche client). */
.fs-ico-balance{width:16px;flex:none;text-align:center;color:#142D52;font-size:13px;position:relative;top:1px}
.fs-manque{color:#D32F2F !important;font-weight:700}
.fs-manque-ico{color:#D32F2F !important}
/* Ligne e-mail : icône, libellé sobre, adresse bleu clair italique — même logique sur les deux fiches, quatre usages. */
.fs-mailrow{display:flex;align-items:baseline;gap:9px;font-size:13px;line-height:1.4}
.fs-mailrow > i{color:#142D52;width:16px;flex:none;text-align:center;font-size:12.5px;position:relative;top:1px}
.fs-maillbl{color:#202124}
.fs-mailval{color:#2799E6 !important;font-style:italic;text-decoration:none;overflow-wrap:anywhere}
.fs-mailval:hover{text-decoration:underline}
.fs-mailgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px}
@media (max-width:520px){.fs-mailgrid{grid-template-columns:1fr}}
.fs-meta{font-size:12px;color:#6b7280;display:flex;gap:14px;flex-wrap:wrap}
.fs-meta i{color:#9aa4b2;width:14px;text-align:center;margin-right:3px}
/* Accès et clés : mauve si renseigné, gris si vide (lecture d'un coup d'œil). */
.fs-acces-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 18px}
@media (max-width:520px){.fs-acces-grid{grid-template-columns:1fr}}
.fs-acces-grid .fs-row{font-size:13px}
.fs-acces-grid .fs-row > i{font-size:12.5px;width:15px}
.fs-ico-mauve{color:#8050A0 !important}
.fs-ico-gris{color:#c7ccd4 !important}
/* Accès et clés : la réponse prend la couleur de son icône (Antonio, 04/10/2026) — mauve si renseignée, gris si vide. */
.fs-acces-grid .fs-row.fs-rempli .fs-v,.fs-acces-grid .fs-row.fs-rempli .fs-v a{color:#8050A0;font-weight:700}
.fs-acces-grid .fs-row.fs-vide .fs-v{color:#c7ccd4}
/* Information du Site / Message interne démarrent bas, s'agrandissent avec le contenu. */
.fs-ta{min-height:34px}
/* ---- Bon compact (retours d'Antonio du 29/09/2026) : moins de défilement, cadres à la hauteur de leur contenu, écritures lisibles ---- */
.bi-v2 .bi-card{margin-bottom:12px}
.bi-v2 .bi-card > .card-body{padding:12px 14px}
.bi-v2 .bi-h{font-size:15px;padding:8px 12px;gap:8px}
.bi-v2 .bi-h .bi-h-note{color:#6b7280;font-weight:400;font-size:12px}
.bi-v2 .bi-h .bi-h-n{font-weight:700;color:#172B4D}
.bi-v2 .bi-h .bi-h-vide{color:#6b7280;font-weight:400;font-size:13px;font-style:italic}
.bi-v2 .bi-h .bi-h-form{margin:0 0 0 auto}
.bi-v2 .bi-h .bi-h-form .bi-h-act{margin-left:0}
.mshow-head.site-head{margin-bottom:10px}
.mshow-head .bi-actions .btn{height:34px;min-height:34px;font-size:13.5px;padding:0 12px}
/* Informations du client et site */
.bi-v2 .bi-infos.bi-infos-alerte{border:1px solid #e2001a}
.bi-v2 .bi-infos table.kv.bi-kv th{width:96px;padding:2px 8px 2px 0;color:#202124;font-weight:500;font-size:14px}
.bi-v2 .bi-infos table.kv.bi-kv td{padding:2px 0;font-size:14px;color:#202124}
.bi-v2 .bi-infos .bi-client{color:#7B3FC6 !important;font-weight:700;font-style:normal}
.bi-v2 .bi-infos .bi-site{color:#172B4D !important;font-style:italic;font-weight:500}
.bi-v2 .bi-infos details{margin-top:6px}
.bi-v2 .bi-te{margin-top:10px;border-top:1px solid #eef1f5;padding-top:8px}
.bi-v2 .bi-te-alerte{color:#e2001a;font-weight:700;font-size:14px;display:flex;align-items:center;gap:8px;margin-bottom:6px}
.bi-v2 .bi-te-item{margin-bottom:8px}
.bi-v2 .bi-te-lbl{font-size:13.5px;color:#202124;font-weight:600;margin-bottom:4px}
.bi-v2 .bi-te-cols{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bi-v2 .bi-te-col{background:#F3F5F7;border-radius:8px;padding:8px 10px;min-width:0}
.bi-v2 .bi-te-col.bi-te-new{background:#FFF4E5}
.bi-v2 .bi-te-t{font-size:12px;color:#6b7280;font-weight:600;margin-bottom:2px}
.bi-v2 .bi-te-v{font-size:14px;color:#202124;overflow-wrap:anywhere}
.bi-v2 .bi-te-act{display:flex;gap:8px;justify-content:flex-end;margin-top:6px}
.bi-v2 .bi-te-modif{background:#0075D9;border-color:#0075D9;color:#fff}
/* Informations du site : 4 lignes, défilement, agrandissable */
.bi-v2 .bi-site-ta{width:100%;box-sizing:border-box;padding:7px 10px;border:1px solid #DDE3EA;border-radius:8px;font-family:inherit;font-size:13.5px;line-height:1.45;resize:vertical;min-height:76px;max-height:60vh;overflow:auto}
.bi-v2 .bi-site-eo{margin-top:6px;display:flex;justify-content:flex-start}
.bi-v2 .bi-site-lecture{white-space:pre-wrap;max-height:110px;overflow:auto;font-size:13.5px;line-height:1.45}
/* Attachements, photos */
.bi-v2 .bi-attach-list{display:flex;flex-direction:column;gap:4px}
.bi-v2 .bi-attach-l{display:flex;align-items:center;gap:10px;font-size:14px}
.bi-v2 .bi-photos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:8px}
.bi-v2 .bi-photo{position:relative}
.bi-v2 .bi-photo a{display:block;aspect-ratio:1;border-radius:8px;overflow:hidden;border:1px solid #DDE3EA}
.bi-v2 .bi-photo img{width:100%;height:100%;object-fit:cover;display:block}
.bi-v2 .bi-photo-del{position:absolute;top:4px;right:4px;margin:0}
.bi-v2 .bi-photo-del button{background:rgba(255,255,255,.9);border:none;border-radius:6px;width:24px;height:24px;cursor:pointer;color:#c0392b;font-size:11px}
/* Matériel vérifié : lignes de 34 px */
.bi-v2 .bi-vf-t{margin-top:0;font-size:15px}
.bi-v2 .bi-vf-plier{margin-left:auto;padding:0;font-size:12.5px}
.bi-v2 #vf-table th{padding:6px 10px;font-size:13px}
.bi-v2 #vf-table td{padding:6px 10px;font-size:14px;line-height:1.3}
.bi-v2 #vf-table tr.vf-art td:first-child{text-align:left;white-space:normal;overflow-wrap:anywhere}
.bi-v2 .tbl-wrap{margin-bottom:12px}
/* Extras / articles : rubriques serrées */
.bi-v2 .bi-subs{gap:8px}
.bi-v2 .bi-sum{min-height:36px;font-size:14.5px;gap:8px}
.bi-v2 .bi-sub table.tbl th{padding:5px 8px;font-size:12.5px}
.bi-v2 .bi-sub table.tbl td{padding:5px 8px;font-size:14px}
.bi-v2 .bi-fait{display:inline-flex;align-items:center;gap:5px;background:#E5F5EC;color:#008751;border:1px solid #16A34A;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:600;text-decoration:none}
.bi-v2 a.bi-etablir{text-decoration:none}
/* Accès terrain sur une ligne */
.bi-v2 .bi-acces .bi-acces-l{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 12px;font-size:14px}
.bi-v2 .bi-acces-t{color:#172B4D;font-weight:700;display:inline-flex;align-items:center;gap:8px}
.bi-v2 .bi-acces-t i{color:#172B4D}
.bi-v2 .bi-acces-sep{color:#9aa4b2}
.bi-v2 .bi-acces-st.clos{background:#E5F5EC;color:#008751;font-weight:600;font-size:12.5px}
.bi-v2 .bi-acces-st.ouvert{background:#FFF4E5;color:#B45309;font-weight:600;font-size:12.5px}
.bi-v2 .bi-acces-rouvrir{background:#e08a1e;border-color:#e08a1e;color:#fff}
.bi-v2 .bi-acces-go{background:#0a8f5b;border-color:#0a8f5b;color:#fff}
/* Historique : 4-5 lignes visibles, défilement, Mission terminée en vert */
.bi-v2 .bi-hist{max-height:172px;overflow:auto}
.bi-v2 .bi-hist.bi-hist-tout{max-height:none}
.bi-v2 .bi-hist-l{padding:6px 0;font-size:13px;grid-template-columns:104px 122px minmax(0,1fr);gap:8px}   /* « 05/10/26 18:48 » tient dans sa colonne (06/10/2026 : la date touchait le nom) */
.bi-v2 .bi-hist-l.bi-hist-fin .bi-hist-t{color:#008751;font-weight:700}
.bi-v2 .bi-lnk{padding:6px 0 0;font-size:13px}
/* Paiement : résumé serré */
.bi-v2 .bi-pay th,.bi-v2 .bi-pay td{padding:4px 0}
.bi-v2 .bi-pay tr.bi-ttc th,.bi-v2 .bi-pay tr.bi-ttc td,.bi-v2 .bi-pay tr.bi-reste th,.bi-v2 .bi-pay tr.bi-reste td{padding:7px 8px}
/* Envoi et signature */
.bi-v2 .bi-card > .card-body[style*="flex-wrap"]{padding:10px 12px;gap:10px}
@media (max-width:700px){.bi-v2 .bi-te-cols{grid-template-columns:1fr}}
/* Bon compact (30/09/2026) : un bloc marqué hidden reste caché même s'il porte display:flex en style — le formulaire
   « Modifier le paiement » ne s'ouvre qu'au clic (Antonio). */
.bi-v2 [hidden]{display:none !important}

/* ---- Cadre « Site » de la fiche site : colonne d'icônes harmonisée (Antonio, 03/10/2026) ----
   Les trois repères de la ligne BCE / création / dernière activité (et leurs voisines adresse et type)
   partagent la même boîte, la même taille et le même bleu foncé ; le pictogramme BCE perd son encadré,
   seul le mot « BCE » reste en gras — le n° qui suit est en graisse normale, sans deux-points. */
.fs-site .fs-kv .fs-row > i,.fs-site .fs-kv .fs-row > .fs-ico-bce{width:20px;flex:none;text-align:center}
.fs-site .fs-kv .fs-row > i{font-size:14.5px;color:#142D52}
.fs-site .fs-kv .fs-row.fs-n3 > i{color:#142D52}
/* Le pictogramme encadré est revenu le 03/10/2026 (dessin fourni par Antonio) : il garde la boîte de 20 px de la
   colonne d'icônes, le cadre et le gras viennent de la règle commune .fs-ico-bce. */
.fs-site .fs-kv .fs-ico-bce{height:19px}
/* Logo « TVA » (Antonio, 04/10/2026) : même dessin que le logo BCE (mot seul, très gras), à la place du terme « TVA » sur les
   fiches client et site. Dans le cadre « Client et facturation » de la fiche site, la colonne des icônes prend la même largeur
   que celle du cadre du site (20 px) pour que les valeurs restent alignées sous le logo. */
.fs-client .fs-kv .fs-row > i,.fs-client .fs-kv .fs-row > .fs-ico-bce{width:20px;flex:none;text-align:center}
/* Colonne « facturation » du même cadre : icônes à la place des libellés (Antonio, 04/10/2026). La colonne d'icônes fait 24 px,
   la largeur du logo Peppol, pour que les quatre réponses soient alignées ; la ligne Peppol garde son logo et son écart. */
.fs-client .fs-client-fact .fs-row > i,.fs-client .fs-client-fact .fs-row > .fs-peppol-ico{width:24px;flex:none;text-align:center;justify-content:center}
.fs-client .fs-client-fact .fs-row,.fs-client .fs-client-fact .fs-row.fs-peppol{gap:9px}
/* Création et dernière activité : même taille et même couleur que les autres informations du cadre, plus de gris
   clair (Antonio, 03/10/2026) — le libellé « Créé le » / « Dernière activité » ne vit que dans l'info-bulle. */
.fs-site .fs-kv .fs-row.fs-n3{font-size:13.5px;color:#202124}
.fs-site .fs-kv .fs-row.fs-n3 .fs-v{color:#202124}
/* Zones e-mail des deux cadres de la ligne 1 (Antonio, 03/10/2026) : elles doivent tomber exactement à la même
   hauteur d'un cadre à l'autre. Le cadre est une colonne flex dont le corps principal (.fs-body) grandit ; la zone
   e-mail ne doit donc PAS grandir, sinon les deux corps se partagent la place et les lignes se décalent. */
.fs-mails{flex:none;padding-top:0}
/* Cadre Maintenance (Antonio, 03/10/2026) : le statut du site dans l'en-tête du cadre, une seule fois, avec sa
   pastille de couleur ; le mois de vérification en bleu foncé s'il est réglé, en noir normal s'il n'y en a aucun. */
.fs-t-statut{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:13px}
.fs-t-statut::before{content:'';width:8px;height:8px;border-radius:50%;background:currentColor;flex:none}
.fs-t-statut.actif{color:#00A85A}
.fs-t-statut.inactif{color:#D32F2F}
.fs-t-statut.prospect{color:#7a5cc0}
.fs-mois{color:#142D52;font-weight:700}
.fs-mois-aucun{color:#202124;font-weight:400}

/* ---- Objectif visuel du 03/10/2026 (point 12 du cahier d'Antonio) : « une fiche très lisible, calme visuellement
   et agréable à utiliser toute la journée », sans toucher à la disposition des cadres. Plus de blanc autour des
   informations, plus d'espace entre les cadres, plus de marge intérieure, moins de gras, informations secondaires
   légèrement plus petites. Rien n'est retiré : seules les respirations changent. ---- */
.fs-top{gap:22px;margin-bottom:22px}
.fs-body{padding:20px 20px 22px}
.fs-kv{gap:12px}
.fs-t{font-weight:600;padding:13px 20px}
.fs-acces-grid{gap:10px 22px}
.fs-mailgrid{gap:10px 22px}
/* Informations secondaires : couleur normale (demandée le même jour), mais un cran plus petites que le reste. */
.fs-site .fs-kv .fs-row.fs-n3{font-size:12.5px}
/* Moins de gras : le libellé d'une ligne porte l'information, il n'a pas besoin d'être appuyé. */
.fs-lbl{font-weight:400}
.fs-maillbl{font-weight:400}
/* Espace entre la dernière ligne d'un cadre et ses e-mails (Magali, 04/10/2026 : « trop de place ») : la règle .fs-mails{padding-top:0}
   écrite plus haut était annulée par .fs-body{padding:20px …} qui la suit — 20 px de trop au-dessus du trait. On la réaffirme
   avec plus de poids, et le bas du corps des DEUX cadres de la ligne 1 passe de 22 à 10 px, à l'identique : les deux cadres
   ont la même hauteur (grille) et la zone e-mail ne grandit pas, donc les e-mails restent alignés d'un cadre à l'autre quel
   que soit le nombre de lignes au-dessus. */
.fs-body.fs-mails{padding-top:0}
.fs-top .fs-site-body,.fs-top .fs-client-body{padding-bottom:10px}
/* « Dernière vérification » : même taille que les lignes voisines du pied (12,5 px comme sur la fiche client), l'italique reste — mesuré dans Chrome le 04/10/2026. */
.fs-row .vf-derniere{font-size:inherit}
/* Les deux cadres de la ligne 1 partagent les MÊMES rangées (titre, corps, e-mails) grâce à une sous-grille : le trait et les
   e-mails tombent à la même hauteur même si, dans un seul des deux cadres, une adresse passe sur deux lignes ou si des lignes
   s'ajoutent au-dessus (Antonio et Magali, 04/10/2026 — défaut mesuré dans Chrome à 1300 px : 18 px d'écart entre les traits).
   Sans prise en charge de la sous-grille, on garde l'ancien comportement (e-mails calés en bas). */
@supports (grid-template-rows: subgrid) {
  .fs-top > .fs-bloc.fs-site,.fs-top > .fs-bloc.fs-client{display:grid;grid-template-rows:subgrid;grid-row:span 3;row-gap:0}
}

/* Zones de texte « Information du Site » et « Message interne » (point 10) : une ligne quand le texte tient sur une
   ligne, elles s'agrandissent avec le contenu, et se bloquent à CINQ lignes visibles avec un ascenseur au-delà.
   La hauteur maximale est posée en CSS : le script qui agrandit la zone ne peut donc pas la dépasser. */
.fs-ta{min-height:36px;max-height:109px;overflow-y:auto}
/* Enregistrer : compact, sans icône (le mot suffit). */
.fs-save{height:30px;padding:0 14px;font-size:13px;font-weight:600}
/* Statut d'un en-tête de cadre poussé à droite, comme le statut du cadre Site (Antonio, 03/10/2026). */
.fs-t-droite{margin-left:auto}
/* Peppol dans « Client et facturation » (Antonio, 03/10/2026) : le logo de la facture à la place de la croix. Le
   logo reste du même bleu foncé que les libellés des lignes au-dessus (« Facturé à », « Paiement », « Tarification »)
   et c'est le TEXTE qui porte la réponse : vert si le client est Peppol, rouge sinon. Même écart icône ↔ texte que
   les autres lignes du cadre, pour que la colonne reste homogène. */
.fs-peppol{align-items:center;gap:9px}
.fs-peppol-ico{display:inline-flex;align-items:center;flex:none;color:#142D52}
.fs-peppol-txt{font-weight:600}
.fs-peppol-txt.oui{color:#00A85A}
.fs-peppol-txt.non{color:#D32F2F}
/* Cadre Maintenance (Antonio, 03/10/2026, fin de soirée) : l'icône du titre ET l'état prennent la couleur de la
   maintenance — vert actif, rouge inactif, ambre pour les états intermédiaires. L'état est un bouton qui ouvre la
   boîte « Maintenance du site », comme le statut du cadre Site ouvre la sienne. */
.fs-t-maint > i{color:var(--fs-etat) !important}
.fs-t-maint .fs-t-statut{color:var(--fs-etat)}
button.fs-t-statut{background:none;border:none;padding:0;font:inherit;font-weight:700;font-size:13px;cursor:pointer}
button.fs-t-statut:hover{text-decoration:underline}
/* Cadenas du technicien : rouge quand le technicien est fixé sur ce site. */
.fs-cadenas-btn.on{color:#D32F2F !important;border-color:#f2b8b1 !important}
.fs-cadenas .fa-lock{color:#D32F2F !important}
/* Ligne du technicien attitré (Antonio, 03/10/2026) : nom, « verrouillé », liste, enregistrement et cadenas sur UNE
   seule ligne. Les gestes sont poussés à droite et ne se replient jamais ; c'est le nom qui se tronque si la place
   manque. */
.fs-techrow{flex-wrap:nowrap;align-items:center}
.fs-technom{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fs-techact{margin-left:auto;display:inline-flex;align-items:center;gap:6px;flex:none}
.fs-techact form{margin:0 !important}
.fs-techact select{max-width:150px}
/* Raison de l'inactivité de la maintenance, dans le cadre (Antonio, 03/10/2026) : l'information compte, elle est
   donc lisible sans crier — ambre, le rouge restant réservé à l'état lui-même dans l'en-tête. */
.fs-maint-raison{color:#8a5a1e;font-weight:600}
/* Journal : le nom de l'utilisateur juste après la date, en gras (Antonio, 03/10/2026) — il était entre parenthèses
   en fin de ligne, il fallait lire toute la ligne pour savoir qui avait agi. */
.log-qui{color:#142D52;font-weight:700}

/* ---- Cadre « Accès et clés » du formulaire de site (Antonio, 03/10/2026) : deux colonnes — à gauche
   l'organisation du site (qui s'en occupe, quand c'est ouvert), à droite les clés et la façon d'entrer. ---- */
.ac-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 26px;align-items:start}
@media (max-width:760px){.ac-cols{grid-template-columns:1fr}}
.ac-col{display:flex;flex-direction:column;gap:12px;min-width:0}
.ac-sub{font-weight:600;font-size:13px;color:#142D52;border-bottom:1px solid #EEF1F5;padding-bottom:6px}
/* « Clés à disposition » : Oui en vert gras, Non en noir normal — l'information se lit sans entrer dans la liste. */
select.ac-oui{color:#00A85A;font-weight:700}
/* Le champ « Accès » grandit avec le contenu, se bloque à QUATRE lignes puis défile. La hauteur maximale est posée
   ici : le script qui agrandit ne peut donc pas la dépasser. */
.ac-ta{min-height:36px;max-height:92px;overflow-y:auto;resize:vertical}
/* « Clés à disposition » sur la fiche : Oui en vert gras, Non en noir normal (Antonio, 03/10/2026). */
.fs-cles-oui{color:#00A85A;font-weight:700}
/* Compléments d'une ligne (le type d'accès et l'endroit où trouver la clé, après Oui/Non) : lisibles sans voler la
   vedette à l'information principale (Antonio, 03/10/2026). */
.fs-sec2{color:#596579}
/* Cadre « Accès et clés » : deux vraies colonnes (Antonio, 03/10/2026) — organisation du site à gauche, clés et
   façon d'entrer à droite. En dessous de 520 px, tout se met l'un sous l'autre. */
.fs-acces-col{display:flex;flex-direction:column;gap:10px;min-width:0}
/* « Dernière mise à jour » : petit, en italique, à droite du titre du cadre (fiche et formulaire). */
.ac-maj{margin-left:auto;font-size:11.5px;font-style:italic;font-weight:400;color:#596579;white-space:nowrap}
.ac-titre{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
/* ✓ « Valider cette information » (§71, 04/10/2026) : gris = pas vérifiée récemment, vert = vérifiée ou modifiée depuis moins de N mois. */
.vf-btn{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;border-radius:50%;border:1.5px solid #c7ccd4;background:#fff;color:#c7ccd4;font-size:10px;padding:0;margin-left:6px;cursor:pointer;vertical-align:middle;line-height:1;flex:none}
.vf-btn:hover{border-color:#1a9f4a;color:#1a9f4a}
.vf-btn.ok{border-color:#1a9f4a;background:#1a9f4a;color:#fff}
.vf-btn.ok:hover{background:#15843d;border-color:#15843d}
.vf-btn:disabled{opacity:.5;cursor:wait}
.vf-btn.vf-cadre{width:22px;height:22px;font-size:12px;margin-left:auto}
.fs-t .vf-btn.vf-cadre,.fc-h .vf-btn.vf-cadre{margin-left:auto}
.fs-t .fs-t-act + .vf-btn.vf-cadre,.fs-t .ac-maj + .vf-btn.vf-cadre{margin-left:8px}
.vf-derniere{font-size:12px;color:#596579;font-style:italic;display:flex;align-items:center;gap:6px}
.vf-derniere i{color:#1a9f4a}
/* Formulaire « Modifier un site » (04/10/2026) : les mêmes cadres que la fiche (fs-bloc), deux colonnes, champs à l'intérieur. */
.sf-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start;margin-bottom:16px}
@media (max-width:1000px){.sf-top{grid-template-columns:1fr}}
.sf-col{display:flex;flex-direction:column;gap:18px;min-width:0}
.sf-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px}
.sf-grid .fld{margin-bottom:0;min-width:0}
.sf-grid .fld.full{grid-column:1/-1}
.sf-grid .fld label{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.sf-grid .fld label .muted{font-weight:400}
.sf-grid .fld input,.sf-grid .fld select,.sf-grid .fld textarea{padding:7px 10px;font-size:13.5px}
.sf-sub{font-weight:600;font-size:13px;color:#142D52;border-bottom:1px solid #EEF1F5;padding-bottom:6px;grid-column:1/-1}
.sf-actions{display:flex;gap:10px;justify-content:flex-end;align-items:center;margin:4px 0 22px}
.sf-legende{font-size:12px;color:#596579;display:flex;gap:18px;flex-wrap:wrap;margin-right:auto}
.sf-legende .vf-btn{margin-left:0;cursor:default}
/* Choix multiples en « ronds » (mois de vérification, type d'accès) : des cases à cocher qui ressemblent aux boutons radio de la fiche. */
.ronds{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px 12px;padding:4px 0}
.ronds.deux{grid-template-columns:repeat(2,minmax(0,1fr))}
.rond{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:400;cursor:pointer;min-width:0;margin:0}
.rond input{position:absolute;opacity:0;width:0;height:0;margin:0}
.rond .pt{flex:none;width:13px;height:13px;border-radius:50%;border:1.5px solid #b6bcc7;position:relative;background:#fff}
.rond input:checked + .pt{border-color:var(--brand)}
.rond input:checked + .pt::after{content:'';position:absolute;inset:2.5px;border-radius:50%;background:var(--brand)}
.rond input:focus-visible + .pt{box-shadow:0 0 0 3px rgba(20,45,82,.15)}
@media (max-width:1300px){.ronds{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){.ronds,.ronds.deux{grid-template-columns:1fr}}
/* Supprimer un client (§67, 04/10/2026) : corbeille rouge à côté du crayon, même place que sur la fiche site. */
.fc-del,.fc-h-act .fc-del{color:#c0392b !important;background:none;border:0;padding:0;cursor:pointer;font:inherit;display:inline-flex;align-items:center}
.fc-del:hover{color:#8b1e12 !important}
/* Retours d'Antonio (04/10/2026) : choix « ronds » = vraies cases à cocher visibles, et formulaire du site qui se replie sur une colonne
   quand son cadre est étroit (container queries, comme la fiche client) ; les ✓ ne se voient qu'en modification. */
.rond .pt{display:none}
.sf-grid .fld .rond input,.rond input{position:static;opacity:1;width:15px;height:15px;margin:0;padding:0;flex:none;accent-color:var(--brand,#7020C0);cursor:pointer}
.sf-grid .fld label.rond{font-weight:400;margin:0;display:inline-flex;flex-wrap:nowrap;gap:7px}
.ronds{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1250px){.sf-top{grid-template-columns:1fr}}
.sf-top .fs-bloc{min-width:0}
.sf-grid input,.sf-grid select,.sf-grid textarea{max-width:100%;box-sizing:border-box}
@supports (container-type:inline-size){
  .sf-top .fs-bloc{container-type:inline-size;container-name:sfbloc}
  @container sfbloc (max-width:560px){.sf-grid{grid-template-columns:1fr}.sf-grid .fld.full{grid-column:auto}.ac-cols{grid-template-columns:1fr}.ronds,.ronds.deux{grid-template-columns:repeat(2,minmax(0,1fr))}}
  @container sfbloc (max-width:360px){.ronds,.ronds.deux{grid-template-columns:1fr}}
}
/* Retour d'Antonio (04/10/2026) : « pourquoi les cadres, l'écriture… sont plus grands dans la modification que sur la fiche ? » —
   la nouvelle interface grossit les champs de formulaire (14 / 15 px, hauteur 38 px). Dans les cadres du formulaire site,
   on reprend exactement les tailles de la fiche : texte 13,5 px, libellés 12,5 px, champs 13 px / 32 px, mêmes marges. */
.sf-top{font-size:13.5px;gap:22px;margin-bottom:22px}
.sf-top .fs-body{padding:16px 18px 18px}
.sf-grid{gap:10px 16px}
html.ui2 .sf-top .fld label,.sf-top .fld label{font-size:12.5px;font-weight:600;margin-bottom:4px;color:#142D52}
html.ui2 .sf-top .fld label .muted,.sf-top .fld label .muted{font-size:11.5px}
html.ui2 .sf-top .fld input,html.ui2 .sf-top .fld select,.sf-top .fld input,.sf-top .fld select{font-size:13px;height:32px;padding:0 9px;border-radius:7px}
html.ui2 .sf-top .fld textarea,.sf-top .fld textarea{font-size:13px;padding:6px 9px;border-radius:7px;height:auto}
html.ui2 .sf-top .fld input[type=checkbox],html.ui2 .sf-top .fld input[type=radio],.sf-top .fld input[type=checkbox],.sf-top .fld input[type=radio]{width:15px;height:15px}
.sf-top .sub,.sf-top .fld .sub{font-size:11.5px;line-height:1.35;margin-top:3px}
html.ui2 .sf-top .fld label.rond,.sf-top .fld label.rond{font-size:13px;font-weight:400;color:#202124}
.sf-top .sf-sub,.sf-top .ac-sub{font-size:12.5px}
.sf-top .ac-cols{gap:12px 22px}
.sf-top .ac-col{gap:10px}
.sf-top #pos-carte{height:220px}
.sf-actions{font-size:13px}
/* TAILLE UNIQUE du texte courant des cadres de la fiche site : 12,5 px (Magali et Antonio, 04/10/2026 — « Syndic et le n° BCE
   n'ont pas la même taille que "aucune activité", c'est cette taille qui est la référence »). L'inventaire fait dans Chrome
   montrait 12,5 / 13 / 13,5 px mélangés, et 11,5 px pour « Dernière mise à jour ». Les titres de cadre restent à 15,5 px.
   Règles écrites en dernier et avec assez de poids pour passer devant celles, plus anciennes, de chaque cadre. */
.fs-top .fs-bloc .fs-row,.fs-top .fs-bloc .fs-acces-grid .fs-row,.fs-top .fs-bloc .fs-mailrow,.fs-top .fs-bloc.fs-site .fs-kv .fs-row.fs-n3{font-size:12.5px}
.fs-top .fs-bloc .fs-t-statut,.fs-top .fs-bloc button.fs-t-statut,.fs-top .fs-bloc .site-toggle,.fs-top .fs-bloc .ac-maj{font-size:12.5px}
/* Uniformisation, suite (Antonio, 04/10/2026 : « tu n'as pas uniformisé les tailles dans tous les cadres ») : le nom du client
   du cadre « Client et facturation », les zones de texte, listes, champs et boutons des cadres passent eux aussi à 12,5 px.
   Seule la TAILLE change : couleurs, graisses, liens et italiques restent ceux d'avant. Les titres de cadre gardent 15,5 px. */
.fs-top .fs-bloc .fs-body .fs-client-nom,.fs-top .fs-bloc .fs-body a.fs-client-nom{font-size:12.5px}
.fs-top .fs-bloc .fs-body textarea,.fs-top .fs-bloc .fs-body .fs-ta,.fs-top .fs-bloc .fs-body select,.fs-top .fs-bloc .fs-body input,
.fs-top .fs-bloc .fs-body .btn,.fs-top .fs-bloc .fs-body button,.fs-top .fs-bloc .fs-body .fs-save,.fs-top .fs-bloc .fs-body .pill{font-size:12.5px}
/* FORMULAIRE « Modifier un site » : même logique que les fiches (Antonio, 04/10/2026) — tout le texte des cadres à 12,5 px
   (libellés, aides, champs, listes déroulantes, cases, petits boutons), titres de cadre à 15,5 px. Champs et listes : un seul
   habillage, 32 px de haut, rayon 8 px, bordure #CFD3DC — le standard retenu pour les formulaires de Go4 (le formulaire
   client suit le même). La carte Google garde ses propres mentions. */
html.ui2 .sf-top,.sf-top,.sf-actions,.sf-legende{font-size:12.5px}
html.ui2 .sf-top .fld label .muted,.sf-top .fld label .muted,.sf-top .sub,.sf-top .fld .sub,.sf-top .muted,.sf-top .small,
html.ui2 .sf-top .fld label.rond,.sf-top .fld label.rond,.sf-top .ronds .rond,.sf-top .sf-sub,.sf-top .ac-sub,.sf-top .ac-maj,
.sf-top .vf-derniere,.sf-actions .vf-derniere,.sf-top .fs-body .btn,.sf-top .fs-body button,.sf-top .fs-body .pill,.sf-top .fs-body a,
.sf-top .fs-body span:not(.fs-ico-bce),.sf-top .fs-body b,.sf-top .fs-body div{font-size:12.5px}
html.ui2 .sf-top .fld input,html.ui2 .sf-top .fld select,.sf-top .fld input,.sf-top .fld select,
html.ui2 .sf-top .fs-body input:not([type=checkbox]):not([type=radio]):not([type=hidden]),html.ui2 .sf-top .fs-body select{font-size:12.5px;height:32px;padding:0 9px;border-radius:8px;border-color:#CFD3DC}
html.ui2 .sf-top .fld textarea,.sf-top .fld textarea,html.ui2 .sf-top .fs-body textarea{font-size:12.5px;padding:6px 9px;border-radius:8px;border-color:#CFD3DC}
.sf-top #pos-carte,.sf-top #pos-carte *{font-size:revert}
html.ui2 .sf-top .fs-body .btn,html.ui2 .sf-top .fs-body button,html.ui2 .sf-top .fs-body .btn.sm{font-size:12.5px}
/* RÈGLE UNIQUE de l'écart icône → texte (Antonio, 04/10/2026 : « la règle des écarts entre l'icône et le texte aussi doit être
   uniformisée ») : une colonne d'icône de 22 px, icône centrée dedans, puis 0,5 cm (10 px jusqu'au 04/10 au soir) — le texte commence
   au même endroit dans TOUS les cadres des fiches (même règle sur la fiche client, ui2.css). Mesuré dans Chrome avant correction
   sur la fiche site : 29, 25, 33 et 24 px selon le cadre. Les logos BCE / TVA et le logo Peppol tiennent dans la même colonne. */
.fs-top .fs-bloc .fs-row,.fs-top .fs-bloc .fs-row.fs-peppol{gap:.5cm}
/* 04/10/2026, nuit — l'écart devient 0,5 cm (au lieu de 10 px), et les lignes « icône → libellé → valeur » (e-mails) suivent
   une seule structure en grille : icône, 0,5 cm, libellé, 0,5 cm, valeur (Antonio). Quand les deux e-mails d'un cadre passent
   l'un sous l'autre (écran étroit), la colonne des libellés prend la largeur du plus long : les valeurs restent alignées. */
.fs-top .fs-bloc .fs-mailrow{display:grid;grid-template-columns:22px .5cm max-content .5cm minmax(0,1fr);gap:0;align-items:baseline}
.fs-top .fs-bloc .fs-mailrow > i{grid-column:1}
.fs-top .fs-bloc .fs-mailrow > .fs-maillbl{grid-column:3;white-space:nowrap}
.fs-top .fs-bloc .fs-mailrow > :nth-child(3){grid-column:5;min-width:0}
/* AUTO-ADAPTATION DES CADRES (Antonio, 04/10/2026, nuit : « faire les cadres en auto-adaptation par rapport à l'adresse mail,
   en gardant une largeur maximum ; la largeur doit être égale entre les cadres de droite et de gauche », « l'adresse ne doit
   pas passer en dessous de l'autre, elle reste sur une ligne », « ne rien changer à la disposition ni aux écarts : ce sont
   les cadres qui doivent s'agrandir si le mail est plus long ») :
   - à l'intérieur, RIEN ne change : deux e-mails côte à côte en deux moitiés égales, mêmes écarts ;
   - si une adresse ne tient pas sur sa ligne, le script de la fiche élargit la page — donc les deux cadres de la rangée,
     ensemble, toujours de même largeur — de ce qu'il faut, jusqu'à un maximum (voir sites/show) ; la classe fs-mesure sert
     à mesurer l'adresse sans retour à la ligne ;
   - au-delà du maximum (ou sur un écran trop étroit), l'adresse continue à la ligne DANS sa moitié : rien n'est coupé ;
   - les libellés d'un cadre ont tous la largeur du plus long (attribut data-large) : les valeurs commencent au même endroit. */
.fs-top .fs-bloc .fs-mailgrid > .fs-mailrow,.fs-top .fs-bloc .fs-acces-grid > .fs-acces-col{min-width:0}
.fs-top .fs-bloc .fs-mailgrid.fs-mesure .fs-mailrow > :nth-child(3){white-space:nowrap}
.fs-top .fs-bloc .fs-maillbl[data-large]::after,.fs-top .fs-bloc .fs-acces-col .fs-lbl[data-large]::after{content:attr(data-large);display:block;height:0;overflow:hidden;visibility:hidden;white-space:nowrap}
/* « Accès et clés » : mêmes lignes icône → libellé → valeur. Chaque colonne du cadre est une grille dont la colonne des
   libellés prend la largeur du plus long (« Personne pour l'accès », « Accès / instructions ») : les réponses sont alignées. */
@supports (grid-template-columns: subgrid) {
  .fs-top .fs-bloc .fs-acces-col{display:grid;grid-template-columns:22px .5cm max-content .5cm minmax(0,1fr);gap:10px 0;align-content:start}
  .fs-top .fs-bloc .fs-acces-col > .fs-row{display:grid;grid-column:1 / -1;grid-template-columns:subgrid;gap:0;align-items:baseline}
  .fs-top .fs-bloc .fs-acces-col > .fs-row > i{grid-column:1}
  .fs-top .fs-bloc .fs-acces-col > .fs-row > .fs-lbl{grid-column:3;margin-right:0;white-space:nowrap}
  .fs-top .fs-bloc .fs-acces-col > .fs-row > .fs-v{grid-column:5;min-width:0}
}
/* Rien ne doit sortir d'un cadre (Antonio, 04/10/2026, nuit : « tout n'est pas visible ») : un texte long — ou un mot sans
   espace, une adresse — passe à la ligne à la largeur de sa colonne et le cadre grandit en HAUTEUR. Les deux cadres d'une
   rangée gardent la même largeur (grille 1fr / 1fr, jamais élargie par le contenu) et la même hauteur. */
.fs-top .fs-bloc .fs-row > .fs-v,.fs-top .fs-bloc .fs-row > a,.fs-top .fs-bloc .fs-mailrow > :nth-child(3){overflow-wrap:anywhere;min-width:0}
/* Lignes SANS icône (cadre Maintenance : « Sous contrat depuis », « Vérification en », « Raison ») : pas concernées par la
   règle, elles gardent leur écart d'avant (10 px). */
.fs-top .fs-bloc .fs-row:has(> .fs-lbl:first-child){gap:10px}
.fs-top .fs-bloc .fs-row > i,.fs-top .fs-bloc .fs-mailrow > i,.fs-top .fs-bloc .fs-row > .fs-ico-bce,.fs-top .fs-bloc .fs-row > .fs-peppol-ico,
.fs-top .fs-bloc .fs-row > .fs-ico-balance,.fs-top .fs-bloc .fs-acces-grid .fs-row > i{width:22px;min-width:22px;flex:none;text-align:center;justify-content:center}

/* §111 (Antonio, 10/10/2026) : bandeau « Base d'essais » / « Base propre » tout en haut, au-dessus de la barre principale, sur
   toute la largeur ; ses couleurs et son texte restent ceux du bandeau (partials/base-bandeau), seule sa marge du bas tombe. */

/* Ligne d'onglets avec des commandes à droite (Facturation, 10/10/2026 — même principe qu'Infos société, §111) : sur une ligne quand
   la place le permet ; sinon les commandes passent dessous, à droite (classe « deux » posée par public/js/onglets-ligne.js). */
.onglets-ligne{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:0 16px;border-bottom:1px solid var(--line);margin:0 0 12px}
.onglets-ligne > .subtabs{flex:0 0 auto;border-bottom:0;margin:0}
.onglets-ligne > .onglets-cmd{flex:0 1 auto;margin-left:auto;display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px 10px;padding:0 0 6px}
.onglets-ligne.deux{border-bottom:0}
.onglets-ligne.deux > .subtabs{flex:1 1 100%;border-bottom:1px solid var(--line)}
.onglets-ligne.deux > .onglets-cmd{flex:1 1 100%;padding:8px 0 0}