/* QUIMIKA · MIS INTERESES · CAPA ADAPTATIVA
   Cargar DESPUÉS de style.css, mis_intereses.css y tema_quimika.css.
   El controlador global determina html[data-theme="light"|"dark"]. */
html[data-theme="light"] body[data-page="mis_intereses"] {
    --it-bg: #f7f6fb;
    --it-surface: #ffffff;
    --it-raised: #f9f7fc;
    --it-soft: #f3eff9;
    --it-border: #e5deed;
    --it-text: #211b2d;
    --it-muted: #655d73;
    --it-accent: #8053ca;
    --it-accent-soft: #efe7fc;
    --it-accent-text: #6334b0;
    --it-focus: rgba(128,83,202,.22);
    --it-shadow: 0 18px 45px rgba(41,24,65,.07);
    color-scheme: light;
}
html[data-theme="dark"] body[data-page="mis_intereses"] {
    --it-bg: #0e0b1a;
    --it-surface: #1a142a;
    --it-raised: #241b38;
    --it-soft: #211930;
    --it-border: rgba(255,255,255,.13);
    --it-text: #f8f3ff;
    --it-muted: #b7adca;
    --it-accent: #bd9bff;
    --it-accent-soft: #352348;
    --it-accent-text: #e4d6ff;
    --it-focus: rgba(189,155,255,.26);
    --it-shadow: 0 18px 45px rgba(0,0,0,.20);
    color-scheme: dark;
}

body[data-page="mis_intereses"] {
    background: var(--it-bg);
    color: var(--it-text);
    transition: background-color .2s ease, color .2s ease;
}
body[data-page="mis_intereses"] .intereses-pagina,
body[data-page="mis_intereses"] .intereses-header {
    color: var(--it-text);
}
body[data-page="mis_intereses"] :is(h1,h2,h3,h4,strong) { color: var(--it-text); }
body[data-page="mis_intereses"] :is(.intereses-titulo p,.intereses-resumen p,.intereses-informacion,.intereses-acciones > span,.intereses-contador span,.intereses-cargando) {
    color: var(--it-muted);
}
body[data-page="mis_intereses"] .intereses-marca { color: var(--it-text); }
body[data-page="mis_intereses"] .intereses-marca :is(span,b) { color: var(--it-accent); }
body[data-page="mis_intereses"] .intereses-volver {
    color: var(--it-muted);
    background: var(--it-surface);
    border: 1px solid var(--it-border);
    text-decoration: none;
}
body[data-page="mis_intereses"] .intereses-volver:hover {
    color: var(--it-accent-text);
    background: var(--it-accent-soft);
    border-color: var(--it-accent);
}
body[data-page="mis_intereses"] .intereses-icono,
body[data-page="mis_intereses"] .intereses-contador {
    background: var(--it-accent-soft);
    color: var(--it-accent-text);
    border: 1px solid var(--it-border);
}
body[data-page="mis_intereses"] .intereses-icono svg { color: var(--it-accent); }
body[data-page="mis_intereses"] .intereses-contador strong { color: var(--it-accent-text); }
body[data-page="mis_intereses"] .intereses-etiqueta { color: var(--it-accent-text); }
body[data-page="mis_intereses"] .intereses-panel {
    background: var(--it-surface);
    color: var(--it-text);
    border: 1px solid var(--it-border);
    box-shadow: var(--it-shadow);
}
body[data-page="mis_intereses"] :is(.intereses-resumen,.intereses-seleccionados,.intereses-informacion,.intereses-acciones) {
    border-color: var(--it-border);
}
body[data-page="mis_intereses"] .intereses-buscador {
    background: var(--it-raised);
    border: 1px solid var(--it-border);
    color: var(--it-muted);
}
body[data-page="mis_intereses"] .intereses-buscador:focus-within {
    border-color: var(--it-accent);
    box-shadow: 0 0 0 3px var(--it-focus);
}
body[data-page="mis_intereses"] #buscar_interes {
    background: transparent;
    color: var(--it-text);
    border: 0;
    box-shadow: none;
    outline: none;
}
body[data-page="mis_intereses"] #buscar_interes::placeholder { color: var(--it-muted); opacity: 1; }
body[data-page="mis_intereses"] #limpiar_busqueda {
    color: var(--it-muted);
    background: var(--it-soft);
    border: 1px solid var(--it-border);
}
body[data-page="mis_intereses"] #limpiar_busqueda:hover {
    color: var(--it-text);
    background: var(--it-accent-soft);
}
/* Tarjetas, acordeones, etiquetas y controles insertados por mis_intereses.js.
   Los selectores se limitan a esta página para evitar afectar Quimika. */
