[hidden]{display:none!important}
:root{
  --bg:#f6f6f8;--panel:#fff;--ink:#1b1d24;--muted:#626977;--line:#e6e7ec;
  --accent:#d8141c;--accent-hover:#b50f16;--accent-soft:#fdecec;
  --grad:linear-gradient(100deg,#f26b4f 0%,#d8141c 45%,#e0006e 100%);
  --ok:#15803d;--ok-soft:#e3f5ea;
  --head:#fff;--head-ink:#4b5160;--head-line:#ececf0;
  --warn:#9a6700;--warn-soft:#fff4d6;--bad:#b42318;--bad-soft:#fde8e7;--info-soft:#eef1f8;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#111115;--panel:#1a1a20;--ink:#ececf1;--muted:#a0a3b0;--line:#2b2b33;
  --accent:#ff4a52;--accent-hover:#ff6b72;--accent-soft:#3a1519;
  --ok:#4ade80;--ok-soft:#12301f;
  --head:#17171c;--head-ink:#c9cad3;--head-line:#2b2b33;
  --warn:#f0c04a;--warn-soft:#3a3016;--bad:#ff7a6e;--bad-soft:#3d1c1a;--info-soft:#1f2330;}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.5 "Poppins",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--accent)}
main{max-width:1240px;margin:0 auto;padding:22px 28px 60px}
h1{font-size:25px;margin:0 0 4px;font-weight:700;letter-spacing:-.015em;color:var(--ink);text-wrap:balance}
h2{font-size:15px;margin:0}
.sub{color:var(--muted);margin:0 0 22px}
.bar{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin-bottom:20px}
.bar .grow{flex:1;min-width:220px}
.btn{display:inline-flex;align-items:center;gap:6px;background:var(--accent);color:#fff;border:0;border-radius:8px;padding:9px 16px;font:inherit;font-weight:600;text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--accent-hover)}
.btn.ghost:hover{background:var(--bg);border-color:var(--accent);color:var(--accent)}
.btn:disabled{opacity:.55;cursor:default}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--line)}
.btn.danger{background:var(--bad)}
.btn.sm{padding:5px 10px;font-size:13px}
.btn.link{background:none;color:var(--accent);padding:0;font-weight:600}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:12px}
.ph{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 18px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.pad{padding:16px 18px}
.stack>*+*{margin-top:18px}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,330px),1fr));gap:18px;align-items:start}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:14px;margin-bottom:18px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px;text-decoration:none;color:inherit;display:block}
.card .k{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600}
.card .v{font-size:26px;font-weight:700;margin-top:4px}
.card .v small{font-size:15px;color:var(--muted);font-weight:500}
.card .s{font-size:13px;color:var(--muted)}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600}
tr:last-child td{border-bottom:0}
td .s{color:var(--muted);font-size:13px}
.table-wrap{overflow-x:auto}
.mono{font-family:var(--mono);font-size:13px}
.pill{display:inline-flex;align-items:center;gap:6px;padding:2px 9px;border-radius:99px;font-size:12px;font-weight:600;white-space:nowrap}
.pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.pill.ok{background:var(--ok-soft);color:var(--ok)}
.pill.wait{background:var(--warn-soft);color:var(--warn)}
.pill.bad{background:var(--bad-soft);color:var(--bad)}
.pill.off{background:var(--bg);color:var(--muted)}
.empty{padding:36px 20px;text-align:center;color:var(--muted)}
.flash{padding:12px 16px;border-radius:10px;margin-bottom:18px;background:var(--ok-soft);color:var(--ok);font-weight:600}
.flash.bad{background:var(--bad-soft);color:var(--bad)}
.flash.warn{background:var(--warn-soft);color:var(--warn)}
.note{padding:12px 16px;border-radius:10px;background:var(--info-soft);font-size:14px}
form.grid,div.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px;padding:20px 18px}
.full{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:6px;font-weight:600;font-size:14px}
input,select,textarea{font:inherit;font-weight:400;padding:9px 11px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--ink);width:100%}
input[readonly]{background:var(--bg);color:var(--muted)}
input[type=checkbox]{width:auto}
input:focus,select:focus,textarea:focus{outline:2px solid var(--accent);outline-offset:0;border-color:var(--accent)}
.hint{font-weight:400;color:var(--muted);font-size:13px}
.err{font-weight:500;color:var(--bad);font-size:13px}
.has-err input,.has-err select{border-color:var(--bad)}
.actions{grid-column:1/-1;display:flex;gap:10px;justify-content:flex-end;border-top:1px solid var(--line);padding-top:16px;flex-wrap:wrap}
details{grid-column:1/-1;border:1px solid var(--line);border-radius:10px;padding:10px 14px}
details summary{cursor:pointer;font-weight:600;font-size:14px}
details .inner{display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;margin-top:14px}
dl{margin:0;padding:6px 18px}
dl>div{display:grid;grid-template-columns:160px minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1px solid var(--line)}
dl>div:last-child{border-bottom:0}
dt{color:var(--muted)}
dd{margin:0;word-break:break-word}
.code{font-family:var(--mono);font-size:12.5px;white-space:pre-wrap;word-break:break-all;overflow-wrap:anywhere;max-width:100%;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:12px;margin:0}
.copy{font:inherit;font-size:12px;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:6px;padding:3px 9px;cursor:pointer}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:99px;padding:6px 12px;cursor:pointer;font-weight:500;user-select:none}
.chip input{margin:0}
.chip.on{border-color:var(--accent);background:var(--accent-soft)}
.op-info{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--muted);background:var(--bg);border-radius:10px;padding:10px 14px}
.op-info b{color:var(--ink);font-weight:600}
/* Assistant */
.wizard{max-width:720px;margin:4vh auto 0}
.steps{display:flex;gap:6px;margin:0 0 20px;padding:0;list-style:none;flex-wrap:wrap}
.steps li{flex:1;min-width:120px;font-size:13px;color:var(--muted);border-top:3px solid var(--line);padding-top:8px}
.steps li.on{color:var(--ink);font-weight:600;border-color:var(--accent)}
.steps li.done{color:var(--ok);border-color:var(--ok)}
.drop{border:2px dashed var(--line);border-radius:12px;padding:36px 20px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.drop.over,.drop:hover{border-color:var(--accent);background:var(--accent-soft)}
.drop strong{display:block;font-size:16px;margin-bottom:4px}
.progress{list-style:none;margin:0;padding:6px 18px}
.progress li{display:grid;grid-template-columns:26px 1fr;gap:8px;padding:10px 0;border-bottom:1px solid var(--line)}
.progress li:last-child{border-bottom:0}
.progress .ic{font-weight:700}
.progress .run .ic{color:var(--muted)}
.progress .ok .ic{color:var(--ok)}
.progress .warn .ic{color:var(--warn)}
.progress .error .ic{color:var(--bad)}
.spin{display:inline-block;width:14px;height:14px;border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;vertical-align:-2px}
@keyframes spin{to{transform:rotate(360deg)}}
.login{max-width:400px;margin:10vh auto 0}
.login form{display:flex;flex-direction:column;gap:14px;padding:22px}
footer{max-width:1240px;margin:0 auto;padding:0 28px 30px;color:var(--muted);font-size:12px}
@media (max-width:760px){
  form.grid,div.grid,details .inner{grid-template-columns:1fr}
  dl>div{grid-template-columns:1fr;gap:2px}
  .hide-sm{display:none}
  header nav{order:3;flex-basis:100%}
}
.pw-wrap{position:relative;display:block}
.pw-wrap input{padding-right:42px}
.pw-eye{position:absolute;right:4px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--muted);padding:6px;cursor:pointer;display:flex;border-radius:6px}
.pw-eye:hover{color:var(--ink)}
.pw-eye:focus-visible{outline:2px solid var(--accent)}
/* Utilisateurs */
.filters{display:flex;gap:12px 18px;align-items:center;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid var(--line)}
.filters input[type=search]{flex:1;min-width:220px}
label.check{flex-direction:row;align-items:center;gap:8px;font-weight:500;cursor:pointer}
label.check input{width:auto;margin:0}
tr.click{cursor:pointer}
tr.click:hover td{background:var(--bg)}
td a{color:inherit;font-weight:600;text-decoration:none}
.fw{font-size:13px;line-height:1.35;padding:1px 0}
.fw.warn{color:var(--warn);font-weight:600}
.fw.bad{color:var(--bad);font-weight:600}
.fw.info{color:var(--ink)}
.back{display:inline-block;margin-bottom:10px;font-size:14px;text-decoration:none}
.fwsum{margin-bottom:14px}
.tabs{display:flex;gap:2px;overflow-x:auto;border-bottom:1px solid var(--line);margin:18px 0 0;scrollbar-width:none}
.tabs a{padding:10px 11px;text-decoration:none;color:var(--muted);font-weight:600;font-size:13.5px;white-space:nowrap;border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs a.on{color:var(--accent);border-bottom-color:var(--accent)}
.panel.tabbed{border-top-left-radius:0;border-top-right-radius:0;border-top:0}
textarea{resize:vertical}
fieldset{border:1px solid var(--line);border-radius:10px;padding:14px 16px 16px;margin:0;display:flex;flex-direction:column;gap:14px}
legend{font-weight:700;padding:0 6px;font-size:14px}
.dl{display:block;font-weight:600;font-size:14px;margin-bottom:6px}
.dest .row{display:flex;gap:10px;flex-wrap:wrap}
.dest .row>*{flex:1;min-width:180px}
.dest .row [hidden]{display:none}
.dest.has-err select,.dest.has-err input{border-color:var(--bad)}
.dest .err{display:block;margin-top:6px}
.short{max-width:260px}
.suffix{display:flex}
.suffix input{border-top-right-radius:0;border-bottom-right-radius:0}
.suffix span{display:flex;align-items:center;padding:0 12px;border:1px solid var(--line);border-left:0;border-radius:0 8px 8px 0;background:var(--bg);color:var(--muted);font-weight:400;font-size:14px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;flex-wrap:wrap}
.seg label{position:relative;flex-direction:row;padding:8px 16px;cursor:pointer;font-weight:600;font-size:14px;border-right:1px solid var(--line)}
.seg label:last-child{border-right:0}
.seg input{position:absolute;inset:0;width:100%;height:100%;opacity:0;margin:0;pointer-events:none}
.seg label.on{background:var(--accent-soft);color:var(--accent)}
.seg label:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:-2px}
.creds dd .copy{margin-left:6px}
.creds dd .s{color:var(--muted);font-size:13px;margin-top:4px}
.secret{display:inline-block;min-width:220px}
.secret input{font-family:var(--mono);font-size:13px;padding:6px 10px}
.form-msg:empty{display:none}
.form-msg .err{display:block;padding:10px 14px;background:var(--bad-soft);border-radius:8px}
.warnbox{border:1px solid var(--warn);background:var(--warn-soft);border-radius:10px;padding:14px 16px}
.warnbox h2{color:var(--warn);margin-bottom:6px}
.warnbox ul{margin:8px 0 12px;padding-left:20px}
.warnbox li{margin:4px 0}
.warnbox .row{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
/* Téléphone IP / touches */
h3.sec{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:6px 0 0}
.provbox{display:flex;flex-direction:column;gap:12px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:14px 16px;font-size:14px}
.provbox .row{display:flex;gap:8px;flex-wrap:wrap}
.provbox .mono{word-break:break-all}
.keys{display:flex;flex-direction:column;gap:8px}
.keyrow{display:grid;grid-template-columns:28px minmax(150px,1.1fr) minmax(150px,1.3fr) minmax(120px,1fr) auto;gap:8px;align-items:center}
.keyrow .kn{font-weight:700;color:var(--muted);text-align:right}
.keyrow .kb{display:flex;gap:4px}
.keyrow .kb .btn{padding:5px 9px}
.stack .row{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:760px){.keyrow{grid-template-columns:24px 1fr;}.keyrow>*:not(.kn){grid-column:2}.keyrow .kv{display:none}}
.dev{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:7px;background:var(--bg);color:var(--muted);flex:none}
.dev.phone{color:var(--accent);background:var(--accent-soft)}
.dev.pc{color:#3b6fd6;background:var(--info-soft)}
.dev.mobile{color:#8a4fd6;background:#f1e9fd}
.dev.web{color:var(--warn);background:var(--warn-soft)}
@media (prefers-color-scheme:dark){.dev.mobile{background:#2a1f3d;color:#c4a1f5}.dev.pc{color:#8fb0f5}}
.devs{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.devcell{display:flex;align-items:center;gap:10px}
.filters .seg{margin:0}
.qr{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.qrimg{width:200px;background:#fff;border-radius:10px;padding:6px;border:1px solid var(--line)}
.qrimg svg{display:block;width:100%;height:auto}
.appbox .row{display:flex;gap:8px;flex-wrap:wrap}
td.acts{text-align:right;white-space:nowrap}

/* ---------- Gestion d'appels */
.cf-form .grid3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:16px 18px;align-items:start}
.cf-form .grid2{gap:16px 18px;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:720px){.cf-form .grid2{grid-template-columns:1fr}}
.cf-h{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:26px 0 0;padding-bottom:8px;border-bottom:1px solid var(--line)}
.cf-sec .dl{margin-bottom:8px}
.ic{border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:8px;min-width:30px;height:30px;padding:0 6px;cursor:pointer;font:inherit;font-size:14px;line-height:1}
.ic:hover:not(:disabled){color:var(--accent);border-color:var(--accent)}
.ic:disabled{opacity:.35;cursor:default}
.ic.big{min-width:40px;height:40px;font-size:16px}
.ic.rec{background:var(--bad);color:#fff;border-color:var(--bad);animation:blinkr 1s infinite}
@keyframes blinkr{50%{opacity:.6}}
.members .mlist{list-style:none;margin:0 0 10px;padding:0;border:1px solid var(--line);border-radius:10px;max-height:320px;overflow:auto}
.members .mlist li{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--line)}
.members .mlist li:last-child{border-bottom:0}
.members .mlist li.s{color:var(--muted)}
.members .grow{flex:1;min-width:0}
.members .row{display:flex;gap:8px;flex-wrap:wrap}
.members .row select{flex:1;min-width:200px;width:auto}
.pplay{display:flex;align-items:center;gap:10px;margin-top:8px;flex-wrap:wrap}
.pplay[hidden]{display:none}
.pplay .psel{flex:1;min-width:180px;width:auto}
.switch{flex-direction:row;align-items:center;gap:8px;font-weight:500;color:var(--muted);cursor:pointer}
.switch input{position:absolute;opacity:0;width:1px;height:1px}
.switch span{width:34px;height:20px;border-radius:10px;background:var(--line);position:relative;transition:background .15s;flex:none}
.switch span::after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#fff;transition:transform .15s;box-shadow:0 1px 2px rgba(0,0,0,.2)}
.switch input:checked+span{background:var(--accent)}
.switch input:checked+span::after{transform:translateX(14px)}
.switch input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.pfield .prow{display:flex;gap:8px;align-items:center}
.pfield .prow select{flex:1;width:auto;min-width:0}
.pfield .hint{display:block;margin-top:6px}
.ivrkeys td{padding:8px 10px;vertical-align:top}
.ivrkeys td:first-child{width:70px}
.kbadge{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-weight:700}
.week{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.week .day{display:flex;align-items:center;gap:14px;padding:8px 12px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.week .day:last-child{border-bottom:0}
.week .dname{width:130px;font-weight:600}
.week .ranges{display:flex;gap:10px;flex-wrap:wrap;align-items:center;flex:1}
.week .rng{display:inline-flex;align-items:center;gap:6px;background:var(--bg);border-radius:8px;padding:4px 6px}
.week input[type=time]{width:auto;padding:5px 7px}
.holrow{display:flex;gap:8px;align-items:center;margin-top:8px;flex-wrap:wrap}
.holrow input{width:auto}
.holrow input:not([type]){flex:1;min-width:180px}
.perrow{display:flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid var(--line);border-radius:8px;margin-bottom:6px}
.perlist{margin-bottom:8px}
.tracebar{display:flex;gap:10px;flex-wrap:wrap}
.tracebar input{flex:1;min-width:240px;font-size:16px}
.tsum{display:flex;gap:10px;align-items:center;margin:18px 0 6px}
.tree,.tree ul{list-style:none;margin:0;padding:0}
.tree ul{margin-left:22px;padding-left:16px;border-left:2px solid var(--line)}
.tn{margin:10px 0;position:relative}
.tree ul>.tn::before{content:"";position:absolute;left:-16px;top:22px;width:14px;border-top:2px solid var(--line)}
.tn .tl{display:inline-block;font-size:12px;font-weight:600;color:var(--muted);background:var(--bg);border-radius:6px;padding:2px 8px;margin-bottom:4px}
.tn.cur>.tl{background:var(--accent);color:#fff}
.tn .tb{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-left:4px solid var(--ok);border-radius:10px;padding:9px 12px;background:var(--panel);max-width:760px}
.tn.warn>.tb{border-left-color:#f59e0b;background:var(--warn-soft)}
.tn.bad>.tb{border-left-color:var(--bad);background:var(--bad-soft)}
.tn.info>.tb{border-left-color:#6b7280}
.tn .ti{width:24px;text-align:center;font-size:16px;flex:none}
.tn .td{color:var(--muted);font-size:13px;margin-top:2px}
@media (max-width:640px){.tree ul{margin-left:8px;padding-left:10px}.week .dname{width:auto}}

/* Journal des appels */
.dirc{display:inline-flex;width:28px;height:28px;border-radius:50%;align-items:center;justify-content:center;font-weight:700;background:var(--info-soft)}
.dirc.in{background:var(--ok-soft);color:var(--ok)}
.dirc.out{background:var(--accent-soft);color:var(--accent)}
table.cdr td{font-size:14px}
.filters select{width:auto}
.phrow{display:flex;gap:8px;margin-bottom:8px;align-items:center}.phrow select{width:130px}.phrow input{flex:1}

/* ---------- Routages : éditeur */
.fx{overflow:visible}
.fx-top{display:flex;align-items:center;gap:14px;padding:14px 18px;border-bottom:1px solid var(--line);flex-wrap:wrap}
.fx-back{color:var(--muted);text-decoration:none;font-size:14px;white-space:nowrap}
.fx-back:hover{color:var(--accent)}
.fx-name{flex:1;min-width:220px;font-size:17px;font-weight:600;border-color:transparent;background:transparent;padding:8px 10px}
.fx-name:hover{border-color:var(--line)}
.fx-actions{display:flex;gap:8px;flex-wrap:wrap}
.fx-nl{border-bottom:1px solid var(--line)}
.fx-nl summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:8px;padding:12px 18px;font-weight:600;color:var(--accent);font-size:14px}
.fx-nl summary::-webkit-details-marker{display:none}
.fx-nl summary::after{content:"▾";margin-left:auto;color:var(--muted);transition:transform .15s}
.fx-nl:not([open]) summary::after{transform:rotate(-90deg)}
.fx-nlb{padding:0 18px 16px}
.fx-nlb textarea{margin-bottom:10px}
.fx-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.fx-prop{margin-top:12px;background:var(--bg);border-radius:10px;padding:12px 14px;font-size:14px}
.fx-prop ul{margin:6px 0 0;padding-left:20px}
.fx-warn{margin-top:10px;color:var(--warn);font-size:14px}
.fx-warn ul{margin:4px 0 0;padding-left:20px}
.fx-entry{display:flex;gap:12px;align-items:stretch;padding:16px 18px;flex-wrap:wrap;border-bottom:1px solid var(--line)}
.fx-box{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--panel);min-width:240px;flex:1;max-width:460px}
.fx-bi{width:34px;height:34px;border-radius:9px;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;flex:none}
.fx-bc{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.fx-bl{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.fx-bc select{padding:6px 9px;font-size:14px}
.fx-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.fx-chip{display:inline-flex;align-items:center;gap:4px;background:var(--bg);border:1px solid var(--line);font-weight:600;font-size:13.5px;border-radius:99px;padding:3px 4px 3px 11px;font-variant-numeric:tabular-nums}
.fx-chip button{border:0;background:none;color:var(--muted);cursor:pointer;display:flex;padding:3px;border-radius:50%}
.fx-chip button:hover{color:var(--bad);background:var(--bad-soft)}
.fx-add{width:auto;padding:4px 8px;font-size:13px}
.fx-other{width:150px;padding:4px 8px;font-size:13px}
.fx-other.bad{border-color:var(--bad)}
.fx-def{align-self:center;font-size:14px}
.fx-tabs{display:flex;gap:4px;padding:10px 18px 0;border-bottom:1px solid var(--line);overflow-x:auto}
.fx-tabs button{border:0;background:none;font:inherit;font-weight:600;font-size:14px;color:var(--muted);padding:8px 12px 10px;border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer;display:flex;flex-direction:column;align-items:flex-start;white-space:nowrap}
.fx-tabs button .s{font-weight:400;font-size:12px}
.fx-tabs button.on{color:var(--accent);border-bottom-color:var(--accent)}
.fx-stage{padding:22px 18px 26px;overflow-x:auto}
.fx-chain{display:flex;align-items:center;width:max-content;min-width:100%;position:relative}
.fx-start{display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--muted);font-size:12px;font-weight:600;width:88px;text-align:center}
.fx-start svg{width:44px;height:44px;padding:10px;border-radius:50%;background:var(--ok-soft);color:var(--ok);box-sizing:border-box}
.fx-link{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:92px;color:var(--muted);align-self:stretch;border-radius:10px;transition:background .12s}
.fx-link span{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.03em;min-height:15px;text-align:center}
.fx-ins{position:absolute;bottom:-4px;border:1px solid var(--line);background:var(--panel);color:var(--muted);border-radius:50%;width:24px;height:24px;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity .12s}
.fx-link:hover .fx-ins,.fx-ins:focus-visible{opacity:1}
.fx-ins:hover{color:var(--accent);border-color:var(--accent)}
.fx-dragging .fx-link{background:var(--accent-soft);outline:1px dashed var(--accent)}
.fx-link.over{background:var(--accent);color:#fff}
.fx-card{width:210px;flex:none;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:12px 12px 10px;cursor:pointer;box-shadow:0 1px 2px rgba(20,20,40,.04);transition:border-color .12s,box-shadow .12s}
.fx-card:hover{border-color:var(--accent);box-shadow:0 6px 18px rgba(20,20,40,.08)}
.fx-card.sel{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.fx-card.bad{border-color:var(--bad)}
.fx-card.dragging{opacity:.4}
.fx-ch{display:flex;align-items:center;gap:9px}
.fx-ci{width:34px;height:34px;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;flex:none}
.fx-card.end .fx-ci,.fx-tile.end .fx-ci{background:var(--info-soft);color:var(--ink)}
.fx-ct{flex:1;font-weight:700;font-size:14px}
.fx-grip{color:var(--line);cursor:grab;display:flex}
.fx-card:hover .fx-grip{color:var(--muted)}
.fx-cs{font-size:13px;color:var(--muted);margin-top:8px;line-height:1.4;min-height:18px}
.fx-err{font-size:12px;color:var(--bad);font-weight:600;margin-top:6px}
.fx-addbtn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:170px;min-height:88px;border:2px dashed var(--line);border-radius:14px;background:transparent;color:var(--muted);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.fx-addbtn:hover,.fx-addbtn.on{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)}
.fx-endnote{font-size:12px;color:var(--muted);margin-left:12px;font-style:italic}
.fx-same{padding:10px 0}
.fx-same p{margin:0 0 12px;color:var(--muted)}
.fx-pickhost{padding:0 18px}
.fx-pickhost:empty{display:none}
.fx-picker{margin:0 0 18px;max-width:820px;border:1px solid var(--line);border-radius:14px;background:var(--panel);padding:14px;box-shadow:0 12px 30px rgba(20,20,40,.1)}
.fx-ph{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.fx-ph strong{flex:1}
.fx-x{border:0;background:none;color:var(--muted);cursor:pointer;padding:6px;border-radius:8px;display:flex}
.fx-x:hover{color:var(--accent);background:var(--accent-soft)}
.fx-pl{display:block;font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin:6px 0 8px}
.fx-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-bottom:8px}
.fx-tile{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:9px 10px;cursor:pointer;font:inherit;color:var(--ink)}
.fx-tile:hover{border-color:var(--accent);background:var(--accent-soft)}
.fx-tile span:last-child{display:flex;flex-direction:column;min-width:0}
.fx-tile small{color:var(--muted);font-size:12px}
.fx-msg{padding:0 18px 14px}
.fx-drawer{position:fixed;top:50%;left:50%;width:min(460px,calc(100vw - 32px));max-height:min(640px,calc(100vh - 48px));background:var(--panel);border:1px solid var(--line);border-radius:16px;z-index:40;display:flex;flex-direction:column;opacity:0;pointer-events:none;transform:translate(-50%,-46%) scale(.98);transition:opacity .15s ease,transform .15s ease;box-shadow:0 24px 60px rgba(20,20,40,.22);z-index:1001}
.fx-drawer.open{opacity:1;pointer-events:auto;transform:translate(-50%,-50%)}
.fx-drawer .fx-ph{padding:14px 18px;border-bottom:1px solid var(--line);margin:0}
.fx-pb{padding:16px 18px;overflow:auto;flex:1}
.fx-pf{display:flex;gap:8px;justify-content:space-between;padding:12px 18px;border-top:1px solid var(--line)}
.fx-pb audio{width:100%}
.fx-uq{margin-bottom:8px}
.fx-users{max-height:280px;overflow:auto;border:1px solid var(--line);border-radius:10px}
.fx-u{flex-direction:row;display:flex;align-items:center;gap:10px;padding:8px 10px;border-bottom:1px solid var(--line);font-weight:400;cursor:pointer}
.fx-u:last-child{border-bottom:0}
.fx-u input{width:auto}
.fx-u:has(input:checked){background:var(--accent-soft)}
.fx-scrim{position:fixed;inset:0;background:rgba(10,10,20,.35);z-index:1000;opacity:0;pointer-events:none;transition:opacity .2s}
.fx-scrim.on{opacity:1;pointer-events:auto}
@media (max-width:640px){.fx-link{width:56px}.fx-card{width:180px}.fx-start{width:64px}.fx-addbtn{width:140px}}

/* ---------- Coquille de la console : menu latéral + barre du haut */
:root{--side:#17151b;--side-ink:#b9b4bf;--side-hover:#24212a;--side-w:248px}
body.console{min-height:100vh}
.side{position:fixed;inset:0 auto 0 0;width:var(--side-w);background:var(--side);color:var(--side-ink);display:flex;flex-direction:column;z-index:30;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#3a3640 transparent}
.side::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--grad)}
.brand{display:flex;align-items:center;gap:11px;padding:20px 18px 16px;text-decoration:none;color:#fff}
.brand .mark{width:34px;height:34px;border-radius:10px;background:var(--grad);flex:none;position:relative;box-shadow:0 6px 16px rgba(216,20,28,.35)}
.brand .mark::after{content:"";position:absolute;inset:10px;border-radius:50%;border:3px solid #fff}
.brand .bt{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.brand strong{font-size:14.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.brand small{font-size:11.5px;color:#ff8a8f;font-weight:600;letter-spacing:.04em}
.side nav{flex:1;padding:4px 10px 10px}
.ng{margin-bottom:12px}
.ngl{display:block;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#7c7684;padding:8px 10px 4px}
.side nav a{display:flex;align-items:center;gap:11px;padding:8px 10px;border-radius:9px;color:var(--side-ink);text-decoration:none;font-size:14px;font-weight:500;position:relative;transition:background .12s,color .12s}
.side nav a svg{flex:none;opacity:.85}
.side nav a:hover{background:var(--side-hover);color:#fff}
.side nav a.on{background:rgba(216,20,28,.16);color:#fff;font-weight:600}
.side nav a.on::before{content:"";position:absolute;left:-10px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:#ff4a52}
.side nav a.on svg{color:#ff6b72;opacity:1}
.side nav a:focus-visible{outline:2px solid #ff6b72;outline-offset:-2px}
.side-foot{padding:10px;border-top:1px solid #2a2730}
.sf-link{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:9px;color:var(--side-ink);text-decoration:none;font-size:13.5px;font-weight:500}
.sf-link:hover{background:var(--side-hover);color:#fff}
.sf-user{display:flex;align-items:center;gap:10px;padding:8px 10px}
.sf-av{width:30px;height:30px;border-radius:50%;background:var(--grad);color:#fff;font-weight:700;font-size:13px;display:flex;align-items:center;justify-content:center;flex:none}
.sf-mail{flex:1;min-width:0;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sf-user button{border:0;background:none;color:var(--side-ink);cursor:pointer;padding:6px;border-radius:8px;display:flex}
.sf-user button:hover{background:var(--side-hover);color:#ff6b72}
.shell{margin-left:var(--side-w);min-height:100vh;display:flex;flex-direction:column}
.shell main{flex:1;width:100%}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:0 28px;height:56px;background:color-mix(in srgb,var(--bg) 85%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.burger{display:none;border:0;background:none;color:var(--ink);cursor:pointer;padding:6px;border-radius:8px}
.crumb{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--muted);min-width:0}
.crumb strong{color:var(--ink);font-weight:600}
.crumb b{font-weight:400;opacity:.6}
.top-actions{margin-left:auto;display:flex;gap:8px}
body.no-side .side,body.no-side .topbar{display:none}
body.no-side .shell{margin-left:0}
.side-scrim{display:none}
@media (max-width:960px){
  .side{transform:translateX(-100%);transition:transform .2s ease;box-shadow:none}
  body.side-open .side{transform:none;box-shadow:20px 0 50px rgba(0,0,0,.35)}
  .side-scrim{position:fixed;inset:0;background:rgba(10,10,20,.4);z-index:25}
  body.side-open .side-scrim{display:block}
  .shell{margin-left:0}
  .burger{display:flex}
  .topbar{padding:0 14px}
  main{padding:18px 14px 50px}
  footer{padding:0 14px 24px}
}
@media (prefers-color-scheme:dark){:root{--side:#0d0c10;--side-hover:#1c1a21}}

/* ---------------------------------------------------------------- Pages d'administration */
.ghost-ic{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:9px;border:1px solid transparent;background:none;color:var(--muted);cursor:pointer;text-decoration:none;flex:none}
.ghost-ic:hover{background:var(--bg);color:var(--ink);border-color:var(--line)}
.ghost-ic.danger{color:var(--bad);border-color:var(--bad);background:var(--bad-soft)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:14px;margin-bottom:18px}
.kpi{display:flex;gap:14px;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.kpi-ic{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--info-soft);color:var(--ink);flex:none}
.kpi.good .kpi-ic{background:var(--ok-soft);color:var(--ok)}
.kpi.warn .kpi-ic{background:var(--warn-soft);color:var(--warn)}
.kpi .k{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600}
.kpi .v{font-size:24px;font-weight:700;line-height:1.25;margin-top:2px}
.kpi .v small{font-size:14px;color:var(--muted);font-weight:500}
.kpi .s{font-size:13px;color:var(--muted)}
.cx-tabs{margin:0 0 18px}
.cx-sw{align-items:flex-start;color:var(--ink)}
.cx-sw b{display:flex;flex-direction:column;font-weight:600;gap:1px}
.cx-sw b small{font-weight:400;color:var(--muted);font-size:13px}
.cx-sw b .pill{align-self:flex-start;margin-top:3px}
.cx-g3{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:14px 18px}
.cx-sec{border:1px solid var(--line);border-radius:12px;padding:16px 18px}
.cx-sec h3,.cx-h3{font-size:14px;margin:0 0 10px;font-weight:700}
.cx-h3{margin:10px 0 0;padding-top:14px;border-top:1px solid var(--line)}
.cx-inline{display:flex;gap:10px;align-items:flex-end;border-bottom:1px solid var(--line)}
.cx-inline .grow{flex:1}
.cx-list>.cx-row+.cx-row{border-top:1px solid var(--line)}
.cx-row{display:flex;align-items:center;gap:12px;padding:12px 18px;flex-wrap:wrap;background:var(--panel)}
.cx-row .grow{flex:1;min-width:180px}
.cx-row.dragging{opacity:.5;outline:2px dashed var(--accent)}
.cx-drag{color:var(--muted);cursor:grab;display:grid}
.cx-num{width:26px;height:26px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-weight:700;font-size:13px;display:grid;place-items:center;flex:none}
.cx-title{font-weight:700;color:var(--ink);text-decoration:none}
.cx-title:hover{color:var(--accent)}
.cx-chain{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.cx-chip{font-size:12px;font-weight:600;padding:3px 9px;border-radius:7px;background:var(--bg);border:1px solid var(--line)}
.cx-chip.ok{border-color:var(--ok);color:var(--ok)}
.cx-chip.bad{border-color:var(--bad);color:var(--bad)}
.cx-arrow{color:var(--muted);font-size:12px}
.cx-acts{display:flex;gap:2px}
.cx-routes{display:flex;flex-direction:column;gap:10px}
.cx-route{display:grid;grid-template-columns:30px 2fr 90px 110px 1.6fr 1.3fr;gap:10px;align-items:start;padding:12px;border-radius:10px;background:var(--bg)}
.cx-route:first-child{background:var(--accent-soft)}
.cx-rn{width:28px;height:28px;border-radius:50%;background:var(--panel);border:1px solid var(--line);display:grid;place-items:center;font-weight:700;margin-top:26px}
@media (max-width:900px){.cx-route{grid-template-columns:30px 1fr 1fr}.cx-route>label:nth-of-type(1){grid-column:2/-1}.cx-rn{margin-top:0}}
.cx-checks>div+div{border-top:1px solid var(--line)}
.cx-check{display:flex;align-items:center;gap:12px;padding:12px 18px}
.cx-check .grow{flex:1}
.cx-dot{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--warn-soft);color:var(--warn);flex:none}
.cx-check.on .cx-dot{background:var(--ok-soft);color:var(--ok)}
.cx-countries{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px}
.cx-cty{flex-direction:row;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--line);border-radius:9px;font-weight:500;cursor:pointer}
.cx-cty small{margin-left:auto;color:var(--muted)}
.cx-cty:has(input:checked){border-color:var(--accent);background:var(--accent-soft)}
.cx-cty[hidden]{display:none}
.cx-rec audio{height:34px;max-width:300px}
.cx-dir{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:var(--info-soft);flex:none}
.cx-dir.in{color:var(--ok)} .cx-dir.out{color:var(--accent)}
.cx-codes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));gap:16px;align-items:start}
.cx-code{flex-direction:row;align-items:center;gap:14px;padding:10px 18px;font-weight:500;border-top:1px solid var(--line)}
.cx-code:first-of-type{border-top:0}
.cx-code .grow{flex:1;display:flex;flex-direction:column}
.cx-code small{color:var(--muted);font-weight:400;font-size:12px}
.cx-kbd{display:flex;align-items:center;gap:8px}
.cx-kbd input{width:78px;text-align:center;font-family:var(--mono);font-weight:700;font-size:15px;background:var(--bg)}
.cx-kbd em{font-style:normal;color:var(--muted);font-size:12px;white-space:nowrap;width:86px}
.cx-step{padding:4px 0 4px 22px;position:relative;font-size:14px}
.cx-step::before{content:"";position:absolute;left:4px;top:11px;width:8px;height:8px;border-radius:50%;background:var(--muted)}
.cx-step.ok::before{background:var(--ok)} .cx-step.error::before{background:var(--bad)} .cx-step.warn::before{background:var(--warn)}
.cx-step.run::before{background:var(--accent);animation:adp 1s infinite alternate}
@keyframes adp{to{opacity:.25}}
.cx-hero{display:flex;gap:18px;align-items:center;padding:22px 24px;border-radius:16px;background:var(--panel);border:1px solid var(--line);margin-bottom:18px;flex-wrap:wrap}
.cx-hero h2{font-size:19px}
.cx-hero p{margin:4px 0 0;color:var(--muted)}
.cx-hero .grow{flex:1;min-width:240px}
.cx-hero-ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:var(--info-soft)}
.cx-hero.ok .cx-hero-ic{background:var(--ok-soft);color:var(--ok)}
.cx-hero.new{border-color:var(--accent)}
.cx-hero.new .cx-hero-ic{background:var(--grad);color:#fff}
.cx-log{margin:0;padding:14px 18px;max-height:340px;overflow:auto;font:12px/1.5 var(--mono);background:var(--bg);white-space:pre-wrap}
.cx-md h3{font-size:14px;margin:14px 0 6px}
.cx-md h3:first-child{margin-top:0}
.cx-md ul{margin:0;padding-left:20px}
.cx-md li{margin:3px 0}
.cx-al{align-items:flex-start}
.cx-sev{width:10px;height:10px;border-radius:50%;background:var(--muted);margin-top:7px;flex:none}
.cx-al.critical .cx-sev{background:var(--bad)} .cx-al.warning .cx-sev{background:var(--warn)}
.cx-r{text-align:right;font-size:12px}
.cx-lic{display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:18px;align-items:stretch}
@media (max-width:860px){.cx-lic{grid-template-columns:1fr}}
.cx-lic-card{border-radius:18px;padding:24px;color:#fff;background:var(--grad);display:flex;flex-direction:column;gap:18px;min-height:200px;box-shadow:0 10px 30px rgba(216,20,28,.25)}
.cx-lic-ed{font-weight:700;font-size:20px;letter-spacing:-.01em}
.cx-lic-key{font-size:18px;letter-spacing:.08em;margin-top:auto}
.cx-lic-meta{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:13px;opacity:.9}
.cx-bar{display:block;height:6px;border-radius:3px;background:var(--line);margin-top:6px;overflow:hidden;width:140px}
.cx-bar i{display:block;height:100%;background:var(--accent)}
.cx-kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.cx-kv>div{display:flex;flex-direction:column;padding:12px 18px;border-bottom:1px solid var(--line)}
.cx-kv span{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:600}
.cx-kv b{font-weight:600;word-break:break-all}
.cx-gws{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:14px}
.cx-gw{display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:14px;background:var(--panel);border:1px solid var(--line);text-decoration:none;color:inherit}
.cx-gw:hover{border-color:var(--accent)}
.cx-gw .grow{flex:1;min-width:0}
.cx-gw-ic{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:var(--info-soft);flex:none}
.cx-gw-ic.dect{background:var(--accent-soft);color:var(--accent)}
.cx-ports{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.cx-port{font-size:12px;padding:2px 8px;border-radius:6px;background:var(--bg);color:var(--muted);border:1px solid var(--line)}
.cx-port.on{color:var(--ok);border-color:var(--ok);background:var(--ok-soft)}
.cx-pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px}
.cx-pmap{flex-direction:row;align-items:center;gap:10px;font-weight:500}
.cx-pmap span{width:90px;flex:none;color:var(--muted);font-size:13px}
.cx-copy{display:flex;gap:10px;align-items:center;padding:10px 12px;border-radius:9px;background:var(--bg);overflow-x:auto}
.cx-copy code{flex:1;word-break:break-all}
.cx-guide{margin:0;padding-left:20px}
.cx-guide li{margin:6px 0}
.empty svg{color:var(--muted);margin-bottom:6px}
.note svg{vertical-align:-3px}

.fx-g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fx-perr{color:var(--bad);font-size:13px;font-weight:500}

/* Double authentification */
.totp{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap}
.totp-qr{width:180px;height:180px;background:#fff;border-radius:12px;padding:8px;border:1px solid var(--line);flex:none}
.totp-qr svg{width:100%;height:100%}
.totp-steps{flex:1;min-width:240px}
.totp-steps ol{margin:0 0 12px;padding-left:20px}
.totp-steps li{margin:6px 0}
.mfa-modal{position:fixed;inset:0;background:rgba(10,10,20,.4);display:grid;place-items:center;z-index:2000;padding:16px}
.mfa-card{background:var(--panel);border-radius:16px;padding:22px;width:min(400px,100%);box-shadow:0 24px 60px rgba(0,0,0,.25)}
.mfa-card h2{font-size:18px;margin:0 0 6px}
.mfa-card input{font-size:22px;letter-spacing:.3em;text-align:center;margin:10px 0 4px}
.mfa-card .actions{border:0;padding-top:10px}

.sysrow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 18px;border-top:1px solid var(--line);flex-wrap:wrap}
.sysrow:first-child{border-top:0}
.sysrow a{color:var(--ink);font-weight:500;text-decoration:none}
.sysrow a:hover{color:var(--accent)}
.sysr{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:flex-end}

.fx-drawer.wide{width:min(760px,calc(100vw - 32px));max-height:calc(100vh - 48px)}
.fx-srow{display:flex;gap:8px;align-items:center}
.fx-keys td{padding:6px 4px}.fx-keys .dest .row>*{min-width:150px}

/* Touches : téléphone dessiné comme sur la notice */
.phv-wrap{display:grid;grid-template-columns:minmax(0,auto) minmax(260px,340px);gap:20px;align-items:start;justify-content:start}
.phv-row{display:flex;gap:14px;align-items:flex-start;flex-wrap:wrap}
.phv-row>.phv:first-child{width:min(620px,100%)}
.phv-exp{width:340px;padding:12px}
.phv-exp .phv-col{flex:1 1 0;min-width:0}
.phv-screen.exp{min-height:0;padding:8px 6px}
.phv-screen.big{min-height:260px}
.phv-tgrid{display:flex;gap:8px;align-items:center;padding:8px;flex:1}
.phv-tgrid .phv-col{flex:1 1 0;min-width:0}
.phv-tgrid .phv-clock{font-size:22px;opacity:.85}
.phv.touch .phv-k span{background:#ffffff1f}
.phv-mods{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:12px;font-size:14px;color:var(--muted)}
.phv-mods span{margin-right:6px}
.phv-mods button{border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:999px;padding:4px 12px;font:inherit;font-size:13px;cursor:pointer}
.phv-mods button.on{background:var(--accent);border-color:var(--accent);color:#fff}
@media (max-width:1100px){.phv-wrap{grid-template-columns:1fr}}
.phv{background:linear-gradient(#2b2d33,#1d1f24);border-radius:22px;padding:14px 16px 16px;color:#e9eaee;box-shadow:0 10px 30px rgba(0,0,0,.18)}
.phv-head{display:flex;justify-content:center;gap:8px;align-items:baseline;margin-bottom:8px}
.phv-brand{font-weight:800;letter-spacing:.5px}.phv-model{font-size:12px;color:#a3a6b0}
.phv-top{display:flex;gap:10px;align-items:stretch}
.phv-pages{margin-top:10px}
.phv-col{display:flex;flex-direction:column;gap:6px;flex:0 0 150px;justify-content:center}
.phv-k{display:flex;align-items:center;gap:7px;border:0;background:none;color:inherit;padding:0;cursor:pointer;font:inherit;text-align:left;min-height:30px}
.phv-col.r .phv-k{flex-direction:row-reverse;text-align:right}
.phv-k i{flex:0 0 26px;height:13px;border-radius:7px;background:#4a4d56;border:1px solid #5d606a;box-shadow:inset 0 -2px 0 rgba(0,0,0,.3)}
.phv-k span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;padding:5px 8px;border-radius:6px;background:#3a5f8f22;border:1px solid transparent}
.phv-k em{font-style:normal;color:#8c909b}
.phv-k b{font-size:10px;color:#8c909b;font-weight:600}
.phv-k.t-blf i{background:#2e9b55}.phv-k.t-status i{background:#c8372d}.phv-k.t-speed i{background:#3b74c4}.phv-k.t-line i{background:#a7aab3}
.phv-k.t-none span{background:none;border:1px dashed #50535c}
.phv-k:hover span,.phv-k:focus-visible span{border-color:#9fb6d8}
.phv-k.sel span{border-color:#fff;background:#ffffff26}
.phv-k.off{visibility:hidden}
.phv-screen{flex:1;min-width:150px;background:linear-gradient(160deg,#4f7eb0,#2e4c74 60%,#1d2f4b);border-radius:8px;border:3px solid #111;display:flex;flex-direction:column;min-height:200px}
.phv-bar{display:flex;justify-content:space-between;font-size:11px;padding:4px 8px;background:#00000040}
.phv-mid{flex:1;display:flex;align-items:center;justify-content:center}
.phv-clock{font-size:30px;font-weight:300}
.phv-soft{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;padding:4px;font-size:10px;text-align:center}
.phv-soft span{background:#00000055;border-radius:4px;padding:4px 0}
.phv.touch .phv-k i{display:none}
.phv-pages{display:flex;justify-content:center;gap:6px;margin-top:12px}
.phv-pages button{border:1px solid #5d606a;background:none;color:#e9eaee;border-radius:999px;padding:4px 12px;font:inherit;font-size:12px;cursor:pointer}
.phv-pages button.on{background:#fff;color:#1d1f24}
.phv-panel{border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:12px;background:var(--panel)}
.phv-ph{display:flex;justify-content:space-between;align-items:baseline}
.phv-types{display:flex;flex-wrap:wrap;gap:6px}
.phv-types button{border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:999px;padding:6px 12px;font:inherit;font-size:13px;cursor:pointer}
.phv-types button.on{background:var(--accent);border-color:var(--accent);color:#fff}
.phv-empty{color:var(--muted);font-size:14px;line-height:1.5}
.phv-list summary{cursor:pointer;color:var(--muted);margin:6px 0}
@media (max-width:560px){.phv-col{flex-basis:96px}.phv-k span{font-size:11px;padding:4px}}
.phv-tgrid.five{align-items:stretch}
.phv-tgrid.five>.phv-col{flex:1 1 0;justify-content:flex-start}
.phv-tgrid.five .phv-mid{flex:3 1 0}
.phv-tgrid.five.open>.phv-col:nth-child(2),.phv-tgrid.five.open>.phv-col:nth-child(3),.phv-tgrid.five.open>.phv-col:nth-child(4){background:#ffffff10;border-radius:8px;padding:2px}
.phv-more{justify-content:center}
.phv-more span{background:#ffffff33!important;text-align:center;font-weight:600}
.phv-note{margin:8px 0 0;font-size:12px;color:#a3a6b0;text-align:center}

/* Serveur multi-tenant : sélecteur de PBX (comptes IRT) */
.pbxsw{position:relative}
.pbxsw-menu{position:absolute;right:0;top:calc(100% + 6px);width:min(340px,90vw);background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,.14);padding:10px;z-index:60;display:flex;flex-direction:column;gap:8px}
.pbxsw-list{max-height:320px;overflow:auto;display:flex;flex-direction:column}
.pbxsw-list a{display:flex;flex-direction:column;padding:7px 9px;border-radius:8px;color:var(--ink);text-decoration:none}
.pbxsw-list a small{color:var(--muted);font-size:12px}
.pbxsw-list a:hover,.pbxsw-list a.on{background:var(--accent-soft)}
.pbxsw-all{font-size:13px;padding:6px 9px;border-top:1px solid var(--line)}

/* Trunk : codecs par ordre de priorité */
.lbl{display:block;font-weight:600;font-size:14px;margin-bottom:6px}
.codec-list{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.codec-row{display:grid;grid-template-columns:92px 1fr auto;align-items:center;gap:10px;padding:8px 12px;border-top:1px solid var(--line);background:var(--panel)}
.codec-row:first-child{border-top:0}
.codec-row:not(.on){opacity:.6}
.codec-rank{font-size:12px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.codec-row.on .codec-rank{color:var(--accent)}
.codec-list .codec-row label.codec-name{display:flex;flex-direction:row;align-items:center;justify-content:flex-start;gap:8px;font-weight:500;margin:0;text-align:left}
.codec-list .codec-row label.codec-name input{width:auto;margin:0}
.codec-move{display:flex;gap:4px}
@media (max-width:520px){.codec-row{grid-template-columns:1fr auto}.codec-rank{grid-column:1/-1}}

/* Fiche utilisateur : un seul « Enregistrer » pour tous les onglets */
.usave{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.usave .pill[hidden],.usave .btn[hidden]{display:none}

/* Utilisateurs : sélection multiple */
th.ck,td.ck{width:34px;padding-right:0}
td.ck input,th.ck input{width:18px;height:18px;margin:0;cursor:pointer}
tr.sel td{background:var(--accent-soft, rgba(216,20,28,.06))}
.ubulk{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 16px;border-top:1px solid var(--line);background:var(--bg)}
.ubulk[hidden]{display:none}
.ubulk strong{margin-right:6px}
.ubulk-res{border-top:1px solid var(--line);padding:14px 16px}
.ubulk-res .ph{display:flex;align-items:center;justify-content:space-between;padding:0;margin-bottom:6px;border:0}
.ubulk-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.ubulk-row .grow{flex:1;min-width:200px;display:flex;flex-direction:column}
.ubulk-qr svg{width:84px;height:84px;display:block;background:#fff;border-radius:6px}

/* Capture réseau : un fichier par appel */
tr.capcalls td{background:var(--bg);padding-top:8px;padding-bottom:10px}
.capcall{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:6px 0;border-top:1px solid var(--line)}
.capcall .grow{flex:1;min-width:220px}

/* Touches : plusieurs BLF d'un coup */
.blfm{display:flex;flex-direction:column;gap:8px;margin-top:10px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.blfm-list{max-height:240px;overflow:auto;display:flex;flex-direction:column;gap:4px}
.blfm-list label[hidden]{display:none}

/* Utilisateur : téléphones supplémentaires */
.xph{display:grid;grid-template-columns:1fr 1.2fr 1fr auto;gap:10px;align-items:end;padding:10px 0;border-bottom:1px solid var(--line)}
.xph .full{grid-column:1/-1}
@media (max-width:760px){.xph{grid-template-columns:1fr}}

/* Téléphone IP : modèle, MAC et provisioning sur une seule ligne ; provisioning replié quand le téléphone est connecté */
.phrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:14px 18px;align-items:start}
.phrow>label{min-width:0}
.phrow select,.phrow input{width:100%}
.phrow .provtog{margin-top:27px;white-space:nowrap;display:inline-flex;align-items:center;gap:8px}
.provtog .chev{display:inline-block;transition:transform .15s;color:var(--muted)}
.provtog.on .chev{transform:rotate(90deg)}
.provwrap[hidden]{display:none}
@media (max-width:760px){.phrow{grid-template-columns:1fr}.phrow .provtog{margin-top:0}}

/* ---------------- Planning de la semaine (Gestion d'appels › Routages) */
.pl-title{margin:0;font-size:19px;flex:1}
.pl-dot{display:inline-block;width:12px;height:12px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px #0002}
.pl-dot.big{width:18px;height:18px}
.pl-now{display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:space-between;margin:16px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.pl-nowmain{display:flex;gap:10px;align-items:flex-start;min-width:0;flex:1}.pl-nowmain .s{margin-top:2px}
.pl-force{display:flex;flex-direction:row;align-items:center;gap:8px;margin:0;font-weight:600;white-space:nowrap}.pl-force select{min-width:220px}
.pl-sec{padding:16px 18px;border-top:1px solid var(--line)}
.pl-h{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}.pl-h h3{margin:0;font-size:16px}
.pl-scs{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.pl-sc{display:flex;flex-direction:column;gap:6px;text-align:left;font:inherit;color:inherit;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:11px 13px;cursor:pointer;min-height:68px}
.pl-sc:hover{border-color:var(--muted)}.pl-sc.bad{border-color:var(--bad);background:var(--bad-soft)}
.pl-sc.add{align-items:center;justify-content:center;border-style:dashed;color:var(--accent);font-weight:600}
.pl-sch{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.pl-sc .s{font-size:12.5px;line-height:1.35}
.pl-inline{display:inline-flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0 0;font-weight:600}.pl-inline select,.pl-inline input{width:auto}
.pl-opts{display:flex;align-items:center;gap:8px 18px;flex-wrap:wrap;margin-bottom:10px}.pl-opts .pl-inline{margin:0}.pl-opts .check{margin:0}
.pl-wtabs{padding:0;margin-bottom:10px}
.pl-brush{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}
.pl-b{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:13.5px;font-weight:600;padding:6px 12px;border-radius:99px;border:1px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer}
.pl-b.on{border-color:var(--ink);box-shadow:0 0 0 2px var(--ink) inset}
.pl-gridwrap{position:relative;overflow-x:auto;padding-bottom:4px}
.pl-grid{position:relative;display:grid;grid-template-columns:42px repeat(var(--cols),minmax(64px,1fr));min-width:calc(42px + var(--cols) * 64px);user-select:none;-webkit-user-select:none}
.pl-gridwrap.one .pl-grid{grid-template-columns:42px minmax(120px,1fr);min-width:0}
.pl-gh{font-weight:700;font-size:13px;text-align:center;padding:4px 0 6px;display:flex;align-items:center;justify-content:center;gap:4px}
.pl-copy{border:0;background:none;color:var(--muted);cursor:pointer;font-size:14px;padding:2px 4px;border-radius:6px}.pl-copy:hover{background:var(--bg);color:var(--ink)}
.pl-hours{position:relative}.pl-hours span{position:absolute;right:6px;transform:translateY(-50%);font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}.pl-hours span:first-child{transform:none}
.pl-col{position:relative;border-left:1px solid var(--line);cursor:crosshair;touch-action:none;
  background:repeating-linear-gradient(to bottom,var(--line) 0 1px,transparent 1px 44px),repeating-linear-gradient(to bottom,color-mix(in srgb,var(--line) 45%,transparent) 0 1px,transparent 1px 22px)}
.pl-col:last-of-type{border-right:1px solid var(--line)}
.pl-blk{position:absolute;left:2px;right:2px;border-radius:6px;color:#fff;overflow:hidden;pointer-events:none;box-shadow:inset 0 0 0 1px #0002}
.pl-blk span{display:flex;flex-direction:column;padding:3px 6px;font-size:12px;font-weight:600;line-height:1.2;text-shadow:0 1px 1px #0004}
.pl-blk small{font-weight:500;opacity:.9;font-variant-numeric:tabular-nums}
.pl-blk.whole{left:2px;right:2px}
.pl-sel{position:absolute;border:2px solid;border-radius:6px;pointer-events:none;z-index:2}
.pl-sel::after{content:attr(data-label);position:absolute;left:4px;top:-22px;background:var(--ink);color:var(--panel);font-size:11.5px;font-weight:600;padding:2px 7px;border-radius:6px;white-space:nowrap}
.pl-gridfoot{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.pl-copypop{position:absolute;z-index:5;width:240px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px;box-shadow:0 12px 30px rgba(20,20,40,.18);display:flex;flex-direction:column;gap:8px}
.pl-cpd{display:grid;grid-template-columns:1fr 1fr;gap:2px 8px}.pl-cpd .check{margin:0;font-size:13.5px}
.pl-mtop{display:flex;align-items:center;gap:10px;margin-bottom:10px;flex-wrap:wrap}.pl-mtop strong{min-width:130px;text-align:center;text-transform:capitalize}
.pl-mtop .btn.on{border-color:var(--accent);color:var(--accent)}
.pl-month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.pl-mh{font-size:12px;font-weight:700;color:var(--muted);text-align:center}
.pl-md{display:flex;flex-direction:column;gap:5px;min-height:64px;padding:6px;border:1px solid var(--line);border-radius:10px;background:var(--panel);font:inherit;color:inherit;text-align:left;cursor:pointer;min-width:0}
.pl-md:hover{border-color:var(--muted)}.pl-md.out{opacity:.45}.pl-md.today{box-shadow:0 0 0 2px var(--accent) inset}
.pl-md.sp{background:var(--info-soft)}.pl-md.picked{background:var(--accent-soft);border-color:var(--accent)}
.pl-mn{font-weight:700;font-size:13.5px;display:flex;justify-content:space-between}.pl-mn small{font-weight:600;color:var(--muted);font-size:11px}
.pl-mbar{position:relative;height:8px;border-radius:4px;background:var(--bg);overflow:hidden;box-shadow:inset 0 0 0 1px var(--line)}.pl-mbar i{position:absolute;top:0;bottom:0}
.pl-mtag{font-size:11px;color:var(--muted);line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pl-test{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.pl-test input{width:auto}
.pl-testr{display:flex;gap:8px;align-items:flex-start;flex:1;min-width:240px}.pl-testr .pl-dot{margin-top:4px}
.pl-colors{display:flex;flex-wrap:wrap;gap:8px}
.pl-color{width:28px;height:28px;border-radius:50%;border:2px solid var(--panel);box-shadow:0 0 0 1px var(--line);cursor:pointer}.pl-color.on{box-shadow:0 0 0 2px var(--ink)}
.pl-steps{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.pl-step{display:flex;flex-direction:column;gap:4px}.pl-link{font-size:12px;color:var(--muted);padding-left:34px}
.pl-stb{display:flex;gap:8px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;padding:8px}
.pl-step.bad .pl-stb{border-color:var(--bad)}
.pl-stn{flex:none;width:22px;height:22px;border-radius:50%;background:var(--bg);display:grid;place-items:center;font-size:12px;font-weight:700;margin-top:6px}
.pl-stf{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}
.pl-row{display:flex;gap:8px;flex-wrap:wrap}.pl-row label{margin:0;display:flex;flex-direction:row;align-items:center;gap:6px;font-size:13px}.pl-row input[type=number]{width:80px}
.pl-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.pl-sta{display:flex;gap:2px;flex:none}
.pl-addstep{display:flex;align-items:center;gap:10px;margin-top:8px}.pl-addstep select{width:auto}
.pl-drawer .fx-pb{overflow:auto}
@media (max-width:640px){
  .pl-now{margin:12px}.pl-force{width:100%}.pl-force select{flex:1;min-width:0}
  .pl-sec{padding:14px 12px}.pl-md{min-height:52px;padding:4px}.pl-mtag{display:none}
}

/* Onglets : défilement horizontal au besoin (petits écrans), sans barre de défilement ni flèches visibles */
.tabs{flex-wrap:wrap}
.tabs,.fx-tabs{overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none}
.tabs::-webkit-scrollbar,.fx-tabs::-webkit-scrollbar{display:none}

/* ---------------- Dépannage (Gestion d'appels) */
.subtabs{display:flex;gap:6px;margin:12px 0 0;flex-wrap:wrap}
.subtabs a{padding:6px 14px;border-radius:99px;border:1px solid var(--line);background:var(--panel);color:var(--muted);font-weight:600;font-size:13.5px;text-decoration:none}
.subtabs a.on{background:var(--ink);border-color:var(--ink);color:var(--panel)}
.dg-mode{align-self:flex-start}
.dg-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap}.dg-form label{margin:0}.dg-form .grow{flex:1;min-width:240px}
.dg-verdict{display:flex;gap:12px;align-items:center;padding:14px 16px;border-radius:12px;border:1px solid var(--line);flex-wrap:wrap}
.dg-verdict>div{flex:1;min-width:220px}
.dg-verdict.ok{background:var(--ok-soft);border-color:color-mix(in srgb,var(--ok) 35%,transparent)}
.dg-verdict.warn{background:var(--warn-soft)}.dg-verdict.bad{background:var(--bad-soft);border-color:color-mix(in srgb,var(--bad) 35%,transparent)}
.dg-vi{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:14px;background:var(--panel);color:var(--muted)}
.ok>.dg-vi{color:var(--ok)}.warn>.dg-vi{color:var(--warn)}.bad>.dg-vi{color:var(--bad)}
.dg-targets{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.dg-t{border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.dg-devs{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.dg-devs li{display:flex;gap:8px;align-items:baseline}.dg-devs li.bad strong{color:var(--bad)}
.dg-ringres .pill{margin-left:4px}
.dg-tree{margin-top:14px}.dg-tree summary{cursor:pointer;font-weight:600}
.dg-steps{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.dg-steps li{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:10px}
.dg-steps li.bad{border-color:var(--bad);background:var(--bad-soft)}.dg-steps li.warn{background:var(--warn-soft)}

/* Page Téléphones : lignes compactes */
.provbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin-bottom:14px}
.provbar .dl{margin:0}.provbar .mono{word-break:break-all}
.ptable td{vertical-align:middle}.ptable .nw{white-space:nowrap}
.ptable .mono-s{font-family:var(--mono);font-size:12px}
.ptable .ic{font-size:16px}
.seg .cnt{display:inline-block;min-width:20px;padding:0 6px;border-radius:99px;background:var(--bg);font-size:12px;margin-left:4px;color:var(--muted)}

/* Codes raccourcis : tableau aligné */
.sctable td{vertical-align:middle}.sctable .nw{white-space:nowrap;width:1%}
.sctable .scg td{background:var(--bg);font-weight:700;font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);padding-top:10px;padding-bottom:10px}
.sc-in{display:inline-flex;align-items:center;gap:8px}.sc-in input{width:76px;text-align:center;font-family:var(--mono);font-weight:700}
.sc-in em{font-style:normal;color:var(--muted);font-size:12.5px;min-width:58px}
.sctable code{font-family:var(--mono);background:var(--bg);padding:2px 8px;border-radius:6px}
.sc-in input{padding:6px 8px}.sctable td{padding-top:7px;padding-bottom:7px}

/* Pagination des listes */
.pager{display:flex;align-items:center;gap:10px;padding:10px 16px;border-top:1px solid var(--line);flex-wrap:wrap}
.pager:first-child,.filters+.pager{border-top:0;border-bottom:1px solid var(--line)}
.pager label{flex-direction:row;align-items:center;gap:8px;margin:0;font-weight:500;font-size:13.5px}.pager select{width:auto}
.sch-gen{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:12px 14px;flex-wrap:wrap}
.nw{white-space:nowrap}

/* Système : licence en haut */
.sys-lic{margin-bottom:18px}
.sys-lic-b{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px 22px}
.sys-lic-b>div{display:flex;flex-direction:column;gap:4px}.sys-lic-b .pill{align-self:flex-start}
.altable td{vertical-align:middle}.altable .nw{width:1%}
.al-inline{flex-direction:row;align-items:center;gap:8px;margin:6px 0 0;font-weight:500;font-size:13px}.al-inline input{width:80px}
.sys-lic-side{display:flex;flex-direction:column;gap:12px;justify-content:space-between}.sys-lic-side .btn{align-self:flex-start}
.sys-lic-side .kpis{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}
.sys-lic .cx-lic-card{min-height:170px}

/* Tableau de bord : la carte Licence en rouge (comme la carte de licence) */
.dash-cards .card.tone-brand{border:0;color:#fff;position:relative;overflow:hidden;background:var(--grad);box-shadow:0 8px 22px rgba(216,20,28,.22);transition:transform .12s ease}
.dash-cards a.card.tone-brand:hover{transform:translateY(-2px)}
.dash-cards .card.tone-brand .k,.dash-cards .card.tone-brand .s{color:rgba(255,255,255,.88)}
.dash-cards .card.tone-brand .v{color:#fff}
.dash-cards .card.tone-brand::after{content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;background:rgba(255,255,255,.12)}

/* Rappel du rouge Callikoe sur toutes les pages */
main h1::after,#app h1::after{content:"";display:block;width:44px;height:4px;border-radius:4px;background:var(--grad);margin-top:8px}
.kpis>.kpi:first-child{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 8px 22px rgba(216,20,28,.22)}
.kpis>.kpi:first-child .k,.kpis>.kpi:first-child .s,.kpis>.kpi:first-child .v small{color:rgba(255,255,255,.88)}
.kpis>.kpi:first-child .v{color:#fff}
.kpis>.kpi:first-child .kpi-ic{background:rgba(255,255,255,.2);color:#fff}
.kpis>.kpi:first-child .cx-bar{background:rgba(255,255,255,.3)}.kpis>.kpi:first-child .cx-bar i{background:#fff}
.kpi-ic{background:var(--accent-soft);color:var(--accent)}
.ph h2::before{content:"";display:inline-block;width:4px;height:14px;border-radius:2px;background:var(--grad);margin-right:9px;vertical-align:-1px}
