/* ═══════════════════════════════════════════════════════════════════════════
   StatCardWidget — variante « indicateur » de la carte partagée.

   Cette feuille ne redéfinit AUCUNE couleur : la carte, sa bordure, son ombre et
   son encre viennent de .sk-cards (charte commune, sk-ui.css). On n'ajoute ici
   que ce que la grammaire partagée ne dit pas d'un indicateur chiffré : un
   nombre lisible de loin, aligné à gauche, au-dessus de son libellé. Toute
   couleur nécessaire est prise dans un jeton existant — un jeton manquant se
   demande à la charte, il ne se recopie pas ici.

   Les sélecteurs doublent volontairement la classe (.sk-cards.sk-statcard) :
   à spécificité égale, l'ordre de chargement des feuilles déciderait, et
   sk-ui.css est injectée après le thème. On ne dépend donc pas de cet ordre.
   ═══════════════════════════════════════════════════════════════════════════ */

.sk-cards.sk-statcard .sk-cards-item {
    gap: var(--sk-s1, 4px);
    align-content: start;
}

/* Toute la tuile est la cible du lien : pas de zone cliquable minuscule. */
.sk-cards.sk-statcard a.sk-cards-item {
    text-decoration: none;
    color: inherit;
}

/* --sk-statcard-accent est posée par la vue UNIQUEMENT si l'auteur a choisi une
   couleur ; sinon ces deux règles retombent sur les jetons de la charte. */
.sk-cards.sk-statcard .sk-statcard-icon {
    font-size: 1.25rem;
    line-height: 1;
    color: var(--sk-statcard-accent, var(--sk-primary, currentColor));
}

.sk-cards.sk-statcard .sk-cards-value {
    text-align: left;
    font-size: 1.7rem;
    font-weight: 800;
    line-height: 1.15;
    word-break: break-word;
    color: var(--sk-statcard-accent, var(--sk-fg, currentColor));
}

.sk-cards.sk-statcard .sk-cards-title {
    font-size: .82rem;
    font-weight: 500;
    color: var(--sk-muted, currentColor);
}

/* Attente et échec : la tuile garde sa place et son libellé, seul le chiffre
   s'efface. Une API muette ne doit ni trouer la page ni crier plus fort que
   les tuiles qui, elles, ont répondu. */
.sk-cards.sk-statcard.is-pending .sk-cards-value,
.sk-cards.sk-statcard.is-error .sk-cards-value {
    font-size: 1.15rem;
    font-weight: 600;
    color: var(--sk-muted, currentColor);
}

.sk-cards.sk-statcard.is-pending .sk-cards-value {
    opacity: .7;
}
