/* ------------------------------------------------------------------
   Facette · onglet Statistiques (03/10/2026)
   Que des variables de styles.css, plus les trois couleurs des
   graphiques, vérifiées pour les daltoniens sur les deux fonds
   (validate_palette.js : fond foncé #1B1235, fond clair #FFFCF6) :
   encaissé = vert, encore attendu = violet, dépenses = rose, et depuis
   le 06/10/2026 signé = bleu (#3D86F0 foncé, #2563EB clair, validés
   avec les trois autres : CVD et vision normale au-dessus du seuil).
   Traits fins, colonnes de 24 px au plus arrondies côté valeur,
   grille en filet plein, textes jamais dans la couleur des données.
   ------------------------------------------------------------------ */

#vue-statistiques{--st-recu:#1FA884;--st-prevu:#8B66FA;--st-sortie:#F4467E;--st-signe:#3D86F0;--st-fond-doux:rgba(255,255,255,0.03)}
#vue-statistiques .st-vide{color:var(--texte-doux);font-size:14px;padding:6px 0}
#vue-statistiques .st-bandeau{border:1px solid rgba(255,154,61,.45);background:rgba(255,154,61,.10);border-radius:12px;padding:10px 14px;font-size:14px;margin-bottom:14px}

/* ---- la barre : ‹ 2026 › ---- */
#vue-statistiques .st-barre{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:center;margin-bottom:14px}
#vue-statistiques .st-nav{display:flex;align-items:center;gap:8px}
#vue-statistiques .st-titre{font-family:var(--display);font-weight:800;font-size:clamp(22px,2.4vw,28px);letter-spacing:-0.01em;min-width:3.2ch;text-align:center}
#vue-statistiques .st-fleche{width:36px;height:36px;border-radius:10px;border:1px solid var(--trait-fort);background:var(--st-fond-doux);color:var(--texte);font-size:22px;line-height:1;display:inline-flex;align-items:center;justify-content:center}
#vue-statistiques .st-fleche:disabled{opacity:.35;cursor:default}
#vue-statistiques .st-sous{color:var(--texte-doux);font-size:14px}

