/* UvaConnect — composants du tableau de bord vendeur (cartes, onglets à compteurs, graphiques, menus d'actions).
   S'ajoute à wiflow.css. Aucune ressource externe. */
:root{
  --tone-blue:#2F5BEA;--tone-blue-bg:#E3EAFE;
  --tone-amber:#B87500;--tone-amber-bg:#FFF0C7;
  --tone-teal:#0B8A7A;--tone-teal-bg:#D8F3EE;
  --tone-coral:#C8412F;--tone-coral-bg:#FDE4DF;
  --tone-violet:#6B3FD1;--tone-violet-bg:#EBE3FC;
  --tone-green:#0F7A4A;--tone-green-bg:#DDF4E8;
  --bar:var(--indigo);--bar-soft:#C9D2F6;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --tone-blue:#8FA8FF;--tone-blue-bg:#1B2760;
    --tone-amber:#FFD36B;--tone-amber-bg:#3A2D08;
    --tone-teal:#5FE0CC;--tone-teal-bg:#0C3A34;
    --tone-coral:#FF9C8C;--tone-coral-bg:#471B15;
    --tone-violet:#C0A6FF;--tone-violet-bg:#2D1F5C;
    --tone-green:#6EE7B0;--tone-green-bg:#0F3A2A;
    --bar-soft:#2A3470;
  }
}

/* ---------- Cartes de chiffres ---------- */
.stats{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}
.stat{display:flex;gap:14px;align-items:center;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);min-width:0}
.stat .tile{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;flex:none;background:var(--tone-bg,var(--indigo-l));color:var(--tone,var(--indigo))}
.stat .tile svg{width:24px;height:24px}
.stat .txt{min-width:0}
.stat b{display:block;font-size:1.55rem;line-height:1.1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.stat .lbl{display:block;color:var(--ink-2);font-size:.9rem;font-weight:600;margin-top:2px}
.stat small{display:block;margin-top:2px;font-size:.8rem;color:var(--muted)}
.tone-blue{--tone:var(--tone-blue);--tone-bg:var(--tone-blue-bg)}
.tone-amber{--tone:var(--tone-amber);--tone-bg:var(--tone-amber-bg)}
.tone-teal{--tone:var(--tone-teal);--tone-bg:var(--tone-teal-bg)}
.tone-coral{--tone:var(--tone-coral);--tone-bg:var(--tone-coral-bg)}
.tone-violet{--tone:var(--tone-violet);--tone-bg:var(--tone-violet-bg)}
.tone-green{--tone:var(--tone-green);--tone-bg:var(--tone-green-bg)}
.stats.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.stats.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1180px){.stats.c4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:900px){.stats.c3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.stats.c3,.stats.c4{grid-template-columns:1fr}}
.trend{display:inline-block;margin-left:6px;font-weight:700}
.trend.up{color:var(--ok)}.trend.down{color:var(--bad)}

