#rck-cookie-banner[hidden],
#rck-cookie-modal[hidden] {
    display: none !important;
}

body.rck-modal-open {
    overflow: hidden;
}

/* Variables par défaut — bandeau */
#rck-cookie-banner {
    --rck-bg: #fff;
    --rck-title-color: #111;
    --rck-color: #111;
    --rck-border-color: #111;
    --rck-border-width: 2px;
    --rck-radius: 16px;
    --rck-link-color: #111;
    --rck-overlay: rgba(0, 0, 0, 0.65);
    --rck-btn-accept-bg: #00a32a;
    --rck-btn-accept-color: #fff;
    --rck-btn-primary-bg: #0073aa;
    --rck-btn-primary-color: #fff;
    --rck-btn-secondary-bg: #fff;
    --rck-btn-secondary-color: #111;
    --rck-btn-border-color: #111;
    --rck-btn-radius: 4px;
}

/* Variables par défaut — modale */
#rck-cookie-modal {
    --rck-bg: #fff;
    --rck-title-color: #111;
    --rck-color: #111;
    --rck-border-color: #111;
    --rck-border-width: 2px;
    --rck-radius: 16px;
    --rck-link-color: #111;
    --rck-overlay: rgba(0, 0, 0, 0.55);
    --rck-btn-accept-bg: #00a32a;
    --rck-btn-accept-color: #fff;
    --rck-btn-primary-bg: #0073aa;
    --rck-btn-primary-color: #fff;
    --rck-btn-secondary-bg: #fff;
    --rck-btn-secondary-color: #111;
    --rck-btn-border-color: #111;
    --rck-btn-radius: 4px;
}

/*
 * Toutes les positions partagent le même wrapper plein écran.
 * L'overlay bloque l'accès au site jusqu'au choix de l'utilisateur.
 * Le flexbox positionne le contenu intérieur selon la variante.
 */
#rck-cookie-banner {
    position: fixed;
    inset: 0;
    z-index: 1000000;
    display: flex;
    background: var(--rck-overlay);
}

/* Flottant bas droite (défaut) */
.rck-banner,
.rck-banner--bottom,
.rck-banner--bottom-right {
    align-items: flex-end;
    justify-content: flex-end;
    padding: 1rem;
}
.rck-banner.rck-banner--bottom-full {
    padding: 0;
}

/* Flottant bas gauche */
.rck-banner--bottom-left {
    align-items: flex-end;
    justify-content: flex-start;
    padding: 1rem;
}

/* Fenêtre centrée */
.rck-banner--center {
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

/* Barre pleine largeur en bas */
.rck-banner--bottom-full {
    align-items: flex-end;
}

/* Contenu intérieur */
.rck-banner__inner,
.rck-modal__inner {
    position: relative;
    width: min(100%, 820px);
    max-height: min(90vh, 900px);
    overflow: auto;
    background: var(--rck-bg);
    color: var(--rck-color);
    border: var(--rck-border-width) solid var(--rck-border-color);
    border-radius: var(--rck-radius);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    padding: 2.5rem;
}

/* Flottants : fenêtre compacte */
.rck-banner--bottom-left .rck-banner__inner,
.rck-banner--bottom-right .rck-banner__inner,
.rck-banner--bottom .rck-banner__inner {
    width: min(100%, 460px);
    aspect-ratio: 5/4;
}

/* Barre pleine largeur */
.rck-banner--bottom-full .rck-banner__inner {
    width: 100%;
    border-radius: 0;
    border-left: none;
    border-right: none;
    border-bottom: none;
    text-align: center;
}

.rck-banner--bottom-full .rck-banner__actions,
.rck-banner--bottom-full .rck-banner__links {
    justify-content: center;
}

/* Fenêtre centrée : contenu centré */
.rck-banner--center .rck-banner__inner {
    text-align: center;
}

.rck-banner--center .rck-banner__actions,
.rck-banner--center .rck-banner__links {
    justify-content: center;
}

.rck-banner__title-row {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    margin: 1.4rem 0;
}
.rck-banner--bottom-full .rck-banner__title-row {
    justify-content: center;
}

.rck-logo {
    height: 48px;
    width: auto;
    max-width: 96px;
    object-fit: contain;
    flex-shrink: 0;
}

.rck-banner__inner h2,
.rck-modal__inner h2 {
    color: var(--rck-title-color);
    margin-top: 0;
    margin-bottom: 0;
    font-size: 1.6em;
}

/* Force les éléments inline/bloc à hériter la couleur du conteneur
   (certains thèmes redéfinissent color sur span, label, p, etc.) */
.rck-banner__inner p,
.rck-banner__inner span,
.rck-banner__inner label,
.rck-banner__inner strong,
.rck-banner__inner em,
.rck-banner__inner li,
.rck-banner__inner h3,
.rck-banner__inner h4,
.rck-modal__inner p,
.rck-modal__inner span,
.rck-modal__inner label,
.rck-modal__inner strong,
.rck-modal__inner em,
.rck-modal__inner li,
.rck-modal__inner h3,
.rck-modal__inner h4 {
    color: inherit;
}

#rck-banner-desc {
    font-size: 0.9em;
    margin-top: 1em;
}

.rck-banner a,
.rck-modal a {
    color: var(--rck-link-color);
}

.rck-banner__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1rem;
}

.rck-banner__links {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 0.875rem;
    font-size: 0.8em;
}

.rck-toggle-group {
    border-top: 1px solid #d1d5db;
}

.rck-toggle-group:first-child {
    border-top: none;
}

.rck-toggle {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.75rem 0 0.5rem;
}