body[data-page="mis_intereses"] #categorias_intereses :is(details,article,.categoria,.categoria-intereses,.intereses-categoria,.intereses-grupo,.categoria-card,.categoria-panel,.categoria-bloque),
body[data-page="mis_intereses"] #categorias_intereses > div:not(.intereses-cargando) {
    background: var(--it-raised);
    color: var(--it-text);
    border-color: var(--it-border);
}
body[data-page="mis_intereses"] #categorias_intereses :is(summary,.categoria-titulo,.categoria-encabezado,.intereses-categoria-titulo) {
    color: var(--it-text);
    border-color: var(--it-border);
}
body[data-page="mis_intereses"] #categorias_intereses :is(p,small,.descripcion,.categoria-descripcion,.intereses-categoria-descripcion) {
    color: var(--it-muted);
}
body[data-page="mis_intereses"] #categorias_intereses :is(.interes,.interes-item,.interes-chip,.interes-opcion,.intereses-item,.intereses-opcion,.interes-boton,.intereses-chip, label),
body[data-page="mis_intereses"] #intereses_seleccionados :is(.interes,.interes-chip,.interes-seleccionado,.intereses-chip,.chip,button) {
    background: var(--it-surface);
    color: var(--it-text);
    border-color: var(--it-border);
}
body[data-page="mis_intereses"] #categorias_intereses :is(.interes,.interes-item,.interes-chip,.interes-opcion,.intereses-item,.intereses-opcion,.interes-boton,.intereses-chip,label):hover {
    border-color: var(--it-accent);
    background: var(--it-accent-soft);
}
body[data-page="mis_intereses"] #categorias_intereses :is(.seleccionado,.selected,.activo,.active,[aria-pressed="true"],[aria-selected="true"]),
body[data-page="mis_intereses"] #intereses_seleccionados :is(.seleccionado,.selected,.interes-seleccionado) {
    color: var(--it-accent-text);
    background: var(--it-accent-soft);
    border-color: var(--it-accent);
}
body[data-page="mis_intereses"] #categorias_intereses input[type="checkbox"] { accent-color: var(--it-accent); }
body[data-page="mis_intereses"] #categorias_intereses :is(button,input,summary):focus-visible,
body[data-page="mis_intereses"] #intereses_seleccionados button:focus-visible,
body[data-page="mis_intereses"] :is(.intereses-volver,#limpiar_busqueda,#guardar_intereses):focus-visible {
    outline: 3px solid var(--it-accent);
    outline-offset: 3px;
}
body[data-page="mis_intereses"] .intereses-mensaje {
    background: var(--it-soft);
    color: var(--it-text);
    border-color: var(--it-border);
}
body[data-page="mis_intereses"] .intereses-guardar:not(:disabled) {
    color: #fff;
    background: #8053ca;
    border-color: #8053ca;
}
body[data-page="mis_intereses"] .intereses-guardar:not(:disabled):hover {
    background: #6e42b8;
    border-color: #6e42b8;
}
body[data-page="mis_intereses"] .intereses-guardar:disabled {
    background: var(--it-soft);
    color: var(--it-muted);
    border-color: var(--it-border);
    opacity: .75;
    cursor: not-allowed;
}
body[data-page="mis_intereses"] [hidden] { display: none !important; }
@media (prefers-reduced-motion: reduce) {
    body[data-page="mis_intereses"] { transition: none; }
}

