/**
 * ==============================================================================
 * REVISTA CIENTÍFICA - PLANTILLA CSS MAESTRA PARA PKP / OPEN JOURNAL SYSTEMS (OJS)
 * ==============================================================================
 * 
 * Nombre del archivo : plantilla_ma.css
 * Ubicación          : /OJS Theme/plantilla_ma.css
 * Compatibilidad     : PKP/OJS 3.3.x, 3.4.x y 3.5.x
 * Tema Base          : PKP Health Sciences Theme (compatible además con Bootstrap 4/5 y Default)
 * Publicación Base   : Revista Matronería Actual (Universidad de Valparaíso)
 * Propósito          : Plantilla CSS unificada, moderna, modular, altamente documentada
 *                      y accesible (WCAG AA/AAA). Diseñada para ser cargada en:
 *                      Ajustes > Sitio web > Apariencia > Avanzado > "Plantilla de la revista"
 * 
 * ------------------------------------------------------------------------------
 * GUÍA DE PERSONALIZACIÓN RÁPIDA (PARA OTRAS REVISTAS):
 * ------------------------------------------------------------------------------
 * 1. Abra este archivo y ubíquese en la sección ":root" (Líneas ~40 a ~170).
 * 2. Modifique los valores de las variables CSS de su revista:
 *      --ma-primary             -> Color primario de identidad (ej: #BF210C, #845A24, #1E40AF)
 *      --ma-primary-hover       -> Variante más oscura para hovers y estados activos
 *      --ma-primary-light       -> Variante clara/pastel para fondos de badges y tarjetas
 *      --ma-accent              -> Color de contraste secundario (ej: azul pizarra #2C3E50)
 *      --ma-font-sans           -> Fuente sans-serif de la interfaz y cuerpo de texto
 *      --ma-font-serif          -> Fuente serif para títulos de artículos y números
 *      --ma-footer-bg           -> Color de fondo del pie de página (ej: #1E293B o #BF210C)
 *      --ma-footer-text         -> Color de texto principal en el footer
 *      --ma-footer-link         -> Color de los enlaces en el footer
 *      --ma-footer-border-top   -> Color de la línea decorativa superior del footer
 * 3. Guarde el archivo y cárguelo en el panel de administración de OJS.
 * ==============================================================================
 */

/* ==============================================================================
   01. VARIABLES DE DISEÑO (DESIGN TOKENS) - IDENTIDAD Y PERSONALIZACIÓN GLOBAL
   ============================================================================== */
:root {
  /* --- PALETA DE COLOR: IDENTIDAD PRINCIPAL (Revista Matronería Actual) --- */
  --ma-primary: #bf210c; /* Rojo / Borgoña institucional primario */
  --ma-primary-hover: #9d1a09; /* Hover de botones y enlaces principales */
  --ma-primary-dark: #7a1406; /* Sombra profunda / encabezados contrastados */
  --ma-primary-light: #fdeeeb; /* Fondo suave para tarjetas y llamadas */
  --ma-primary-tint: rgba(
    191,
    33,
    12,
    0.08
  ); /* Tinte translúcido para badges */
  --ma-primary-tint-hover: rgba(
    191,
    33,
    12,
    0.15
  ); /* Hover para elementos sutiles */
  --ma-gradient-primary: linear-gradient(
    135deg,
    #bf210c 0%,
    #8b1608 60%,
    #5a0e05 100%
  );
  --ma-gradient-subtle: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);

  /* --- PALETA DE COLOR: ACENTOS Y TERCEROS --- */
  --ma-accent: #2c3e50; /* Azul pizarra académico / contraste */
  --ma-accent-gold: #d97706; /* Acento para destacados / avisos especiales */
  --ma-orcid: #a6ce39; /* Verde oficial ORCID */
  --ma-orcid-dark: #82a523; /* Hover ORCID */
  --ma-success: #10b981; /* Indicadores de éxito / acceso abierto */
  --ma-warning: #f59e0b; /* Indicadores de advertencia */
  --ma-info: #0284c7; /* Información adicional */

  /* --- PALETA DE COLOR: SUPERFICIES Y FONDOS --- */
  --ma-bg-body: #f8f9fb; /* Fondo general de la página */
  --ma-bg-surface: #ffffff; /* Fondo de tarjetas y bloques principales */
  --ma-bg-alt: #f1f5f9; /* Fondo alternativo suave */
  --ma-bg-header: #ffffff; /* Fondo del encabezado superior */

  /* --- PALETA DE COLOR: PERSONALIZACIÓN EXCLUSIVA DEL PIE DE PÁGINA (FOOTER) --- */
  --ma-footer-bg: #bf210c; /* Color de fondo principal del footer (ej: #1E293B oscuro o #BF210C primario) */
  --ma-footer-bg-card: #0f172a; /* Fondo de bloques/tarjetas secundarias en el footer */
  --ma-footer-text: rgba(
    255,
    255,
    255,
    0.85
  ); /* Color de texto general y párrafos del footer */
  --ma-footer-text-muted: #94a3b8; /* Color de metadatos o textos secundarios en el footer */
  --ma-footer-title: #ffffff; /* Color de títulos de bloques (H2, H3, H4, .title) en el footer */
  --ma-footer-title-border: #bf210c; /* Color del subrayado/acento bajo los títulos de bloques */
  --ma-footer-link: rgba(
    255,
    255,
    255,
    0.8
  ); /* Color normal de los enlaces en el footer */
  --ma-footer-link-hover: #ffffff; /* Color de los enlaces al pasar el cursor (hover) */
  --ma-footer-link-underline: #bf210c; /* Color de la línea de subrayado en hover */
  --ma-footer-border-top: #bf210c; /* Franja decorativa superior del pie de página (4px) */
  --ma-footer-divider: rgba(
    255,
    255,
    255,
    0.12
  ); /* Separador entre la sidebar del footer y el contenido inferior */

  /* Variables legacy de compatibilidad */
  --ma-bg-footer: var(--ma-footer-bg);
  --ma-bg-footer-card: var(--ma-footer-bg-card);

  /* --- PALETA DE COLOR: TEXTO Y CONTRASTE (WCAG AAA/AA) --- */
  --ma-text-main: #1e293b; /* Texto principal de lectura (antracita) */
  --ma-text-muted: #64748b; /* Metadatos, fechas, DOIs, afiliaciones */
  --ma-text-light: #94a3b8; /* Texto secundario atenuado */
  --ma-text-inverse: #ffffff; /* Texto sobre fondos oscuros o primarios */
  --ma-text-link: #bf210c; /* Enlaces interactivos */
  --ma-text-link-hover: #7a1406; /* Enlaces en estado hover */

  /* --- PALETA DE COLOR: BORDES Y SEPARADORES --- */
  --ma-border-subtle: #e2e8f0; /* Bordes de tarjetas y divisores leves */
  --ma-border-medium: #cbd5e1; /* Bordes de inputs y tablas */
  --ma-border-strong: #94a3b8; /* Bordes destacados */
  --ma-border-focus: #bf210c; /* Anillo de enfoque accesible */

  /* --- TIPOGRAFÍA Y ESCALA MODULAR --- */
  --ma-font-sans:
    system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial,
    sans-serif;
  --ma-font-serif:
    "PT Serif", "Merriweather", Georgia, "Times New Roman", serif;
  --ma-font-mono:
    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;

  --ma-font-size-xs: 0.75rem; /* 12px */
  --ma-font-size-sm: 0.875rem; /* 14px */
  --ma-font-size-base: 1rem; /* 16px */
  --ma-font-size-md: 1.125rem; /* 18px */
  --ma-font-size-lg: 1.25rem; /* 20px */
  --ma-font-size-xl: 1.5rem; /* 24px */
  --ma-font-size-2xl: 1.875rem; /* 30px */
  --ma-font-size-3xl: 2.25rem; /* 36px */
  --ma-font-size-4xl: 2.75rem; /* 44px */

  --ma-line-height-tight: 1.25;
  --ma-line-height-normal: 1.6;
  --ma-line-height-relaxed: 1.75;

  /* --- RADIOS DE BORDE (BORDER RADIUS) --- */
  --ma-radius-xs: 4px;
  --ma-radius-sm: 6px;
  --ma-radius-md: 10px;
  --ma-radius-lg: 16px;
  --ma-radius-xl: 24px;
  --ma-radius-full: 9999px;

  /* --- ELEVACIÓN Y SOMBRAS (BOX SHADOWS) --- */
  --ma-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --ma-shadow-sm: 0 2px 4px rgba(15, 23, 42, 0.06);
  --ma-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08);
  --ma-shadow-lg: 0 10px 25px rgba(15, 23, 42, 0.1);
  --ma-shadow-xl: 0 20px 35px rgba(15, 23, 42, 0.12);
  --ma-shadow-glow: 0 0 0 3px rgba(191, 33, 12, 0.25);
  --ma-shadow-inner: inset 0 2px 4px rgba(0, 0, 0, 0.05);

  /* --- ESPACIADOS (SPACING) --- */
  --ma-space-1: 0.25rem; /* 4px */
  --ma-space-2: 0.5rem; /* 8px */
  --ma-space-3: 0.75rem; /* 12px */
  --ma-space-4: 1rem; /* 16px */
  --ma-space-5: 1.25rem; /* 20px */
  --ma-space-6: 1.5rem; /* 24px */
  --ma-space-8: 2rem; /* 32px */
  --ma-space-10: 2.5rem; /* 40px */
  --ma-space-12: 3rem; /* 48px */
  --ma-space-16: 4rem; /* 64px */

  /* --- TRANSICIONES SUAVES --- */
  --ma-transition-fast: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
  --ma-transition-normal: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  --ma-transition-smooth: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

