/*
 Theme Name:   hijo neve
 Theme URI:
 Description:
 Author:       carlos
 Author URI:   http://localhost/dondepuedo
 Template:     neve
 Version:      1.2
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html

 /* == Add your own styles below this line ==
--------------------------------------------*/

/**
 * Rediseño del blog + plantilla de páginas de información — ronda 24/08.
 *
 * Selectores sacados directamente de neve/inc/views/post_layout.php,
 * template_parts.php y partials/excerpt.php (no adivinados): .entry-title,
 * .entry-content/.nv-content-wrap, .entry-summary/.excerpt-wrap,
 * .nv-thumb-wrap/.nv-post-thumbnail-wrap, y las clases estándar de
 * WordPress que pone get_post_class() (.hentry, .category-*...).
 *
 * Los colores usan var(--dp-x, #valor) con el valor de la nueva paleta
 * como respaldo directo (no el azul/gris anterior): el blog es una
 * superficie nueva, no había "antes" que revertir aquí — el interruptor
 * DondePuedo → Diseño de marca (ver class-brand.php) solo controla la
 * marca del plugin (fichas, buscador, paneles...), no esta hoja.
 */

body {
    background: #FFFFFF;
    color: var(--dp-text, #102A43);
}

/* ===== Listado del blog (archivo/categoría/home de entradas) ===== */

article.hentry {
    border: 1px solid var(--dp-border, #E2E8F0);
    border-radius: 18px;
    padding: 28px;
    margin-bottom: 24px;
    background: #FFFFFF;
    transition: box-shadow .2s ease, border-color .2s ease;
}

article.hentry:hover {
    border-color: var(--dp-turquesa, #08AFC1);
    box-shadow: 0 6px 20px rgba(8, 175, 193, .10);
}

.nv-post-thumbnail-wrap,
.nv-thumb-wrap {
    border-radius: 14px;
    overflow: hidden;
    margin-bottom: 18px;
}

.entry-title,
.entry-title a {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-weight: 800;
    color: var(--dp-text, #102A43);
    text-decoration: none;
    letter-spacing: -0.01em;
}

.entry-title a:hover {
    color: var(--dp-turquesa, #08AFC1);
}

.entry-summary,
.excerpt-wrap {
    color: var(--dp-text-muted, #5A7184);
    line-height: 1.65;
}

.nv-meta-list,
.posted-on,
.byline,
.cat-links {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 13px;
    color: var(--dp-text-muted, #5A7184);
}

.cat-links a {
    display: inline-block;
    background: var(--dp-bg-tint, #E8F9FB);
    color: var(--dp-turquesa-dark, #078E9D);
    border-radius: 999px;
    padding: 3px 12px;
    font-weight: 600;
    text-decoration: none;
    font-size: 12px;
}

/* "Leer más" a tono con los botones del resto de la plataforma. */
.nv-read-more-button,
a.nv-read-more-button {
    display: inline-block;
    background: var(--dp-turquesa, #08AFC1);
    color: #fff !important;
    border-radius: 12px;
    padding: 9px 20px;
    font-weight: 700;
    font-size: 14px;
    text-decoration: none !important;
    border: none;
}

.nv-read-more-button:hover {
    background: var(--dp-turquesa-dark, #078E9D);
}

/* ===== Entrada individual ===== */

.entry-content,
.nv-content-wrap {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: var(--dp-text, #102A43);
    line-height: 1.75;
    font-size: 17px;
}

.entry-content h2,
.entry-content h3,
.entry-content h4 {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-weight: 800;
    color: var(--dp-text, #102A43);
}

.entry-content a {
    color: var(--dp-turquesa, #08AFC1);
}

.entry-content blockquote {
    border-left: 3px solid var(--dp-turquesa, #08AFC1);
    background: var(--dp-bg, #F7FAFC);
    border-radius: 0 12px 12px 0;
    padding: 14px 20px;
    color: var(--dp-text-muted, #5A7184);
}

.entry-content img {
    border-radius: 14px;
}

single-post .entry-header,
.entry-header {
    margin-bottom: 24px;
}

/* ===== Cabecera de la entrada individual: imagen "hero" + kicker =====
   Selectores confirmados leyendo neve/inc/views/post_layout.php: el
   wrapper de la imagen destacada en single es SIEMPRE .nv-thumb-wrap
   (nunca .nv-post-thumbnail-wrap, esa clase es del listado), y se pinta
   antes que .entry-header salvo que el orden de bloques del tema se
   cambie desde el Personalizador — por eso el margen de separación vive
   en el propio .nv-thumb-wrap, no en el header. */

.single-post .nv-thumb-wrap {
    margin-bottom: 28px;
}

.single-post .nv-thumb-wrap img {
    width: 100%;
    aspect-ratio: 21 / 9;
    object-fit: cover;
    border-radius: 20px;
    box-shadow: 0 12px 32px rgba(16, 42, 67, .14);
}

.dp-single-kicker {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 14px;
    margin-bottom: 14px;
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 13px;
}

.dp-single-kicker-back {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--dp-turquesa-dark, #078E9D);
    font-weight: 700;
    text-decoration: none;
}

.dp-single-kicker-back:hover {
    color: var(--dp-turquesa, #08AFC1);
}

.dp-single-kicker-dot {
    color: var(--dp-border, #E2E8F0);
}

.dp-single-kicker-meta {
    color: var(--dp-text-muted, #5A7184);
}

.dp-single-kicker-cat {
    display: inline-block;
    background: var(--dp-bg-tint, #E8F9FB);
    color: var(--dp-turquesa-dark, #078E9D);
    border-radius: 999px;
    padding: 3px 12px;
    font-weight: 600;
    font-size: 12px;
    text-decoration: none;
}

.dp-single-kicker-cat:hover {
    background: var(--dp-turquesa, #08AFC1);
    color: #fff;
}

/* ===== Migas de pan (Yoast, vía Neve) sobre la cabecera con imagen de
   fondo — el estilo por defecto del tema usa un gris (#676767) pensado
   para fondo claro, así que sobre la superposición oscura del hero
   quedaba prácticamente invisible. Se sobrescribe solo dentro de
   .nv-post-cover (la cabecera "Fondo"), sin tocar las migas de pan que
   pudieran aparecer en páginas con cabecera "Normal". ===== */

.nv-post-cover .neve-breadcrumbs-wrapper {
    color: rgba(255, 255, 255, .82);
}

.nv-post-cover .neve-breadcrumbs-wrapper a {
    color: #fff;
    text-decoration: none;
}

.nv-post-cover .neve-breadcrumbs-wrapper a:hover {
    text-decoration: underline;
}

/* ===== Hero de entrada individual (cabecera "Fondo") -- titulo y meta en
   blanco para que se lean sobre cualquier foto, no solo sobre fondos
   oscuros. El titulo (var(--dp-text) navy) y el kicker (turquesa oscuro /
   gris apagado) estan pensados para fondo blanco; sobre la foto del hero,
   incluso con la superposicion al 40%, quedaban con poco contraste en fotos
   claras. Mismo ajuste ya aplicado en produccion via CSS adicional. ===== */

.nv-post-cover .title.entry-title {
    color: #fff;
}

.nv-post-cover .dp-single-kicker-back,
.nv-post-cover .dp-single-kicker-meta {
    color: rgba(255, 255, 255, .92);
}

.nv-post-cover .dp-single-kicker-back:hover {
    color: #fff;
}

.nv-post-cover .dp-single-kicker-dot {
    color: rgba(255, 255, 255, .5);
}

.nv-post-cover .dp-single-kicker-cat {
    background: rgba(255, 255, 255, .2);
    color: #fff;
}

.nv-post-cover .dp-single-kicker-cat:hover {
    background: rgba(255, 255, 255, .35);
    color: #fff;
}



/* ===== Entradas relacionadas (ver hijo-neve/functions.php) ===== */

.dp-related-posts {
    max-width: 760px;
    margin: 48px auto 0;
    padding-top: 32px;
    border-top: 1px solid var(--dp-border, #E2E8F0);
}

.dp-related-posts h3 {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-weight: 800;
    font-size: 20px;
    color: var(--dp-text, #102A43);
    margin-bottom: 18px;
}

.dp-related-posts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 18px;
}

.dp-related-post-card {
    display: block;
    text-decoration: none;
    border: 1px solid var(--dp-border, #E2E8F0);
    border-radius: 18px;
    overflow: hidden;
    background: #FFFFFF;
    transition: box-shadow .2s ease, border-color .2s ease;
}

.dp-related-post-card:hover {
    border-color: var(--dp-turquesa, #08AFC1);
    box-shadow: 0 6px 16px rgba(8, 175, 193, .12);
}

.dp-related-post-card-thumb {
    width: 100%;
    aspect-ratio: 16/10;
    object-fit: cover;
    display: block;
    background: var(--dp-bg, #F7FAFC);
}

.dp-related-post-card-body {
    padding: 14px 16px;
}

.dp-related-post-card-title {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-weight: 700;
    font-size: 14px;
    color: var(--dp-text, #102A43);
    margin: 0 0 4px;
    line-height: 1.4;
}

.dp-related-post-card-date {
    font-size: 12px;
    color: var(--dp-text-muted, #5A7184);
}

/* ===== Plantilla "Página DondePuedo" (ver page-templates/pagina-dondepuedo.php) ===== */

.dp-info-page {
    max-width: 760px;
    margin: 0 auto;
    padding: 48px 24px 80px;
}

.dp-info-page-title {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-weight: 800;
    font-size: 34px;
    color: var(--dp-text, #102A43);
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}

.dp-info-page-updated {
    font-size: 13px;
    color: var(--dp-text-muted, #5A7184);
    margin-bottom: 32px;
}

.dp-info-page-content {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: var(--dp-text, #102A43);
    line-height: 1.75;
    font-size: 16px;
}

.dp-info-page-content h2 {
    font-weight: 800;
    font-size: 22px;
    margin-top: 36px;
    color: var(--dp-text, #102A43);
}

.dp-info-page-content h3 {
    font-weight: 700;
    font-size: 18px;
    margin-top: 28px;
}

.dp-info-page-content a {
    color: var(--dp-turquesa, #08AFC1);
}

.dp-info-page-content ul,
.dp-info-page-content ol {
    padding-left: 22px;
}

.dp-info-page-content blockquote {
    border-left: 3px solid var(--dp-turquesa, #08AFC1);
    background: var(--dp-bg, #F7FAFC);
    border-radius: 0 12px 12px 0;
    padding: 14px 20px;
    color: var(--dp-text-muted, #5A7184);
}

/* ===== Plantilla "DondePuedo - FAQ" (ver page-templates/pagina-faq.php) =====
   Acordeón con <details>/<summary> nativos a propósito: cero JS propio,
   así no hay riesgo de chocar con los scripts del tema (misma lección que
   el bug de especificidad CSS del botón "Seguir" del 25/08, aplicada aquí
   evitando el problema de raíz en vez de parchearlo). */

.dp-faq-page {
    max-width: 760px;
    margin: 0 auto;
    padding: 48px 24px 80px;
}

.dp-faq-page-title {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-weight: 800;
    font-size: 34px;
    color: var(--dp-text, #102A43);
    margin-bottom: 8px;
    letter-spacing: -0.01em;
}

.dp-faq-list {
    margin-top: 32px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.dp-faq-item {
    border: 1px solid var(--dp-border, #E2E8F0);
    border-radius: 14px;
    background: #FFFFFF;
    overflow: hidden;
}

.dp-faq-item summary {
    cursor: pointer;
    list-style: none;
    padding: 18px 22px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: var(--dp-text, #102A43);
}

/* Oculta el triángulo nativo del navegador en ambos motores (Chrome/Safari
   usan el pseudo-elemento marker, Firefox el marcador de lista) para
   sustituirlo por el "+"/"×" propio de abajo. */
.dp-faq-item summary::-webkit-details-marker {
    display: none;
}

.dp-faq-item summary {
    list-style: none;
}

.dp-faq-item summary::after {
    content: "+";
    flex-shrink: 0;
    font-size: 22px;
    font-weight: 400;
    line-height: 1;
    color: var(--dp-turquesa, #08AFC1);
    transition: transform .2s ease;
}

.dp-faq-item[open] summary::after {
    transform: rotate(45deg);
}

.dp-faq-item[open] summary {
    border-bottom: 1px solid var(--dp-border, #E2E8F0);
}

.dp-faq-item-answer {
    padding: 4px 22px 20px;
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: var(--dp-text-muted, #5A7184);
    line-height: 1.7;
    text-align: justify;
}

.dp-faq-item-answer p:last-child {
    margin-bottom: 0;
}

/* Texto justificado también en el contenido de respaldo (cuando la página
   no tiene ningún H3 todavía) — acotado a esta plantilla con .dp-faq-page
   para no afectar a "Página DondePuedo", que comparte la misma clase
   .dp-info-page-content. */
.dp-faq-page .dp-info-page-content {
    text-align: justify;
}

/* ===== Plantilla "DondePuedo - Landing" (ver page-templates/pagina-landing.php) ===== */

.dp-landing-hero {
    position: relative;
    overflow: hidden;
    max-width: 1100px;
    margin: 24px auto 0;
    padding: 72px 40px;
    border-radius: 24px;
    text-align: center;
    color: #FFFFFF;
    background: linear-gradient(135deg, var(--dp-turquesa, #08AFC1), var(--dp-turquesa-dark, #078E9D));
}

.dp-landing-hero.has-image {
    padding: 100px 40px;
}

.dp-landing-hero-bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: .30;
}

.dp-landing-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 680px;
    margin: 0 auto;
}

.dp-landing-hero-title {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-weight: 800;
    font-size: 40px;
    line-height: 1.15;
    letter-spacing: -0.02em;
    margin-bottom: 16px;
}

.dp-landing-hero-subtitle {
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    font-size: 18px;
    line-height: 1.6;
    opacity: .95;
}

.dp-landing-content {
    max-width: 760px;
    margin: 56px auto 0;
    padding: 0 24px 80px;
    font-family: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: var(--dp-text, #102A43);
    line-height: 1.75;
    font-size: 16px;
}

.dp-landing-content h2 {
    font-weight: 800;
    font-size: 26px;
    margin-top: 40px;
    color: var(--dp-text, #102A43);
}

.dp-landing-content h3 {
    font-weight: 700;
    font-size: 19px;
    margin-top: 28px;
}

.dp-landing-content a {
    color: var(--dp-turquesa, #08AFC1);
}

/* Bloques nativos de Gutenberg reforzados a la marca. Selectores propios
   del core de WordPress (wp-block-*), estables entre versiones de tema —
   se refuerzan con !important solo aquí porque el editor de bloques inyecta
   sus propios estilos inline/por defecto que si no ganarían por cascada. */
.dp-landing-content .wp-block-button__link {
    background: var(--dp-turquesa, #08AFC1) !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    padding: 12px 26px !important;
}

.dp-landing-content .wp-block-button__link:hover {
    background: var(--dp-turquesa-dark, #078E9D) !important;
}

.dp-landing-content .wp-block-quote {
    border-left: 3px solid var(--dp-turquesa, #08AFC1);
    background: var(--dp-bg, #F7FAFC);
    border-radius: 0 12px 12px 0;
    padding: 14px 20px;
    margin-left: 0;
    margin-right: 0;
}

.dp-landing-content .wp-block-columns {
    gap: 32px;
}

.dp-landing-content .wp-block-image img,
.dp-landing-content figure.wp-block-image img {
    border-radius: 14px;
}

@media (max-width: 600px) {
    .dp-landing-hero {
        padding: 48px 24px;
        border-radius: 18px;
    }

    .dp-landing-hero-title {
        font-size: 30px;
    }
}

/* ------------------------------------------------------------------ */
/* Fix: boton hamburguesa del menu movil se queda en azul al tocarlo   */
/* ------------------------------------------------------------------ */
/*
   Causa real: Neve pinta TODOS los <button> del sitio con su color de
   marca al pasar el raton, mediante una regla global del propio tema:

       button:hover { background: var(--primarybtnhoverbg); }

   Esa regla tiene mas especificidad CSS (una pseudo-clase + una etiqueta)
   que la regla propia del boton hamburguesa (.dp-header-burger, que es
   solo una clase), asi que la de Neve gana y pinta el fondo de azul
   (var(--primarybtnhoverbg) resuelve al color secundario de Neve, un
   azul que no se ha personalizado, #1d4ed8).

   En movil esto se nota SIEMPRE, no solo "al pasar el raton": las
   pantallas tactiles simulan el estado ":hover" en cuanto se toca un
   elemento, y ese estado se queda "pegado" hasta que el usuario toca en
   otro sitio de la pantalla. Por eso el icono se queda azul mientras el
   menu esta abierto (justo tras tocarlo).

   Solucion: una regla con mas especificidad que la de Neve (la propia
   clase del boton + el mismo pseudo-estado) que anule el fondo en todos
   los estados de interaccion.
*/
.dp-header-burger:hover,
.dp-header-burger:focus,
.dp-header-burger:focus-visible,
.dp-header-burger:active {
    background: transparent;
    box-shadow: none;
}