/* ==========================================
   QUIMIKA - ENCABEZADOS DE CATEGORÍAS
   COMPATIBILIDAD CON TEMA CLARO / OSCURO
========================================== */

/* TEMA CLARO */

html[data-theme="light"] .intereses-categorias summary,
html[data-theme="light"] .intereses-categoria-header,
html[data-theme="light"] .intereses-categoria-titulo,
html[data-theme="light"] .categoria-header,
html[data-theme="light"] .categoria-titulo {
    background: #f3eefb !important;
    color: #241936 !important;
    border-color: #e5dcef !important;
}

html[data-theme="light"] .intereses-categorias summary *,
html[data-theme="light"] .intereses-categoria-header *,
html[data-theme="light"] .intereses-categoria-titulo *,
html[data-theme="light"] .categoria-header *,
html[data-theme="light"] .categoria-titulo * {
    color: #241936 !important;
}

/* TEMA OSCURO */

html[data-theme="dark"] .intereses-categorias summary,
html[data-theme="dark"] .intereses-categoria-header,
html[data-theme="dark"] .intereses-categoria-titulo,
html[data-theme="dark"] .categoria-header,
html[data-theme="dark"] .categoria-titulo {
    background: #261c3c !important;
    color: #f8f3ff !important;
    border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .intereses-categorias summary *,
html[data-theme="dark"] .intereses-categoria-header *,
html[data-theme="dark"] .intereses-categoria-titulo *,
html[data-theme="dark"] .categoria-header *,
html[data-theme="dark"] .categoria-titulo * {
    color: #f8f3ff !important;
}


/* ==========================================
   QUIMIKA - CATEGORÍAS E INTERESES
   TEMA CLARO
========================================== */

html[data-theme="light"] .interes-categoria {
    background: #ffffff;
    border: 1px solid #e5dfed;
}

html[data-theme="light"] .interes-categoria h3 {
    color: #241936;
}

html[data-theme="light"] .interes-categoria h3 span {
    color: #70647e;
}

/* Checkbox - Estado normal */

html[data-theme="light"] .interes-opcion {
    background: #f8f6fb;
    border-color: #e5dfed;
    color: #352b42;
}

html[data-theme="light"] .interes-opcion svg {
    color: #a567a0;
}

html[data-theme="light"] .interes-opcion:hover {
    background: #f3ecfa;
    border-color: #b78dbb;
}

/* Checkbox - Seleccionado */

html[data-theme="light"] .interes-opcion.seleccionado {
    background: #fce8f3;
    border-color: #d879ae;
    color: #642a4c;
}

html[data-theme="light"] .interes-opcion.seleccionado svg {
    color: #b54f87;
}

/* Etiquetas de intereses seleccionados */

html[data-theme="light"] .interes-etiqueta {
    background: #fce8f3;
    border-color: #eab6d2;
    color: #79365b;
}

/* ==========================================
   QUIMIKA - CATEGORÍAS E INTERESES
   TEMA OSCURO
========================================== */

html[data-theme="dark"] .interes-categoria {
    background: #120f20;
    border: 1px solid #342a49;
}

html[data-theme="dark"] .interes-categoria h3 {
    color: #ffffff;
}

html[data-theme="dark"] .interes-categoria h3 span {
    color: #ad9dbf;
}

html[data-theme="dark"] .interes-opcion {
    background: #1b162b;
    border-color: #352d48;
    color: #d3c9e1;
}

html[data-theme="dark"] .interes-opcion svg {
    color: #d99ac8;
}

html[data-theme="dark"] .interes-opcion.seleccionado {
    background: #3c2341;
    border-color: #d879ae;
    color: #ffffff;
}

html[data-theme="dark"] .interes-opcion.seleccionado svg {
    color: #ffb4db;
}

html[data-theme="dark"] .interes-etiqueta {
    background: #3b2140;
    border-color: #71405f;
    color: #ffd6e9;
}