/* ==============================================================================
   02. RESET GENERAL Y MEJORAS GLOBALES DE TIPOGRAFÍA
   ============================================================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body,
.pkp_structure_main {
  font-family: var(--ma-font-sans);
  font-size: var(--ma-font-size-base);
  line-height: var(--ma-line-height-normal);
  color: var(--ma-text-main);
  background-color: var(--ma-bg-body);
  letter-spacing: -0.01em;
}

::selection {
  background-color: var(--ma-primary);
  color: var(--ma-text-inverse);
}

a {
  color: var(--ma-text-link);
  text-decoration: none;
  transition: var(--ma-transition-fast);
}

a:hover,
a:focus {
  color: var(--ma-text-link-hover);
  text-decoration: none;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: none;
  box-shadow: var(--ma-shadow-glow) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.page_title,
.pkp_page_title {
  font-family: var(--ma-font-serif);
  color: var(--ma-text-main);
  font-weight: 700;
  line-height: var(--ma-line-height-tight);
  margin-top: 0;
}

img {
  max-width: 100%;
  height: auto;
}

/* ==============================================================================
   03. ENCABEZADO Y BARRA DE NAVEGACIÓN CON FONDO DE COLOR PRIMARIO
       (.main-header, .pkp_structure_head, #primaryNav, #userNav)
   ============================================================================== */
.main-header,
.pkp_structure_head {
  background-color: var(--ma-bg-header);
  border-bottom: none;
  position: relative;
  z-index: 100;
}

.main-header .container,
.pkp_structure_head .container {
  padding-top: var(--ma-space-4);
  padding-bottom: 0;
  position: relative;
}

/* ==============================================================================
   ANIMACIÓN DE CARGA INICIAL PARA EL LOGOTIPO (Elegante, sobria y suave)
   ============================================================================== */
@keyframes maLogoEntrance {
  0% {
    opacity: 0;
    transform: translateY(-8px) scale(0.98);
    filter: blur(1.5px);
  }
  60% {
    opacity: 0.95;
    filter: blur(0);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
    filter: blur(0);
  }
}

/* Logo de la Revista en Cabecera (Formato grande y destacado) */
.navbar-logo,
.pkp_site_name_wrapper,
.pkp_site_name .is_img {
  text-align: center;
  padding: var(--ma-space-4) 0 var(--ma-space-4);
  display: flex;
  justify-content: center;
  align-items: center;
}

.navbar-logo img,
.navbar-logo .img-fluid,
.pkp_site_name .is_img img,
.pkp_site_name_wrapper img,
.img-fluid[src*="pageHeaderLogoImage"] {
  max-height: 160px !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  object-fit: contain;
  display: inline-block;
  filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.04));
  animation: maLogoEntrance 0.85s cubic-bezier(0.16, 1, 0.3, 1) both;
  will-change: transform, opacity;
}

/* Evitar salto en hover al inicio (mantiene estabilidad y sobriedad) */
.navbar-logo:hover img,
.pkp_site_name_wrapper:hover img,
.navbar-logo a:hover img {
  transform: none !important;
}

/* Ocultar el logo secundario de la barra navbar (evita duplicidad con el logo principal superior) */
.navbar-brand,
.navbar .navbar-brand,
.navbar-brand img,
.navbar-brand .img-fluid {
  display: none !important;
}

.navbar-logo-text,
.pkp_site_name {
  font-family: var(--ma-font-serif);
  font-size: var(--ma-font-size-2xl);
  font-weight: 700;
  color: var(--ma-text-main);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

/* Menú de Usuario y Selector de Idioma (Top Bar Superior) */
#userNav,
.pkp_navigation_user,
.language-toggle,
#languageLargeNav {
  display: flex;
  align-items: center;
  gap: var(--ma-space-2);
}

#userNav .nav-link,
.pkp_navigation_user a,
.language-toggle .dropdown-toggle,
#languageLargeNav a {
  font-size: var(--ma-font-size-xs) !important;
  font-weight: 600 !important;
  color: var(--ma-text-muted) !important;
  padding: var(--ma-space-1) var(--ma-space-3) !important;
  border-radius: var(--ma-radius-full);
  background-color: var(--ma-bg-alt);
  border: 1px solid transparent !important;
  outline: none !important;
  box-shadow: none !important;
  transition:
    background-color var(--ma-transition-fast),
    color var(--ma-transition-fast),
    border-color var(--ma-transition-fast) !important;
  box-sizing: border-box !important;
}

#userNav .nav-link:hover,
#userNav .nav-link:focus,
#userNav .nav-link:active,
#userNav .show > .nav-link,
#userNav [aria-expanded="true"],
.pkp_navigation_user a:hover,
.pkp_navigation_user a:focus,
.language-toggle .dropdown-toggle:hover,
.language-toggle .dropdown-toggle:focus,
.language-toggle .show > .dropdown-toggle,
#languageLargeNav a:hover,
#languageLargeNav a:focus,
#languageLargeNav [aria-expanded="true"] {
  color: var(--ma-primary) !important;
  background-color: var(--ma-primary-light) !important;
  border-color: rgba(191, 33, 12, 0.25) !important;
  outline: none !important;
  box-shadow: none !important;
}

/* ==============================================================================
   MENÚ PRINCIPAL: RESPETANDO EL DISEÑO ORIGINAL HEALTH SCIENCES CON COLOR PRIMARIO
   ============================================================================== */
#primaryNav .dropdown-menu.show {
  background-color: var(--ma-primary) !important;
}

#primaryNav .dropdown-item:focus,
#primaryNav .dropdown-item:hover {
  background-color: var(--ma-primary) !important;
}

/* ==============================================================================
   MENÚS DESPLEGABLES DE IDIOMA Y USUARIO (DROPDOWNS) - ESCRITORIO (>= 992px)
   Alineación estricta y sin saltos ni en hover ni en click
   ============================================================================== */
@media (min-width: 992px) {
  /* Botón de hamburguesa NUNCA visible en escritorio */
  .navbar-toggler {
    display: none !important;
  }

  /* Menú de navegación principal en escritorio */
  #main-navbar.collapse,
  #main-navbar {
    display: flex !important;
    visibility: visible !important;
  }

  /* Ocultar menús internos del drawer en escritorio (se usan las barras superiores #languageLargeNav y #userNav) */
  #languageSmallNav,
  #primaryNav-userNav,
  #main-navbar #languageSmallNav,
  #main-navbar #primaryNav-userNav {
    display: none !important;
  }

  /* --- DROPDOWN SELECTOR DE IDIOMA (TOP BAR - ESCRITORIO) --- */
  #languageLargeNav,
  .language-toggle {
    position: absolute !important;
    top: 1rem !important;
    left: 1rem !important;
    z-index: 1060 !important;
  }

  #languageLargeNav .dropdown-menu,
  .language-toggle .dropdown-menu,
  #languageLargeNav .dropdown-menu.show,
  .language-toggle .dropdown-menu.show {
    position: absolute !important;
    top: calc(100% + 4px) !important;
    left: 0 !important;
    right: auto !important;
    transform: none !important;
    min-width: 170px !important;
    max-width: 260px !important;
    width: auto !important;
    background: var(--ma-bg-surface) !important;
    border: 1px solid var(--ma-border-subtle) !important;
    border-radius: var(--ma-radius-md) !important;
    box-shadow: var(--ma-shadow-lg) !important;
    padding: var(--ma-space-2) !important;
    margin: 0 !important;
    display: none;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    text-align: left !important;
    z-index: 1060 !important;
    transition: opacity var(--ma-transition-fast) !important;
  }

  #languageLargeNav:hover > .dropdown-menu,
  .language-toggle:hover > .dropdown-menu,
  #languageLargeNav .dropdown-menu.show,
  .language-toggle .dropdown-menu.show {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  #languageLargeNav .dropdown-item,
  .language-toggle .dropdown-item {
    display: block !important;
    width: 100% !important;
    text-align: left !important;
    white-space: nowrap !important;
    font-family: var(--ma-font-sans) !important;
    font-size: var(--ma-font-size-xs) !important;
    font-weight: 600 !important;
    color: var(--ma-text-main) !important;
    text-transform: none !important;
    padding: var(--ma-space-2) var(--ma-space-3) !important;
    border-radius: var(--ma-radius-xs) !important;
    border: none !important;
    background: transparent !important;
    transition: var(--ma-transition-fast) !important;
  }

  #languageLargeNav .dropdown-item:hover,
  #languageLargeNav .dropdown-item:focus,
  .language-toggle .dropdown-item:hover,
  .language-toggle .dropdown-item:focus {
    background-color: var(--ma-primary-light) !important;
    color: var(--ma-primary) !important;
    transform: translateX(4px) !important;
    text-align: left !important;
  }

  /* --- DROPDOWN MENÚ DE USUARIO (TOP BAR - ESCRITORIO) --- */
  #userNav,
  .pkp_navigation_user {
    position: absolute !important;
    top: 1rem !important;
    right: 1rem !important;
    z-index: 1060 !important;
  }

  #userNav .nav-item,
  .pkp_navigation_user > li {
    position: relative !important;
  }

  #userNav .dropdown-menu,
  .pkp_navigation_user .dropdown-menu,
  #userNav .dropdown-menu.show,
  .pkp_navigation_user .dropdown-menu.show {
    position: absolute !important;
    top: calc(100% + 4px) !important;
    right: 0 !important;
    left: auto !important;
    transform: none !important;
    min-width: 200px !important;
    max-width: 300px !important;
    width: auto !important;
    background: var(--ma-bg-surface) !important;
    border: 1px solid var(--ma-border-subtle) !important;
    border-radius: var(--ma-radius-md) !important;
    box-shadow: var(--ma-shadow-lg) !important;
    padding: var(--ma-space-2) !important;
    margin: 0 !important;
    display: none;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    text-align: left !important;
    z-index: 1060 !important;
    transition: opacity var(--ma-transition-fast) !important;
  }

  #userNav .nav-item.dropdown:hover > .dropdown-menu,
  #userNav .nav-item:hover > .dropdown-menu,
  .pkp_navigation_user > li:hover > .dropdown-menu,
  #userNav .dropdown-menu.show,
  .pkp_navigation_user .dropdown-menu.show {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  #userNav .dropdown-item,
  .pkp_navigation_user .dropdown-item {
    display: block !important;
    width: 100% !important;
    text-align: left !important;
    white-space: nowrap !important;
    font-family: var(--ma-font-sans) !important;
    font-size: var(--ma-font-size-xs) !important;
    font-weight: 600 !important;
    color: var(--ma-text-main) !important;
    text-transform: none !important;
    padding: var(--ma-space-2) var(--ma-space-3) !important;
    border-radius: var(--ma-radius-xs) !important;
    border: none !important;
    background: transparent !important;
    transition: var(--ma-transition-fast) !important;
  }

  #userNav .dropdown-item:hover,
  #userNav .dropdown-item:focus,
  .pkp_navigation_user .dropdown-item:hover,
  .pkp_navigation_user .dropdown-item:focus {
    background-color: var(--ma-primary-light) !important;
    color: var(--ma-primary) !important;
    transform: translateX(4px) !important;
    text-align: left !important;
  }
}

/* Animación de entrada para menús desplegables */
@keyframes maFadeDown {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ==============================================================================
   04. PORTADA, HERO IMAGE Y NÚMERO ACTUAL (.page-home, .container-homepage-issue)
   ============================================================================== */
.page-home,
.page_index {
  padding-bottom: var(--ma-space-12);
}

/* IMAGEN HERO DE FONDO (.homepage-image-behind-issue) */
.homepage-image-behind-issue {
  position: absolute;
  z-index: -1;
  width: 100%;
  left: 0;
  right: 0;
  max-height: 480px;
  overflow: hidden;
}

.homepage-image-behind-issue img {
  width: 100%;
  height: 480px;
  object-fit: cover;
  display: block;
}

.homepage-image-behind-issue::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.5) 0%,
    rgba(0, 0, 0, 0.75) 100%
  ) !important;
}

