/* ==========================================================
   Justicia(s) — Cabecera en estilo Editorial UNO
   OJS 3.4.0.5 · tema Novelty
   Colores: vino #470909 · vino claro #5A1313 · oro #C9A227
            tinta #1E1A1A · crema #F4EFEA
   ========================================================== */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700&display=swap');

/* ---------- Banda de la cabecera (todo el ancho) ---------- */
header#headerNavigationContainer.navbar {
  background: #470909;
  border: 0;
  border-radius: 0;
  margin-bottom: 28px;
  min-height: 0;
  font-family: 'Montserrat', sans-serif;
}
#headerNavigationContainer > .container:first-child {
  padding-top: 26px; padding-bottom: 22px;
  background: transparent; border: 0; box-shadow: none; /* taste-skill-ignore: quita la sombra del tema */
}
#headerNavigationContainer > .container:first-child > .row { display: flex; align-items: center; flex-wrap: wrap; }

/* ---------- Logo ---------- */
#headerNavigationContainer .journal_logo .navbar-brand {
  float: none; display: inline-block; height: auto; padding: 0; margin: 0;
}
#headerNavigationContainer .journal_logo .navbar-brand img {
  max-height: 116px; width: auto; max-width: 100%;
}

/* ---------- ISSN (arriba a la derecha) ---------- */
#headerNavigationContainer .issn,
#headerNavigationContainer .issn a,
#headerNavigationContainer span.issn {
  color: #F4EFEA; font-family: 'Montserrat', sans-serif;
  font-size: 13px; font-weight: 500; text-align: right; letter-spacing: 0;
  text-decoration: none; text-transform: none;
}
#headerNavigationContainer .issn a:hover span.issn { color: #C9A227; }

/* ---------- Barra del menú (vino claro, extendida a todo el ancho) ---------- */
#headerNavigationContainer .container.main_menu {
  background: #5A1313;
  border: 0; border-radius: 0;
  /* dos copias de la barra a cada lado: la extienden a todo el ancho sin ensanchar la página */
  box-shadow: -50vw 0 0 0 #5A1313, 50vw 0 0 0 #5A1313; /* taste-skill-ignore: relleno sólido sin difuminado, extiende la barra */
  position: relative; z-index: 50;
}
#headerNavigationContainer #main-navigation > li > a {
  color: #F4EFEA; background: transparent;
  font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 600;
  padding: 17px 16px; position: relative;
  transition: color .2s ease;
}
/* Menú de enlaces simples: sin iconos delante (se conserva la flecha de "Acerca de") */
#headerNavigationContainer #main-navigation > li > a > .fa { display: none; }
#headerNavigationContainer #main-navigation > li > a::after {
  content: ""; position: absolute; left: 16px; bottom: 9px;
  width: 0; height: 4px; background: #C9A227; transition: width .25s ease;
}
#headerNavigationContainer #main-navigation > li > a:hover,
#headerNavigationContainer #main-navigation > li > a:focus,
#headerNavigationContainer #main-navigation > li.open > a {
  color: #FFFFFF; background: transparent;
}
#headerNavigationContainer #main-navigation > li > a:hover::after,
#headerNavigationContainer #main-navigation > li > a:focus::after,
#headerNavigationContainer #main-navigation > li.open > a::after { width: 28px; }

/* ---------- Registrarse (enlace) y Entrar (botón dorado) ----------
   El tema decide al cargar: en pantallas de más de 760 px quedan en la lista
   #navigationUser, arriba a la derecha; en teléfonos los mete en el menú. */
