/* ==========================================
   1. FONDO PREMIUM Y MODERNO CON TEXTURA
   ========================================== */
.pkp_navigation_user_wrapper, 
.pkp_structure_head {
    background: radial-gradient(circle at 50% 30%, #1e6498 0%, #11466d 70%, #0a3352 100%) !important;
    position: relative;
    overflow: visible !important; 
}

/* Sombra inferior elegante */
.pkp_structure_head {
    box-shadow: 0 10px 30px rgba(10, 51, 82, 0.15) !important;
}

/* Espacio arriba y abajo del logo (Escritorio) */
.pkp_site_name_wrapper {
    padding-top: 60px !important;   
    padding-bottom: 50px !important; 
    display: flex;
    justify-content: center; 
}

/* Evita que el logo se estire o pierda su proporción */
.pkp_site_name_wrapper img {
    max-width: 100% !important;
    height: auto !important;
    filter: drop-shadow(0 4px 8px rgba(0,0,0,0.15)); 
    object-fit: contain !important;
}


/* ==========================================
   2. AJUSTES PARA ESCRITORIO
   ========================================== */
@media (min-width: 992px) {

    /* 
     * PROFILE (Menú de usuario):
     * Lo posicionamos arriba a la derecha. 
     * El cálculo max() asegura que se alinee perfectamente con el final de la barra (1170px)
     * pero nunca se salga de la pantalla en monitores más pequeños.
     */
    .pkp_navigation_user_wrapper {
        position: absolute !important;
        top: 25px !important; /* Visible y seguro en la zona superior */
        right: max(20px, calc((100% - 1170px) / 2)) !important; 
        left: auto !important;
        transform: none !important;
        background: transparent !important;
        z-index: 999 !important;
        width: auto !important;
    }

    .pkp_navigation_user {
        display: flex !important;
        justify-content: flex-end !important;
        white-space: nowrap !important;
    }

    .pkp_navigation_user > li > a {
        color: rgba(255, 255, 255, 0.9) !important;
        font-weight: 500 !important;
    }

    /* Opciones desplegables del usuario en Computadora */
    .pkp_navigation_user ul {
        background: #11466d !important;
        border: 1px solid rgba(255, 255, 255, 0.15);
        box-shadow: 0 8px 20px rgba(0,0,0,0.3) !important;
        border-radius: 4px;
        z-index: 9999 !important;
        outline: none !important;
    }

    .pkp_navigation_user ul a {
        color: #ffffff !important;
        font-weight: 500 !important;
        display: block !important;
        padding: 8px 15px !important;
    }

    .pkp_navigation_user ul a:hover {
        background: #1e6498 !important;
        color: #4fc3f7 !important;
    }

    /* 
     * CORRECCIÓN DEFINITIVA: 
     * Elimina el cuadrado blanco y bordes al hacer clic/foco en CUALQUIER botón de usuario.
     */
    .pkp_navigation_user a:focus,
    .pkp_navigation_user a:active,
    .pkp_navigation_user a:visited,
    .pkp_navigation_user li:focus-within {
        outline: none !important;
        box-shadow: none !important;
    }

    /* Para botones principales en modo incógnito (Registrarse / Entrar) */
    .pkp_navigation_user > li > a:focus,
    .pkp_navigation_user > li > a:active {
        background: transparent !important; /* Evita el fondo blanco */
        color: #4fc3f7 !important;           /* Cambia a celeste elegante al hacer clic */
    }

    /* Para submenús cuando estás logueado */
    .pkp_navigation_user ul a:focus,
    .pkp_navigation_user ul a:active {
        background: #11466d !important;
        color: #4fc3f7 !important;
    }

    /* MENÚ PRINCIPAL CENTRADO */
    .pkp_navigation_primary_wrapper {
        border-top: 1px solid rgba(255, 255, 255, 0.12); 
        padding-top: 15px !important;
        padding-bottom: 15px !important;
        display: flex !important;
        justify-content: center !important; 
        position: relative !important;
        overflow: visible !important; 
        max-width: 1170px; 
        margin: 0 auto !important; 
    }

    .pkp_navigation_primary {
        display: flex !important;
        justify-content: center !important;
        gap: 45px !important; 
        float: none !important;
        width: auto !important;
        overflow: visible !important;
    }

    .pkp_navigation_primary > li > a {
        font-weight: 600 !important; 
        font-size: 1.05rem !important; 
        letter-spacing: 0.5px; 
        color: rgba(255, 255, 255, 0.9) !important; 
        position: relative;
        padding: 8px 0 !important;
        transition: color 0.3s ease !important;
    }

    /* Hover del menú principal */
    .pkp_navigation_primary > li > a:hover {
        color: #4fc3f7 !important; 
        text-decoration: none !important;
    }

    .pkp_navigation_primary > li > a::after {
        content: '';
        position: absolute;
        width: 100%;
        transform: scaleX(0);
        height: 2px;
        bottom: 0;
        left: 0;
        background-color: #4fc3f7;
        transform-origin: bottom center;
        transition: transform 0.25s ease-out;
    }

    .pkp_navigation_primary > li > a:hover::after {
        transform: scaleX(1);
    }

    /* Submenú de navegación principal (Acerca de) */
    .pkp_navigation_primary ul {
        background: #11466d !important; 
        border: 1px solid rgba(255, 255, 255, 0.15);
        box-shadow: 0 8px 20px rgba(0,0,0,0.3) !important;
        border-radius: 4px;
        z-index: 9999 !important;
    }
    
    .pkp_navigation_primary ul a {
        font-weight: 500 !important;
        color: #ffffff !important;
        padding: 10px 15px !important;
    }
    
    .pkp_navigation_primary ul a:hover {
        background: #1e6498 !important;
        color: #4fc3f7 !important;
    }

    /* 
     * BUSCADOR (Search):
     * Lo posicionamos exactamente en el extremo derecho del contenedor principal (1170px),
     * alineado horizontalmente con el menú de navegación principal.
     */
    .pkp_navigation_search_wrapper {
        position: absolute !important;
        bottom: 12px !important; /* Alineado verticalmente con el menú principal */
        right: max(20px, calc((100% - 1170px) / 2)) !important; 
        left: auto !important;
        margin: 0 !important;
        z-index: 999 !important;
    }

    .pkp_navigation_search {
        margin: 0 !important;
    }

    .pkp_navigation_search a {
        font-weight: 600 !important;
        color: rgba(255, 255, 255, 0.8) !important;
        background: rgba(255, 255, 255, 0.1); 
        padding: 6px 15px !important;
        border-radius: 20px;
        transition: all 0.25s ease;
        display: inline-block !important;
    }

    .pkp_navigation_search a:hover {
        color: #ffffff !important;
        background: rgba(255, 255, 255, 0.2);
    }
}
/* ==========================================================================
   DISEÑO AUTOMÁTICO PARA ANUNCIOS (CONTRARRESTA EL FILTRO DE OJS)
   ========================================================================== */

/* Seleccionamos los contenedores de anuncios de OJS en la página principal y detalle */
.obj_announcement_full, 
.obj_announcement_summary, 
.page_announcement, 
.announcements_list .item {
    font-family: inherit !important;
    color: #333333 !important;
    line-height: 1.6 !important;
    font-size: 1.05rem !important;
}

/* El título principal (h2) */
.obj_announcement_full h2, 
.obj_announcement_summary h2, 
.page_announcement h2 {
    color: #11466d !important;
    font-size: 1.8rem !important;
    font-weight: 700 !important;
    text-align: center !important;
    margin-top: 20px !important;
    margin-bottom: 5px !important;
    display: block !important;
    border: none !important;
}

/* El subtítulo (el primer párrafo con fuerte/negrita) */
.obj_announcement_full p strong:first-child,
.page_announcement p strong:first-child {
    color: #11466d !important;
}

/* Subtítulos de sección (h3) */
.obj_announcement_full h3, 
.page_announcement h3 {
    color: #11466d !important;
    font-size: 1.3rem !important;
    margin-top: 25px !important;
    margin-bottom: 12px !important;
    font-weight: 600 !important;
    border-bottom: 1px solid rgba(17, 70, 109, 0.1) !important;
    padding-bottom: 5px !important;
}

/* Listas de los anuncios */
.obj_announcement_full ol, .obj_announcement_full ul,
.page_announcement ol, .page_announcement ul {
    margin-bottom: 25px !important;
    padding-left: 20px !important;
}

.obj_announcement_full li,
.page_announcement li {
    margin-bottom: 8px !important;
    line-height: 1.7 !important;
}

/* Enlaces normales dentro del anuncio */
.obj_announcement_full a,
.page_announcement a {
    color: #1e6498 !important;
    text-decoration: underline !important;
    font-weight: 500 !important;
}

.obj_announcement_full a:hover,
.page_announcement a:hover {
    color: #4fc3f7 !important;
}

/* Caja de alerta (Blockquote nativo) */
.obj_announcement_full blockquote,
.page_announcement blockquote {
    background: #f9f9f9 !important;
    padding: 15px !important;
    border-left: 4px solid #1e6498 !important;
    border-top: none !important;
    border-bottom: none !important;
    border-right: none !important;
    border-radius: 4px !important;
    margin: 30px 0 !important;
    font-size: 1rem !important;
}

/* Centrado automático de cualquier imagen en el anuncio */
.obj_announcement_full img,
.page_announcement img {
    display: block !important;
    margin: 30px auto !important;
    max-width: 100% !important;
    height: auto !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;
}

/* BOTÓN DE ACCIÓN (Cualquier enlace que abra en pestaña nueva 'target="_blank"') */
.obj_announcement_full a[target="_blank"],
.page_announcement a[target="_blank"] {
    display: block !important;
    width: fit-content !important;
    background: #11466d !important;
    color: #ffffff !important;
    font-size: 1.15rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    padding: 12px 35px !important;
    border-radius: 30px !important;
    box-shadow: 0 4px 10px rgba(17, 70, 109, 0.3) !important;
    margin: 30px auto !important;
    text-align: center !important;
    transition: all 0.25s ease !important;
}

.obj_announcement_full a[target="_blank"]:hover,
.page_announcement a[target="_blank"]:hover {
    background: #1e6498 !important;
    color: #ffffff !important;
    box-shadow: 0 6px 15px rgba(30, 100, 152, 0.4) !important;
}