/* CONTENEDOR DEL NÚMERO ACTUAL: TRANSPARENTE CUANDO HAY HERO */
.homepage-image-behind-issue + .container-homepage-issue,
.container-homepage-issue {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding-top: var(--ma-space-8);
  margin-top: 0 !important;
  margin-bottom: var(--ma-space-8);
}

/* Badge "NÚMERO ACTUAL" */
.homepage-issue-current {
  display: inline-block !important;
  background: var(--ma-primary) !important;
  color: #ffffff !important;
  font-size: var(--ma-font-size-xs) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  padding: 0.4rem 1.25rem !important;
  border-radius: var(--ma-radius-full) !important;
  margin-bottom: var(--ma-space-2) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3) !important;
  text-shadow: none !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
}

/* Título de la Edición ("Vol. X Núm. Y") */
.homepage-issue-identifier,
.current_issue_wrapper .title {
  font-family: var(--ma-font-serif) !important;
  font-size: clamp(2rem, 4.5vw, 3.25rem) !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  text-shadow:
    0 2px 8px rgba(0, 0, 0, 0.85),
    0 4px 20px rgba(0, 0, 0, 0.6) !important;
  margin: var(--ma-space-2) 0 !important;
  line-height: 1.15 !important;
}

/* Fecha de Publicación */
.homepage-issue-published,
.current_issue_wrapper .published {
  font-size: var(--ma-font-size-md) !important;
  color: rgba(255, 255, 255, 0.95) !important;
  font-style: italic !important;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.7) !important;
  margin-bottom: var(--ma-space-8) !important;
}

/* Cuando NO hay imagen de fondo y el fondo es claro */
:not(.homepage-image-behind-issue)
  + .container-homepage-issue
  .homepage-issue-identifier,
.page-home:not(:has(.homepage-image-behind-issue)) .homepage-issue-identifier {
  color: var(--ma-text-main) !important;
  text-shadow: none !important;
}

:not(.homepage-image-behind-issue)
  + .container-homepage-issue
  .homepage-issue-published,
.page-home:not(:has(.homepage-image-behind-issue)) .homepage-issue-published {
  color: var(--ma-text-muted) !important;
  text-shadow: none !important;
}

/* Portada del Número */
.homepage-issue-cover,
.current_issue_wrapper .cover {
  max-width: 230px !important;
  border-radius: var(--ma-radius-md) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.35) !important;
  border: 2px solid rgba(255, 255, 255, 0.25) !important;
  transition:
    transform var(--ma-transition-smooth),
    box-shadow var(--ma-transition-smooth);
}

.homepage-issue-cover:hover,
.current_issue_wrapper .cover:hover {
  transform: translateY(-4px) scale(1.02);
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.45) !important;
}

/* Descripción del Número */
.homepage-issue-description-wrapper,
.current_issue_wrapper .description {
  background: var(--ma-bg-surface) !important;
  border-radius: var(--ma-radius-lg) !important;
  padding: var(--ma-space-6) var(--ma-space-8) !important;
  border-left: 6px solid var(--ma-primary) !important;
  box-shadow: var(--ma-shadow-lg) !important;
  color: var(--ma-text-main) !important;
}

.homepage-issue-description,
.current_issue_wrapper .description p {
  font-size: var(--ma-font-size-base) !important;
  color: var(--ma-text-main) !important;
  line-height: var(--ma-line-height-relaxed) !important;
}

.homepage-issue-galleys {
  margin-top: var(--ma-space-4);
  padding-top: var(--ma-space-4);
  border-top: 1px solid var(--ma-border-subtle);
}

/* ==============================================================================
   05. SUMARIO DE ARTÍCULOS Y LISTADOS (OJS 3.3 / 3.4 / 3.5)
       (.article-summary, .obj_article_summary, .issue-toc, .sections)
   ============================================================================== */
.issue-toc,
.sections,
.obj_issue_toc {
  margin-top: var(--ma-space-8);
}

.issue-toc .lead,
.sections .section h2,
.sections .section h3 {
  font-family: var(--ma-font-serif);
  font-size: var(--ma-font-size-xl);
  font-weight: 700;
  color: var(--ma-text-main);
  padding-bottom: var(--ma-space-3);
  margin-bottom: var(--ma-space-6);
  border-bottom: 2px solid var(--ma-border-subtle);
  display: flex;
  align-items: center;
  gap: var(--ma-space-3);
}

.issue-toc .lead::before,
.sections .section h2::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 24px;
  background: var(--ma-primary);
  border-radius: var(--ma-radius-xs);
}

/* Tarjeta Individual de Artículo (.article-summary) */
.article-summary,
.obj_article_summary {
  background: var(--ma-bg-surface);
  border: 1px solid var(--ma-border-subtle);
  border-radius: var(--ma-radius-md);
  padding: var(--ma-space-6);
  margin-bottom: var(--ma-space-5);
  box-shadow: var(--ma-shadow-xs);
  transition:
    transform var(--ma-transition-normal),
    box-shadow var(--ma-transition-normal),
    border-color var(--ma-transition-normal);
  position: relative;
  overflow: hidden;
}

.article-summary::before,
.obj_article_summary::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 3px;
  height: 100%;
  background: transparent;
  transition: var(--ma-transition-fast);
}

.article-summary:hover,
.obj_article_summary:hover {
  transform: translateY(-2px);
  box-shadow: var(--ma-shadow-md);
  border-color: var(--ma-border-medium);
}

.article-summary:hover::before,
.obj_article_summary:hover::before {
  background: var(--ma-primary);
}

/* Título del Artículo */
.article-summary-title,
.obj_article_summary .title {
  font-family: var(--ma-font-serif);
  font-size: var(--ma-font-size-lg);
  font-weight: 700;
  line-height: 1.35;
  margin-bottom: var(--ma-space-2);
}

.article-summary-title a,
.obj_article_summary .title a {
  color: var(--ma-text-main);
  transition: var(--ma-transition-fast);
}

.article-summary-title a:hover,
.obj_article_summary .title a:hover {
  color: var(--ma-primary);
}

/* Autores del Artículo */
.article-summary-authors,
.obj_article_summary .authors {
  font-size: var(--ma-font-size-sm);
  color: var(--ma-text-muted);
  font-weight: 500;
  margin-bottom: var(--ma-space-3);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ma-space-1);
}