/* ---------- Onglets à compteurs ---------- */
.ptabs{display:flex;gap:8px;flex-wrap:wrap}
.ptab{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:6px 8px 6px 15px;border-radius:999px;border:2px solid var(--line);background:var(--surface);font-weight:700;cursor:pointer;color:var(--ink-2)}
.ptab:hover{border-color:var(--line-2)}
.ptab .n{min-width:28px;text-align:center;padding:1px 9px;border-radius:999px;background:var(--indigo-l);color:var(--indigo);font-size:.84rem;font-variant-numeric:tabular-nums}
.ptab[data-tone=ok] .n{background:var(--ok-bg);color:var(--ok)}
.ptab[data-tone=warn] .n{background:var(--warn-bg);color:var(--warn)}
.ptab[data-tone=bad] .n{background:var(--bad-bg);color:var(--bad)}
.ptab[aria-selected=true],.ptab[aria-pressed=true]{background:var(--indigo);border-color:var(--indigo);color:#fff}
.ptab[aria-selected=true] .n,.ptab[aria-pressed=true] .n{background:rgba(255,255,255,.22);color:#fff}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .ptab[aria-selected=true]{color:#0B1030}:root:not([data-theme="light"]) .ptab[aria-selected=true] .n,.ptab[aria-pressed=true] .n{background:rgba(11,16,48,.18);color:#0B1030}}

/* ---------- Barres d'outils, sélection ---------- */
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}
.toolbar .grow{min-width:120px}
.toolbar input[type=search]{width:min(260px,100%)}
.toolbar select{width:auto;max-width:100%}
.bulkbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;padding:10px 18px;background:var(--indigo-l);color:var(--indigo);font-weight:700;border-bottom:1px solid var(--line)}
input.cb{width:18px;height:18px;accent-color:var(--indigo);cursor:pointer}
td.sel,th.sel{width:42px;padding-right:0}
.code{font-family:var(--mono);font-weight:800;letter-spacing:.06em}
.sub{display:block;color:var(--muted);font-size:.82rem;line-height:1.3}
.livedot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--ok);margin-right:6px;box-shadow:0 0 0 3px var(--ok-bg)}
.kebab{width:38px;height:38px}
.kebab svg{stroke-width:3.4}
.menu{position:fixed;z-index:90;min-width:210px;max-width:min(300px,92vw);background:var(--surface);border:1px solid var(--line-2);border-radius:14px;box-shadow:0 18px 50px -12px rgba(10,14,40,.45);padding:6px}
.menu button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;background:none;padding:10px 12px;border-radius:9px;cursor:pointer;font-weight:600;min-height:42px}
.menu button:hover,.menu button:focus-visible{background:var(--surface-2)}
.menu button.danger{color:var(--bad)}
.menu hr{border:0;border-top:1px solid var(--line);margin:4px 0}
td.actions{white-space:nowrap}

