/*
Theme Name:     Herald Child
Theme URI:      https://mekshq.com/theme/herald/
Description:    Child theme for the Herald theme
Author:         meks
Author URI:     https://mekshq.com
Template:       herald
Version:        0.1.0
*/

h2, h3, h4, h5, h6 a {
    line-height: 1.2 !important;
    font-weight: 600 !important;
    margin-top: 5px;
}


h1 {
    margin-top: 15px !important;
    font-weight: 600 !important;
    line-height: 1.1 !important;
}

.ticker-title span {
    font-size:8pt;
}
/* Colores de títulos solo en artículos individuales */
.col-mod-single h1 {
    margin-top: 20px !important;
}

.col-mod-single h2 {
    color: #1557b0 !important;
    text-justify: center !important;
    font-size: 1.6em !important;
}

.col-mod-single h3 {
    color: #1557b0 !important;
    font-weight: 500 !important;
}

.col-mod-single li {
    font-size:12pt !important;
}

/* Bullets de listas en artículos #ea4335 */
.col-mod-single ul li::marker {
    color: #ea4335 !important;
    font-size: 15pt !important;
}


.herald-no-sid .herald-fa-wrapper .meta-category a{
    background-color: #ff4400 !important;
    color: #fff !important;
    padding: 3px 15px !important;    
}

.col-mod-single .entry-header .meta-category a {
    background-color: #ff4400 !important;
    color: #fff !important;
    padding: 3px 15px !important;
}

.col-mod-single .entry-header .meta-category span {
    margin: 0 1px !important;
    color: #efefef;
}

/* Ocultar completamente la sección de comentarios */
    #comments,
    .herald-comments,
    .comments-area,
    .comment-respond,
    .comment-form,
    .herald-comment-form-open {
        display: none !important;
    }



/* ========================================
   EMBEDS MULTIMEDIA - Redes Sociales
   ======================================== */

/* Wrapper externo - 100% ancho, centrado */
.embed-wrapper {
    width: 100%;
    text-align: center;
    margin: 0 0 20px 0;
}

/* Contenedor del embed - inline-block para centrar */
.embed-multimedia {
    display: inline-block;
}

/* Caption */
.embed-multimedia figcaption {
    text-align: center;
    font-style: italic;
    margin: 0 !important;
    font-weight: normal;
    color: #666;
    font-size: 16px;
    line-height: 1.5;
}

.embed-multimedia blockquote,
.embed-multimedia p,
.embed-multimedia iframe {
    margin-bottom: 0 !important;
}


/* Para Youtube */
.mi-video-youtube {
    width: 100%;
    text-align: center;
    margin: 0 0 20px 0;
}

.mi-video-youtube .embed-youtube {
    display: inline-block !important;
    width: 90%;
    max-width: 450px;
}

/* ===== RESPONSIVE ===== */

/* Tablets */
@media (max-width: 1024px) {
    .mi-video-youtube .embed-youtube {
        width: 85%;
    }
}

/* Móviles */
@media (max-width: 768px) {
    .embed-multimedia figcaption {
        font-size: 16px;
    }
    .mi-video-youtube .embed-youtube {
        width: 95%;
    }
}

/* Móviles pequeños */
@media (max-width: 480px) {
    .embed-multimedia figcaption {
        font-size: 13px;
    }
    .mi-video-youtube .embed-youtube {
        width: 100%;
    }
}






















/* ========================================
   OCULTAR TODAS LAS CABECERAS DEL TEMA PADRE
   ======================================== */
#header.herald-site-header,
#herald-responsive-header,
.herald-sticky-header {
    display: none !important;
}

/* ========================================
   OVERLAY DEL MENÚ
   ======================================== */
.herald-menu-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    z-index: 9998;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
}

.herald-menu-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* ========================================
   MENÚ LATERAL
   ======================================== */
.herald-side-menu {
    position: fixed;
    top: 0;
    left: -320px;
    width: 300px;
    height: 100%;
    background: #1c2f49;
    z-index: 9999;
    overflow-y: auto;
    transition: left 0.3s ease;
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.3);
}

