/* ===== Composant « claim-status » : pastille de statut colorée + libellé =====
   Utilisé en lien inline dans Claim/ClaimsList (colonne Statut) et en bloc d'en-tête
   dans Claim/DetailsVisa (claim-status-header, pages/details-visa.css).
   Couleurs d'état définies localement (pas de tokens globaux — états métier). */

.claim-status {
    display: inline-flex;
    align-items: flex-start;
    gap: var(--spacing-xs4);
    text-decoration: none;
    font-size: var(--font-size-sm);
    color: var(--color-text-primary);
    transition: opacity var(--transition-fast);
}

/* Usage lien (ClaimsList, <a class="claim-status">) : lien classique (souligné, se comporte comme
   n'importe quel lien de base) — la couleur d'état reste portée par la pastille, pas par le texte.
   Le <span> de DetailsVisa n'est pas concerné (voir .claim-outcome__header .claim-status__label,
   pages/details-visa.css). */
a.claim-status {
    color: var(--color-status-uploaded-fg); /* #0066CC */
    text-decoration: underline;
}

/* Survol : lien de base, pas d'effet spécifique (juste le retrait du soulignement). */
a.claim-status:hover {
    text-decoration: none;
}

/* Anneau : règle globale :focus-visible (Default/base/utilities.css) ; seul le rayon est spécifique */
a.claim-status:focus-visible {
    border-radius: var(--border-radius-xs);
}

.claim-status__dot {
    display: inline-block;
    width: 0.875rem; /* 14px */
    height: 0.875rem; /* 14px */
    border-radius: 50%;
    background-color: var(--_status-color);
    flex-shrink: 0;
    /* Aligne la pastille sur la 1re ligne quand le libellé passe sur 2 lignes (align-items: flex-start). */
    margin-top: 0.1875rem;
}

/* Valeurs des couleurs d'état (définies localement — états métier) */
.claim-status--initial  { --_status-color: var(--color-claim-initial); } /* gris #B2C2CB */
.claim-status--ongoing  { --_status-color: var(--color-claim-ongoing); } /* bleu #2490EE */
.claim-status--waiting  { --_status-color: var(--color-claim-waiting); } /* orange #E18801 — en attente de docs */
.claim-status--contact  { --_status-color: var(--color-claim-contact); } /* orange #E18801 — nous contacter */
.claim-status--refused  { --_status-color: var(--color-error); }         /* rouge #B90000 */
.claim-status--accepted { --_status-color: var(--color-claim-accepted); } /* vert #047D26 — indemnisé */