/* ---------- Semaine en cours : sept fiches, lundi → dimanche ---------- */
.weekhead{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap;padding:18px 18px 4px}
.weekhead h2{font-size:1.1rem}
.weekhead .tot{text-align:right}
.weekhead .tot b{display:block;font-size:1.7rem;letter-spacing:-.02em;line-height:1.1;font-variant-numeric:tabular-nums}
.weekhead .tot span{color:var(--muted);font-size:.85rem}
.wk{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;padding:12px 18px 18px}
.wk-day{display:flex;flex-direction:column;align-items:stretch;gap:6px;text-align:center;min-width:0}
.wk-amt{font-size:.82rem;font-weight:800;font-variant-numeric:tabular-nums;min-height:1.2em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wk-bar{height:140px;display:flex;align-items:flex-end;background:repeating-linear-gradient(to top,transparent 0,transparent 34px,var(--line) 34px,var(--line) 35px);border-radius:10px;overflow:hidden}
.wk-bar i{display:block;width:100%;background:var(--bar);border-radius:8px 8px 0 0;min-height:3px}
.wk-day.today .wk-bar i{background:var(--saffron)}
.wk-day.future .wk-bar i{background:var(--bar-soft);min-height:3px}
.wk-lbl{font-weight:800;font-size:.9rem}
.wk-day.today .wk-lbl{color:var(--saffron-d)}
.wk-sub{font-size:.76rem;color:var(--muted);line-height:1.25}
@media (max-width:520px){.wk{gap:4px;padding:10px 10px 14px}.wk-bar{height:110px}.wk-amt{font-size:.7rem}.wk-sub{font-size:.68rem}}

/* ---------- Comptabilité par semaine ---------- */
.weeks td,.weeks th{padding-top:12px;padding-bottom:12px}
.weeks tr.cur td{background:color-mix(in srgb,var(--saffron) 14%,transparent)}
.weeks tr.cur td:first-child{box-shadow:inset 4px 0 0 var(--saffron)}
.weeks tfoot td{border-top:2px solid var(--line-2);font-weight:800;background:var(--surface-2)}
.weeks .wname b{display:block}
.weeks .wname span{color:var(--muted);font-size:.84rem}
.money-split{display:block;color:var(--muted);font-size:.78rem;font-weight:500}
.note{color:var(--muted);font-size:.88rem;padding:12px 18px;border-top:1px solid var(--line)}

/* ---------- Graphiques SVG ---------- */
.chartwrap{width:100%;min-width:0}
.chart{width:100%;height:auto;display:block;overflow:visible}
.chart text{fill:var(--muted);font:600 12px var(--font)}
.chart .gl{stroke:var(--line);stroke-width:1}
.chart .bar{fill:var(--bar)}
.chart .bar.alt{fill:var(--saffron)}
.chart .bar.soft{fill:var(--bar-soft)}
.chart .ln{fill:none;stroke:var(--tone-teal);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.chart .pt{fill:var(--surface);stroke:var(--tone-teal);stroke-width:2}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:.84rem;color:var(--muted);padding:0 18px 14px}
.legend i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:6px;vertical-align:-1px;background:var(--bar)}
.legend i.alt{background:var(--saffron)}.legend i.ln{background:var(--tone-teal);border-radius:50%}
.chartbox{padding:8px 18px 4px}
.grid-2{display:grid;gap:20px;grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{display:grid;gap:20px;grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1100px){.grid-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:820px){.grid-2,.grid-3{grid-template-columns:1fr}}

/* ---------- Listes à barres, jauges ---------- */
.hbars{display:grid;gap:12px;padding:16px 18px}
.hbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:center}
.hbar .nm{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar .vl{font-variant-numeric:tabular-nums;font-weight:800}
.hbar .tr{grid-column:1/-1;height:8px;border-radius:99px;background:var(--line);overflow:hidden}
.hbar .tr i{display:block;height:100%;border-radius:99px;background:var(--bar)}
.prog{height:8px;border-radius:99px;background:var(--line);overflow:hidden;min-width:70px}
.prog i{display:block;height:100%;border-radius:99px;background:var(--ok)}
.prog.warn i{background:var(--saffron)}.prog.bad i{background:var(--bad)}
.kv{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;padding:16px 18px;font-size:.95rem}
.kv dt{color:var(--muted)}.kv dd{margin:0;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}

/* ---------- Alertes cliquables ---------- */
.alerts{display:grid;gap:8px}
.alert{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:11px 16px;border-radius:12px;background:var(--warn-bg);color:var(--warn);font-weight:600}
.alert.info{background:var(--indigo-l);color:var(--indigo)}.alert.bad{background:var(--bad-bg);color:var(--bad)}.alert.good{background:var(--ok-bg);color:var(--ok)}
.alert a{color:inherit;font-weight:800;white-space:nowrap}

/* ---------- Routeurs : fiches et assistant ---------- */
.rcard{padding:18px;display:grid;gap:14px}
.rcard .top{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:flex-start}
.rsteps{display:flex;gap:8px;flex-wrap:wrap}
.rstep{display:inline-flex;align-items:center;gap:8px;padding:5px 12px 5px 6px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);font-size:.86rem;font-weight:700;color:var(--muted)}
.rstep b{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--line-2);color:var(--ink);font-size:.78rem}
.rstep.done{color:var(--ok);background:var(--ok-bg);border-color:transparent}.rstep.done b{background:var(--ok);color:#fff}
.rstep.now{color:var(--ink);border-color:var(--saffron);background:color-mix(in srgb,var(--saffron) 16%,transparent)}.rstep.now b{background:var(--saffron);color:var(--on-saffron)}
.rmetrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}
.rmetrics div{display:grid;gap:5px;font-size:.84rem;color:var(--muted)}
.rmetrics b{color:var(--ink);font-size:.95rem}
.wiz-steps{display:grid;gap:14px}
.wiz{border:2px solid var(--line);border-radius:16px;padding:16px;display:grid;gap:12px;background:var(--surface)}
.wiz.now{border-color:var(--saffron);box-shadow:0 0 0 3px color-mix(in srgb,var(--saffron) 25%,transparent)}
.wiz.locked{background:var(--surface-2);opacity:.9}
.wiz.done{border-color:var(--ok)}
.wiz h3{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.wiz .num{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--saffron);color:var(--on-saffron);font-weight:800;flex:none}
.wiz.locked .num{background:var(--line-2);color:var(--ink)}
.wiz.done .num{background:var(--ok);color:#fff}
.cmd{display:flex;gap:8px;align-items:stretch}
.cmd pre.code{flex:1;min-width:0;white-space:pre-wrap;word-break:break-all}
.waiting{display:flex;gap:10px;align-items:center;font-weight:700}
.spin{width:16px;height:16px;border-radius:50%;border:3px solid var(--line-2);border-top-color:var(--saffron);animation:spin 1s linear infinite;flex:none}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- Abonnement, parrainage ---------- */
.plancards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.plancard{position:relative;display:grid;gap:4px;padding:18px;border:2px solid var(--line);border-radius:16px;cursor:pointer;background:var(--surface)}
.plancard input{position:absolute;opacity:0;inset:0;cursor:pointer}
.plancard .pr{font-size:2rem;font-weight:800;letter-spacing:-.03em;line-height:1.1}
.plancard .pr small{font-size:.95rem;font-weight:600;color:var(--muted);letter-spacing:0}
.plancard:has(input:checked){border-color:var(--saffron);box-shadow:0 0 0 3px color-mix(in srgb,var(--saffron) 35%,transparent)}
.plancard:has(input:focus-visible){outline:3px solid var(--saffron);outline-offset:2px}
.refcode{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.refcode .big{font-family:var(--mono);font-size:1.8rem;font-weight:800;letter-spacing:.1em;padding:8px 16px;border:2px dashed var(--saffron);border-radius:14px;background:color-mix(in srgb,var(--saffron) 12%,transparent)}
.total-line{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;padding:14px 16px;border-radius:14px;background:var(--surface-2);border:1px solid var(--line)}
.total-line b{font-size:1.6rem;letter-spacing:-.02em}

/* ---------- Aperçus ---------- */
.frame{width:100%;height:62vh;min-height:360px;border:1px solid var(--line);border-radius:12px;background:#fff;display:block}
.modelgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.modelbtn{border:2px solid var(--line);background:var(--surface);border-radius:12px;padding:10px 12px;text-align:left;cursor:pointer}
.modelbtn b{display:block}.modelbtn small{color:var(--muted);font-size:.78rem;line-height:1.25;display:block;margin-top:2px}
.modelbtn[aria-pressed=true]{border-color:var(--saffron);box-shadow:0 0 0 3px color-mix(in srgb,var(--saffron) 35%,transparent)}
.pagehint{color:var(--muted);font-size:.9rem}
.section-gap>*+*{margin-top:20px}

table.nowrap td,table.nowrap th{white-space:nowrap}
table.nowrap .sub{white-space:nowrap}
@media (max-width:720px){table.nowrap td,table.nowrap th{white-space:normal}}

/* Mode sombre : les boutons « fantôme » et « danger » gardent un texte lisible */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .btn.ghost{color:var(--ink)}
  :root:not([data-theme="light"]) .btn.danger{color:var(--bad)}
  :root:not([data-theme="light"]) .btn.ghost:hover{background:var(--surface-2)}
}

/* Prise en main par le propriétaire de UvaConnect */
.impbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:9px 16px;background:#9A4A06;color:#fff;font-size:.92rem;position:sticky;top:0;z-index:70}
.impbar .btn{background:#fff;color:#6B3204;border-color:#fff}
/* Équipe : description des rôles, messages d'assistance */
.rolegrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.rolecard{border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.rolecard p{margin:8px 0 0;color:var(--muted);font-size:.92rem}
.bubble .who{display:block;font-size:.75rem;opacity:.78;margin-bottom:2px}
.bubble .when{display:block;font-size:.72rem;opacity:.7;margin-top:3px}
.thread form textarea{resize:vertical}
body.imp .side{top:44px;height:calc(100vh - 44px);height:calc(100dvh - 44px)}
@media (max-width:900px){body.imp .side{top:0;height:auto}}
.conv b small{white-space:nowrap;flex:none;font-weight:600}
.convlist .filters{gap:6px}
.convlist .filters .btn{padding:6px 10px}

/* Annonces de l'équipe UvaConnect */
.annstack{display:grid;gap:10px;margin-bottom:16px}
.annstack:empty{display:none;margin:0}
.ann{display:flex;align-items:flex-start;gap:8px;padding:12px 8px 12px 16px;border-radius:12px;border-left:5px solid var(--indigo);background:var(--indigo-l);color:var(--indigo-d)}
.ann.warning{border-left-color:var(--warn);background:var(--warn-bg);color:var(--warn)}
.ann.promo{border-left-color:var(--ok);background:var(--ok-bg);color:var(--ok)}
.ann .anntext{flex:1;min-width:0}
.ann p{margin:4px 0 0;white-space:pre-line;font-weight:500;overflow-wrap:anywhere}
.ann .iconbtn{flex:none;margin-top:-6px}
.ann .iconbtn:hover{background:rgba(0,0,0,.08)}
.annlist .live{font-weight:700}