/* Messages : confirmation (succès) ou erreur, en tête de formulaire ou de page. */

.alert {
    display: grid;
    gap: var(--space-2);
    padding: var(--space-3) var(--space-4);
    border-left: 3px solid currentColor;
    border-radius: var(--radius-sm);
    font: var(--type-body);
}

.alert p {
    color: var(--text-primary);
}

.alert--success {
    background: var(--status-stock-bg);
    color: var(--status-stock);
}

.alert--error {
    background: var(--status-error-bg);
    color: var(--status-error);
}

.alert--warning {
    background: var(--status-order-bg);
    color: var(--status-order-text);
}

.alert--info {
    background: var(--status-info-bg);
    color: var(--status-info);
}

/* Résumé des erreurs d'un long formulaire (form/_error_summary.html.twig) : chaque erreur mène à son champ */
.error-summary__title {
    font-weight: var(--weight-semibold);
}

.error-summary__list {
    display: grid;
    gap: var(--space-1);
    margin: 0;
    padding-left: var(--space-5);
}

.error-summary__list a {
    color: var(--text-primary);
}

/* Plusieurs messages à la suite (composant Flashes) */
.flashes {
    display: grid;
    gap: var(--space-2);
}

/* En tête de page, sous l'en-tête du site */
.site-flashes {
    padding-block-start: var(--space-6);
}