#headerNavigationContainer #navigationUser {
  display: flex; align-items: center; gap: 24px; float: none; margin: 0; padding: 0;
}
#headerNavigationContainer #navigationUser::before,
#headerNavigationContainer #navigationUser::after { display: none; }
#headerNavigationContainer #navigationUser > li { float: none; margin: 0; }
#headerNavigationContainer #navigationUser > li > a .fa { display: none; }
#headerNavigationContainer #navigationUser > li > a,
#headerNavigationContainer #main-navigation > li > a[href$="/user/register"],
#headerNavigationContainer #main-navigation > li > a[href$="/login"] {
  font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 600;
  line-height: 20px; border-radius: 0;
  transition: color .2s ease, background-color .2s ease;
}
#headerNavigationContainer #navigationUser > li > a[href$="/user/register"] {
  color: #F4EFEA; background: transparent; padding: 10px 0;
  text-decoration: underline; text-decoration-color: rgba(201, 162, 39, .8);
  text-decoration-thickness: 2px; text-underline-offset: 6px;
}
#headerNavigationContainer #navigationUser > li > a[href$="/user/register"]:hover,
#headerNavigationContainer #navigationUser > li > a[href$="/user/register"]:focus { color: #C9A227; background: transparent; }
#headerNavigationContainer #navigationUser > li > a[href$="/login"],
#headerNavigationContainer #main-navigation > li > a[href$="/login"] {
  background: #C9A227; color: #1E1A1A; width: 112px; text-align: center; padding: 10px 0;
}
#headerNavigationContainer #navigationUser > li > a[href$="/login"]:hover,
#headerNavigationContainer #navigationUser > li > a[href$="/login"]:focus,
#headerNavigationContainer #main-navigation > li > a[href$="/login"]:hover,
#headerNavigationContainer #main-navigation > li > a[href$="/login"]:focus { background: #DDB53A; color: #1E1A1A; }
#headerNavigationContainer #main-navigation > li > a[href$="/login"]::after { display: none; }
#headerNavigationContainer #navigationUser > li > a:focus-visible { outline: 2px solid #F4EFEA; outline-offset: 3px; }

@media (min-width: 768px) {
  /* Logo, menú, botones, ISSN y Buscar sobre dos bordes comunes */
  #headerNavigationContainer #nav-menu { padding-left: 10px; padding-right: 10px; }
  #headerNavigationContainer #main-navigation { margin-left: 0; }
  #headerNavigationContainer #main-navigation > li:first-child > a { padding-left: 0; }
  #headerNavigationContainer #main-navigation > li:first-child > a::after { left: 0; }
  #headerNavigationContainer .pull-md-right .navbar-form { margin-right: 0; }
  #headerNavigationContainer > .container:first-child > .row { align-items: stretch; }
  #headerNavigationContainer .col-md-7 {
    display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-end; padding-top: 4px;
  }
  #headerNavigationContainer .col-md-7 > nav { display: flex; justify-content: flex-end; padding: 0; }
  #headerNavigationContainer div.issn { margin-top: 14px; padding-right: 0; }

  /* Si la página se abrió en una pantalla angosta y luego se ensanchó,
     los dos enlaces siguen en el menú: se suben a la altura del logo. */
  #headerNavigationContainer #main-navigation > li:has(> a[href$="/user/register"]),
  #headerNavigationContainer #main-navigation > li:has(> a[href$="/login"]) {
    position: absolute; bottom: calc(100% + 22px); float: none;
  }
  #headerNavigationContainer #main-navigation > li:has(> a[href$="/login"]) { right: 15px; }
  #headerNavigationContainer #main-navigation > li:has(> a[href$="/user/register"]) { right: 151px; }
  #headerNavigationContainer #main-navigation > li > a[href$="/user/register"] {
    padding: 10px 0; color: #F4EFEA;
    text-decoration: underline; text-decoration-color: rgba(201, 162, 39, .8);
    text-decoration-thickness: 2px; text-underline-offset: 6px;
  }
  #headerNavigationContainer #main-navigation > li > a[href$="/user/register"]::after { display: none; }
  #headerNavigationContainer #main-navigation > li > a[href$="/user/register"]:hover { color: #C9A227; }
}