.herald-side-menu.active {
    left: 0;
}

/* Header del menú lateral */
.herald-side-menu .menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.herald-side-menu .menu-logo img {
    max-height: 40px;
    width: auto;
}

.herald-side-menu .menu-logo h2 {
    margin: 0;
    font-size: 20px;
}

.herald-side-menu .menu-logo a {
    color: #fff;
    text-decoration: none;
}

.herald-side-menu .menu-logo img {
    filter: brightness(0) invert(0.9);
}

.herald-side-menu .menu-close {
    cursor: pointer;
    font-size: 20px;
    color: #cecece;
    padding: 10px;
    transition: color 0.3s;
    font-weight: normal;
}

.herald-side-menu .menu-close:hover {
    color: #ff6900;
}

/* Navegación del menú lateral */
.herald-side-menu-nav {
    padding: 20px 0;
}

.herald-side-menu-nav .side-nav-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.herald-side-menu-nav .side-nav-menu li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    margin-bottom: 0 !important;
}

.herald-side-menu-nav .side-nav-menu li a {
    display: block;
    padding: 15px 20px;
    color: #dfdfdf;
    text-decoration: none;
    transition: all 0.3s;
}

.herald-side-menu-nav .side-nav-menu li a:hover,
.herald-side-menu-nav .side-nav-menu li.current-menu-item > a {
    background: rgba(255, 105, 0, 0.1);
    color: #ff6900;
    padding-left: 30px;
}

.herald-side-menu-nav .side-nav-menu .sub-menu {
    list-style: none;
    padding: 0;
    background: rgba(0, 0, 0, 0.2);
}

.herald-side-menu-nav .side-nav-menu .sub-menu li a {
    padding-left: 40px;
    font-size: 14px;
}








/* ========================================
   CABECERA PRINCIPAL - ESTRUCTURA INDEPENDIENTE
   ======================================== */
.herald-custom-header {
    width: 100%;
    background: #1c2f49;
    position: relative;
    z-index: 1000;
}

/* Sticky header */
.herald-custom-header.sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
    animation: slideDown 0.3s ease;
}

@keyframes slideDown {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}

body.has-sticky-header {
    padding-top: 60px;
}

/* Contenedor interno */
.herald-header-inner {
    width: 100%;
}
/* Contenedor inferior */
.herald-header-outer {
    display: flex;
    font-size: small;
    justify-content: center;
    padding: 5px !important;
    background-color: #efefef !important;
}
.herald-header-outer p {
    cursor: pointer;
    padding: 0;
    margin: 0;
}
.herald-header-outer p:hover {
    color: #ff6900;
}

.herald-header-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 70px;
    padding: 0 15px;
    position: relative;
}

/* ========================================
   LOGO - SIEMPRE CENTRADO
   ======================================== */
.site-branding.mini {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    pointer-events: none;
}

.site-branding.mini a {
    display: inline-block;
    pointer-events: all;
}

.herald-logo-mini {
    max-height: 70px;
    width: auto;
    display: block;
}


/* ========================================
   HAMBURGUESA - SIEMPRE VISIBLE
   ======================================== */
.herald-nav-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    cursor: pointer;
    font-size: 20px;
    color: #fff;
    transition: color 0.3s;
    flex-shrink: 0;
}

.herald-nav-toggle:hover {
    color: #ff6900;
}

/* ========================================
   ICONOS DE ACCIÓN - SIEMPRE A LA DERECHA
   ======================================== */
.herald-header-actions {
    display: flex;
    align-items: center;
    gap: 2px;
    flex-shrink: 0;
    margin-left: auto;
    z-index: 10;
}

.herald-menu-popup-login,
.herald-menu-popup-search {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    cursor: pointer;
    font-size: 18px;
    color: #fff;
    transition: color 0.3s;
}

.herald-menu-popup-search .herald-in-popup {
    padding: 15px !important;
    width: 1000px;
}

