/* Page « Statistiques ». Complète contenu.css et rubriques.css (gabarit des
   pages de contenu) : tuiles de chiffres et tableaux de palmarès, rangés en
   rubriques par statistiques.js. */

/* Intertitres des deux parties (statistiques DGFiP / cadastre),
   pleine largeur entre deux lots de rubriques, un cran au-dessus des titres
   de rubrique. */
.stats-partie {
    margin: 0.5rem 0 0;
    font-size: 1.75rem;
    line-height: 2.25rem;
    color: var(--texte);
}

.stats-partie-description {
    margin: 0.25rem 0 1rem;
    font-size: 1rem;
    color: var(--texte-mention);
}

/* Sommaire à deux niveaux : le nom de partie en gras, ses rubriques en
   sous-liste — les liens gardent la graisse normale. En bloc pour que le
   sommaire en colonnes (rubriques-colonnes.js) ne laisse pas un nom de
   partie orphelin en bas de colonne. */
.sommaire-partie {
    display: block;
    font-weight: 700;
    break-after: avoid;
}

/* Tuiles : autant de colonnes que la largeur en autorise, une seule sur
   téléphone. */
.stats-tuiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    gap: 0.75rem;
    margin: 0;
}

/* Tuiles dans la forme des mises en avant DSFR : bande de 0.25rem, ni cadre
   ni arrondi. Fond de page et non fond teinté : posées dans une rubrique déjà
   teintée, elles se fondraient dans son aplat. */
.stats-tuile {
    display: flex;
    flex-direction: column;
    padding: 0.75rem 1rem;
    border-left: 0.25rem solid var(--accent);
    background-color: var(--fond);
}

.stats-valeur {
    font-size: 1.625rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--accent);
    font-variant-numeric: tabular-nums;
}

.stats-etiquette {
    margin-top: 0.25rem;
    font-size: 1rem;
    color: var(--texte);
}

.stats-precision {
    margin: 0.25rem 0 0;
    font-size: 0.875rem;
    color: var(--texte-mention);
}

.stats-note {
    margin: 0 0 0.625rem;
    font-size: 1rem;
    color: var(--texte-mention);
}

/* Les libellés de communes et de parcelles sont longs : le tableau défile
   dans son cadre plutôt que d'élargir la page. */
.stats-tableau {
    overflow-x: auto;
}

/* Cadres à sélections (largeur standard de rubrique) : les menus de
   sélection (échelle, service), puis le tableau — classement-répartition
   des services compétents, palmarès de la population. */
.stats-selection {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.25rem;
    margin-bottom: 0.5rem;
}

.stats-selection .stats-recherche-champ {
    width: min(25.75rem, 100%);
}

/* Échelle : options courtes (« commune »… « France entière »), champ
   resserré à gauche. Service : libellés plus longs, champ élargi. */
.stats-selection .stats-champ-echelle {
    width: min(9rem, 100%);
    max-width: none;
}

.stats-selection .stats-champ-service {
    width: min(33rem, 100%);
    max-width: none;
}

/* Champs masqués (territoire des autres échelles) : l'attribut hidden
   doit l'emporter sur le display: flex des address-field. */
.stats-recherche-champ[hidden] {
    display: none;
}

/* Ligne de recherche au pied des tableaux (territoire des services
   compétents, entité des palmarès cherchables) : séparée du classement par
   le filet courant, sans filet final. La cellule du champ est haute
   (étiquette au-dessus) : la valeur et le rang s'alignent en bas, au
   niveau de la ligne de saisie. */
.stats-tableau tfoot th,
.stats-tableau tfoot td {
    border-top: 1px solid var(--bordure);
    border-bottom: none;
}

.stats-tableau tfoot td {
    vertical-align: bottom;
    padding-bottom: 0.8125rem;
}

/* Encart des anomalies connues, sous le tableau des services compétents :
   même grammaire que celui du volet d'information de la carte — fond
   d'avertissement, lignes .anomalie-encart de style.css — montré quand le
   territoire cherché touche une entrée du catalogue. */
