/**
 * Restor'Cars — bannière de consentement.
 *
 * Un bandeau bas, pas une fenêtre qui bloque la page. Le site n'a rien à
 * cacher : rien ne justifie d'empêcher la lecture tant qu'on n'a pas répondu.
 *
 * Les deux boutons de décision ont exactement le même style. C'est une
 * exigence, pas un choix esthétique : un « refuser » effacé à côté d'un
 * « accepter » mis en avant ne recueille pas un accord libre.
 */

.rc-consent {
    position: fixed;
    inset: auto 0 0 0;
    z-index: 9999;
    background-color: var(--color-primary, #043B58);
    color: #fff;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.18);

    /* Glisse depuis le bas, sans déplacer le contenu de la page */
    transform: translateY(100%);
    transition: transform 0.28s ease;
}

.rc-consent.is-visible {
    transform: translateY(0);
}

.rc-consent__inner {
    display: grid;
    gap: var(--space-xs, 0.625rem) var(--space-lg, 2.5rem);
    align-items: center;
    width: min(100% - 2.5rem, 75rem);
    margin-inline: auto;
    padding-block: var(--space-md, 1.5rem);
}

@media (min-width: 62em) {
    .rc-consent__inner {
        grid-template-columns: 1fr auto;
        grid-template-areas:
            "titre   actions"
            "texte   actions";
    }

    .rc-consent__titre  { grid-area: titre; }
    .rc-consent__texte  { grid-area: texte; }
    .rc-consent__actions { grid-area: actions; }
}

/*
 * La couleur est posée ici et non héritée du bandeau : Kadence attribue une
 * couleur à tous les titres du site, et elle l'emportait sur l'héritage. Le
 * titre s'affichait en marine sur fond marine — présent dans le code, invisible
 * à l'écran.
 */
.rc-consent__titre {
    margin: 0;
    color: #fff;
    font-family: var(--font-heading, Georgia, serif);
    font-size: 1.25rem;
    line-height: 1.2;
}

.rc-consent__texte {
    margin: 0;
    max-width: 52rem;
    font-size: 0.9375rem;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.92);
}

.rc-consent__lien,
.rc-consent-panneau__pied a {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 0.2em;
    white-space: nowrap;
}

.rc-consent__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs, 0.625rem);
}

/* ==========================================================================
   Boutons
   ========================================================================== */

.rc-consent__bouton {
    /* 44 px : la cible tactile minimale, y compris pour le « refuser » */
    min-height: 2.75rem;
    padding: 0.625rem 1.25rem;
    border: 2px solid transparent;
    border-radius: var(--radius-sm, 4px);
    font: inherit;
    font-weight: 600;
    font-size: 0.9375rem;
    line-height: 1.2;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease;
}

/*
 * « Tout accepter » et « Tout refuser » partagent CETTE règle. Ne pas les
 * séparer : c'est ce qui garantit qu'ils resteront identiques.
 */
.rc-consent__bouton--principal {
    background: #fff;
    color: var(--color-primary, #043B58);
    border-color: #fff;
}

.rc-consent__bouton--principal:hover,
.rc-consent__bouton--principal:focus-visible {
    background: var(--color-bg-warm, #F6EAD4);
    border-color: var(--color-bg-warm, #F6EAD4);
}

.rc-consent__bouton--discret {
    background: transparent;
    color: #fff;
    border-color: rgba(255, 255, 255, 0.55);
}

.rc-consent__bouton--discret:hover,
.rc-consent__bouton--discret:focus-visible {
    background: rgba(255, 255, 255, 0.12);
    border-color: #fff;
}

.rc-consent__bouton:focus-visible {
    outline: 3px solid var(--color-accent, #EE5C2B);
    outline-offset: 2px;
}

/* ==========================================================================
   Panneau de réglage fin
   ========================================================================== */

.rc-consent-fond {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-sm, 1rem);
    background: rgba(4, 59, 88, 0.65);
}

body.rc-consent-ouvert {
    overflow: hidden;
}

.rc-consent-panneau {
    width: min(100%, 34rem);
    max-height: min(90vh, 44rem);
    overflow-y: auto;
    padding: var(--space-lg, 2.5rem);
    border-radius: var(--radius-md, 8px);
    background: var(--color-bg-light, #FAFAF7);
    color: var(--color-text, #1A1A1A);
    box-shadow: var(--shadow-lg, 0 8px 28px rgba(4, 59, 88, 0.14));
}

.rc-consent-panneau__titre {
    margin: 0 0 var(--space-md, 1.5rem);
    color: var(--color-primary, #043B58);
    font-family: var(--font-heading, Georgia, serif);
    font-size: 1.5rem;
    line-height: 1.2;
}

.rc-consent-categorie {
    padding-block: var(--space-sm, 1rem);
    border-top: 1px solid rgba(4, 59, 88, 0.12);
}

.rc-consent-categorie--fixe {
    border-top: 0;
    opacity: 0.8;
}

.rc-consent-categorie__label {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    cursor: pointer;
}

.rc-consent-categorie__case {
    flex: 0 0 auto;
    width: 1.25rem;
    height: 1.25rem;
    accent-color: var(--color-action, #CA4E24);
    cursor: pointer;
}

.rc-consent-categorie__titre {
    margin: 0;
    color: var(--color-primary, #043B58);
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.3;
}

.rc-consent-categorie__texte {
    /* Aligné sous le libellé, pas sous la case */
    margin: 0.375rem 0 0 1.875rem;
    font-size: 0.875rem;
    line-height: 1.5;
    color: var(--color-text-muted, #666);
}

.rc-consent-categorie--fixe .rc-consent-categorie__texte {
    margin-left: 0;
}

.rc-consent-panneau__actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-xs, 0.625rem);
    margin-top: var(--space-lg, 2.5rem);
}

/* Dans le panneau, les boutons sont sur fond clair : on inverse. */
.rc-consent-panneau .rc-consent__bouton--principal {
    background: var(--color-primary, #043B58);
    color: #fff;
    border-color: var(--color-primary, #043B58);
}

.rc-consent-panneau .rc-consent__bouton--principal:hover,
.rc-consent-panneau .rc-consent__bouton--principal:focus-visible {
    background: var(--color-action, #CA4E24);
    border-color: var(--color-action, #CA4E24);
}

.rc-consent-panneau__pied {
    margin: var(--space-md, 1.5rem) 0 0;
    font-size: 0.875rem;
}

.rc-consent-panneau__pied a {
    color: var(--color-action, #CA4E24);
    white-space: normal;
}

/* Respect du réglage système « réduire les animations » */
@media (prefers-reduced-motion: reduce) {
    .rc-consent {
        transition: none;
    }
}