/* Submenú "Acerca de" */
#headerNavigationContainer #main-navigation .dropdown-menu {
  background: #FFFFFF; border: 0; border-radius: 0; padding: 8px 0;
  box-shadow: 0 10px 28px rgba(30, 26, 26, .18); z-index: 1000; /* taste-skill-ignore: el submenú flota */
}
#headerNavigationContainer #main-navigation .dropdown-menu > li > a {
  color: #1E1A1A; font-family: 'Montserrat', sans-serif; font-size: 14px; font-weight: 500;
  padding: 9px 20px; background: transparent;
}
#headerNavigationContainer #main-navigation .dropdown-menu > li > a:hover,
#headerNavigationContainer #main-navigation .dropdown-menu > li > a:focus {
  background: #F4EFEA; color: #470909;
}

/* Buscar compacto */
#headerNavigationContainer .navbar-form { border: 0; box-shadow: none; margin: 9px 0; padding: 0; display: flex; } /* taste-skill-ignore: quita la sombra del tema */
#headerNavigationContainer .navbar-form .form-group { margin: 0; }
#headerNavigationContainer .navbar-form .form-control {
  height: 34px; width: 170px; border: 0; border-radius: 0; box-shadow: none; /* taste-skill-ignore: quita la sombra del tema */
  background: rgba(244, 239, 234, .12); color: #FFFFFF;
  font-family: 'Montserrat', sans-serif; font-size: 13px;
}
#headerNavigationContainer .navbar-form .form-control::placeholder { color: rgba(244, 239, 234, .7); }
#headerNavigationContainer .navbar-form .form-control:focus { background: rgba(244, 239, 234, .2); outline: 2px solid #C9A227; outline-offset: 0; }
#headerNavigationContainer .navbar-form .btn {
  height: 34px; border: 0; border-radius: 0; background: #C9A227; color: #1E1A1A;
  font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 600; padding: 0 14px;
  box-shadow: none; /* taste-skill-ignore: quita la sombra del tema */
}
#headerNavigationContainer .navbar-form .btn:hover { background: #DDB53A; }

/* ---------- Tableta y teléfono ---------- */
#headerNavigationContainer .navbar-toggle { border: 0; border-radius: 0; background: transparent; margin: 8px 0; }
#headerNavigationContainer .navbar-toggle .icon-bar { background: #F4EFEA; width: 24px; height: 3px; border-radius: 0; }
#headerNavigationContainer .navbar-toggle:hover,
#headerNavigationContainer .navbar-toggle:focus { background: rgba(244, 239, 234, .1); }

@media (max-width: 991px) {
  #headerNavigationContainer > .container:first-child { padding-top: 20px; padding-bottom: 16px; }
  #headerNavigationContainer .journal_logo { text-align: left; }
  #headerNavigationContainer .journal_logo .navbar-brand img { max-height: 92px; }
  #headerNavigationContainer div.issn { display: block; padding-left: 0; padding-right: 0; margin-top: 10px; }
  #headerNavigationContainer div.issn a { display: inline-block; }
}
/* Tableta: el bloque de la derecha ocupa el resto de la fila para que Registrarse, Entrar e ISSN vayan al borde */
@media (min-width: 768px) {
  #headerNavigationContainer .col-md-7 { flex: 1 1 auto; }
  #headerNavigationContainer .issn, #headerNavigationContainer span.issn { text-align: right; }
}
@media (max-width: 767px) {
  #headerNavigationContainer .journal_logo .navbar-brand img { max-height: 72px; }
  #headerNavigationContainer .issn, #headerNavigationContainer span.issn { text-align: left; }
  /* Menú desplegable alineado con el logo, sin salirse de la pantalla */
  #headerNavigationContainer .container.main_menu { padding-left: 15px; padding-right: 15px; }
  #headerNavigationContainer .container.main_menu > .navbar-header { margin-left: 0; margin-right: 0; }
  #headerNavigationContainer .container.main_menu > #nav-menu {
    margin-left: 0; margin-right: 0;
    padding-left: 0 !important; padding-right: 0 !important; /* el tema fija esta sangría con !important */
  }
  #headerNavigationContainer .navbar-toggle { margin-right: 0; }
  #headerNavigationContainer #main-navigation { margin: 0 0 6px; }
  #headerNavigationContainer #main-navigation > li > a { padding: 11px 0; }
  #headerNavigationContainer #main-navigation > li > a::after { display: none; }
  #headerNavigationContainer #main-navigation > li > a[href$="/login"] { display: inline-block; margin: 8px 0 6px; padding: 10px 0; }
  #headerNavigationContainer .navbar-collapse { border: 0; box-shadow: none; } /* taste-skill-ignore: quita la sombra del tema */
  #headerNavigationContainer .navbar-form { padding: 0 0 16px; margin: 0; }
  #headerNavigationContainer .navbar-form .form-group { flex: 1; }
  #headerNavigationContainer .navbar-form .form-control { width: 100%; }
  #headerNavigationContainer #main-navigation .dropdown-menu { background: transparent; box-shadow: none; } /* taste-skill-ignore: quita la sombra del tema */
  #headerNavigationContainer #main-navigation .dropdown-menu > li > a { color: #F4EFEA; padding-left: 16px; }
  #headerNavigationContainer #main-navigation .dropdown-menu > li > a:hover { background: transparent; color: #C9A227; }
}

