{#
 # ============================================================================
 # MOLECULE: INLINE ALERT
 # ============================================================================
 # Bandeau d'information inline : fond coloré + bordure + icône + texte.
 # Différent de _molecules/alert qui rend un simple <p>.
 #
 # Paramètres
 # ----------
 # message : string  Texte affiché (HTML autorisé via |raw)          (requis)
 # variant : string  'primary' | 'warning' | 'error'                 (défaut : 'warning')
 # icon    : string  Nom de l'icône (override auto selon variant)     (optionnel)
 # size    : string  Taille de l'icône : 'xs' | 'sm'                 (défaut : 'sm')
 # class   : string  Classes CSS additionnelles sur le wrapper        (optionnel)
 # ============================================================================
 #}
{% set message = message ?? '' %}
{% set variant = variant ?? 'warning' %}
{% set size    = size    ?? 'sm' %}
{% set class   = class   ?? '' %}

{% set configs = {
    'primary': { bg: 'bg-primary/5',   border: 'border-primary/15',  text: 'text-primary-dark', icon: 'info'    , iconColor: 'primary' },
    'warning': { bg: 'bg-warning/10',  border: 'border-warning/20',  text: 'text-amber-800',    icon: 'info'    , iconColor: 'warning' },
    'error':   { bg: 'bg-error/10',    border: 'border-error/20',    text: 'text-red-800',      icon: 'alert'   , iconColor: 'error'   }
} %}
{% set conf = configs[variant] ?? configs['warning'] %}
{% set alertIcon = icon ?? conf.icon %}

<div class="flex items-start gap-2.5 p-3 {{ conf.bg }} border {{ conf.border }} rounded-xl {{ class }}">
    {% include '_atoms/icon/icon.html.twig' with { name: alertIcon, size: size, color: conf.iconColor } only %}
    <p class="text-xs {{ conf.text }} leading-relaxed">{{ message|raw }}</p>
</div>