/* ============================================================
   FIX: ELIMINAR ESPACIO VACÍO A LA DERECHA (OVERFLOW)
   ============================================================ */
html,
body {
    overflow-x: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

.pkp_structure_page {
    overflow-x: hidden !important;
    width: 100% !important;
}

/* ============================================================
   NAVEGACIÓN USUARIO (ARRIBA DEL TODO) - FONDO CELESTE
   ============================================================ */
.pkp_navigation_user_wrapper {
    background-color: #2E84C1 !important;
    /* Celeste */
    width: 100% !important;
    padding: 0.5rem 20px !important;
    margin: 0 !important;
    box-sizing: border-box;
    order: -1;
    /* Lo coloca arriba */
}

.pkp_navigation_user {
    display: flex !important;
    justify-content: flex-end !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.pkp_navigation_user a {
    color: #ffffff !important;
    text-decoration: none;
    font-weight: 500;
}

.pkp_navigation_user a:hover {
    color: #1a5276 !important;
}

/* ============================================================
   NAVEGACIÓN PRIMARIA - FONDO CELESTE
   ============================================================ */
.pkp_navigation_primary_row {
    background-color: #2E84C1 !important;
    /* Celeste */
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.pkp_navigation_primary_wrapper {
    background-color: #2E84C1 !important;
    padding: 0.8rem 20px !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box;
}

.pkp_navigation_primary {
    margin: 0 !important;
    padding: 0 !important;
}

.pkp_navigation_primary a {
    color: #ffffff !important;
    font-weight: 500;
}

.pkp_navigation_primary a:hover {
    color: #1a5276 !important;
}

/* ============================================================
   DROPDOWNS / SUBMENÚS - FONDO AZUL Y TEXTO LEGIBLE
   ============================================================ */
/* Submenú de navegación primaria (Acerca de, etc.) */
.pkp_navigation_primary ul ul,
.pkp_navigation_primary>li>ul {
    background-color: #2E84C1 !important;
    border: 1px solid #1a5276 !important;
    border-radius: 4px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    padding: 0.5rem 0 !important;
}

.pkp_navigation_primary ul ul li,
.pkp_navigation_primary>li>ul>li {
    background-color: #2E84C1 !important;
}

.pkp_navigation_primary ul ul a,
.pkp_navigation_primary>li>ul>li>a {
    color: #ffffff !important;
    padding: 0.5rem 1rem !important;
    display: block !important;
}

.pkp_navigation_primary ul ul a:hover,
.pkp_navigation_primary>li>ul>li>a:hover {
    background-color: #1a5276 !important;
    color: #ffffff !important;
}

/* Submenú de navegación de usuario (rosag, Panel de control, etc.) */
.pkp_navigation_user ul,
.pkp_navigation_user>li>ul {
    background-color: #2E84C1 !important;
    border: 1px solid #1a5276 !important;
    border-radius: 4px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    padding: 0.5rem 0 !important;
    min-width: 180px !important;
}

.pkp_navigation_user ul li,
.pkp_navigation_user>li>ul>li {
    background-color: #2E84C1 !important;
}

.pkp_navigation_user ul a,
.pkp_navigation_user>li>ul>li>a {
    color: #ffffff !important;
    padding: 0.5rem 1rem !important;
    display: block !important;
}

.pkp_navigation_user ul a:hover,
.pkp_navigation_user>li>ul>li>a:hover {
    background-color: #1a5276 !important;
    color: #ffffff !important;
}

/* Buscador en la navegación */
.pkp_navigation_search_wrapper {
    background-color: transparent !important;
}

.pkp_search {
    color: #ffffff !important;
}

/* ============================================================
   HEADER RESPONSIVE - REORDENADO: NAVUSER > IMAGEN > NAVBAR
   ============================================================ */
.pkp_structure_head {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

.pkp_head_wrapper {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
}

/* pkp_site_nav_menu se comporta como si sus hijos fueran hijos directos del flex container */
.pkp_site_nav_menu {
    display: contents !important;
}

/* ============================================================
   NAVEGACIÓN DE USUARIO - PRIMERO (arriba de todo)
   ============================================================ */
.pkp_navigation_user_wrapper {
    order: 1 !important;
    width: 100% !important;
    position: relative !important;
    z-index: 9999 !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    padding: 0.5rem 1rem !important;
    margin: 0 !important;
}

/* ============================================================
   LOGO/IMAGEN - SEGUNDO (en el medio)
   ============================================================ */
.pkp_site_name_wrapper {
    order: 2 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    position: relative !important;
    z-index: 1 !important;
    display: block !important;
}

/* ============================================================
   NAVBAR PRINCIPAL - TERCERO (abajo)
   ============================================================ */
.pkp_navigation_primary_row {
    order: 3 !important;
    width: 100% !important;
    position: relative !important;
    z-index: 100 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0.5rem 1rem !important;
    margin: 0 !important;
}

.pkp_site_name {
    width: 100% !important;
    max-width: 100% !important;
    text-align: center;
}

.pkp_site_name .is_img {
    display: block;
    width: 100% !important;
}

.pkp_site_name .is_img img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    display: block;
    object-fit: cover;
}

/* Responsividad del header en diferentes pantallas */
@media (max-width: 768px) {
    .pkp_site_name .is_img img {
        width: 100% !important;
        height: auto !important;
    }
}

/* ============================================================
   0. TIPOGRAFÍA GENERAL (TAMAÑOS DE FUENTE)
   ============================================================ */
body {
    font-size: 1.1rem !important;
    /* Base más grande */
    line-height: 1.7 !important;
}

/* Títulos principales */
h1 {
    font-size: 2.4rem !important;
}

h2 {
    font-size: 1.9rem !important;
    color: #2e84c1;
}

h3 {
    font-size: 1.5rem !important;
}

h4 {
    font-size: 1.25rem !important;
}

/* Párrafos y texto general */
p,
li,
.content,
.authors,
.meta {
    font-size: 1.1rem !important;
    line-height: 1.7 !important;
}

/* Navegación */
.pkp_navigation_primary a,
.pkp_navigation_user a {
    font-size: 1.05rem !important;
}

/* Títulos de artículos */
.obj_article_summary .title a {
    font-size: 1.2rem !important;
    font-weight: 600;
}

/* Bloques del sidebar */
.pkp_block .title {
    font-size: 1.15rem !important;
}

.pkp_block .content {
    font-size: 1.05rem !important;
}

/* ============================================================
   1. CABECERA Y NAVEGACIÓN - 100% RESPONSIVE
   ============================================================ */
.has_site_logo .pkp_head_wrapper,
.pkp_site_name_wrapper,
.pkp_navigation_primary_wrapper,
.pkp_navigation_user,
.pkp_search_mobile,
.pkp_structure_footer {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
}

@media (min-width: 992px) {
    .pkp_site_name .is_img img {
        max-height: 100%;
    }

    .obj_issue_toc .cover {
        margin: 0 0 3rem 0;
        width: 100%;
    }

    .obj_issue_toc .cover img {
        width: 80%;
        margin: auto;
    }
}

.pkp_navigation_primary_wrapper {
    display: flex;
    justify-content: center;
}

/* ============================================================
   2. ESTRUCTURA DE PORTAL (2 COLUMNAS: MAIN + SIDEBAR)
   ============================================================ */
.pkp_structure_content {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    display: flex;
    flex-wrap: wrap;
    padding: 0 20px;
    box-sizing: border-box;
}

/* Columna Principal (Izquierda) - Con margen izquierdo para centrar contenido */
body .pkp_structure_main {
    float: none !important;
    width: 72% !important;
    margin: 0 !important;
    padding: 2rem 3% 2rem 5% !important;
    /* Margen izquierdo aumentado */
    box-sizing: border-box;
}

/* Columna de Información (Derecha) */
body .pkp_structure_sidebar {
    float: none !important;
    width: 28% !important;
    padding: 2rem 0 !important;
    box-sizing: border-box;
}

/* Limpieza de líneas estéticas antiguas de OJS */
body .pkp_structure_main::before,
body .pkp_structure_main::after {
    display: none !important;
}

/* ============================================================
   3. ESTILOS DE ELEMENTOS (ARTÍCULOS Y BLOQUES)
   ============================================================ */
h2 {
    color: #2e84c1;
}

/* Tarjetas de Artículos */
ul.articles>li {
    padding: 1.5rem;
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: .5rem;
    box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.05);
    margin-bottom: 1.5rem;
    list-style: none;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    background: #fff;
}

ul.articles>li:hover {
    box-shadow: 0px 12px 20px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

/* Bloques del Sidebar */
.pkp_block {
    margin-bottom: 2rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.02);
}

.pkp_block .title {
    background-color: #2e84c1;
    color: #ffffff;
    padding: 1rem;
    font-size: 1.1rem;
    font-weight: 600;
    text-align: left;
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.pkp_block .content {
    padding: 1.2rem !important;
    border: none !important;
}

/* ============================================================
   4. ARCHIVO, FOOTER Y RESPONSIVIDAD FINAL
   ============================================================ */

/* Grid de Archivos */
.page_issue_archive .issues_archive {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 2rem;
}

/* Footer Estilizado */
.pkp_structure_footer_wrapper {
    color: #ffffff;
    background-color: #2e84c1;
    padding: 3rem 0;
    margin-top: 3rem;
}

.footer-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 20px;
}

.footer-right img {
    max-width: 25rem;
    height: auto;
}

.pkp_brand_footer {
    display: none;
}

/* Tablets y Laptops pequeñas */
@media (max-width: 1200px) {
    body .pkp_structure_main {
        width: 65% !important;
    }

    body .pkp_structure_sidebar {
        width: 35% !important;
    }
}

/* Celulares y Tablets Verticales */
@media (max-width: 992px) {

    body .pkp_structure_main,
    body .pkp_structure_sidebar {
        width: 100% !important;
        float: none !important;
        padding: 1rem 0 !important;
    }

    .footer-info {
        flex-direction: column;
        text-align: center;
    }
}

/* ============================================================
   1. CONTROL DE LA IMAGEN DE PORTADA (150% MÁS GRANDE)
   ============================================================ */
.obj_issue_toc .cover img {
    max-width: 750px !important;
    /* 150% más grande */
    max-height: 1100px !important;
    width: auto !important;
    height: auto !important;
    margin: 0 auto 1.5rem auto !important;
    display: block !important;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
    border-radius: 4px;
}

/* En pantallas grandes mantener tamaño aumentado */
@media (min-width: 992px) {
    .obj_issue_toc .cover img {
        width: 600px !important;
        /* 150% de 400px aprox */
    }
}

/* ============================================================
   2. AJUSTE DE COLUMNAS (SIDEBAR MÁS PEQUEÑO)
   ============================================================ */
/* Contenedor principal */
.pkp_structure_content {
    max-width: 1920px;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    padding: 0 20px;
    box-sizing: border-box;
}

/* Columna Principal: Aumentada al 78% */
body .pkp_structure_main {
    float: none !important;
    width: 78% !important;
    margin: 0 !important;
    padding: 2rem 4% 2rem 0 !important;
    /* Más aire entre columnas */
    box-sizing: border-box;
}

/* Columna de Información (Sidebar): Reducida al 22% */
body .pkp_structure_sidebar {
    float: none !important;
    width: 22% !important;
    padding: 2rem 0 !important;
    box-sizing: border-box;
}

/* ============================================================
   3. RESPONSIVIDAD (TABLETS Y MÓVILES)
   ============================================================ */
@media (max-width: 1200px) {

    /* En laptops pequeñas ajustamos un poco para no apretar el sidebar */
    body .pkp_structure_main {
        width: 75% !important;
    }

    body .pkp_structure_sidebar {
        width: 25% !important;
    }
}

@media (max-width: 992px) {

    /* En móviles, ambas columnas ocupan todo el ancho */
    body .pkp_structure_main,
    body .pkp_structure_sidebar {
        width: 100% !important;
        padding: 1rem 0 !important;
    }

    .obj_issue_toc .cover img {
        max-width: 200px !important;
        /* Más pequeña aún en móviles */
    }
}

/* ============================================================
   4. ESTILOS DE CABECERA Y ELEMENTOS (MANTENIDOS)
   ============================================================ */
@media (min-width: 100%) {

    .has_site_logo .pkp_head_wrapper,
    .pkp_site_name_wrapper,
    .pkp_navigation_primary_wrapper,
    .pkp_navigation_user,
    .pkp_search_mobile,
    .pkp_structure_footer {
        width: 100% !important;
        margin: 0 auto;
    }
}

.pkp_navigation_primary_wrapper {
    display: flex;
    justify-content: center;
}

h2 {
    color: #2e84c1;
}

/* Bloques del Sidebar */
.pkp_block {
    margin-bottom: 2rem;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 8px;
    overflow: hidden;
    background: #ffffff;
}

.pkp_block .title {
    background-color: #2e84c1;
    color: #ffffff;
    padding: 0.8rem;
    font-size: 1rem;
    font-weight: 600;
    text-align: center;
    text-transform: uppercase;
}

/* Footer */
.pkp_structure_footer_wrapper {
    color: #ffffff;
    background-color: #2e84c1;
    padding: 3rem 0;
}

.footer-info {
    display: flex;
    justify-content: space-between;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 20px;
}

/* ============================================================
   RESPONSIVE COMPLETO - TODAS LAS PANTALLAS
   ============================================================ */

/* Base: Todo a 100% de ancho */
.pkp_structure_head,
.pkp_head_wrapper,
.pkp_site_name_wrapper,
.pkp_site_name,
.pkp_site_nav_menu,
.pkp_navigation_user_wrapper,
.pkp_navigation_primary_row,
.pkp_navigation_primary_wrapper,
.pkp_structure_content,
.pkp_structure_main,
.pkp_structure_sidebar,
.pkp_structure_footer_wrapper {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Imagen del header siempre responsiva */
.pkp_site_name .is_img,
.pkp_site_name .is_img img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
}

/* ============================================================
   PANTALLAS MUY PEQUEÑAS (Móviles < 480px)
   ============================================================ */
@media (max-width: 480px) {

    .pkp_navigation_user_wrapper,
    .pkp_navigation_primary_wrapper {
        padding: 0.3rem 10px !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .pkp_navigation_primary {
        flex-direction: column !important;
        text-align: center !important;
    }

    .pkp_navigation_primary li {
        margin: 0.3rem 0 !important;
    }

    body .pkp_structure_main,
    body .pkp_structure_sidebar {
        width: 100% !important;
        padding: 1rem !important;
    }

    h1 {
        font-size: 1.5rem !important;
    }

    h2 {
        font-size: 1.3rem !important;
    }
}

/* ============================================================
   MÓVILES (480px - 768px)
   ============================================================ */
@media (min-width: 481px) and (max-width: 768px) {

    .pkp_navigation_user_wrapper,
    .pkp_navigation_primary_wrapper {
        padding: 0.5rem 15px !important;
    }

    body .pkp_structure_main,
    body .pkp_structure_sidebar {
        width: 100% !important;
        padding: 1rem !important;
    }
}

/* ============================================================
   TABLETS (768px - 992px)
   ============================================================ */
@media (min-width: 769px) and (max-width: 992px) {
    body .pkp_structure_main {
        width: 65% !important;
        padding: 1.5rem !important;
    }

    body .pkp_structure_sidebar {
        width: 35% !important;
        padding: 1.5rem !important;
    }
}

/* ============================================================
   LAPTOPS (992px - 1400px)
   ============================================================ */
@media (min-width: 993px) and (max-width: 1400px) {
    body .pkp_structure_main {
        width: 72% !important;
        padding: 2rem !important;
    }

    body .pkp_structure_sidebar {
        width: 28% !important;
        padding: 2rem !important;
    }
}

/* ============================================================
   ESCRITORIOS GRANDES (1400px - 1920px)
   ============================================================ */
@media (min-width: 1401px) and (max-width: 100%) {
    body .pkp_structure_main {
        width: 75% !important;
        padding: 2rem 3rem !important;
    }

    body .pkp_structure_sidebar {
        width: 25% !important;
        padding: 2rem !important;
    }

    .pkp_structure_content {
        max-width: 100% !important;
        padding: 0 2rem !important;
    }
}

/* ============================================================
   PANTALLAS ULTRA ANCHAS (> 1920px - 4K y más)
   ============================================================ */
@media (min-width: 1921px) {

    .pkp_structure_head,
    .pkp_head_wrapper,
    .pkp_navigation_user_wrapper,
    .pkp_navigation_primary_row,
    .pkp_site_name_wrapper {
        width: 100% !important;
        max-width: 100% !important;
    }

    .pkp_site_name .is_img img {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        object-fit: cover !important;
    }

    .pkp_structure_content {
        width: 100% !important;
        max-width: 2560px !important;
        margin: 0 auto !important;
        padding: 0 3rem !important;
    }

    body .pkp_structure_main {
        width: 78% !important;
        padding: 2rem 4rem !important;
    }

    body .pkp_structure_sidebar {
        width: 22% !important;
        padding: 2rem !important;
    }

    .pkp_structure_footer_wrapper {
        width: 100% !important;
    }

    .footer-info {
        max-width: 2560px !important;
        margin: 0 auto !important;
    }
}

/* ============================================================
   PANTALLAS 4K Y SUPERIORES (> 2560px)
   ============================================================ */
@media (min-width: 2561px) {
    .pkp_structure_content {
        max-width: 3200px !important;
    }

    .footer-info {
        max-width: 3200px !important;
    }

    body {
        font-size: 1.3rem !important;
    }

    h1 {
        font-size: 3rem !important;
    }

    h2 {
        font-size: 2.4rem !important;
    }

    h3 {
        font-size: 1.8rem !important;
    }
}

page_issue_archive .issues_archive {
    margin-left: -0.714rem;
    margin-right: -0.714rem;
    border-top: 1px solid #ddd
}

.page_issue_archive .issues_archive>li {
    padding: 2.143rem .714rem;
    border-bottom: 1px solid #ddd
}

@media (min-width:480px) {
    .page_issue_archive .issues_archive {
        margin-left: -1.43rem;
        margin-right: -1.43rem
    }

    .page_issue_archive .issues_archive>li {
        padding-left: 1.43rem;
        padding-right: 1.43rem
    }
}

@media (min-width:992px) {
    .page_issue_archive .issues_archive {
        margin-left: -2.143rem;
        margin-right: -2.143rem
    }

    .page_issue_archive .issues_archive>li {
        padding-left: 2.143rem;
        padding-right: 2.143rem
    }
}

.page_issue_archive .cmp_pagination {
    margin-top: 1.43rem
}

/* ============================================================
   5. IMPROVED ISSUE SUMMARY STYLES (BIGGER & BETTER)
   ============================================================ */
.obj_issue_summary {
    display: flex;
    flex-direction: column;
}

.obj_issue_summary h2 {
    margin: 1rem 0 0.5rem 0 !important;
    font-size: 1.8rem !important;
    /* Larger title */
    line-height: 1.3 !important;
    font-weight: 700 !important;
}

.obj_issue_summary h2 a {
    text-decoration: none !important;
    color: #2e84c1 !important;
    transition: color 0.2s ease;
}

.obj_issue_summary h2 a:hover {
    color: #1a5276 !important;
}

.obj_issue_summary .cover {
    display: block !important;
    width: 100% !important;
    margin-bottom: 1rem !important;
    float: none !important;
}

.obj_issue_summary .cover img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    /* Allows image to be big */
    object-fit: cover !important;
    border-radius: 8px !important;
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15) !important;
    transition: transform 0.3s ease;
}

.obj_issue_summary .cover:hover img {
    transform: translateY(-5px);
}

.obj_issue_summary .series {
    margin-bottom: 0.5rem;
    color: #666;
    font-size: 1.1rem;
}

.obj_issue_summary .description {
    font-size: 1.1rem;
    line-height: 1.6;
    color: #444;
}

.obj_issue_summary .description p {
    margin: 0.5rem 0;
}

/* Ensure no float interference from other media queries */
@media (min-width: 768px) {
    .obj_issue_summary .cover {
        float: none !important;
        width: 100% !important;
        margin-right: 0 !important;
    }
}

/* ============================================================
   BOTÓN ENVIAR ARTÍCULO (SIDEBAR)
   ============================================================ */
.pkp_block.block_make_submission .content {
    text-align: center !important;
    /* Centrado */
    padding: 1.5rem !important;
}

.block_make_submission_link {
    display: inline-block !important;
    font-size: 1.2rem !important;
    /* Letra más grande */
    font-weight: 700 !important;
    padding: 1rem 1.5rem !important;
    /* Botón más grande */
    line-height: normal !important;
    width: 100% !important;
    /* Ocupar ancho disponible para verse grande */
    box-sizing: border-box !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ============================================================
   MENU HAMBURGUESA MOVIL
   ============================================================ */
.pkp_site_nav_toggle {
    display: none !important;
}

@media (max-width: 992px) {
    .pkp_site_name_wrapper {
        position: relative !important;
        padding: 0 !important;
    }

    .pkp_site_nav_toggle {
        display: inline-flex !important;
        position: absolute !important;
        top: 10px !important;
        left: 10px !important;
        right: auto !important;
        bottom: auto !important;
        z-index: 10000 !important;
        width: 46px !important;
        height: 42px !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 auto !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        border-radius: 8px !important;
        background-color: #2E84C1 !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
        cursor: pointer !important;
        font-size: 0 !important;
        line-height: 0 !important;
        text-indent: 0 !important;
    }

    .pkp_site_name {
        padding: 0 !important;
        margin: 0 !important;
    }

    .pkp_site_name .is_img,
    .pkp_site_name .is_img img {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .pkp_site_nav_toggle span,
    .pkp_site_nav_toggle span::before,
    .pkp_site_nav_toggle span::after {
        display: block !important;
        width: 24px !important;
        height: 3px !important;
        border-radius: 3px !important;
        background-color: #ffffff !important;
        transition: transform 0.2s ease, background-color 0.2s ease !important;
        content: "" !important;
    }

    .pkp_site_nav_toggle span {
        top: 0 !important;
        left: 10px !important;
        position: relative !important;
        overflow: visible !important;
        text-indent: -9999px !important;
        font-size: 0 !important;
        line-height: 0 !important;
    }

    .pkp_site_nav_toggle span::before,
    .pkp_site_nav_toggle span::after {
        position: absolute !important;
        left: 0 !important;
    }

    .pkp_site_nav_toggle span::before {
        top: -8px !important;
    }

    .pkp_site_nav_toggle span::after {
        top: 8px !important;
    }

    .pkp_site_nav_toggle.pkp_site_nav_toggle--transform span {
        background-color: transparent !important;
    }

    .pkp_site_nav_toggle.pkp_site_nav_toggle--transform span::before {
        transform: translateY(8px) rotate(45deg) !important;
    }

    .pkp_site_nav_toggle.pkp_site_nav_toggle--transform span::after {
        transform: translateY(-8px) rotate(-45deg) !important;
    }

    .pkp_site_nav_menu {
        order: 3 !important;
        display: flex !important;
        flex-direction: column !important;
        width: 100% !important;
        max-height: 0 !important;
        overflow: hidden !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        background-color: #2E84C1 !important;
        transition: max-height 0.25s ease, opacity 0.2s ease, visibility 0.2s ease !important;
    }

    .pkp_site_nav_menu.pkp_site_nav_menu--isOpen {
        max-height: 85vh !important;
        overflow-y: auto !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    .pkp_navigation_user_wrapper,
    .pkp_navigation_primary_row {
        width: 100% !important;
        padding: 0 !important;
        justify-content: stretch !important;
    }

    .pkp_navigation_primary_wrapper {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: flex-start !important;
        padding: 0 !important;
        width: 100% !important;
    }

    .pkp_navigation_primary,
    .pkp_navigation_user {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    .pkp_navigation_primary li,
    .pkp_navigation_user li {
        width: 100% !important;
        margin: 0 !important;
        list-style: none !important;
    }

    .pkp_navigation_primary a,
    .pkp_navigation_user a,
    .pkp_search {
        display: block !important;
        width: 100% !important;
        padding: 0.85rem 1rem !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.18) !important;
        box-sizing: border-box !important;
        color: #ffffff !important;
        text-align: left !important;
    }

    .pkp_navigation_primary a:hover,
    .pkp_navigation_user a:hover,
    .pkp_search:hover {
        background-color: #1a5276 !important;
        color: #ffffff !important;
    }

    .pkp_navigation_primary>li>ul,
    .pkp_navigation_user>li>ul {
        position: static !important;
        display: block !important;
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0.25rem 0 0.35rem 1rem !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background-color: #1a5276 !important;
        box-sizing: border-box !important;
    }

    .pkp_navigation_primary>li>ul a,
    .pkp_navigation_user>li>ul a {
        padding: 0.65rem 1rem !important;
        border-bottom: 0 !important;
        font-size: 0.98rem !important;
    }

    .pkp_navigation_search_wrapper {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
}

@media (min-width: 993px) {
    .pkp_site_nav_menu {
        display: contents !important;
    }
}

/* ============================================================
   FOOTER: MENOS PADDING Y MAS AIRE ENTRE COLUMNAS
   ============================================================ */
.pkp_footer_content {
    padding: 1.25rem !important;
}

.pkp_structure_footer_wrapper {
    padding: 2rem 0 !important;
}

.footer-info {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 1.5rem !important;
    padding: 0 12px !important;
}

.footer-info .footer-left,
.footer-info .footer-center,
.footer-info .footer-right {
    width: auto !important;
    flex: 1 1 280px !important;
    min-width: 0 !important;
}

.footer-info .footer-left,
.footer-info .footer-center {
    line-height: 1.55 !important;
}

.footer-info .footer-right {
    display: flex !important;
    justify-content: center !important;
}

.footer-info .footer-right img {
    padding: 10px !important;
    max-width: 100% !important;
}

@media (max-width: 992px) {
    .pkp_footer_content {
        padding: 1rem !important;
    }

    .pkp_structure_footer_wrapper {
        padding: 1.5rem 0 !important;
    }

    .footer-info {
        gap: 1rem !important;
        padding: 0 8px !important;
    }
}