.stats-anomalies {
    margin-top: 0.75rem;
    padding: 0.625rem 0.75rem;
    background-color: var(--avertissement-fond);
    font-size: 0.875rem;
    line-height: 1.5;
}

/* Encart d'information, sous la note d'un cadre : la clé de lecture en
   une ou deux phrases — même grammaire que l'encart des anomalies, en
   bleu info plutôt qu'en avertissement. */
.stats-information {
    margin: 0.75rem 0;
    padding: 0.625rem 0.75rem;
    border-left: 3px solid var(--information);
    background-color: var(--information-fond);
    font-size: 0.875rem;
    line-height: 1.5;
}

/* Ligne d'ensemble du haut de classement (« toutes | 1 », « les autres ») :
   en italique, pour ne pas se confondre avec un nom de territoire. */
.stats-ligne-ensemble th {
    font-style: italic;
}

/* Lignes repliées dépliables : le libellé porte le chevron des
   accordéons du site — un span à rôle bouton, pas un <button>, dont les
   navigateurs excluraient le texte du copié-collé du tableau — et la
   liste des territoires se déroule dans une sous-ligne pleine largeur,
   en mention. */
.stats-liste-bouton {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    cursor: pointer;
}

.stats-liste-bouton::after {
    content: '▸';
    font-style: normal;
    color: var(--texte-mention);
    transition: transform 0.15s;
}

.stats-liste-bouton[aria-expanded="true"]::after {
    transform: rotate(90deg);
}

.stats-liste-bouton:focus-visible {
    outline: 2px solid var(--focus);
    outline-offset: 2px;
}

.stats-liste-membres td {
    font-size: 0.875rem;
    color: var(--texte-mention);
}

.stats-tableau table {
    border-collapse: collapse;
    width: 100%;
    font-size: 1rem;
}

.stats-tableau th,
.stats-tableau td {
    padding: 0.375rem 0.625rem;
    text-align: left;
    border-bottom: 1px solid var(--bordure);
}

/* En-tête de tableau DSFR : graisse pleine, couleur et filet du texte. */
.stats-tableau thead th {
    font-weight: 700;
    color: var(--texte);
    border-bottom: 2px solid var(--texte);
}

.stats-tableau tbody th,
.stats-tableau tfoot th {
    font-weight: 400;
}

.stats-tableau tbody tr:last-child th,
.stats-tableau tbody tr:last-child td {
    border-bottom: none;
}

/* Ligne total en pied de corps : effectif de la répartition ou somme du
   classement, distinguée du classement par la graisse et un filet plus
   marqué, comme l'en-tête. Sélecteur qualifié par .stats-tableau : deux
   classes pour l'emporter sur .stats-tableau tbody th (font-weight: 400). */
.stats-tableau .stats-ligne-total th,
.stats-tableau .stats-ligne-total td {
    font-weight: 700;
    border-top: 2px solid var(--texte);
}

/* Colonne des chiffres : réduite à son contenu (le libellé absorbe le reste
   de la largeur), alignée à droite pour que les ordres de grandeur se
   comparent d'un coup d'œil. */
