/* ══════════════════════════════════════════════════════════════════════════
 * stat-publique.css — LE VERSANT PUBLIC DES STATISTIQUES DU MINISTÈRE.
 *
 * ⚠ ELLE COMPLÈTE `marche_public.php`, ELLE NE LA REFAIT PAS. L'enveloppe
 *   publique (barre, `pub-main`, `pub-h1`, `pub-note`, `pub-pied`, mode sombre)
 *   vient de là et sert déjà trois produits. Ce fichier n'ajoute QUE ce qu'une
 *   page de données a de propre : un tableau long, des condensés à recopier,
 *   des cartes de document.
 *
 * ⚠ LES COULEURS PASSENT PAR LES VARIABLES DE L'ENVELOPPE (`--pub-*`), jamais
 *   par des valeurs en dur : le mode sombre est défini une seule fois, chez
 *   elle. Une valeur écrite ici serait invisible la nuit.
 * ══════════════════════════════════════════════════════════════════════════ */

/* ── Les documents publiés, en cartes ────────────────────────────────────── */
.sp-liste{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));margin:0 0 2rem}
.sp-carte{background:var(--pub-surf);border:1px solid var(--pub-line);border-radius:14px;
  padding:1.1rem 1.2rem;display:flex;flex-direction:column;gap:.5rem}
.sp-carte h2{margin:0;font-size:1.12rem;line-height:1.25;letter-spacing:-.01em}
.sp-carte h2 a{color:var(--pub-ink);text-decoration:none}
/* Survols sous `(hover:hover)` (audit 2026-09-10) : un écran tactile n'a pas de
 * survol, et un `:hover` collé y repeint l'élément après le doigt. */
@media (hover:hover){.sp-carte h2 a:hover{color:var(--pub-acc);text-decoration:underline}}
.sp-meta{font-size:.82rem;color:var(--pub-ink2);display:flex;flex-wrap:wrap;gap:.15rem .9rem}
.sp-meta b{color:var(--pub-ink);font-weight:650}

/* ── L'identité du document : millésime, portée, dates ───────────────────── */
.sp-fiche{background:var(--pub-surf);border:1px solid var(--pub-line);border-radius:14px;
  padding:1.2rem 1.3rem;margin:0 0 1.5rem}
.sp-fiche dl{display:grid;grid-template-columns:auto 1fr;gap:.45rem 1.1rem;margin:0;font-size:.92rem}
.sp-fiche dt{color:var(--pub-ink2);white-space:nowrap}
.sp-fiche dd{margin:0;color:var(--pub-ink)}

/* ── Le condensé : fait pour être RECOPIÉ, donc lisible et sélectionnable ── */
.sp-emp{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.78rem;
  word-break:break-all;line-height:1.5;background:var(--pub-bg);border:1px solid var(--pub-line);
  border-radius:8px;padding:.45rem .6rem;display:inline-block}
.sp-cmd{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.8rem;
  background:var(--pub-bg);border:1px solid var(--pub-line);border-radius:8px;
  padding:.6rem .75rem;overflow-x:auto;white-space:pre;margin:.75rem 0 0}

/* ── Le tableau de données ──────────────────────────────────────────────── */
/* ⚠ IL DÉFILE DANS SON PROPRE CADRE. Sept cents lignes de données sur un
 *   téléphone : sans ce conteneur, c'est la PAGE qui défile latéralement, et
 *   le corps du texte devient illisible. */
.sp-cadre{overflow-x:auto;border:1px solid var(--pub-line);border-radius:12px;background:var(--pub-surf)}
.sp-tab{width:100%;border-collapse:collapse;font-size:.86rem;min-width:38rem}
/* Alignements LOGIQUES (start/end), jamais left/right : en arabe la table part
 * de la droite, et les nombres doivent suivre la fin de ligne, pas le bord ouest. */
.sp-tab th,.sp-tab td{padding:.5rem .7rem;border-bottom:1px solid var(--pub-line);text-align:end;
  white-space:nowrap}
.sp-tab th:first-child,.sp-tab td:first-child,
.sp-tab th:nth-child(2),.sp-tab td:nth-child(2){text-align:start;white-space:normal}
.sp-tab thead th{position:sticky;top:0;background:var(--pub-surf);z-index:1;
  font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--pub-ink2)}
.sp-tab tbody tr:last-child td{border-bottom:0}
.sp-tab .n{font-variant-numeric:tabular-nums;font-weight:650}
.sp-tab .c{color:var(--pub-ink2);font-variant-numeric:tabular-nums}

