/* 1. ELIMINAR EL ESPACIO EN BLANCO DEL LADO IZQUIERDO */
/* Forzamos a la página a alinearse totalmente a la izquierda y ocupar el 100% */
.pkp_structure_page {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important; /* Elimina el centrado y pega el diseño a la izquierda */
    margin-right: auto !important;
    padding-left: 2% !important;  /* Pequeño margen de cortesía para que no toque el borde físico */
    padding-right: 4% !important; 
    box-sizing: border-box !important;
}

/* Ajustar también la cabecera y menús al lado izquierdo */
.pkp_structure_head, 
.pkp_navigation_user_wrapper, 
.pkp_navigation_primary_wrapper {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
}

/* 2. DISTRIBUCIÓN DE LAS COLUMNAS */
.pkp_structure_main {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important; /* Prohíbe terminantemente que la barra salte abajo */
    align-items: flex-start !important;
    width: 100% !important;
    gap: 30px; /* Espacio controlado entre el contenido y la barra */
}

/* 3. BLOQUE DE ARTÍCULOS (Se estira en el espacio restante) */
.pkp_structure_content {
    flex: 1 !important; /* Absorbe todo el espacio en blanco de pantallas estándar y grandes */
    min-width: 0 !important; /* Evita que elementos anchos empujen la barra */
}

/* CONTROL DE TÍTULOS: Que nada se salga del bloque */
.pkp_structure_content h1, 
.pkp_structure_content h2, 
.pkp_structure_content h3, 
.pkp_structure_content .title,
.obj_article_details .title {
    max-width: 100% !important;
    word-wrap: break-word !important; /* Rompe el texto si una palabra es extremadamente larga */
    overflow-wrap: break-word !important;
    white-space: normal !important; /* Fuerza al título a saltar de línea dentro de su bloque */
}

/* 4. BARRA LATERAL (Inmune a cambios de pantalla) */
.pkp_structure_sidebar {
    width: 300px !important; /* Tamaño estándar óptimo para OJS */
    min-width: 300px !important; /* No permite que se reduzca en pantallas más chicas */
    flex-shrink: 0 !important; /* Prohíbe estrictamente que el navegador la achique */
    display: block !important;
}

/* Evitar que los bloques de la barra (plugins, imágenes) se salgan */
.pkp_structure_sidebar .pkp_block {
    width: 100% !important;
    box-sizing: border-box !important;
    word-wrap: break-word !important;
}