/* Metadatos (Páginas, Fecha, DOI) */
.article-summary-pages,
.article-summary-doi,
.article-summary-date,
.obj_article_summary .pages,
.obj_article_summary .doi {
  font-size: var(--ma-font-size-xs);
  color: var(--ma-text-light);
  margin-right: var(--ma-space-3);
}

.article-summary-doi a,
.obj_article_summary .doi a {
  color: var(--ma-text-muted);
  font-family: var(--ma-font-mono);
}

.article-summary-doi a:hover,
.obj_article_summary .doi a:hover {
  color: var(--ma-primary);
}

/* ==============================================================================
   06. PÁGINA DETALLE DEL ARTÍCULO (OJS 3.3 / 3.4 / 3.5)
   ============================================================================== */
.page-article,
.page_article {
  padding-top: var(--ma-space-6);
  padding-bottom: var(--ma-space-16);
}

.article-details,
.obj_article_details {
  background: transparent;
}

/* Encabezado Editorial / Metadatos Superiores */
.article-details-issue-identifier,
.obj_article_details .item.issue {
  font-family: var(--ma-font-sans);
  font-size: var(--ma-font-size-sm);
  font-weight: 600;
  color: var(--ma-text-muted);
  margin-bottom: var(--ma-space-2);
}

.article-details-issue-identifier a,
.obj_article_details .item.issue a {
  color: var(--ma-text-muted);
  border-bottom: 1px dashed var(--ma-border-medium);
}

.article-details-issue-identifier a:hover,
.obj_article_details .item.issue a:hover {
  color: var(--ma-primary);
  border-bottom-style: solid;
}

.article-details-issue-section,
.obj_article_details .item.section {
  display: inline-block;
  background: var(--ma-primary-tint);
  color: var(--ma-primary);
  font-size: var(--ma-font-size-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  padding: var(--ma-space-1) var(--ma-space-3);
  border-radius: var(--ma-radius-full);
  margin-bottom: var(--ma-space-3);
}

/* Título Principal del Artículo */
.article-details h1,
.article-details-fulltitle,
.obj_article_details .page_title,
.obj_article_details .title {
  font-family: var(--ma-font-serif);
  font-size: var(--ma-font-size-3xl);
  font-weight: 700;
  line-height: 1.25;
  color: var(--ma-text-main);
  margin-top: var(--ma-space-2);
  margin-bottom: var(--ma-space-6);
  letter-spacing: -0.02em;
}

@media (min-width: 992px) {
  .article-details h1,
  .article-details-fulltitle,
  .obj_article_details .page_title {
    font-size: var(--ma-font-size-4xl);
  }
}

/* Lista de Autores en el Encabezado (Badges / Pills) */
.authors-string,
.obj_article_details .authors {
  list-style: none;
  padding: 0;
  margin: var(--ma-space-4) 0 var(--ma-space-6);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ma-space-2);
}

.authors-string li,
.obj_article_details .authors .author {
  display: inline-flex;
  align-items: center;
  background: var(--ma-bg-surface);
  border: 1px solid var(--ma-border-subtle);
  padding: var(--ma-space-1) var(--ma-space-3);
  border-radius: var(--ma-radius-full);
  box-shadow: var(--ma-shadow-xs);
  font-size: var(--ma-font-size-sm);
  font-weight: 600;
  max-width: 100%;
  box-sizing: border-box;
  transition: var(--ma-transition-fast);
}

.authors-string li:hover,
.obj_article_details .authors .author:hover {
  border-color: var(--ma-primary);
  background-color: var(--ma-primary-light);
}

.authors-string .author-string-href,
.obj_article_details .authors .name {
  color: var(--ma-text-main);
  display: inline-flex;
  align-items: center;
  gap: 2px;
  text-decoration: none;
}

.authors-string .author-string-href:hover,
.obj_article_details .authors .name:hover {
  color: var(--ma-primary);
}

.author-symbol {
  color: var(--ma-primary);
  font-size: 0.75em;
  font-weight: 700;
  margin-left: 2px;
  line-height: 1;
}

/* Iconos ORCID, ROR y Enlaces de Autor */
.orcidImage,
.orcid_icon,
.orcid-icon,
.orcid,
.rorImage {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  vertical-align: middle !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}

.orcidImage {
  width: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  max-height: 16px !important;
  margin-left: 6px !important;
  padding: 0 !important;
  border: none !important;
  text-decoration: none !important;
  transition: transform var(--ma-transition-fast) !important;
}

.orcidImage:hover {
  transform: scale(1.15) !important;
}

.orcidImage img,
.orcidImage svg,
.orcid_icon,
.orcid-icon,
.orcid img,
.orcid svg,
.article-details-author-orcid img,
.article-details-author-orcid svg {
  width: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  height: 16px !important;
  min-height: 16px !important;
  max-height: 16px !important;
  display: block !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* Detalle extendido de autor y enlaces ORCID en biografía */
.article-details-author-orcid {
  margin-top: var(--ma-space-2);
  font-size: var(--ma-font-size-xs);
}

.article-details-author-orcid a {
  display: inline-flex;
  align-items: center;
  gap: var(--ma-space-2);
  color: var(--ma-text-muted);
  font-family: var(--ma-font-mono);
  font-size: var(--ma-font-size-xs);
  word-break: break-all;
  text-decoration: none;
  transition: color var(--ma-transition-fast);
}

.article-details-author-orcid a:hover {
  color: var(--ma-primary);
}

/* DOI y Fecha de Publicación */
.article-details-doi,
.article-details-published,
.obj_article_details .item.doi,
.obj_article_details .item.published {
  font-size: var(--ma-font-size-sm);
  color: var(--ma-text-muted);
  margin-bottom: var(--ma-space-4);
}

.article-details-doi a,
.obj_article_details .item.doi a {
  font-family: var(--ma-font-mono);
  color: var(--ma-text-muted);
  background: var(--ma-bg-alt);
  padding: var(--ma-space-1) var(--ma-space-2);
  border-radius: var(--ma-radius-xs);
  border: 1px solid var(--ma-border-subtle);
}

.article-details-doi a:hover,
.obj_article_details .item.doi a:hover {
  color: var(--ma-primary);
  border-color: var(--ma-primary);
}

/* Cuerpo Principal de la Ficha del Artículo (.article-details-main) */
.article-details-main,
.obj_article_details .main_entry {
  background: var(--ma-bg-surface);
  border-radius: var(--ma-radius-lg);
  border: 1px solid var(--ma-border-subtle);
  box-shadow: var(--ma-shadow-md);
  padding: var(--ma-space-8);
  margin-top: var(--ma-space-6);
}

@media (min-width: 992px) {
  .article-details-main,
  .obj_article_details .main_entry {
    padding: var(--ma-space-10) var(--ma-space-12);
  }
}

/* Bloque del Resumen (Abstract) */
.article-details-abstract,
.obj_article_details .item.abstract {
  background: linear-gradient(135deg, rgba(191, 33, 12, 0.02) 0%, #ffffff 100%);
  border-left: 4px solid var(--ma-primary);
  border-radius: 0 var(--ma-radius-md) var(--ma-radius-md) 0;
  padding: var(--ma-space-6);
  margin-bottom: var(--ma-space-8);
  box-shadow: var(--ma-shadow-xs);
  font-size: var(--ma-font-size-base);
  line-height: var(--ma-line-height-relaxed);
}

.article-details-abstract .article-details-heading,
.obj_article_details .item.abstract .label {
  font-family: var(--ma-font-serif);
  font-size: var(--ma-font-size-xl);
  font-weight: 700;
  color: var(--ma-primary-dark);
  margin-bottom: var(--ma-space-3);
  display: flex;
  align-items: center;
  gap: var(--ma-space-2);
}

/* Palabras Clave (Keywords) */
.article-details-keywords,
.obj_article_details .item.keywords {
  margin-bottom: var(--ma-space-8);
  padding-top: var(--ma-space-4);
  border-top: 1px solid var(--ma-border-subtle);
}

.article-details-keywords .article-details-heading,
.obj_article_details .item.keywords .label {
  font-size: var(--ma-font-size-sm);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ma-text-muted);
  margin-bottom: var(--ma-space-3);
}

.article-details-keywords-value span,
.obj_article_details .item.keywords .value span {
  display: inline-block;
  background: var(--ma-bg-alt);
  color: var(--ma-text-main);
  font-size: var(--ma-font-size-xs);
  font-weight: 600;
  padding: var(--ma-space-1) var(--ma-space-3);
  border-radius: var(--ma-radius-full);
  margin-right: var(--ma-space-2);
  margin-bottom: var(--ma-space-2);
  border: 1px solid var(--ma-border-subtle);
  transition: var(--ma-transition-fast);
}

.article-details-keywords-value span:hover,
.obj_article_details .item.keywords .value span:hover {
  background: var(--ma-primary-light);
  color: var(--ma-primary);
  border-color: rgba(191, 33, 12, 0.2);
}

/* Bloque de Cita ("Cómo citar" / How to Cite) */
.article-details-how-to-cite,
.obj_article_details .item.citation,
.how_to_cite {
  background: var(--ma-bg-surface) !important;
  border: 1px solid var(--ma-border-subtle) !important;
  border-radius: var(--ma-radius-lg) !important;
  padding: var(--ma-space-6) !important;
  margin-bottom: var(--ma-space-8) !important;
  box-shadow: var(--ma-shadow-sm) !important;
}

.article-details-how-to-cite .article-details-heading,
.obj_article_details .item.citation .label {
  font-family: var(--ma-font-serif);
  font-size: var(--ma-font-size-lg) !important;
  font-weight: 700 !important;
  color: var(--ma-text-main) !important;
  margin-top: 0 !important;
  margin-bottom: var(--ma-space-4) !important;
}

/* Caja única de texto de cita (sin bordes dobles) */
.article-details-how-to-cite-citation {
  font-family: var(--ma-font-sans);
  font-size: var(--ma-font-size-sm);
  line-height: var(--ma-line-height-normal);
  color: var(--ma-text-main);
  background: var(--ma-bg-alt) !important;
  padding: var(--ma-space-4) var(--ma-space-5) !important;
  border-radius: var(--ma-radius-md) !important;
  border: 1px solid var(--ma-border-subtle) !important;
  border-left: 4px solid var(--ma-primary) !important;
  margin-bottom: var(--ma-space-4) !important;
  word-break: break-word;
}

/* Reset total de elementos internos de CSL para evitar marcos anidados */
.article-details-how-to-cite .csl-entry,
.article-details-how-to-cite .csl-bib-body,
.article-details-how-to-cite .csl-right-inline,
.article-details-how-to-cite .csl-left-margin,
.csl-entry,
.csl-bib-body {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

/* Botón y Dropdown de Formatos de Cita */
.article-details-how-to-cite .dropdown .btn,
.article-details-how-to-cite button#cslCitationFormatsButton {
  background: var(--ma-bg-surface) !important;
  color: var(--ma-text-main) !important;
  border: 1px solid var(--ma-border-medium) !important;
  border-radius: var(--ma-radius-sm) !important;
  padding: 0.45rem 1rem !important;
  font-size: var(--ma-font-size-xs) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  width: auto !important;
}

.article-details-how-to-cite .dropdown .btn:hover,
.article-details-how-to-cite button#cslCitationFormatsButton:hover {
  background: var(--ma-primary-light) !important;
  border-color: var(--ma-primary) !important;
  color: var(--ma-primary) !important;
}