/* ==========================================================
   Pie de página (HTML en Configuración → Sitio web → Aspecto → Pie de página)
   ========================================================== */
footer.footer { background: #470909; padding: 0; margin-top: 56px; }
footer.footer > .container {
  background: transparent; border: 0; box-shadow: none; padding: 0 15px; /* taste-skill-ignore: quita la sombra del tema */
}
footer.footer > .container > .row { margin-left: 0; margin-right: 0; }
footer.footer > .container > .row > .col-md-12 { padding-left: 0; padding-right: 0; }
footer.footer #footer { background: transparent !important; padding: 0; } /* el pie anterior traía el color en línea */
footer.footer #footer > .container-fluid { padding: 0; }

.jx-pie {
  display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 56px; row-gap: 40px; padding: 56px 0 36px;
  font-family: 'Montserrat', sans-serif; font-size: 15px; line-height: 1.6; color: #F4EFEA;
}
.jx-pie .jx-pie__logo { display: block; width: 100%; max-width: 280px; height: auto; }
.jx-pie .jx-pie__issn { margin: 16px 0 0; font-size: 14px; }
.jx-pie .jx-pie__h {
  margin: 0 0 14px; font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 600;
  line-height: 1.3; color: #C9A227; text-transform: none; letter-spacing: 0;
}
.jx-pie address, .jx-pie p { margin: 0 0 6px; font-style: normal; color: #F4EFEA; }
.jx-pie a { color: #F4EFEA; text-decoration: underline; text-decoration-color: rgba(201, 162, 39, .7); text-underline-offset: 4px; }
.jx-pie a:hover, .jx-pie a:focus { color: #C9A227; }
.jx-pie a:focus-visible { outline: 2px solid #F4EFEA; outline-offset: 3px; }
.jx-pie .jx-pie__legal {
  grid-column: 1 / -1; display: flex; align-items: center; gap: 20px;
  padding-top: 24px; font-size: 13px; color: rgba(244, 239, 234, .82);
}
.jx-pie .jx-pie__legal p { margin: 0; max-width: 760px; color: inherit; }
.jx-pie .jx-pie__cc { flex: none; line-height: 0; }
.jx-pie .jx-pie__cc img { display: block; }

@media (max-width: 991px) {
  .jx-pie { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 40px; }
  .jx-pie .jx-pie__marca { grid-column: 1 / -1; }
  .jx-pie .jx-pie__logo { max-width: 240px; }
}
@media (max-width: 600px) {
  .jx-pie { grid-template-columns: minmax(0, 1fr); row-gap: 32px; padding: 40px 0 28px; }
  .jx-pie .jx-pie__logo { max-width: 200px; }
  .jx-pie .jx-pie__legal { flex-direction: column; align-items: flex-start; gap: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  #headerNavigationContainer #main-navigation > li > a,
  #headerNavigationContainer #main-navigation > li > a::after { transition-duration: .01ms; }
}
