:root {
    --ck-accent:  var(--accent-color); /* Utilise la variable globale */
    --ck-dark:    var(--link-color);   /* Utilise la variable globale */
    --ck-bg:      var(--card-color);   /* S'adaptera au thème clair/sombre plus tard */
    --ck-surface: var(--bg-input);     /* Utilise le fond gris/beige clair global */
    --ck-border:  var(--border-color); /* Bordure globale */
    --ck-text:    var(--text-color);   /* Texte global */
    --ck-muted:   var(--text-muted-input);
    --ck-shadow:  0 8px 40px rgba(var(--rgb-title-color), .14), 0 2px 8px rgba(var(--rgb-title-color), .08);
    --ck-radius:  18px;
    --ck-z:       9999;
}
.cookie-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.35);
    backdrop-filter: blur(3px);
    z-index: calc(var(--ck-z) - 1);
    opacity: 0;
    transition: opacity .3s ease;
}
.cookie-overlay.visible { display: block; }
.cookie-overlay.show    { opacity: 1; }

.cookie-popup {
    position: fixed;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%) translateY(20px);
    width: min(520px, calc(100vw - 32px));
    background: var(--ck-bg);
    border-radius: var(--ck-radius);
    box-shadow: var(--ck-shadow);
    border: 1px solid var(--ck-border);
    padding: 28px 28px 20px;
    z-index: var(--ck-z);
    opacity: 0;
    transition: opacity .35s ease, transform .35s cubic-bezier(.34,1.56,.64,1);
    pointer-events: none;
    /* Caché par défaut — JS décide d'afficher */
    visibility: hidden;
}
.cookie-popup.show {
    opacity: 1;
    visibility: visible;
    transform: translateX(-50%) translateY(0);
    pointer-events: auto;
}
.cookie-popup__header { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.cookie-popup__icon   { font-size: 1.6rem; flex-shrink: 0; }
.cookie-popup__title  { font-size: 1.1rem; font-weight: 700; color: var(--ck-text); margin: 0; }
.cookie-popup__desc   { font-size: .875rem; color: var(--ck-muted); line-height: 1.6; margin-bottom: 14px; }
.cookie-popup__desc strong { color: var(--ck-text); }

.cookie-popup__details { background: var(--ck-surface); border: 1px solid var(--ck-border); border-radius: 10px; padding: 10px 14px; margin-bottom: 18px; }
.cookie-popup__details summary { font-size: .8rem; font-weight: 600; color: var(--ck-dark); cursor: pointer; user-select: none; list-style: none; display: flex; align-items: center; gap: 6px; }
.cookie-popup__details summary::-webkit-details-marker { display: none; }
.cookie-popup__details summary::before { content: '▸'; transition: transform .2s; display: inline-block; }
.cookie-popup__details[open] summary::before { transform: rotate(90deg); }

.cookie-list { list-style: none; padding: 0; margin: 12px 0 4px; display: flex; flex-direction: column; gap: 10px; }
.cookie-list li { display: flex; gap: 10px; align-items: flex-start; font-size: .8rem; color: var(--ck-text); line-height: 1.5; }
.cookie-list code  { background: #f0e6da; padding: 1px 5px; border-radius: 4px; font-size: .75rem; }
.cookie-list small { color: var(--ck-muted); }

.cookie-badge           { flex-shrink: 0; margin-top: 1px; font-size: .65rem; font-weight: 700; padding: 2px 7px; border-radius: 20px; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.cookie-badge--required { background: #fff0e0; color: #c47020; border: 1px solid #ffd0a0; }
.cookie-badge--pref     { background: #e8f4fd; color: #2980b9; border: 1px solid #b8daf5; }

.cookie-popup__actions { display: flex; gap: 10px; margin-bottom: 12px; }
.cookie-btn        { flex: 1; padding: 11px 16px; border-radius: 50px; font-size: .875rem; font-weight: 700; cursor: pointer; border: none; transition: transform .15s, box-shadow .15s, background .15s; }
.cookie-btn:hover  { transform: translateY(-1px); }
.cookie-btn:active { transform: translateY(0); }
.cookie-btn--refuse       { background: var(--ck-surface); color: var(--ck-muted); border: 1px solid var(--ck-border); }
.cookie-btn--refuse:hover { background: #f5ece3; color: var(--ck-text); box-shadow: 0 2px 8px rgba(0,0,0,.08); }
.cookie-btn--accept       { background: var(--ck-accent); color: #fff; box-shadow: 0 3px 12px rgba(255,180,128,.4); }
.cookie-btn--accept:hover { background: var(--ck-dark); box-shadow: 0 5px 18px rgba(255,180,128,.5); }

.cookie-popup__legal { font-size: .72rem; color: var(--ck-muted); text-align: center; margin: 0; line-height: 1.5; }
.cookie-link       { color: var(--ck-dark); text-decoration: underline; font-weight: 600; }
.cookie-link:hover { color: var(--ck-text); }

.cookie-toast {
    position: fixed;
    bottom: 28px;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    background: #2d2d2d;
    color: #fff;
    padding: 10px 20px;
    border-radius: 50px;
    font-size: .82rem;
    font-weight: 600;
    z-index: var(--ck-z);
    opacity: 0;
    transition: opacity .3s, transform .3s;
    pointer-events: none;
    white-space: nowrap;
}
.cookie-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

@media (max-width: 540px) {
    .cookie-popup { bottom: 0; left: 0; right: 0; width: 100%; transform: translateY(20px); border-radius: var(--ck-radius) var(--ck-radius) 0 0; }
    .cookie-popup.show { transform: translateY(0); }
    .cookie-popup__actions { flex-direction: column-reverse; }
}