.article-details-how-to-cite .dropdown-menu {
  background: var(--ma-bg-surface) !important;
  border: 1px solid var(--ma-border-subtle) !important;
  border-radius: var(--ma-radius-md) !important;
  box-shadow: var(--ma-shadow-lg) !important;
  padding: 0.5rem !important;
}

.article-details-how-to-cite .dropdown-item {
  color: var(--ma-text-main) !important;
  font-size: var(--ma-font-size-xs) !important;
  padding: 0.4rem 0.8rem !important;
  border-radius: var(--ma-radius-xs) !important;
  text-align: left !important;
}

.article-details-how-to-cite .dropdown-item:hover {
  background-color: var(--ma-primary-light) !important;
  color: var(--ma-primary) !important;
  text-align: left !important;
}

/* Lista de Referencias Bibliográficas */
.article-details-references,
.obj_article_details .item.references {
  margin-top: var(--ma-space-10);
  padding-top: var(--ma-space-8);
  border-top: 2px solid var(--ma-border-subtle);
}

.article-details-references .article-details-heading,
.obj_article_details .item.references .label {
  font-family: var(--ma-font-serif);
  font-size: var(--ma-font-size-xl);
  font-weight: 700;
  color: var(--ma-text-main);
  margin-bottom: var(--ma-space-6);
}

.article-details-references-value p,
.obj_article_details .item.references .value p {
  font-size: var(--ma-font-size-sm);
  line-height: var(--ma-line-height-normal);
  color: var(--ma-text-main);
  padding-left: var(--ma-space-6);
  text-indent: -1.5rem;
  margin-bottom: var(--ma-space-4);
  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
  padding-bottom: var(--ma-space-3);
}

/* Licencia Creative Commons y Derechos de Autor */
.article-details-license,
.obj_article_details .item.copyright {
  background: var(--ma-bg-alt);
  border: 1px solid var(--ma-border-subtle);
  border-radius: var(--ma-radius-md);
  padding: var(--ma-space-5);
  margin-top: var(--ma-space-8);
  font-size: var(--ma-font-size-xs);
  color: var(--ma-text-muted);
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--ma-space-5);
}

.article-details-license a[rel="license"],
.article-details-license .copyright-image,
.obj_article_details .item.copyright a {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.article-details-license img,
.article-details-license a img,
.obj_article_details .item.copyright img {
  width: auto !important;
  max-width: 120px !important;
  height: auto !important;
  max-height: 38px !important;
  object-fit: contain !important;
  display: block !important;
  flex-shrink: 0 !important;
  border: none !important;
  box-shadow: none !important;
}

.article-details-license p,
.obj_article_details .item.copyright p {
  margin: 0 !important;
  font-size: var(--ma-font-size-xs) !important;
  line-height: var(--ma-line-height-normal) !important;
  color: var(--ma-text-muted) !important;
  flex: 1 1 auto;
}

.article-details-license p + p,
.obj_article_details .item.copyright p + p {
  margin-top: var(--ma-space-1) !important;
}

/* ==============================================================================
   07. BOTONES DE GALERADA (PDF, HTML, XML) Y BOTONES GLOBALES
   ============================================================================== */
.btn,
.galley-link,
.obj_galley_link {
  font-family: var(--ma-font-sans);
  font-size: var(--ma-font-size-sm);
  font-weight: 600;
  padding: var(--ma-space-3) var(--ma-space-5);
  border-radius: var(--ma-radius-sm);
  border: 1px solid transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--ma-space-2);
  cursor: pointer;
  transition: var(--ma-transition-normal);
  text-decoration: none;
  box-shadow: var(--ma-shadow-xs);
}

.btn:hover,
.btn:focus,
.galley-link:hover,
.obj_galley_link:hover {
  transform: translateY(-1px);
  box-shadow: var(--ma-shadow-sm);
}

.btn:active,
.galley-link:active,
.obj_galley_link:active {
  transform: translateY(0);
}

/* Botón Primario */
.btn-primary,
.button.primary {
  background: var(--ma-primary) !important;
  border-color: var(--ma-primary) !important;
  color: var(--ma-text-inverse) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.button.primary:hover {
  background: var(--ma-primary-hover) !important;
  border-color: var(--ma-primary-hover) !important;
  color: var(--ma-text-inverse) !important;
}

/* Botón Secundario / Contorno */
.btn-light,
.btn-secondary,
.button.secondary {
  background: var(--ma-bg-surface);
  border-color: var(--ma-border-medium);
  color: var(--ma-text-main);
}

.btn-light:hover,
.btn-secondary:hover,
.button.secondary:hover {
  background: var(--ma-primary-light);
  border-color: var(--ma-primary);
  color: var(--ma-primary);
}

/* Botones de Descarga de Galeradas (PDF/HTML/XML) */
.article-details-galley .btn,
.article-summary-galleys .btn,
.homepage-issue-galleys .btn,
.obj_galley_link,
.galleys_links .galley_link {
  background: var(--ma-primary) !important;
  color: var(--ma-text-inverse) !important;
  border-radius: var(--ma-radius-full) !important;
  padding: var(--ma-space-2) var(--ma-space-5) !important;
  font-size: var(--ma-font-size-sm) !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
  box-shadow: 0 4px 10px rgba(191, 33, 12, 0.25) !important;
  position: relative;
  overflow: hidden;
}

.article-details-galley .btn:hover,
.article-summary-galleys .btn:hover,
.homepage-issue-galleys .btn:hover,
.obj_galley_link:hover,
.galleys_links .galley_link:hover {
  background: var(--ma-primary-hover) !important;
  box-shadow: 0 6px 15px rgba(191, 33, 12, 0.35) !important;
  transform: translateY(-2px);
}

.article-details-galley .btn::before,
.obj_galley_link::before {
  content: "↓ ";
  font-weight: 800;
  opacity: 0.85;
}

/* ==============================================================================
   08. PÁGINAS DE LOGIN, REGISTRO Y FORMULARIOS (.page-login, .form-login)
   ============================================================================== */
.page-login,
.page_login,
.page-register,
.page_register {
  padding-top: var(--ma-space-8);
  padding-bottom: var(--ma-space-16);
}

.page-login h1,
.page_login h1,
.page-register h1,
.page_register h1 {
  text-align: center;
  font-size: var(--ma-font-size-3xl);
  color: var(--ma-text-main);
  margin-bottom: var(--ma-space-6);
}

.form-login,
.form-register {
  background: var(--ma-bg-surface);
  border: 1px solid var(--ma-border-subtle);
  border-radius: var(--ma-radius-lg);
  box-shadow: var(--ma-shadow-md);
  padding: var(--ma-space-8);
  margin: 0 auto;
  max-width: 520px;
}

.form-login .form-group,
.form-register .form-group {
  margin-bottom: var(--ma-space-4);
}

.form-login label,
.form-register label {
  font-weight: 600;
  font-size: var(--ma-font-size-sm);
  color: var(--ma-text-main);
  margin-bottom: var(--ma-space-1);
  display: block;
}

.form-login .btn-primary,
.form-register .btn-primary {
  width: 100%;
  padding: var(--ma-space-3) var(--ma-space-6);
  font-size: var(--ma-font-size-base);
  font-weight: 700;
  border-radius: var(--ma-radius-full);
  box-shadow: 0 4px 12px rgba(191, 33, 12, 0.25);
  margin-top: var(--ma-space-2);
}

.form-group-register,
.form-group-forgot {
  font-size: var(--ma-font-size-sm);
  text-align: center;
  margin-top: var(--ma-space-4);
}

/* ==============================================================================
   09. BARRA LATERAL (SIDEBAR) Y BLOQUES DE INFORMACIÓN DEL FOOTER (.pkp_block)
   ============================================================================== */
.site-footer-sidebar,
.pkp_structure_sidebar {
  border-bottom: none !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Distribución en 4 columnas perfectamente alineadas para escritorio */
.site-footer-sidebar .row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
}

.site-footer-sidebar .pkp_block {
  flex: 0 0 calc(24% - 12px) !important;
  max-width: calc(24% - 12px) !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  margin-bottom: var(--ma-space-6) !important;
  padding: 0 !important;
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  color: var(--ma-footer-text) !important;
}

/* Limpieza de separadores antiguos dentro del footer */
.site-footer hr,
.site-footer .pkp_block hr {
  display: none !important;
}

/* Encabezados y títulos de bloques en el footer (Tipografía del sitio con tracking elegante) */
.site-footer-sidebar .pkp_block .title,
.site-footer .pkp_block h2,
.site-footer .pkp_block h3,
.site-footer .pkp_block h4,
#customblock-comenta-nuestros-artculos h4 {
  font-family: var(--ma-font-sans) !important;
  font-size: 0.8125rem !important; /* 13px */
  font-weight: 700 !important;
  color: #ffffff !important;
  text-transform: uppercase !important;
  letter-spacing: 0.09em !important;
  margin-top: 0 !important;
  margin-bottom: var(--ma-space-4) !important;
  padding-bottom: 0.45rem !important;
  border-bottom: 2px solid rgba(255, 255, 255, 0.35) !important;
  display: inline-block !important;
  line-height: 1.3 !important;
}

