/* ==========================================================================
   FASE 3 · IDENTIDAD VISUAL (UX)
   Causa raíz detectada: el tema por defecto de la biblioteca ("planeta-theme",
   asignado en <body>) definía el color de acento en AZUL (#0f81e4). Por eso
   botones, títulos y enlaces salían en azul en lugar del dorado de la marca.
   Aquí se unifica el acento de marca (dorado) sin tocar los archivos base.
   Los temas que el usuario elige a propósito (Clínico, Bosque, etc.) conservan
   su personalidad.
   ========================================================================== */

/* ---------- 1. Paleta de marca para temas claros ----------
   Dorado algo más profundo que el original (#b8975a) para que el texto
   dorado sobre fondo blanco sea legible (mejor contraste). */
body.planeta-theme,
body.white-theme {
    --gold: #a37f2f;
    --gold-light: #c9a55a;
    --gold-dark: #7d5f1f;
    --gold-bg: rgba(163, 127, 47, 0.10);
    --gold-border: rgba(163, 127, 47, 0.32);
    --card-hover-border: rgba(163, 127, 47, 0.45);
}

/* Menú lateral activo: antes azul claro (#eff6ff / #2563eb) */
body:not(.dark-theme):not(.clinico-theme) {
    --sidebar-active-bg: rgba(163, 127, 47, 0.12);
    --sidebar-active-text: #7d5f1f;
}

/* Reglas del tema planeta que tenían el azul escrito directamente */
body.planeta-theme .book-card-year,
body.planeta-theme .author-label {
    color: var(--gold) !important;
}

/* ---------- 2. Botones uniformes ---------- */
/* Primarios dorados en todo el sitio */
.hero-btn:hover,
.btn-ver-todo:hover {
    background: var(--gold);
    border-color: var(--gold);
    color: #fff;
}
.btn-ver-todo {
    color: var(--gold);
    font-weight: 700;
}

/* Lector: "Atrás" y "Catálogo" con el mismo estilo de píldora */
.lector-top-header .lector-btn-volver {
    background: var(--gold-bg) !important;
    border: 1px solid var(--gold-border) !important;
    color: var(--gold) !important;
}
.lector-top-header .lector-btn-volver:hover {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: #fff !important;
}

/* "Abrir PDF": antes parecía un enlace subrayado; ahora es un botón real */
a.btn-open-pdf,
a.btn-open-pdf:visited {
    text-decoration: none !important;
    color: var(--gold) !important;
    border: 1px solid var(--gold-border) !important;
    background: var(--gold-bg) !important;
    border-radius: 999px !important;
    font-weight: 700;
}
a.btn-open-pdf:hover {
    background: var(--gold) !important;
    border-color: var(--gold) !important;
    color: #fff !important;
}

/* Botones de acción del lector (Modo Texto / Favorito) con radio consistente */
.lector-actions-wrapper .icon-btn {
    border-radius: 999px;
}

/* ---------- 3. Lector: etiqueta de categoría completa (antes "EMPRENDIMIENTO Y I…") ---------- */
#lector-libro-categoria {
    max-width: 100% !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    line-height: 1.3;
    padding: 0.25rem 0.6rem !important;
    font-size: 0.66rem !important;
}
#lector-libro-autor { color: var(--gold); }

/* ---------- 4. Títulos de secciones y presentación de categoría ---------- */
.carousel-section-title {
    position: relative;
    padding-left: 0.85rem;
}
.carousel-section-title::before {
    content: '';
    position: absolute;
    left: 0;
    top: 15%;
    bottom: 15%;
    width: 4px;
    border-radius: 4px;
    background: linear-gradient(180deg, var(--gold-light, #dfc085), var(--gold, #b8975a));
}

.categoria-intro h3,
.categoria-intro h4,
.categoria-intro [class*="titulo"] {
    color: var(--gold) !important;
}

/* Contador "N títulos disponibles" con el acento de marca */
#catalogo-header-count {
    color: var(--gold) !important;
    border-color: var(--gold-border) !important;
    background: var(--gold-bg) !important;
}

/* ---------- 5. Foco accesible y selección de texto en dorado ---------- */
:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
}
::selection {
    background: rgba(184, 151, 90, 0.35);
}
