/* ============================================================
   Banner de cookies (RGPD/LSSI) — Norte Cálido
   ============================================================ */

/* CRÍTICO: el atributo [hidden] debe ganar siempre. Sin esto, .gn-cookie-modal
   (display:flex) y .gn-cookie-banner anularían el [hidden] del navegador → el
   pop-up quedaría visible y no se podría cerrar. */
.gn-cookie-banner[hidden],
.gn-cookie-modal[hidden] { display: none !important; }

.gn-cookie-banner {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 9998;
    background: var(--c-black, #0A0706);
    color: var(--c-base, #F5F0E8);
    box-shadow: 0 -8px 32px rgba(0,0,0,0.28);
    animation: gn-cookie-up 0.35s ease;
}
@keyframes gn-cookie-up { from { transform: translateY(100%); } to { transform: translateY(0); } }

.gn-cookie-banner__inner {
    max-width: 1180px;
    margin: 0 auto;
    padding: 20px 24px;
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}
.gn-cookie-banner__text { flex: 1 1 380px; }
.gn-cookie-banner__text strong {
    display: block;
    font-family: 'Fraunces', Georgia, serif;
    font-size: 17px;
    margin-bottom: 4px;
}
.gn-cookie-banner__text p { margin: 0; font-size: 13.5px; line-height: 1.55; color: rgba(245,240,232,0.82); }
.gn-cookie-banner__text a { color: var(--c-gold, #C89B6C); text-decoration: underline; }

.gn-cookie-banner__actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}

/* Botones (rechazar al mismo nivel visual que aceptar — requisito AEPD) */
.gn-cookie-btn {
    min-height: 44px;
    padding: 11px 22px;
    border-radius: 999px;
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    border: 1.5px solid transparent;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    white-space: nowrap;
}
.gn-cookie-btn--primary { background: var(--c-base, #F5F0E8); color: var(--c-black, #0A0706); }
.gn-cookie-btn--primary:hover { background: var(--c-gold, #C89B6C); }
.gn-cookie-btn--ghost { background: transparent; color: var(--c-base, #F5F0E8); border-color: rgba(245,240,232,0.4); }
.gn-cookie-btn--ghost:hover { border-color: var(--c-base, #F5F0E8); background: rgba(245,240,232,0.08); }

/* ---- Modal de configuración ---- */
.gn-cookie-modal {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(10,7,6,0.6);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}
.gn-cookie-modal__box {
    position: relative;
    background: var(--c-base, #F5F0E8);
    color: var(--c-text, #2B1F17);
    max-width: 540px;
    width: 100%;
    max-height: 88vh;
    overflow-y: auto;
    border-radius: 16px;
    padding: 32px 28px;
    box-shadow: 0 24px 64px rgba(0,0,0,0.3);
}
.gn-cookie-modal__close {
    position: absolute;
    top: 12px; right: 16px;
    width: 40px; height: 40px;
    border: none; background: transparent;
    font-size: 28px; line-height: 1;
    color: var(--c-text-mute, #8A7A6E);
    cursor: pointer;
}
.gn-cookie-modal__box h2 {
    font-family: 'Fraunces', Georgia, serif;
    font-weight: 500;
    font-size: 24px;
    margin: 0 0 12px;
    color: var(--c-text, #2B1F17);
}
.gn-cookie-modal__intro { font-size: 14px; line-height: 1.6; color: var(--c-text-soft, #5A4A3E); margin: 0 0 20px; }

.gn-cookie-cat {
    border: 1px solid var(--c-border, rgba(43,31,23,0.12));
    border-radius: 12px;
    padding: 16px 18px;
    margin-bottom: 14px;
    background: #fff;
}
.gn-cookie-cat__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.gn-cookie-cat__name { font-weight: 600; font-size: 15px; }
.gn-cookie-cat__always { font-size: 12px; font-weight: 600; color: var(--c-secondary, #5C6B4F); text-transform: uppercase; letter-spacing: 0.5px; }
.gn-cookie-cat__desc { margin: 0; font-size: 13px; line-height: 1.55; color: var(--c-text-soft, #5A4A3E); }

/* Switch accesible */
.gn-cookie-switch { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; cursor: pointer; }
.gn-cookie-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.gn-cookie-switch__track {
    position: relative;
    flex: 0 0 auto;
    width: 46px; height: 26px;
    border-radius: 999px;
    background: var(--c-base-soft, #EBE3D5);
    border: 1px solid var(--c-border, rgba(43,31,23,0.18));
    transition: background 0.2s ease;
}
.gn-cookie-switch__track::after {
    content: '';
    position: absolute;
    top: 2px; left: 2px;
    width: 20px; height: 20px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.25);
    transition: transform 0.2s ease;
}
.gn-cookie-switch input:checked + .gn-cookie-switch__track { background: var(--c-accent, #B4654A); border-color: var(--c-accent, #B4654A); }
.gn-cookie-switch input:checked + .gn-cookie-switch__track::after { transform: translateX(20px); }
.gn-cookie-switch input:focus-visible + .gn-cookie-switch__track { outline: 2px solid var(--c-accent-dark, #8E4F3A); outline-offset: 2px; }

.gn-cookie-modal__actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; margin-top: 22px; }
/* En el modal (fondo claro) los botones invierten color */
.gn-cookie-modal .gn-cookie-btn--primary { background: var(--c-black, #0A0706); color: var(--c-base, #F5F0E8); }
.gn-cookie-modal .gn-cookie-btn--primary:hover { background: var(--c-accent-dark, #8E4F3A); }
.gn-cookie-modal .gn-cookie-btn--ghost { color: var(--c-text, #2B1F17); border-color: var(--c-border, rgba(43,31,23,0.3)); }
.gn-cookie-modal .gn-cookie-btn--ghost:hover { background: var(--c-base-soft, #EBE3D5); }
.gn-cookie-modal__link { text-align: center; margin: 16px 0 0; font-size: 13px; }
.gn-cookie-modal__link a { color: var(--c-accent-dark, #8E4F3A); }

@media (max-width: 640px) {
    .gn-cookie-banner__actions { width: 100%; }
    .gn-cookie-banner__actions .gn-cookie-btn { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
    .gn-cookie-banner { animation: none; }
}