/* Párrafos, textos y enlaces generales del footer */
.site-footer p,
.site-footer .content,
.site-footer-content p,
.site-footer-sidebar .pkp_block p {
  color: rgba(255, 255, 255, 0.88) !important;
  font-family: var(--ma-font-sans) !important;
  font-size: 0.8125rem !important;
  line-height: 1.7 !important;
  margin-bottom: var(--ma-space-3) !important;
}

.site-footer a,
.site-footer-sidebar .pkp_block a,
.site-footer-content a {
  color: rgba(255, 255, 255, 0.88) !important;
  font-family: var(--ma-font-sans) !important;
  font-size: 0.8125rem !important;
  line-height: 1.7 !important;
  text-decoration: none !important;
  transition:
    opacity var(--ma-transition-fast),
    color var(--ma-transition-fast),
    transform var(--ma-transition-fast) !important;
}

.site-footer a:hover,
.site-footer-sidebar .pkp_block a:hover,
.site-footer-content a:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-decoration-color: rgba(255, 255, 255, 0.6) !important;
}

/* Iconos dentro de listas y bloques de autores / ISSN */
.site-footer-sidebar .pkp_block i,
.site-footer-sidebar .pkp_block svg,
.site-footer-sidebar .pkp_block li i,
.site-footer-sidebar .pkp_block li svg,
.site-footer-sidebar .pkp_block p i,
.site-footer-sidebar .pkp_block p svg,
.site-footer-sidebar .pkp_block a i,
.site-footer-sidebar .pkp_block a svg {
  font-size: 1.15rem !important;
  min-width: 18px !important;
  display: inline-block !important;
  margin-right: 8px !important;
  vertical-align: -2px !important;
  opacity: 0.95 !important;
}

/* Listas dentro de bloques (ej: Idiomas, enlaces) */
.site-footer-sidebar .pkp_block ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.site-footer-sidebar .pkp_block ul li {
  margin-bottom: var(--ma-space-2) !important;
}

/* Bloque de Idiomas (.block_language) */
.block_language .content,
#customblock-comenta-nuestros-artculos .content > div {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

.block_language ul li a {
  display: inline-block;
  color: rgba(255, 255, 255, 0.9) !important;
  font-weight: 500;
  padding: 2px 0;
  transition: color var(--ma-transition-fast) !important;
}

.block_language ul li a:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
}

/* Adaptación fluida de videos, iframes y reproductores (ej: YouTube) */
.site-footer iframe,
.site-footer-sidebar iframe,
.site-footer video,
.site-footer embed {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  border: none !important;
  border-radius: var(--ma-radius-md) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.35) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  margin-bottom: var(--ma-space-3) !important;
}

/* Logotipo institucional UV en el footer (Limpio, transparente, sin doble caja) */
.site-footer-sidebar img[src*="logo-revistas"],
.site-footer-sidebar img[src*="revistas"],
.site-footer-sidebar img[src*="valparaiso"],
.site-footer-sidebar
  .pkp_block
  img:not([src*="creativecommons"]):not([src*="88x31"]) {
  max-width: 100% !important;
  max-width: 220px !important;
  height: auto !important;
  display: block;
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin-bottom: var(--ma-space-3) !important;
  transition: transform var(--ma-transition-fast) !important;
}

.site-footer-sidebar img[src*="logo-revistas"]:hover,
.site-footer-sidebar img[src*="revistas"]:hover {
  transform: translateY(-2px);
}

/* Subtítulo SÍGUENOS EN */
.site-footer-sidebar strong {
  font-family: var(--ma-font-sans) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.95) !important;
  display: block !important;
  margin-top: 0.75rem !important;
  margin-bottom: 0.4rem !important;
}

/* Botones de Redes Sociales (Tamaño óptimo, translúcidos y con microinteracción) */
.site-footer-sidebar a:has(i),
.site-footer-sidebar a:has(svg),
.site-footer-sidebar a:has(img[src*="instagram"]),
.site-footer-sidebar a:has(img[src*="facebook"]),
.site-footer-sidebar a:has(img[src*="linkedin"]),
.site-footer-sidebar .social-links a,
#customblock-comenta-nuestros-artculos .content a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: var(--ma-radius-md) !important;
  background: rgba(255, 255, 255, 0.16) !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  color: #ffffff !important;
  font-size: 1.1rem !important;
  margin-right: 8px !important;
  margin-top: 6px !important;
  transition: all var(--ma-transition-fast) !important;
  text-decoration: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15) !important;
}

.site-footer-sidebar a:has(i):hover,
.site-footer-sidebar a:has(svg):hover,
#customblock-comenta-nuestros-artculos .content a:hover {
  background: rgba(255, 255, 255, 0.32) !important;
  border-color: rgba(255, 255, 255, 0.7) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
  color: #ffffff !important;
}

.site-footer-sidebar a:has(i) i,
.site-footer-sidebar a:has(svg) svg,
.site-footer-sidebar .social-links a i,
#customblock-comenta-nuestros-artculos .content a i {
  font-size: 1.1rem !important;
  margin: 0 !important;
}

/* Distintivo de Licencia Creative Commons */
.site-footer-sidebar img[src*="creativecommons"],
.site-footer-sidebar img[alt*="Creative Commons"],
.site-footer-sidebar .pkp_block a img[src*="88x31"] {
  max-width: 88px !important;
  height: auto !important;
  margin: var(--ma-space-2) 0 !important;
  display: block !important;
  border-radius: 3px !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25) !important;
}

/* Botón "Hacer un envío" (.block_make_submission) */
.block_make_submission .block_make_submission_link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--ma-gradient-primary) !important;
  color: var(--ma-text-inverse) !important;
  font-weight: 700;
  font-size: var(--ma-font-size-sm);
  padding: var(--ma-space-3) var(--ma-space-6);
  border-radius: var(--ma-radius-full);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
  text-decoration: none;
  transition: var(--ma-transition-normal);
  border: 1px solid rgba(255, 255, 255, 0.2);
  width: 100%;
  text-align: center;
}

.block_make_submission .block_make_submission_link:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(191, 33, 12, 0.5);
  border-color: rgba(255, 255, 255, 0.4);
}

/* ==============================================================================
   10. PIE DE PÁGINA INSTITUCIONAL (.site-footer, .pkp_structure_footer)
   ============================================================================== */
.site-footer,
.pkp_structure_footer {
  background: linear-gradient(
    160deg,
    #991b0c 0%,
    #7d1407 50%,
    #520b02 100%
  ) !important;
  color: var(--ma-footer-text) !important;
  padding-top: var(--ma-space-12) !important;
  padding-bottom: var(--ma-space-8) !important;
  font-family: var(--ma-font-sans);
  font-size: var(--ma-font-size-sm);
  line-height: var(--ma-line-height-normal);
  border-top: 4px solid var(--ma-primary) !important;
  box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.25) !important;
}

/* Divisor único y elegante en el pie de página */
.site-footer-content {
  padding-top: var(--ma-space-6);
  border-top: 1px solid rgba(255, 255, 255, 0.18) !important;
  margin-top: var(--ma-space-6);
}

.site-footer-content .row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* Imágenes institucionales secundarias (excluyendo el logo de marca OJS) */
.site-footer-content
  img:not(.footer-brand-image):not([src*="ojs_brand"]):not([src*="brand"]) {
  max-width: 180px !important;
  height: auto !important;
  display: inline-block;
  margin-bottom: var(--ma-space-2);
}

