/* Analyse des ventes · affichage Écran (v3) : tableau de bord 16/9, thèmes Nuit et Jour.
   Tout est limité à #stage-screen.ecran (et à body.nuit pour la barre) : le dossier PDF et l'impression gardent la feuille A4. */

/* Sélecteur Nuit / Jour / A4 */
.aff{display:inline-flex;background:#eef0f4;border-radius:5px;padding:2px;margin-right:4px}
.aff button{border:0;background:none;font-size:12px;padding:4px 11px;border-radius:4px;color:var(--ink-2)}
.aff button[aria-pressed="true"]{background:#fff;color:var(--navy-ink);font-weight:600;box-shadow:0 1px 2px rgba(20,30,60,.14)}

/* ---------- Thème Jour ---------- */
.stage.ecran{background:#eceef3}
.ecran .stage-inner{width:1360px}
.ecran .sheet{width:1360px;height:765px;background:transparent;box-shadow:none;padding:0 2px;overflow:visible}

.ecran .sh-head{border-bottom:0;padding:0 4px 12px;gap:16px;align-items:center}
.ecran .sh-head img{height:30px;background:#fff;border-radius:6px;padding:5px 8px;box-sizing:content-box;box-shadow:0 1px 2px rgba(20,30,60,.08)}
.ecran .sh-title{border-left:0;padding-left:0}
.ecran .sh-title h1{font-size:26px;letter-spacing:.1px}
.ecran .sh-title p{font-size:12px}
.ecran .sh-period{background:#fff;border-radius:8px;padding:8px 14px;box-shadow:0 1px 2px rgba(20,30,60,.06)}
.ecran .sh-period strong{font-size:18px}
.ecran .sh-period span{font-size:10.5px}

/* Indicateurs : une carte par indicateur, l'indicateur principal en bleu GSL, mini-courbe en fond */
.ecran .kpis{gap:12px;border-bottom:0;grid-template-columns:1.3fr repeat(5,1fr)}
.ecran .kpi,.ecran .kpi:first-child{background:#fff;border:0;border-radius:10px;padding:13px 16px 8px;overflow:hidden;
  box-shadow:0 1px 2px rgba(20,30,60,.06),0 4px 14px rgba(20,30,60,.06);transition:box-shadow .25s,transform .25s}
.ecran .kpi:hover{box-shadow:0 2px 4px rgba(20,30,60,.08),0 14px 30px rgba(20,30,60,.12);transform:translateY(-2px)}
.ecran .kpi .k-lab{font-size:10px;letter-spacing:.7px}
.ecran .kpi .k-val{font-size:28px;margin-top:5px}
.ecran .kpi .k-val.txt{font-size:20px;padding-top:7px}
.ecran .kpi.main{background:linear-gradient(135deg,#2f47c4 0%,#233588 55%,#1a2766 100%)}
.ecran .kpi.main .k-lab,.ecran .kpi.main .k-cmp small,.ecran .kpi.main .k-n2 small,.ecran .kpi.main .k-cmp{color:rgba(255,255,255,.75)}
.ecran .kpi.main .k-val{color:#fff;font-size:34px}
.ecran .kpi.main .k-spark svg path:not(.spark-area){stroke:rgba(255,255,255,.85)!important}
.ecran .kpi.main .k-spark svg circle{fill:#fff!important}
.ecran .kpi .k-spark{height:30px;margin:6px -16px 0}
/* évolution en pastille */
.ecran .kpi .k-cmp{gap:4px}
.ecran .kpi .k-cmp>span:first-child{align-self:flex-start;display:inline-flex;align-items:baseline;gap:4px;border-radius:20px;padding:2px 9px;font-weight:600;font-size:11.5px}
.ecran .kpi .k-cmp>span.up{background:rgba(31,107,58,.1)}.ecran .kpi .k-cmp>span.down{background:rgba(176,58,42,.09)}.ecran .kpi .k-cmp>span.flat{background:rgba(120,128,145,.1)}
.ecran .kpi .k-cmp>span:first-child small{font-weight:400}
.ecran .kpi.main .k-cmp>span:first-child{background:rgba(255,255,255,.14)}
.ecran .kpi.main .up{color:#a8f0c0}.ecran .kpi.main .down{color:#ffc1b5}.ecran .kpi.main .flat{color:rgba(255,255,255,.8)}

/* « À retenir » */
.insights{display:none}
.ecran .insights{display:grid;grid-template-columns:auto repeat(3,1fr);gap:12px;margin-top:12px;align-items:stretch}
.ecran .ins-lab{writing-mode:vertical-rl;transform:rotate(180deg);font-size:9.5px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--ochre);text-align:center;padding:0 2px}
.ecran .ins{display:flex;gap:11px;align-items:flex-start;background:#fff;border-radius:10px;padding:9px 14px;box-shadow:0 1px 2px rgba(20,30,60,.06),0 4px 14px rgba(20,30,60,.05);min-width:0;position:relative;overflow:hidden}
.ecran .ins::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--muted)}
.ecran .ins.up::before{background:var(--good)}.ecran .ins.down::before{background:var(--bad)}.ecran .ins.flat::before{background:var(--ochre)}
.ecran .ins i{flex:none;width:24px;height:24px;border-radius:50%;margin-top:2px;position:relative;background:rgba(120,128,145,.12)}
.ecran .ins.up i{background:rgba(31,107,58,.12)}.ecran .ins.down i{background:rgba(176,58,42,.11)}.ecran .ins.flat i{background:rgba(208,138,30,.14)}
.ecran .ins i::after{content:"";position:absolute;left:8px;top:8px;width:7px;height:7px;border-top:2px solid var(--muted);border-right:2px solid var(--muted)}
.ecran .ins.up i::after{border-color:var(--good);transform:rotate(-45deg);top:10px}
.ecran .ins.down i::after{border-color:var(--bad);transform:rotate(135deg);top:6px}
.ecran .ins.flat i::after{border-color:var(--ochre);transform:rotate(45deg);left:7px}
.ecran .ins div{min-width:0}
.ecran .ins strong{display:block;font-size:11.5px;color:var(--ink);margin-bottom:1px}
.ecran .ins span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:11.5px;line-height:1.4;color:var(--ink-2)}

.ecran .remarks{display:none}

/* Cartes de contenu */
.ecran .sh-body{column-gap:12px;row-gap:12px;padding:12px 0 6px}
.ecran .blk{position:relative;background:#fff;border-radius:10px;padding:13px 16px 10px;box-shadow:0 1px 2px rgba(20,30,60,.06),0 4px 14px rgba(20,30,60,.05);transition:box-shadow .25s,opacity .3s,filter .3s}
.ecran .blk:hover{box-shadow:0 2px 4px rgba(20,30,60,.08),0 14px 32px rgba(20,30,60,.12)}
.ecran .blk-h{border-bottom:0;padding-bottom:2px;margin-bottom:8px;padding-right:26px}
.ecran .blk-h h2{font-size:12px;letter-spacing:.6px}

/* Bouton d'agrandissement */
.blk-x{display:none}
.ecran .blk-x{display:block;position:absolute;top:10px;right:10px;width:22px;height:22px;border:0;border-radius:5px;background:transparent;opacity:0;transition:opacity .15s,background-color .15s;cursor:pointer}
.ecran .blk:hover .blk-x,.ecran .blk.focused .blk-x{opacity:1}
.ecran .blk-x:hover{background:rgba(120,128,145,.14)}
.ecran .blk-x::before,.ecran .blk-x::after{content:"";position:absolute;width:6px;height:6px;border:1.6px solid var(--muted)}
.ecran .blk-x::before{top:5px;right:5px;border-left:0;border-bottom:0}
.ecran .blk-x::after{bottom:5px;left:5px;border-right:0;border-top:0}
.ecran .blk.focused .blk-x::before{top:9px;right:9px;border:1.6px solid var(--muted);border-right:0;border-top:0}
.ecran .blk.focused .blk-x::after{bottom:9px;left:9px;border:1.6px solid var(--muted);border-left:0;border-bottom:0}
.ecran .sheet.focusing>*:not(.sh-body),.ecran .sheet.focusing .sh-body>.blk:not(.focused){opacity:.08!important;filter:blur(2px);pointer-events:none}
.ecran .blk.focused{z-index:20;box-shadow:0 24px 70px rgba(10,16,40,.35)}

.ecran .sh-foot{border-top:0;padding:2px 4px 0}
.ecran .sheet.loading{opacity:.6}

/* ---------- Thème Nuit : salle de pilotage ---------- */
.stage.ecran.nuit{background:#0a1029 radial-gradient(1200px 500px at 50% -10%,#16214d 0%,rgba(10,16,41,0) 70%) no-repeat}
.stage.ecran.nuit{
  --paper:#121a3a;--field:#18214a;--ink:#e8ecf8;--ink-2:#b4bdd8;--muted:#7f89a9;--rule:#2a3459;--rule-2:#1f2849;
  --navy:#8ea3ff;--navy-ink:#dfe5ff;--navy-tint:#1e2a5c;--good:#4fd18b;--bad:#ff7d6b;--ochre:#f0a640;
  --cur:#7d95ff;--prev:#58628a;--prev2:#3a4368;--up:#6f8cff;--down:#ff7d6b;--neutral:#3a4368;
  --s1:#6f8cff;--s2:#f0a640;--s3:#3fc79a;--s4:#ff7d6b;--s5:#a98bff;--s6:#5cc2f2;--s7:#8a91a6;--s8:#58628a;
  --surface:#121a3a;--surface-2:#18214a;--hair:#222b4d;--axis:#3a4470;--grid:#1c2548;--accent:#8ea3ff;--good-ink:#4fd18b;--bad-ink:#ff7d6b;
  --concrete:#58628a;--concrete-2:#3a4368;color:var(--ink)}
.nuit .sh-head img{background:#fff}
.nuit .sh-title h1,.nuit .sh-period strong{color:#fff}
.nuit .sh-period{background:#121a3a;box-shadow:0 0 0 1px rgba(255,255,255,.05)}
.nuit .kpi,.nuit .kpi:first-child,.nuit .blk,.nuit .ins{background:#121a3a;box-shadow:0 0 0 1px rgba(255,255,255,.05),0 10px 30px rgba(0,0,0,.25)}
.nuit .kpi:hover,.nuit .blk:hover{box-shadow:0 0 0 1px rgba(142,163,255,.22),0 16px 40px rgba(0,0,0,.35)}
.nuit .kpi.main{background:linear-gradient(135deg,#3d5bff 0%,#2a3fb8 50%,#1b2774 100%);box-shadow:0 0 0 1px rgba(142,163,255,.3),0 12px 40px rgba(61,91,255,.28)}
.nuit .kpi .k-val{color:#fff}
.nuit .kpi .k-cmp>span.up{background:rgba(79,209,139,.12)}.nuit .kpi .k-cmp>span.down{background:rgba(255,125,107,.12)}
.nuit .blk-h h2{color:#dfe5ff}
.nuit .ins.up i{background:rgba(79,209,139,.14)}.nuit .ins.down i{background:rgba(255,125,107,.14)}.nuit .ins.flat i{background:rgba(240,166,64,.14)}
.nuit .chart .map-base .dep{fill:#1a2349;stroke:#0a1029}
.nuit .chart .map-base .dep.has{fill:#7d95ff}
.nuit .chart .map-lbl{stroke:#121a3a}
.nuit .chart .dep-lbl{fill:#aab6e8}
.nuit table.t tr.total td{color:#fff}
.nuit .switch button{color:var(--muted)}.nuit .switch button[aria-pressed="true"]{color:#dfe5ff}
.nuit .link{color:#9fb1ff}
.nuit .blk-x::before,.nuit .blk-x::after{border-color:#9aa4c4}
.nuit .sheet.focusing .blk.focused{box-shadow:0 0 0 1px rgba(142,163,255,.3),0 30px 90px rgba(0,0,0,.6)}
.nuit .sheet input[type=range]{accent-color:#7d95ff}

/* Barre d'outils et barre de filtres en Nuit */
body.nuit{background:#0a1029}
body.nuit .toolbar{background:#0e1532;border-bottom-color:#1f2849}
body.nuit .tb-brand img{background:#fff;border-radius:5px;padding:3px 6px;box-sizing:content-box;height:24px}
body.nuit .tb-brand span{color:#dfe5ff;border-left-color:#2a3459}
body.nuit .tabs button{color:#9aa4c4}
body.nuit .tabs button:hover,body.nuit .tabs button[aria-current="page"]{color:#fff}
body.nuit .tab-ink{background:#7d95ff;box-shadow:0 0 10px rgba(125,149,255,.7)}
body.nuit .btn{background:#141c3e;border-color:#2a3459;color:#dfe5ff}
body.nuit .btn:hover{border-color:#7d95ff;color:#fff}
body.nuit .btn.primary{background:#3d5bff;border-color:#3d5bff;color:#fff}
body.nuit .tb-back{color:#9aa4c4}
body.nuit .aff{background:#141c3e}
body.nuit .aff button{color:#9aa4c4}
body.nuit .aff button[aria-pressed="true"]{background:#2a3a8a;color:#fff;box-shadow:none}
body.nuit .fbar{background:#0e1532;border-top-color:#1f2849}
body.nuit .tok{background:#141c3e;border-color:#2a3459}
body.nuit .tok.on{background:#18224d;border-color:#34418a}
body.nuit .tok-v,body.nuit .tok.on .tok-v{color:#eef1fb}
body.nuit .tok-l,body.nuit .fb-lab{color:#7f89a9}
body.nuit .seg,body.nuit .years{background:#141c3e}
body.nuit .seg button{color:#9aa4c4}
body.nuit .seg button[aria-checked="true"]{color:#fff}
body.nuit .seg-thumb{background:#2a3a8a;box-shadow:none}
body.nuit .fb-add{color:#9fb1ff;border-color:#34418a}
body.nuit .fb-add:hover{background:#141c3e;border-color:#7d95ff}
body.nuit .fb-add kbd{background:#141c3e;border-color:#34418a;color:#9aa4c4}
body.nuit .fb-sep{background:#2a3459}
body.nuit .fchip{background:#1e2a5c;color:#dfe5ff}
body.nuit .chip-k{color:#9aa4c4}
body.nuit .fb-reset,body.nuit .fb-compare{color:#9aa4c4}
body.nuit .progress span{background:#7d95ff;box-shadow:0 0 8px #7d95ff}

@media print{.aff,.blk-x,.insights{display:none!important}}

/* Onglets : pas de barre de défilement visible */
.v3 .tabs{scrollbar-width:none}
.v3 .tabs::-webkit-scrollbar{display:none}
.v3 .tabs button{padding:0 10px}