.herald-menu-popup-login:hover,
.herald-menu-popup-search:hover {
    color: #ff6900;
}

/* Popups de búsqueda y login */
.herald-in-popup {
    display: none;
    position: absolute;
    right: 0;
    left: auto;
    top: calc(100% + 10px);
    background: #fff;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
    padding: 20px;
    min-width: 300px;
    z-index: 10000;
    border-radius: 4px;
}


.herald-menu-popup-search .herald-in-popup,
.herald-menu-popup-login .herald-in-popup {
    min-width: 320px;
    right: 0;
    left: auto;
}


.herald-menu-popup-login.active .herald-in-popup,
.herald-menu-popup-search.active .herald-in-popup {
    display: block;
}

/* Triángulo superior del popup */
.herald-in-popup:before {
    content: '';
    position: absolute;
    top: -8px;
    right: 15px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid #fff;
}

/* Formulario de búsqueda */
.herald-search-form {
    display: flex;
    gap: 10px;
}

.herald-search-input {
    flex: 1;
    color:#333;
    padding: 10px 15px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
    outline: none;
    transition: border-color 0.3s;
}


.herald-search-submit {
    padding: 10px 20px;
    background: #ff6900;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: background 0.3s;
    font-size: 14px;
}

.herald-search-submit:hover {
    background: #e55a00;
}

/* Contenido del login */
#custom-login-menu {
    min-height: 50px;
    color: #333;
}

#custom-login-menu:empty:before {
    content: "Login menu";
    color: #999;
    font-size: 13px;
    font-style: italic;
}

/* Ajustes responsive */
@media (max-width:1250px) {
    .herald-menu-popup-search .herald-in-popup {
        width: 670px;
    }
    .herald-menu-popup-login .herald-in-popup {
        width:320px;
    }
}


@media (max-width: 768px) {
    .herald-header-content {
        padding: 0 10px;
        height: 45px;
    }
    
    .herald-menu-popup-search .herald-in-popup {
        right: -10px;
        width: 350px;
    }
    
    .herald-menu-popup-login .herald-in-popup {
        min-width: 220px;
        width: 320px;
    }
    
    .herald-logo-mini {
        max-height: 45px;
    }
}

@media (max-width: 480px) {
    .herald-nav-toggle,
    .herald-menu-popup-login,
    .herald-menu-popup-search {
        width: 36px;
        height: 40px;
        font-size: 16px;
    }
        
    .herald-header-content {
        padding: 0 7px 0 0;
        height: 45px;
    }

    .herald-menu-popup-search .herald-in-popup {
        min-width: 300px;
        width: 300px;
        right: -50px;
        padding: 5px !important;

    }
    
    .herald-menu-popup-search .herald-in-popup:before {
        content: '';
        position: absolute;
        top: -8px;
        right: 60px;
        width: 0;
        height: 0;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        border-bottom: 8px solid #fff;
    }

    .herald-menu-popup-login .herald-in-popup {
        min-width: 290px;
        width: 290px;
        right: -2px;
        padding: 10px;
    }
}

/* ========================================
   CORREGIR MENÚ LATERAL EN MÓVILES
   ======================================== */

/* Prevenir que el menú empuje el contenido */
body {
    overflow-x: hidden;
}

/* Cuando el menú está abierto */
body.menu-open {
    overflow: hidden;
    position: relative;
}

/* Asegurar que el contenido no se mueva */
.herald-site-content {
    position: relative;
    transition: none !important;
    transform: none !important;
    padding-top: 5px !important;
}

/* Media query específica para pantallas pequeñas */
@media (max-width: 1250px) {
    .herald-side-menu {
        position: fixed !important;
        z-index: 9999 !important;
    }
    
    .herald-side-menu.active {
        left: 0 !important;
    }
    
    /* Prevenir scroll horizontal */
    body, html {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }
    
    /* Asegurar que el contenido permanezca en su lugar */
    #content,
    .herald-site-content,
    .container {
        position: relative !important;
        left: 0 !important;
        right: 0 !important;
        transform: none !important;
        transition: none !important;
    }
}



