/* Logotipo de plataforma OJS / PKP: tamaño discreto, elegante y proporcionado */
.footer-brand-image,
.site-footer-content a[href*="aboutThisPublishingSystem"] img,
.site-footer-content img[src*="ojs_brand"],
.site-footer-content img[src*="brand"],
.pkp_brand_footer img,
.site-footer a.pkp_brand_footer img {
  max-width: 55px !important;
  max-height: 28px !important;
  width: auto !important;
  height: auto !important;
  filter: brightness(0) invert(1) !important;
  opacity: 0.75 !important;
  display: block !important;
  margin-left: auto !important;
  transition:
    opacity var(--ma-transition-fast),
    transform var(--ma-transition-fast) !important;
}

.footer-brand-image:hover,
.site-footer-content a[href*="aboutThisPublishingSystem"] img:hover,
.site-footer-content img[src*="ojs_brand"]:hover,
.pkp_brand_footer img:hover {
  opacity: 1 !important;
  transform: scale(1.06);
}

/* Ajustes de Responsividad del Pie de Página */
@media (min-width: 768px) and (max-width: 991px) {
  .site-footer-sidebar .pkp_block {
    flex: 0 0 calc(48% - 10px) !important;
    max-width: calc(48% - 10px) !important;
    margin-bottom: var(--ma-space-6) !important;
  }
}

@media (max-width: 767px) {
  .site-footer-sidebar .pkp_block {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    margin-bottom: var(--ma-space-6) !important;
  }

  .footer-brand-image,
  .site-footer-content a[href*="aboutThisPublishingSystem"] img,
  .site-footer-content img[src*="ojs_brand"] {
    margin: var(--ma-space-4) auto 0 auto !important;
  }

  .site-footer-content {
    text-align: center !important;
  }
}

/* ==============================================================================
   11. ESTILOS MODERNOS PARA PÁGINAS ESTÁTICAS Y GUÍAS DE AUTORES
       (#ma-container, #ma-indice, details, summary, tablas, badges)
   ============================================================================== */
#ma-container,
#ma-indice,
.ma-content-box {
  background-color: var(--ma-bg-surface);
  border: 1px solid var(--ma-border-subtle);
  border-radius: var(--ma-radius-lg);
  box-shadow: var(--ma-shadow-sm);
  padding: var(--ma-space-8);
  margin-bottom: var(--ma-space-8);
  line-height: var(--ma-line-height-normal);
}

/* Acordeones interactivos (<details> / <summary>) */
details {
  border: 1px solid var(--ma-border-subtle);
  border-radius: var(--ma-radius-md);
  background: var(--ma-bg-surface);
  margin-bottom: var(--ma-space-4);
  overflow: hidden;
  transition:
    box-shadow var(--ma-transition-fast),
    border-color var(--ma-transition-fast);
}

details:hover {
  border-color: var(--ma-border-medium);
  box-shadow: var(--ma-shadow-xs);
}

details[open] {
  border-color: rgba(191, 33, 12, 0.3);
  box-shadow: var(--ma-shadow-sm);
}

summary {
  background-color: var(--ma-bg-surface);
  color: var(--ma-text-main);
  padding: var(--ma-space-4) var(--ma-space-6);
  font-weight: 700;
  cursor: pointer;
  border-left: 6px solid var(--ma-primary);
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  user-select: none;
  transition: background-color var(--ma-transition-fast);
}

summary::-webkit-details-marker {
  display: none;
}

summary:hover {
  background-color: var(--ma-primary-light);
  color: var(--ma-primary);
}

details[open] summary {
  background-color: #fafafa;
  border-bottom: 1px solid var(--ma-border-subtle);
}

/* Tablas científicas */
table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--ma-border-subtle);
  border-radius: var(--ma-radius-md);
  overflow: hidden;
  margin: var(--ma-space-6) 0;
  font-size: var(--ma-font-size-sm);
}

table thead tr {
  background: var(--ma-gradient-primary);
  color: var(--ma-text-inverse);
}

table th {
  padding: var(--ma-space-4);
  text-align: left;
  font-weight: 700;
  letter-spacing: 0.02em;
}

table td {
  padding: var(--ma-space-4);
  border-top: 1px solid var(--ma-border-subtle);
  color: var(--ma-text-main);
}

table tbody tr:nth-child(even) {
  background-color: var(--ma-bg-alt);
}

table tbody tr:hover {
  background-color: var(--ma-primary-light);
}

/* Badges / Pastillas de categorías */
.badge,
.ma-badge {
  display: inline-flex;
  align-items: center;
  font-size: var(--ma-font-size-xs);
  font-weight: 700;
  padding: var(--ma-space-1) var(--ma-space-3);
  border-radius: var(--ma-radius-full);
  letter-spacing: 0.02em;
}

.badge-primary,
.ma-badge-primary {
  background: var(--ma-primary-tint);
  color: var(--ma-primary);
  border: 1px solid rgba(191, 33, 12, 0.2);
}

.badge-secondary,
.ma-badge-secondary {
  background: var(--ma-bg-alt);
  color: var(--ma-text-muted);
  border: 1px solid var(--ma-border-subtle);
}

/* ==============================================================================
   12. FORMULARIOS, BUSCADORES Y BANNERS DE COOKIES/GDPR
   ============================================================================== */
.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
select,
textarea {
  border: 1px solid var(--ma-border-medium);
  border-radius: var(--ma-radius-sm);
  padding: var(--ma-space-3) var(--ma-space-4);
  font-size: var(--ma-font-size-sm);
  color: var(--ma-text-main);
  background-color: var(--ma-bg-surface);
  transition: var(--ma-transition-fast);
}

.form-control:focus,
input:focus,
select:focus,
textarea:focus {
  border-color: var(--ma-primary);
  box-shadow: var(--ma-shadow-glow);
  outline: none;
}

.alert {
  padding: var(--ma-space-4) var(--ma-space-6);
  border-radius: var(--ma-radius-md);
  font-size: var(--ma-font-size-sm);
  margin-bottom: var(--ma-space-5);
  border: 1px solid transparent;
}

.alert-info {
  background-color: #e0f2fe;
  border-color: #bae6fd;
  color: #0369a1;
}

.alert-warning {
  background-color: #fef3c7;
  border-color: #fde68a;
  color: #b45309;
}

.alert-danger {
  background-color: var(--ma-primary-light);
  border-color: #fecdd3;
  color: var(--ma-primary-dark);
}

/* Banner de Consentimiento de Cookies (GDPR) */
.cc-window,
.cc-banner {
  background-color: var(--ma-bg-footer) !important;
  color: var(--ma-text-inverse) !important;
  box-shadow: var(--ma-shadow-xl) !important;
  border-top: 3px solid var(--ma-primary) !important;
}

.cc-btn {
  background-color: var(--ma-primary) !important;
  color: var(--ma-text-inverse) !important;
  border-radius: var(--ma-radius-full) !important;
  font-weight: 700 !important;
  border: none !important;
  transition: var(--ma-transition-fast) !important;
}

.cc-btn:hover {
  background-color: var(--ma-primary-hover) !important;
}

/* ==============================================================================
   13. ADAPTABILIDAD RESPONSIVA Y REGLAS DE IMPRESIÓN (@media print)
   ============================================================================== */