/* ---- les six chiffres de l'année ---- */
#vue-statistiques .st-tuiles{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:14px}
@media (min-width:1400px){#vue-statistiques .st-tuiles{grid-template-columns:repeat(7,minmax(0,1fr))}}
#vue-statistiques .st-tuile{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:var(--rayon);border:1px solid var(--trait);background:var(--carte);min-width:0}
#vue-statistiques .st-tuile-etiquette{font-size:12px;color:var(--texte-faible);text-transform:uppercase;letter-spacing:.06em;font-weight:600}
#vue-statistiques .st-tuile-valeur{font-family:var(--display);font-weight:800;font-size:clamp(22px,2.4vw,30px);letter-spacing:-0.02em;line-height:1.15}
#vue-statistiques .st-tuile-detail{font-size:12.5px;color:var(--texte-doux)}
#vue-statistiques .st-tuile--vert .st-tuile-valeur{color:var(--vert)}
#vue-statistiques .st-tuile--rouge{border-color:rgba(244,70,126,.45);background:linear-gradient(160deg,rgba(244,70,126,.14),var(--carte) 65%)}
#vue-statistiques .st-tuile--rouge .st-tuile-valeur{color:var(--rose)}
#vue-statistiques .st-tuile--bleu{border-color:rgba(61,134,240,.50);background:linear-gradient(160deg,rgba(61,134,240,.18),var(--carte) 65%)}
#vue-statistiques .st-tuile-plus{display:block;margin-top:1px;font-family:var(--corps);font-size:13px;font-weight:600;letter-spacing:0;line-height:1.3;color:var(--texte-doux);white-space:nowrap}

/* ---- les cartes ---- */
#vue-statistiques .st-carte{border:1px solid var(--trait);border-radius:var(--rayon);background:var(--carte);padding:16px 17px;margin-bottom:14px;min-width:0}
#vue-statistiques .st-carte-tete{display:flex;flex-wrap:wrap;gap:6px 18px;align-items:baseline;justify-content:space-between;margin-bottom:10px}
#vue-statistiques .st-carte-tete h3{font-family:var(--display);font-size:17px;font-weight:700}
#vue-statistiques .st-legende{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:var(--texte-doux)}
#vue-statistiques .st-legende span{display:inline-flex;align-items:center;gap:6px}
#vue-statistiques .st-legende-texte{font-size:12.5px;color:var(--texte-faible)}
#vue-statistiques .st-cle{display:inline-block;width:11px;height:11px;border-radius:3px}
#vue-statistiques .st-note{font-size:12px;color:var(--texte-faible);margin-top:6px}
#vue-statistiques .st-deux{display:grid;gap:14px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
#vue-statistiques .st-deux .st-carte{margin-bottom:14px}

/* ---- les graphiques ---- */
#vue-statistiques .st-graphe{position:relative}
#vue-statistiques .st-svg{display:block;overflow:visible}
#vue-statistiques .st-recu{fill:var(--st-recu);background:var(--st-recu)}
#vue-statistiques .st-prevu{fill:var(--st-prevu);background:var(--st-prevu)}
#vue-statistiques .st-sortie{fill:var(--st-sortie);background:var(--st-sortie)}
#vue-statistiques .st-signe{fill:var(--st-signe);background:var(--st-signe)}
#vue-statistiques .st-grille{stroke:var(--trait);stroke-width:1;shape-rendering:crispEdges}
#vue-statistiques .st-zero{stroke:var(--trait-fort)}
#vue-statistiques .st-axe{fill:var(--texte-faible);font-size:11.5px;font-family:var(--corps);font-variant-numeric:tabular-nums}
#vue-statistiques .st-mois{font-size:12px}
#vue-statistiques .st-maintenant.st-mois{fill:var(--texte);font-weight:700}
#vue-statistiques .st-valeur{fill:var(--texte-doux);font-size:12px;font-weight:600;font-family:var(--corps)}
#vue-statistiques .st-cible{fill:transparent;cursor:default;outline:none}
#vue-statistiques .st-groupe.survol path,#vue-statistiques .st-groupe.survol rect:not(.st-cible){filter:brightness(1.2)}
#vue-statistiques .st-groupe.survol .st-cible{fill:var(--st-fond-doux)}
#vue-statistiques .st-infobulle{position:absolute;z-index:5;pointer-events:none;min-width:190px;background:var(--nuit-2);border:1px solid var(--trait-fort);border-radius:10px;padding:9px 11px;box-shadow:0 18px 40px -18px rgba(0,0,0,.7);font-size:13px}
#vue-statistiques .st-infobulle p{display:flex;flex-direction:row-reverse;justify-content:space-between;gap:14px;align-items:baseline;margin:2px 0}
#vue-statistiques .st-infobulle p b{font-family:var(--mono);font-size:13px;color:var(--texte)}
#vue-statistiques .st-infobulle p span{display:inline-flex;align-items:center;gap:7px;color:var(--texte-doux)}
#vue-statistiques .st-infobulle .st-info-titre{display:block;font-weight:700;color:var(--texte);margin-bottom:5px;text-transform:capitalize}
#vue-statistiques .st-trait{display:inline-block;width:12px;height:2px;border-radius:1px}

/* ---- où va l'argent ---- */
#vue-statistiques .st-postes{list-style:none;margin:0;padding:0;display:grid;gap:10px}
#vue-statistiques .st-postes li{display:grid;grid-template-columns:minmax(110px,170px) 1fr auto;gap:12px;align-items:center;font-size:13.5px}
#vue-statistiques .st-poste-nom{color:var(--texte-doux);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#vue-statistiques .st-poste-barre{height:12px;display:block}
#vue-statistiques .st-poste-barre i{display:block;height:100%;background:var(--st-sortie);border-radius:0 4px 4px 0}
#vue-statistiques .st-poste-montant{font-family:var(--mono);font-size:13px;text-align:right;white-space:nowrap}
#vue-statistiques .st-poste-montant small{color:var(--texte-faible);font-family:var(--corps);margin-left:4px}

/* ---- le tableau ---- */
#vue-statistiques .st-tableau-cadre{overflow-x:auto}
#vue-statistiques .st-tableau{width:100%;border-collapse:collapse;font-size:14px;min-width:760px}
#vue-statistiques .st-tableau th{text-align:left;font-size:11.5px;color:var(--texte-faible);text-transform:uppercase;letter-spacing:.05em;font-weight:600;padding:6px 10px;border-bottom:1px solid var(--trait);white-space:nowrap}
#vue-statistiques .st-tableau td{padding:9px 10px;border-bottom:1px solid var(--trait)}
#vue-statistiques .st-tableau .st-nb{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
#vue-statistiques .st-tableau tbody tr{cursor:pointer}
#vue-statistiques .st-tableau tbody tr:hover td{background:var(--st-fond-doux)}
#vue-statistiques .st-tableau tbody tr:focus-visible{outline:2px solid var(--violet);outline-offset:-2px}
#vue-statistiques .st-tableau tr.st-maintenant td{background:rgba(110,58,247,.10)}
#vue-statistiques .st-tableau tr.st-futur td{color:var(--texte-doux)}
#vue-statistiques .st-tableau small{color:var(--texte-faible);font-size:11.5px}
#vue-statistiques .st-tableau tfoot td{font-weight:700;border-bottom:0;border-top:1px solid var(--trait-fort)}
#vue-statistiques .st-positif{color:var(--vert)}
#vue-statistiques .st-negatif{color:var(--rose)}

/* ---- écrans moyens et téléphone ---- */
@media (max-width:1180px){
  #vue-statistiques .st-deux{grid-template-columns:1fr}
}
@media (max-width:760px){
  #vue-statistiques .st-tuiles{grid-template-columns:1fr 1fr}
  #vue-statistiques .st-tuile:last-child:nth-child(odd){grid-column:1/-1}
  #vue-statistiques .st-tuile{padding:12px}
  #vue-statistiques .st-tuile-valeur{font-size:21px}
  #vue-statistiques .st-carte{padding:14px 12px}
  #vue-statistiques .st-postes li{grid-template-columns:1fr auto;gap:4px 10px}
  #vue-statistiques .st-poste-barre{grid-column:1/-1;grid-row:2}
}

/* ---- fond clair : les mêmes rôles, des pas plus foncés (validés sur #FFFCF6) ---- */
html[data-theme="clair"] #vue-statistiques{--st-recu:#0E8F6A;--st-prevu:#6E3AF7;--st-sortie:#D6336C;--st-signe:#2563EB;--st-fond-doux:rgba(60,42,20,0.03)}
html[data-theme="clair"] #vue-statistiques .st-tuile--bleu{border-color:rgba(37,99,235,.40);background:linear-gradient(160deg,rgba(37,99,235,.08),var(--carte) 65%)}
html[data-theme="clair"] #vue-statistiques .st-infobulle{background:var(--carte);box-shadow:0 18px 40px -18px rgba(80,60,30,.35)}
html[data-theme="clair"] #vue-statistiques .st-tuile--rouge{background:linear-gradient(160deg,rgba(244,70,126,.08),var(--carte) 65%)}
html[data-theme="clair"] #vue-statistiques .st-tuile--vert .st-tuile-valeur,html[data-theme="clair"] #vue-statistiques .st-positif{color:#0E8F6A}
html[data-theme="clair"] #vue-statistiques .st-tuile--rouge .st-tuile-valeur,html[data-theme="clair"] #vue-statistiques .st-negatif{color:#C2185B}
html[data-theme="clair"] #vue-statistiques .st-tableau tr.st-maintenant td{background:rgba(110,58,247,.06)}