/* ========================================
   CORRECCIONES DE ESTILOS DEL TEMA PADRE
   ======================================== */

/* Eliminar margin-top de herald-site-content en todos los tamaños */
.herald-site-content {
    margin-top: 0 !important;
}

/* Eliminar padding de containers 
.container, 
.herald-boxed .container, 
.herald-boxed .herald-site-content, 
.herald-boxed .herald-site-footer .container, 
.herald-lay-a .col-mod, 
.herald-site-content {
    padding: 0 !important;
}*/


/* ========================================
   CAPTIONS DE IMÁGENES - DEBAJO DE LA FOTO
   ======================================== */

/* Contenedor de la imagen principal del post */
.herald-post-thumbnail,
.herald-post-thumbnail-single {
    position: relative !important;
    margin-bottom: 20px !important;
    display: flex !important;
    flex-direction: column !important;
}

/* Quitar posicionamiento absoluto del caption */
.herald-post-thumbnail .wp-caption-text,
.herald-post-thumbnail-single .wp-caption-text,
.herald-post-thumbnail figure.wp-caption-text,
.herald-post-thumbnail-single figure.wp-caption-text {
    position: static !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 10px 15px !important;
    background: #f5f5f5 !important;
    color: #666 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    font-style: italic !important;
    text-align: left !important;
    border-left: 3px solid #ff6900 !important;
    transform: none !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
}

/* Responsive - móviles */
@media (max-width: 768px) {
    .herald-post-thumbnail .wp-caption-text,
    .herald-post-thumbnail-single .wp-caption-text,
    .herald-post-thumbnail figure.wp-caption-text,
    .herald-post-thumbnail-single figure.wp-caption-text {
        font-size: 13px !important;
        padding: 8px 12px !important;
    }
}

/* Asegurar que la imagen no tenga efectos que interfieran */
.herald-post-thumbnail span,
.herald-post-thumbnail-single span {
    display: block !important;
    position: relative !important;
    overflow: hidden !important;
    width: 100% !important;
}

.herald-post-thumbnail span img,
.herald-post-thumbnail-single span img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
}

/* ========================================
   CAPTIONS DE IMÁGENES EN EL CONTENIDO
   ======================================== */

/* Contenedor figure dentro del contenido */
.col-mod-single .entry-content .wp-caption,
.col-mod-single .entry-content figure {
    position: relative !important;
    margin-bottom: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    max-width: 100% !important;
    width: auto !important;
}

/* Caption dentro del contenido - mismo estilo que imagen principal */
.col-mod-single .entry-content .wp-caption-text,
.col-mod-single .entry-content figcaption {
    position: static !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 10px 15px !important;
    background: #f5f5f5 !important;
    color: #666 !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
    font-style: italic !important;
    text-align: left !important;
    border-left: 3px solid #ff6900 !important;
    transform: none !important;
    opacity: 1 !important;
    box-sizing: border-box !important;
}

/* Asegurar que la imagen respete el contenedor */
.col-mod-single .entry-content .wp-caption img,
.col-mod-single .entry-content figure img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
}

/* Responsive - móviles */
@media (max-width: 768px) {
    .col-mod-single .entry-content .wp-caption-text,
    .col-mod-single .entry-content figcaption {
        font-size: 13px !important;
        padding: 8px 12px !important;
    }
}


/* Menú lateral con submenús colapsables */
.herald-side-menu-nav .sub-menu {
    display: none;
    padding-left: 20px;
}

.herald-side-menu-nav .sub-menu.active {
    display: block;
}

.herald-side-menu-nav .menu-item-has-children > a {
    position: relative;
    padding-right: 40px;
}

.herald-side-menu-nav .menu-item-has-children > a::after {
    content: '\f107';
    font-family: 'FontAwesome';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    transition: transform 0.3s ease;
    padding: 15px;
    cursor: pointer;
}

.herald-side-menu-nav .menu-item-has-children.open > a::after {
    transform: translateY(-50%) rotate(180deg);
}