.stats-tableau .stats-nombre {
    width: 1%;
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

/* Valeurs en gras, au corps comme sur la ligne de recherche du pied. */
.stats-tableau td.stats-nombre {
    font-weight: 700;
}

/* Préfixe « approx. » des lignes approximatives : graisse normale — le
   gras reste aux chiffres — et couleur de mention, comme les rangs : en
   tête de ligne, il ne doit pas se lire comme une partie du nom. */
.stats-tableau .stats-approx {
    font-weight: 400;
    color: var(--texte-mention);
}

/* Colonne du rang des palmarès cherchables (« 3ᵉ », ligne de recherche
   comprise) : en retrait de la valeur, graisse normale et couleur de
   mention. */
.stats-tableau td.stats-rang {
    font-weight: 400;
    color: var(--texte-mention);
}

/* Cale des rangs à suffixe court (« 2ᵉ », statistiques.js) : un « ʳ »
   invisible comble l'écart avec « 1ᵉʳ » pour aligner les chiffres malgré
   l'alignement à droite — en contenu généré, hors du texte copié. */
.stats-tableau .stats-rang-cale::after {
    content: 'ʳ';
    visibility: hidden;
}

/* Recherche dans un tableau : le champ de la barre Localisation de la
   carte (address-field, address-box, croix — style.css) vit au pied du
   tableau, dont le haut et le bas du classement restent visibles, séparés
   d'une ellipse ; la valeur et le rang de l'entité choisie s'affichent
   dans les colonnes, sur la même ligne. Le bloc enveloppe le cadre défilant
   du tableau — qui rognerait un panneau absolu — et porte le panneau de
   suggestions, recalé sous le champ à chaque ouverture (statistiques.js). */
.stats-recherche {
    position: relative;
}

/* Largeur du champ commune de cette barre, commune à tous les champs :
   les libellés longs vivent dans la liste de suggestions (max-content). */
.stats-recherche-champ {
    max-width: 25.75rem;
}

/* Chevron des champs à menu déroulant (classement embarqué dans la page),
   repris des champs département et commune de la barre Localisation. */
.stats-recherche-menu .address-box::after {
    content: '▾';
    position: absolute;
    top: 50%;
    right: 0.4375rem;
    color: var(--texte);
    pointer-events: none;
    transform: translateY(-50%);
}

/* Le panneau, hors du cadre : position posée par statistiques.js, jamais
   élargi au tableau entier. */
.stats-recherche > .address-suggestions {
    min-width: min(25.75rem, calc(100% - 1.25rem));
}

/* Ellipse entre le haut et le bas du classement, une par colonne — alignée
   comme les valeurs (héritée : à gauche pour le nom, à droite pour le
   nombre via .stats-nombre). */
.stats-recherche-ellipse th,
.stats-recherche-ellipse td {
    color: var(--texte-mention);
}

/* Fond de sélection : la ligne du territoire cherché d'un classement
   (rendreClassement) ou la ligne de recherche au pied des tableaux
   (statistiques.js). */
.stats-recherche-ligne {
    background-color: var(--accent-selection);
}

/* Rouge fonctionnel « erreur » du DSFR. */
.stats-erreur {
    color: #ce0500;
}

/* Tableaux multigrandeurs (par structure, entreprises par territoire) :
   plusieurs dénombrements côte à côte. Le rang de chaque colonne suit sa
   valeur, en mention et à graisse normale — le gras reste aux chiffres. */
.stats-tableau .stats-rang-suffixe {
    font-weight: 400;
    color: var(--texte-mention);
}

/* Cale des rangs courts : les chiffres manquants du plus grand rang de la
   colonne, invisibles — les unités des valeurs se superposent ainsi d'une
   ligne à l'autre. En contenu généré, hors du texte copié, comme la cale
   des ordinaux ci-dessous. */
.stats-rang-cale-largeur::after {
    content: attr(data-cale);
    visibility: hidden;
}

/* En-têtes des colonnes de grandeurs : libres de se replier sur deux
   lignes plutôt que d'élargir la colonne (« nombre de SIREt publics
   locaux ») — les valeurs, elles, restent insécables. */
.stats-tableau thead th.stats-entete-grandeur {
    white-space: normal;
}

/* En-têtes de tri : un bouton nu qui hérite tout du th, souligné au
   survol comme au clavier. */
.stats-tri-bouton {
    font: inherit;
    color: inherit;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    text-align: inherit;
}

.stats-tri-bouton:hover,
.stats-tri-bouton:focus-visible {
    text-decoration: underline;
}

/* Marque de la colonne triée : flèche en contenu généré, hors du texte
   copié. */
.stats-tableau th[aria-sort='descending'] .stats-tri-bouton::after {
    content: ' ▼';
    font-size: 0.75em;
}