/* Chips de services — alignés sous leur catégorie */
.rck-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    padding: 0 0 0.75rem 1.75rem;
}

.rck-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.2rem 0.6rem;
    border: 1px solid var(--rck-border-color);
    border-radius: 999px;
    font-size: 0.8rem;
    cursor: pointer;
    color: var(--rck-color);
    background: transparent;
    transition:
        background 0.1s,
        color 0.1s;
    user-select: none;
}

.rck-chip input[type="checkbox"] {
    margin: 0;
    width: 12px;
    height: 12px;
    cursor: pointer;
    accent-color: var(--rck-btn-accept-bg);
}

/* Chip coché : fond coloré */
.rck-chip:has(input:checked) {
    background: var(--rck-btn-accept-bg);
    color: var(--rck-btn-accept-color);
    border-color: var(--rck-btn-accept-bg);
}

/* Chip désactivé (catégorie parente OFF) */
.rck-chip:has(input:disabled) {
    opacity: 0.4;
    cursor: not-allowed;
}

.rck-modal {
    position: fixed;
    inset: 0;
    z-index: 1000001;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: var(--rck-overlay);
}

.rck-manage-cookies,
.rck-manage-cookies-shortcode,
.rck-manage-cookies:focus {
    position: fixed;
    right: 6rem;
    bottom: 1rem;
    z-index: 99998;
    background: #fff;
    color: #111;
    border-radius: 999px;
    padding: 0.75rem 1rem;
    cursor: pointer;
}
.rck-manage-cookies.rck-manage-cookies--image,
.rck-manage-cookies.rck-manage-cookies--image:focus {
    padding: 0;
}

.rck-manage-cookies-shortcode {
    position: static;
}

/* Mode image : padding réduit, image centrée */
.rck-manage-cookies--image {
    padding: 0.375rem;
    line-height: 0;
}

.rck-manage-cookies--image img {
    display: block;
    width: 48px;
    height: 48px;
    object-fit: contain;
}

/* Lien "Continuer sans accepter" — haut droite du bandeau */
.rck-reject-link {
    position: absolute;
    top: 0.75rem;
    right: 1.6rem;
    background: none;
    background-color: rgba(0, 0, 0, 0);
    border: none;
    border-top-color: currentcolor;
    border-right-color: currentcolor;
    border-bottom-color: currentcolor;
    border-left-color: currentcolor;
    padding: 0;
    font-size: 0.8rem;
    font-family: inherit;
    color: #aaa !important;
    text-decoration: underline;
    cursor: pointer;
    line-height: 1.4;
}
.rck-reject-link:hover {
    background-color: transparent;
    border-color: transparent;
}

/* Dans la modale : décalé à gauche du bouton × (2.25rem + 0.75rem + 0.5rem) */
.rck-reject-link--modal {
    right: calc(0.75rem + 2.25rem + 0.75rem);
    top: 1rem;
}

.rck-modal__close {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    width: 2.25rem;
    height: 2.25rem;
    border: var(--rck-border-width) solid var(--rck-border-color);
    background: var(--rck-bg);
    color: var(--rck-color);
    border-radius: 999px;
    cursor: pointer;
    font-size: 1.25rem;
    line-height: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
}

/* Bouton "Accepter tout" */
.rck-banner [data-rck-action="accept-all"],
.rck-modal [data-rck-action="accept-all"] {
    background-color: var(--rck-btn-accept-bg) !important;
    color: var(--rck-btn-accept-color) !important;
    border-color: var(--rck-btn-accept-bg) !important;
    border-radius: var(--rck-btn-radius) !important;
}

/* Bouton principal (Enregistrer mes choix) */
.rck-banner .rck-button-primary:not([data-rck-action="accept-all"]),
.rck-modal .rck-button-primary:not([data-rck-action="accept-all"]) {
    background-color: var(--rck-btn-primary-bg) !important;
    color: var(--rck-btn-primary-color) !important;
    border-color: var(--rck-btn-primary-bg) !important;
    border-radius: var(--rck-btn-radius) !important;
}

/* Bouton secondaire */
.rck-banner .rck-button-secondary,
.rck-modal .rck-button-secondary {
    background-color: var(--rck-btn-secondary-bg) !important;
    color: var(--rck-btn-secondary-color) !important;
    border-color: var(--rck-btn-border-color) !important;
    border-radius: var(--rck-btn-radius) !important;
}

.rck-button-primary,
.rck-button-secondary {
    min-width: 10rem;
}

.rck-banner a:focus-visible,
.rck-modal a:focus-visible,
.rck-manage-cookies:focus-visible,
.rck-manage-cookies-shortcode:focus-visible,
.rck-modal__close:focus-visible,
.rck-banner button:focus-visible,
.rck-modal button:focus-visible,
.rck-banner input:focus-visible,
.rck-modal input:focus-visible {
    outline: 3px solid var(--rck-border-color);
    outline-offset: 3px;
}

.rck-error {
    margin-top: 0.75rem;
    font-size: 0.875rem;
    color: #b91c1c;
}

/* Placeholder de contenu bloqué (iframes, embeds) */
.rck-embed-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    min-height: 180px;
    padding: 2rem 1.5rem;
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    text-align: center;
    box-sizing: border-box;
}

.rck-embed-placeholder p {
    margin: 0;
    color: #374151;
    font-size: 0.95rem;
}

/* Placeholder débloqué : reset pour laisser le contenu natif s'afficher */
.rck-embed-placeholder[data-rck-loaded="1"] {
    display: block;
    background: none;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    min-height: 0;
    text-align: left;
}

@media (max-width: 640px) {
    .rck-banner__actions {
        flex-direction: column;
    }
}
