/* ============================================================================
   Rapports — fréquentation, revenus, paniers oubliés
   Chargé par app.css (@import). Une règle posée directement dans app.css
   n'atteindrait jamais le navigateur : css_links() ne sert que les fichiers importés.
   ============================================================================ */

/* --- Barre de période ----------------------------------------------------- */
.report-filters { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3) var(--sp-4); }
.report-presets { display: flex; flex-wrap: wrap; gap: var(--sp-1); }
.report-dates { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2); }
/* La période lue en toutes lettres passe à la ligne et prend toute la largeur : c'est
   elle qui dit ce que les chiffres du dessous recouvrent, elle ne doit pas se perdre
   au bout de la rangée de boutons. */
.report-range { flex: 1 0 100%; margin: 0; font-size: var(--fs-sm); }
.report-note { margin: calc(-1 * var(--sp-2)) 0 var(--sp-4); font-size: var(--fs-sm); }

/* --- Hauteur des graphiques ----------------------------------------------- */
/* Fixée ici plutôt qu'en style= sur chaque page : les trois onglets doivent donner
   la même hauteur, sinon passer de l'un à l'autre fait sauter la page. */
.card-body > .chart-box { height: 300px; }
@media (max-width: 640px) { .card-body > .chart-box { height: 220px; } }

/* --- Colonnes de tableaux ------------------------------------------------- */
.report-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: var(--sp-4); align-items: start; }
.report-cols-3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.report-cols > .card { margin: 0; }

/* --- Barre de proportion dans les répartitions ---------------------------- */
/* Une part se saisit mieux d'un coup d'œil qu'en lisant un pourcentage : la barre
   donne l'ordre de grandeur, le nombre juste à côté donne la précision. */
.report-share { width: 34%; padding-left: 0; }
.report-share span { display: block; height: 6px; width: var(--share, 0%); min-width: 2px; background: var(--c-primary); border-radius: 999px; }

/* --- Aperçu du contenu d'un panier ---------------------------------------- */
.cart-peek { margin: 0; padding: 0; list-style: none; font-size: var(--fs-sm); }
.cart-peek li + li { margin-top: .15rem; }