@media (max-width: 991px) {
  /* En móvil, ocultar los menús flotantes exteriores */
  #languageLargeNav,
  #userNav {
    display: none !important;
  }

  /* Cabecera en móvil: Fila única, bloqueada sin saltos */
  .main-header {
    position: relative !important;
    padding: var(--ma-space-2) 0 !important;
  }

  .main-header .container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    position: relative !important;
  }

  /* Logotipo alineado a la izquierda */
  .navbar-logo,
  .pkp_site_name_wrapper,
  .pkp_site_name .is_img {
    flex: 0 1 auto !important;
    max-width: calc(100% - 60px) !important;
    text-align: left !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  .navbar-logo a {
    display: inline-flex !important;
    align-items: center !important;
  }

  .navbar-logo img,
  .pkp_site_name_wrapper img,
  .pkp_site_name .is_img img,
  .img-fluid[src*="pageHeaderLogoImage"] {
    max-height: 42px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain;
  }

  /* Barra navbar en móvil (botón hamburguesa a la derecha en la misma fila) */
  .main-header .navbar {
    position: static !important;
    flex: 0 0 auto !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
  }

  /* Botón hamburguesa sobrio y minimalista */
  .navbar-toggler {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: #ffffff !important;
    border: 1.5px solid var(--ma-border-medium) !important;
    color: var(--ma-text-main) !important;
    padding: 7px 10px !important;
    border-radius: var(--ma-radius-md) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    outline: none !important;
    cursor: pointer !important;
    margin: 0 !important;
    transition: all var(--ma-transition-fast) !important;
  }

  .navbar-toggler:hover,
  .navbar-toggler:focus {
    background-color: var(--ma-bg-alt) !important;
    border-color: var(--ma-primary) !important;
    box-shadow: 0 2px 8px rgba(191, 33, 12, 0.15) !important;
  }

  .navbar-toggler .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%231e293b' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
    width: 20px !important;
    height: 20px !important;
    display: block !important;
  }

  /* Menú desplegable cerrado por defecto */
  #main-navbar.collapse:not(.show) {
    display: none !important;
  }

  /* Menú desplegado: Tarjeta flotante que abarca el 100% del ancho del contenedor */
  #main-navbar.collapse.show,
  #main-navbar.collapsing {
    position: absolute !important;
    top: 100% !important;
    left: 15px !important;
    right: 15px !important;
    width: calc(100% - 30px) !important;
    max-width: calc(100% - 30px) !important;
    box-sizing: border-box !important;
    z-index: 1060 !important;
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 1px solid var(--ma-border-subtle) !important;
    border-radius: var(--ma-radius-lg) !important;
    box-shadow: 0 14px 40px rgba(0, 0, 0, 0.16) !important;
    padding: var(--ma-space-4) !important;
    margin-top: 8px !important;
    margin-bottom: var(--ma-space-4) !important;
  }

  /* LISTA DE ENLACES PRINCIPALES EN MÓVIL */
  #primaryNav {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
  }

  #primaryNav .nav-item {
    width: 100% !important;
    border-bottom: 1px solid var(--ma-border-subtle) !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #primaryNav .nav-item:last-child {
    border-bottom: none !important;
  }

  #primaryNav .nav-link {
    color: var(--ma-text-main) !important;
    font-size: 0.875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    padding: 0.75rem 1rem !important;
    border-radius: var(--ma-radius-md) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    transition: all var(--ma-transition-fast) !important;
    text-decoration: none !important;
  }

  #primaryNav .nav-link:hover,
  #primaryNav .nav-link:focus,
  #primaryNav .nav-link.active {
    background-color: var(--ma-primary-light) !important;
    color: var(--ma-primary) !important;
    padding-left: 1.25rem !important;
  }

  /* SUBMENÚS DESPLEGABLES EN MÓVIL */
  #primaryNav .dropdown-menu,
  #primaryNav .dropdown-menu.show {
    background-color: var(--ma-bg-alt) !important;
    border: 1px solid var(--ma-border-subtle) !important;
    border-radius: var(--ma-radius-md) !important;
    box-shadow: none !important;
    padding: var(--ma-space-2) !important;
    margin: var(--ma-space-1) 0 var(--ma-space-2) 0 !important;
    position: static !important;
    float: none !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
  }

  #primaryNav .dropdown-item {
    color: var(--ma-text-main) !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    padding: 0.55rem 0.85rem !important;
    border-radius: var(--ma-radius-sm) !important;
    background: transparent !important;
    text-align: left !important;
    text-transform: none !important;
    transition: all var(--ma-transition-fast) !important;
  }

  #primaryNav .dropdown-item:hover,
  #primaryNav .dropdown-item:focus {
    background-color: var(--ma-primary) !important;
    color: #ffffff !important;
  }

  /* MENÚ DE USUARIO INTEGRADO EN EL DRAWER MÓVIL */
  #primaryNav-userNav {
    border-top: 1px solid var(--ma-border-subtle) !important;
    margin-top: var(--ma-space-3) !important;
    padding-top: var(--ma-space-3) !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: var(--ma-space-2) !important;
    list-style: none !important;
  }

  #primaryNav-userNav .nav-item {
    width: 100% !important;
    text-align: center !important;
    border: none !important;
  }

  #primaryNav-userNav .nav-link,
  #primaryNav-userNav a {
    background: var(--ma-primary-light) !important;
    color: var(--ma-primary) !important;
    font-weight: 700 !important;
    font-size: 0.8125rem !important;
    border-radius: var(--ma-radius-md) !important;
    padding: 0.6rem 1.25rem !important;
    text-align: center !important;
    display: block !important;
    border: 1px solid rgba(191, 33, 12, 0.2) !important;
    box-shadow: none !important;
    text-decoration: none !important;
    transition: all var(--ma-transition-fast) !important;
  }

  #primaryNav-userNav .nav-link:hover,
  #primaryNav-userNav a:hover {
    background: var(--ma-primary) !important;
    color: #ffffff !important;
  }

  #primaryNav-userNav .dropdown-menu,
  #primaryNav-userNav .dropdown-menu.show {
    position: static !important;
    float: none !important;
    width: 100% !important;
    min-width: 100% !important;
    box-shadow: none !important;
    border: 1px solid var(--ma-border-subtle) !important;
    background-color: var(--ma-bg-surface) !important;
    border-radius: var(--ma-radius-md) !important;
    padding: var(--ma-space-2) !important;
    margin-top: var(--ma-space-2) !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
  }

  #primaryNav-userNav .dropdown-item,
  #primaryNav-userNav .dropdown-menu.show .dropdown-item {
    text-align: center !important;
    display: block !important;
    width: 100% !important;
    padding: 0.55rem 1rem !important;
    font-size: var(--ma-font-size-xs) !important;
    color: var(--ma-text-main) !important;
    background: transparent !important;
    border-radius: var(--ma-radius-sm) !important;
  }

  #primaryNav-userNav .dropdown-item:hover,
  #primaryNav-userNav .dropdown-item:focus {
    background-color: var(--ma-primary-light) !important;
    color: var(--ma-primary) !important;
  }

  /* SELECTOR DE IDIOMAS INTEGRADO EN EL DRAWER MÓVIL */
  #languageSmallNav,
  #main-navbar #languageSmallNav {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    gap: var(--ma-space-2) !important;
    width: 100% !important;
    border-top: 1px solid var(--ma-border-subtle) !important;
    padding-top: var(--ma-space-3) !important;
    margin-top: var(--ma-space-2) !important;
    padding-left: 0 !important;
    list-style: none !important;
  }

  #languageSmallNav .dropdown-menu,
  #languageSmallNav .dropdown-menu.show {
    position: static !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    gap: var(--ma-space-2) !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
    width: auto !important;
  }

  #languageSmallNav .dropdown-item,
  #languageSmallNav a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0.78rem !important;
    font-weight: 600 !important;
    color: var(--ma-text-main) !important;
    background: var(--ma-bg-alt) !important;
    border: 1px solid var(--ma-border-medium) !important;
    border-radius: var(--ma-radius-full) !important;
    padding: 4px 14px !important;
    text-decoration: none !important;
    transition: all var(--ma-transition-fast) !important;
  }

  #languageSmallNav .dropdown-item:hover,
  #languageSmallNav a:hover {
    background: var(--ma-primary-light) !important;
    color: var(--ma-primary) !important;
    border-color: var(--ma-primary) !important;
  }

  .article-details-main,
  .obj_article_details .main_entry {
    padding: var(--ma-space-6);
  }

  .homepage-issue-cover,
  .current_issue_wrapper .cover {
    margin: 0 auto var(--ma-space-4);
  }

  /* Autores y ORCID en móvil: Badges compactos y alineados sin desborde */
  .authors-string,
  .obj_article_details .authors {
    gap: var(--ma-space-2) !important;
    margin-bottom: var(--ma-space-4) !important;
  }

  .authors-string li,
  .obj_article_details .authors .author {
    max-width: 100% !important;
    font-size: var(--ma-font-size-xs) !important;
    padding: 0.35rem 0.75rem !important;
    display: inline-flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
  }

  .authors-string .author-string-href,
  .obj_article_details .authors .name {
    display: inline-flex !important;
    align-items: center !important;
    gap: 2px !important;
    max-width: calc(100% - 24px) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .authors-string .author-string-href span,
  .obj_article_details .authors .name span {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .orcidImage,
  .orcid_icon,
  .orcid-icon,
  .orcid,
  .rorImage {
    flex-shrink: 0 !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    min-height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-left: 6px !important;
    vertical-align: middle !important;
  }

  .orcidImage img,
  .orcidImage svg,
  .orcid_icon,
  .orcid-icon,
  .orcid img,
  .orcid svg {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    min-height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    display: block !important;
    object-fit: contain !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }

  /* Licencia Creative Commons en móvil: Apilada limpia y proporcional */
  .article-details-license,
  .obj_article_details .item.copyright {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: var(--ma-space-3) !important;
    padding: var(--ma-space-4) !important;
  }

  .article-details-license a[rel="license"],
  .article-details-license .copyright-image,
  .obj_article_details .item.copyright a {
    display: inline-flex !important;
    align-items: center !important;
    flex-shrink: 0 !important;
    margin-bottom: var(--ma-space-1) !important;
  }

  .article-details-license img,
  .article-details-license a img,
  .obj_article_details .item.copyright img {
    width: auto !important;
    max-width: 110px !important;
    height: auto !important;
    max-height: 34px !important;
    object-fit: contain !important;
    display: block !important;
    flex-shrink: 0 !important;
    border: none !important;
    box-shadow: none !important;
  }

  .article-details-license p,
  .obj_article_details .item.copyright p {
    width: 100% !important;
    font-size: var(--ma-font-size-xs) !important;
    line-height: 1.55 !important;
    margin: 0 !important;
  }

  .article-details-license p + p,
  .obj_article_details .item.copyright p + p {
    margin-top: var(--ma-space-2) !important;
  }
}

@media print {
  .main-header,
  .pkp_structure_head,
  .site-footer,
  .pkp_structure_footer,
  .site-footer-sidebar,
  .pkp_structure_sidebar,
  .article-details-galleys,
  .homepage-issue-galleys,
  .obj_galley_link,
  .btn,
  #userNav,
  .pkp_navigation_user,
  .language-toggle,
  .cc-window {
    display: none !important;
  }

  body {
    background: #ffffff !important;
    color: #000000 !important;
    font-size: 11pt !important;
  }

  .article-details-main,
  .container-homepage-issue,
  .obj_article_details .main_entry,
  #ma-container {
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
  }

  a {
    color: #000000 !important;
    text-decoration: none !important;
  }

  .article-details-doi a::after {
    content: " (" attr(href) ")";
    font-size: 9pt;
  }
}