/* =====================================================================
   Páginas legales (/legal/aviso, privacidad, cookies, condiciones)
   Tema de marca 2026: todo cuelga de body.tema-claro.pag-legal.
   El encabezado es .extra-hero, así que el degradado y la trama del
   manual (6.4) y el texto blanco ya los pone theme-light.css.
   ===================================================================== */

body.tema-claro.pag-legal { background: var(--bg-soft); }

/* ---------- Encabezado ---------- */
body.tema-claro .legal-hero { padding: 132px 0 58px; text-align: center; }
body.tema-claro .legal-hero h1 {
    font-size: clamp(1.9rem, 4.2vw, 2.8rem); font-weight: 800; letter-spacing: -.02em;
    line-height: 1.12; margin: 0 0 .6rem;
}
body.tema-claro .legal-hero h1 i { opacity: .9; margin-right: .2rem; }
body.tema-claro .legal-hero .legal-sub { font-size: 1.05rem; opacity: .95; margin: 0 auto; max-width: 40em; }
body.tema-claro .legal-hero .legal-kicker {
    display: inline-flex; align-items: center; gap: .45rem; margin: 0 0 1rem;
    font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
    padding: .35rem .85rem; border-radius: 999px; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.28);
}

/* ---------- Navegación entre documentos ---------- */
body.tema-claro .legal-docs { position: relative; z-index: 2; margin-top: -24px; }
body.tema-claro .legal-docs .container { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; }
body.tema-claro .legal-docs a {
    display: inline-flex; align-items: center; gap: .45rem; padding: .6rem 1.1rem; border-radius: 999px;
    background: var(--card); color: var(--ink-2); border: 1px solid var(--line-2); box-shadow: var(--shadow-1);
    font-weight: 700; font-size: .88rem; text-decoration: none; transition: .15s;
}
body.tema-claro .legal-docs a i { color: var(--bv-pink); }
body.tema-claro .legal-docs a:hover { border-color: var(--line-marca); color: var(--ink); transform: translateY(-1px); }
body.tema-claro .legal-docs a.on { background: var(--bv-grad); color: #fff; border-color: transparent; }
body.tema-claro .legal-docs a.on i { color: #fff; }

/* ---------- Documento ---------- */
body.tema-claro .legal-content {
    max-width: 880px; margin: 2rem auto 4rem; padding: 2.6rem clamp(1.1rem, 4vw, 3.2rem);
    background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-1);
    color: var(--ink-2); font-size: 1rem;
}
body.tema-claro .legal-content h2 {
    color: var(--ink); font-size: 1.35rem; font-weight: 800; letter-spacing: -.01em;
    margin: 2.4rem 0 .9rem; padding-bottom: .55rem; position: relative;
    border-bottom: 1px solid var(--line);
}
body.tema-claro .legal-content h2::after {
    content: ''; position: absolute; left: 0; bottom: -1px; width: 56px; height: 3px; border-radius: 3px; background: var(--bv-grad);
}
body.tema-claro .legal-content > h2:first-child,
body.tema-claro .legal-content > .legal-box:first-child + h2 { margin-top: 1.6rem; }
body.tema-claro .legal-content h3 { color: var(--ink); font-size: 1.08rem; font-weight: 700; margin: 1.5rem 0 .6rem; }
body.tema-claro .legal-content p,
body.tema-claro .legal-content li { line-height: 1.8; color: var(--ink-2); margin-bottom: .9rem; }
body.tema-claro .legal-content ul, body.tema-claro .legal-content ol { padding-left: 1.4rem; margin-bottom: 1rem; }
body.tema-claro .legal-content ul li { margin-bottom: .45rem; }
body.tema-claro .legal-content ul li::marker { color: var(--bv-pink); }
body.tema-claro .legal-content strong { color: var(--ink); }
body.tema-claro .legal-content a { color: var(--bv-pink); text-decoration: underline; text-underline-offset: 2px; }

/* Cajas de datos (responsable, ejercicio de derechos…) y destacados */
body.tema-claro .legal-box,
body.tema-claro .legal-highlight {
    background: var(--wash); border: 1px solid var(--line-marca-2); border-left: 4px solid var(--bv-pink);
    padding: 1.3rem 1.4rem; margin: 1.5rem 0; border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
    color: var(--ink-2); line-height: 1.75;
}
body.tema-claro .legal-highlight { border-left-color: var(--bv-orange); background: #FFF6EE; }
body.tema-claro .legal-box strong, body.tema-claro .legal-highlight strong { color: var(--ink); }

/* Tablas: se desplazan en horizontal en el móvil en vez de romper la página */
body.tema-claro .legal-table {
    width: 100%; border-collapse: separate; border-spacing: 0; margin: 1.5rem 0; font-size: .92rem;
    border: 1px solid var(--line-2); border-radius: var(--radius-sm); overflow: hidden;
}
body.tema-claro .legal-table th, body.tema-claro .legal-table td { padding: .75rem .9rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
body.tema-claro .legal-table tr:last-child td { border-bottom: 0; }
body.tema-claro .legal-table th { background: var(--wash); color: var(--ink); font-weight: 700; }
body.tema-claro .legal-table td { color: var(--ink-2); }
body.tema-claro .legal-table tr:nth-child(even) td { background: var(--bg-soft); }

/* Etiquetas de tipo de cookie */
body.tema-claro .cookie-type { display: inline-block; padding: .22rem .7rem; border-radius: 999px; font-size: .78rem; font-weight: 700; white-space: nowrap; }
body.tema-claro .cookie-necesaria { background: #E7F6EC; color: #1E6B3A; }
body.tema-claro .cookie-analitica { background: #FFF1E0; color: #8A4200; }
body.tema-claro .cookie-funcional { background: #E6F2FB; color: #0B5A94; }
body.tema-claro .cookie-publicidad { background: var(--wash-2); color: #A3143B; }

body.tema-claro .legal-date {
    color: var(--ink-3); font-size: .88rem; margin-top: 2.8rem; padding-top: 1rem; border-top: 1px solid var(--line);
}

@media (max-width: 768px) {
    body.tema-claro .legal-hero { padding: 110px 0 50px; }
    body.tema-claro .legal-docs { margin-top: -20px; }
    body.tema-claro .legal-docs a { padding: .5rem .85rem; font-size: .8rem; }
    body.tema-claro .legal-content { margin: 1.4rem 12px 3rem; border-radius: var(--radius-sm); }
    body.tema-claro .legal-table { display: block; overflow-x: auto; white-space: normal; font-size: .82rem; }
}

/* El primer bloque del documento no suma su margen al relleno de la tarjeta */
body.tema-claro .legal-content > :first-child { margin-top: 0; }
@media (max-width: 480px) {
    body.tema-claro .legal-hero .legal-kicker { font-size: .66rem; letter-spacing: .03em; padding: .3rem .7rem; }
}

/* style.css quita las viñetas a todas las listas: en un texto legal hacen falta */
body.tema-claro .legal-content ul { list-style: disc; }
body.tema-claro .legal-content ol { list-style: decimal; }
/* La tarjeta del documento sobre el fondo suave, sin la banda blanca de <main> */
body.tema-claro.pag-legal main { background: var(--bg-soft); padding-bottom: 1px; }