Snackbars

<div class="rounded-button border-2 flex gap-2.5 py-3.5 px-4.25 border-success bg-success-light">

    <?= icon('label-check-success-colored'); ?>

    <span>

        Votre demande est bien prise en compte

    </span>

</div>

<div class="rounded-button border-2 flex gap-2.5 py-3.5 px-4.25 border-error bg-error-light">

    <?= icon('label-suppress-colored'); ?>

    <span>

        Il y a une erreur dans le formulaire

    </span>

</div>

<div class="rounded-button border-2 flex gap-2.5 py-3.5 px-4.25 border-warning bg-warning-light">

    <?= icon('label-question-asking-colored'); ?>

    <span>

        Snack avec une question

    </span>

</div>

<div class="rounded-button border-2 flex items-center gap-2.5 py-3.5 px-4.25 border-warning bg-warning-light">

    <?= icon('label-question-asking-colored'); ?>

    <span>

        Snack avec une question

    </span>

    <div class="flex gap-2 md:ml-10">

        <button class="btn btn-secondary btn-pill">No</button>

        <button class="btn btn-primary btn-pill">Yes</button>

    </div>

</div>

<div class="rounded-button border-2 flex items-center gap-2.5 py-3.5 px-4.25 border-primary-accent bg-[#EFF6FF]">

    <?= icon('label-question-colored'); ?>

    <span>

        Un message informatif avec un CTA

    </span>

</div>

<div class="rounded-button border-2 flex items-center gap-2.5 py-3.5 px-4.25 border-primary-accent bg-[#EFF6FF]">

    <?= icon('label-question-colored'); ?>

    <span>

        Un message informatif avec un CTA

    </span>

    <div class="flex gap-2 md:ml-10">

        <button class="btn btn-primary-blue btn-pill">CTA</button>

    </div>

</div>