/*
 * Webciclista – ajustes sobre el tema Wishful Blog
 * Se carga después de wishfulthemes/assets/css/custom.css.
 */

/* ---------------------------------------------------------------
 * 1. Menú fijo (sticky)
 * El tema fija .primary-navigation-wrap al añadir body.sticky, pero:
 *  - su "transition: 0.5s ease all" hace que durante medio segundo el
 *    fondo sea casi transparente y el menú se mezcle con la imagen;
 *  - al sacarlo del flujo, .menu-block pasa a medir 0 px y el contenido
 *    salta hacia arriba (CLS);
 *  - no tiene sombra ni borde, así que el texto pasa por debajo sin
 *    separación visual;
 *  - con la barra de administración visible queda tapado por ella.
 * ------------------------------------------------------------- */
body.sticky .primary-navigation-wrap {
    transition: none;
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .10);
    z-index: 1000;
}

/* Reserva el hueco que deja el menú al fijarse */
body.sticky .header_s .menu-block {
    min-height: 51px;
}

@media (max-width: 991px) {
    body.sticky .header_s .menu-block {
        min-height: 54px;
    }

    /* Menú móvil desplegado: que nunca quede cortado por abajo */
    body.sticky .primary-navigation-wrap {
        max-height: 100vh;
        overflow-y: auto;
    }
}

/* Barra de administración de WordPress (solo usuarios conectados) */
body.admin-bar.sticky .primary-navigation-wrap {
    top: 32px;
}

@media (max-width: 782px) {
    body.admin-bar.sticky .primary-navigation-wrap {
        top: 46px;
    }
}

/* ---------------------------------------------------------------
 * 2. Legibilidad
 * Texto del cuerpo #717171 (4,9:1): cumple AA por muy poco y en
 * textos largos cansa. Pasamos a #333 (12,6:1) y damos más aire.
 * ------------------------------------------------------------- */
body,
.type-post .entry-content p,
article[class*="type-"] .entry-content > ul > li,
article[class*="type-"] .entry-content > ol > li,
.comments-area .comment p {
    color: #333;
}

.single .entry-content,
.page .entry-content {
    font-size: 17px;
    line-height: 1.75;
}

/* Fecha y categoría bajo el título: #717171 -> #5f5f5f (6,4:1) */
.blog-single .entry-header .post-meta > span,
.blog-single article[class*="type-"] .entry-header .post-meta > span > a {
    color: #5f5f5f;
}

/* Pies de foto: #9E9E9E (2,7:1) desde "CSS adicional" -> #5f5f5f (6,4:1).
 * Selector más específico para ganar al !important del CSS adicional. */
.entry-content figure .wp-element-caption,
.entry-content .wp-element-caption {
    color: #5f5f5f !important;
}

/* Títulos de la barra lateral: el "CSS adicional" los pone en #e1e1e1
 * (1,3:1 sobre blanco). Ese gris solo tiene sentido en el pie oscuro,
 * así que lo limitamos a la barra lateral del contenido. */
#content .widget-area .widget-title {
    color: #151515 !important;
    font-weight: 600;
}