/* Bandeau cookies : consentement à la mesure d'audience (Refuser et Accepter, même poids visuel).
   Mobile-first : texte puis boutons côte à côte, en ligne avec le texte à partir de 40rem.
   Fermé ou pas encore affiché : visibility hidden (hors tabulation, ignoré des lecteurs d'écran).
   Les styles du formulaire (.form-consent) sont dans style.css. */
.cookies-banner {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    padding: var(--e-2) var(--container-padding);
    padding-bottom: max(var(--e-2), env(safe-area-inset-bottom));
    background: var(--color-dark);
    color: var(--color-white);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.2);
    font-size: 0.875rem;
    line-height: 1.5;
    transform: translateY(100%);
    visibility: hidden;
    --focus: var(--color-white);
}

.cookies-banner.is-visible {
    transform: none;
    visibility: visible;
}

.cookies-banner__inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.75rem;
    max-width: var(--container-max);
    margin-inline: auto;
}

.cookies-banner__text {
    flex: none;
}

.cookies-banner__text a {
    color: var(--color-green-light);
    text-decoration: underline;
    text-underline-offset: 0.15em;
}

.cookies-banner__actions {
    display: flex;
    gap: 0.75rem;
}

.cookies-banner__btn {
    display: inline-flex;
    flex: 1 1 0;
    align-items: center;
    justify-content: center;
    min-height: var(--target);
    padding: 0.625rem 1.5rem;
    background: var(--color-white);
    color: var(--color-dark);
    border: 0;
    border-radius: 0.25rem;
    font-size: 0.875rem;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

@media (min-width: 40rem) {
    .cookies-banner__inner {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 1.5rem;
    }

    .cookies-banner__text {
        flex: 1 1 15rem;
    }

    .cookies-banner__actions {
        flex: none;
    }

    .cookies-banner__btn {
        flex: none;
    }
}

@media (hover: hover) and (pointer: fine) {
    .cookies-banner__text a:hover {
        text-decoration-thickness: 2px;
    }

    .cookies-banner__btn:hover {
        background: var(--color-green-light);
    }
}

@media (prefers-reduced-motion: no-preference) {
    .cookies-banner {
        transition: transform 0.4s ease, visibility 0s linear 0.4s;
    }

    .cookies-banner.is-visible {
        transition: transform 0.4s ease, visibility 0s linear 0s;
    }

    .cookies-banner__btn {
        transition: background-color 0.2s ease;
    }
}