/* ── Les liens de téléchargement ────────────────────────────────────────── */
.sp-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 1.2rem}
.sp-dl{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .9rem;border-radius:9px;
  border:1px solid var(--pub-acc);color:var(--pub-acc);text-decoration:none;font-weight:650;font-size:.9rem}
@media (hover:hover){.sp-dl:hover{background:var(--pub-acc);color:#fff}}

.sp-vide{color:var(--pub-ink2);font-size:.95rem}
.sp-titre-sec{font-size:1.05rem;margin:2rem 0 .8rem;letter-spacing:-.01em}

/* ⚠ L'INDICATEUR CHOISI SE VOIT. Une barre de filtres où rien n'est marqué
 *   laisse croire qu'aucun filtre n'est actif — et le lecteur prend les
 *   131 lignes d'un indicateur pour la totalité du document. */
.sp-dl.on{background:var(--pub-acc);color:#fff}
.sp-dl .c{opacity:.72;font-weight:500}

/* ══════════════════════════════════════════════════════════════════════════
 * 🔴 SUR UN TÉLÉPHONE, LE TABLEAU NE MONTRAIT AUCUN CHIFFRE.
 *
 *    `.sp-tab` imposait `min-width:38rem` (608 px) et défilait dans son cadre.
 *    À 375 px, les deux seules colonnes visibles au repos étaient
 *    « Indicateur » et « Territoire » : « Valeur » et « Établissements » —
 *    c'est-à-dire TOUT le contenu — restaient hors écran, sans la moindre
 *    marque invitant à glisser. C'est la page que le ministère donne à citer
 *    au public.
 *
 *    Sous 560 px, la table passe donc en FICHES EMPILÉES : chaque ligne est un
 *    bloc, chaque cellule porte son intitulé via `data-l`. Plus de défilement
 *    latéral, et les quatre valeurs sont lisibles d'un coup.
 *
 * ⚠ L'EN-TÊTE EST SORTI AVEC UNE PROPRIÉTÉ LOGIQUE (`inset-inline-start`), pas
 *   avec `left:-9999px` : en arabe, la forme physique décale toute la page —
 *   défaut déjà payé dans ce dépôt.
 * ══════════════════════════════════════════════════════════════════════════ */
@media (max-width:560px){
  .sp-cadre{overflow-x:visible;border:0;background:transparent;border-radius:0}
  .sp-tab{min-width:0;font-size:.9rem}
  .sp-tab thead{position:absolute;inset-inline-start:-9999px;inline-size:1px;block-size:1px;overflow:hidden}
  .sp-tab tr{display:block;background:var(--pub-surf);border:1px solid var(--pub-line);
    border-radius:12px;padding:.65rem .8rem;margin-block-end:.7rem}
  .sp-tab td{display:flex;justify-content:space-between;gap:.9rem;align-items:baseline;
    border:0;padding:.22rem 0;text-align:end;white-space:normal}
  .sp-tab td::before{content:attr(data-l);color:var(--pub-ink2);font-size:.78rem;
    font-weight:600;text-align:start;flex:0 0 auto}
  /* L'indicateur est le titre de la fiche : il prend la ligne entière. */
  .sp-tab td:first-child{display:block;font-weight:650;text-align:start;
    padding-block-end:.4rem;margin-block-end:.3rem;border-bottom:1px solid var(--pub-line)}
  .sp-tab td:first-child::before{display:none}
  .sp-tab tbody tr:last-child td{border-bottom:0}
  .sp-tab tbody tr:last-child td:first-child{border-bottom:1px solid var(--pub-line)}
}

/* La pagination de la vue « Tout » : des cibles qu'un doigt atteint. */
.sp-pager{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:1rem 0 0;
  font-size:.88rem;color:var(--pub-ink2)}
.sp-pager a,.sp-pager span.cur{display:inline-flex;align-items:center;justify-content:center;
  min-inline-size:2.5rem;min-block-size:2.5rem;padding:0 .6rem;border-radius:9px;
  border:1px solid var(--pub-line);color:var(--pub-acc);text-decoration:none;font-weight:650}
.sp-pager span.cur{background:var(--pub-acc);color:#fff;border-color:var(--pub-acc)}
.sp-pager .info{border:0;min-block-size:0;color:var(--pub-ink2);font-weight:400}
