/* Sorti de analytics.php le 19/09/2026.
 *
 * Les feuilles etaient ecrites dans les pages, ce qui obligeait la
 * politique de securite a autoriser 'unsafe-inline' sur style-src : toute
 * injection de HTML devenait alors une injection de style. En fichier, le
 * navigateur peut les mettre en cache, et la politique peut se fermer.
 *
 * Deplace sans une modification : ce qui suit est le bloc d'origine. */

/* ── full-viewport lock (same as facture.php) ── */
html,body{height:100%;overflow:hidden;}
.app{height:100vh;overflow:hidden;}
.main{height:100vh;min-height:0;overflow:hidden;display:flex;flex-direction:column;}
.an-shell{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;}

/* ── page header ── */
.an-page-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-5) var(--space-8) 0;flex-shrink:0;gap:var(--space-3);}
.an-page-kicker{font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--psg-gold-dark,#b8860b);margin-bottom:2px;}
.an-page-title{font-size:1.5rem;font-weight:900;color:var(--psg-navy);margin:0;line-height:1.1;}
.an-page-sub{font-size:.8rem;color:var(--grey-400);font-weight:600;margin-top:3px;}

/* ── filter bar ── */
.an-bar{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-bottom:1px solid var(--grey-100);background:#fff;flex-shrink:0;flex-wrap:wrap;border-radius:10px;margin:var(--space-5) var(--space-8) 0;border:1px solid #d9d9d9;}
.an-bar-sep{width:1px;height:24px;background:var(--grey-200);margin:0 var(--space-1);}
.an-bar-label{font-size:.72rem;font-weight:700;color:var(--grey-400);}
/* Le bandeau de projection : une phrase, pas un graphique. */
.proj{display:flex;align-items:baseline;gap:var(--space-3);flex-wrap:wrap;padding:12px 16px;margin-bottom:var(--space-3);
      border-radius:10px;background:#f8fafc;border:1px solid var(--grey-100);border-left:4px solid #001a2f;}
.proj-n{font-size:1.5rem;font-weight:900;color:#001a2f;font-variant-numeric:tabular-nums;}
.proj-t{font-size:.82rem;color:var(--grey-600);font-weight:600;}
.proj-c{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:2px 8px;border-radius:999px;}
.proj-bonne{background:#dcfce7;color:#166534;} .proj-moyenne{background:#fef9c3;color:#854d0e;} .proj-faible{background:#fee2e2;color:#991b1b;}
/* Tableaux compacts des repartitions. */
.rep{width:100%;border-collapse:collapse;font-size:.8rem;}
.rep th{text-align:left;font-size:.62rem;text-transform:uppercase;letter-spacing:.05em;color:var(--grey-400);font-weight:800;padding:5px 8px;border-bottom:1px solid var(--grey-100);}
.rep td{padding:6px 8px;border-bottom:1px solid var(--grey-50);font-variant-numeric:tabular-nums;}
.rep td.n{text-align:right;font-weight:700;}
.rep tr:last-child td{border-bottom:none;}
.an-bar input[type=date]{font-size:.78rem;padding:5px 8px;border:1px solid var(--grey-200);border-radius:6px;color:var(--grey-700);font-family:inherit;font-weight:600;background:#fff;}
.an-info{font-size:.72rem;color:var(--grey-400);font-weight:700;margin-left:auto;}

/* ── tabs — floating card like cmd-stats ── */
/* DEFILEMENT HORIZONTAL, JAMAIS VERTICAL.
   `overflow-x:auto` seul force `overflow-y` a `auto`. Le trait de l'onglet
   actif debordait de 2 px vers le bas (margin-bottom:-2px), ce qui suffisait a
   faire apparaitre une minuscule barre de defilement verticale. Le trait est
   devenu une ombre interne : elle se peint a l'interieur, donc elle ne deborde
   de rien, et le defilement vertical n'a plus lieu d'etre. */
.an-tabs{display:flex;gap:2px;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin;padding:0 var(--space-5);background:#fff;flex-shrink:0;margin:var(--space-5) var(--space-8) 0;border-radius:10px;border:1px solid #d9d9d9;}
.an-tabs::-webkit-scrollbar{height:5px;}
.an-tabs::-webkit-scrollbar-thumb{background:var(--grey-200);border-radius:999px;}
.an-tabs::-webkit-scrollbar-track{background:transparent;}
.an-tab{padding:12px 16px;font-size:.8rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--grey-400);cursor:pointer;flex-shrink:0;box-shadow:inset 0 -2px 0 transparent;transition:color .15s,box-shadow .15s;white-space:nowrap;display:flex;align-items:center;gap:6px;}
.an-tab:hover{color:var(--grey-700);}
.an-tab.active{color:var(--psg-navy);box-shadow:inset 0 -2px 0 var(--psg-navy);}
.an-tab svg{width:14px;height:14px;flex-shrink:0;}

/* ── panels ── */
.an-panels{flex:1;min-height:0;overflow:hidden;position:relative;}
.an-panel{display:none;position:absolute;inset:0;overflow-y:auto;padding:var(--space-5) var(--space-8);background:var(--grey-100);}
.an-panel.active{display:block;}

/* ── grids ── */
.g-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-3);margin-bottom:var(--space-4);}
.g-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3);margin-bottom:var(--space-4);}
.g-2{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3);margin-bottom:var(--space-4);}
.g-2-1{display:grid;grid-template-columns:2fr 1fr;gap:var(--space-3);margin-bottom:var(--space-4);}
.g-3-2{display:grid;grid-template-columns:3fr 2fr;gap:var(--space-3);margin-bottom:var(--space-4);}

/* ── KPI tile — matches .cpt-stat from comptabilite ── */
.kpi{background:#fff;border:1px solid #d9d9d9;border-radius:12px;padding:var(--space-4);position:relative;overflow:hidden;}
.kpi-label{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--grey-500);}
.kpi-value{font-size:1.2rem;font-weight:800;color:var(--psg-navy);margin-top:5px;}
.kpi-delta{font-size:.68rem;font-weight:800;margin-top:5px;}
.kpi-delta.up{color:#059669;} .kpi-delta.down{color:#dc2626;} .kpi-delta.flat{color:var(--grey-400);}
.kpi-accent{position:absolute;bottom:0;left:0;right:0;height:3px;}

/* ── chart card — uses .card from main.css ── */
.cc{background:#fff;border:1px solid #d9d9d9;border-radius:var(--radius-lg);padding:var(--space-4);overflow:hidden;}
.cc-label{font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--grey-500);margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--grey-100);display:block;}
.cc-wrap{position:relative;}
.h120{height:120px;} .h160{height:160px;} .h200{height:200px;} .h240{height:240px;} .h280{height:280px;}

/* ── mini table ── */
.mt{width:100%;border-collapse:collapse;font-size:.82rem;}
.mt th{padding:7px 10px;font-weight:800;font-size:.65rem;text-transform:uppercase;letter-spacing:.04em;color:var(--grey-500);border-bottom:2px solid var(--grey-100);text-align:left;white-space:nowrap;}
.mt td{padding:7px 10px;border-bottom:1px solid var(--grey-50);color:var(--grey-700);font-weight:600;vertical-align:middle;}
.mt tbody tr:hover{background:var(--grey-50);}
.mt tbody tr:last-child td{border-bottom:0;}
.rk{width:20px;text-align:right;font-size:.65rem;font-weight:900;color:var(--grey-300);padding-right:4px;}
.rk-1{color:#f59e0b;} .rk-2{color:var(--grey-400);} .rk-3{color:#b45309;}

/* ── insight pills ── */
.ins{display:inline-flex;align-items:center;gap:4px;border-radius:999px;padding:3px 10px;font-size:.68rem;font-weight:800;margin:2px;}
.ins-g{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0;}
.ins-r{background:#fef2f2;color:#dc2626;border:1px solid #fca5a5;}
.ins-b{background:#eff6ff;color:#1e40af;border:1px solid #bfdbfe;}
.ins-y{background:#fffbeb;color:#92400e;border:1px solid #fde68a;}

/* ── pair chip ── */
.pair-chip{background:var(--grey-50);border:1px solid var(--grey-100);border-radius:8px;padding:4px 10px;font-size:.72rem;font-weight:700;color:var(--grey-700);display:inline-flex;align-items:center;gap:5px;margin:2px;}
.pair-cnt{background:var(--psg-navy);color:#fff;border-radius:999px;padding:1px 6px;font-size:.62rem;}
