/* Un eje de lectura para todas las plantillas del portal. */
body.portal {
  --rp-ancho-contenido: var(--ancho-max, 80rem);
}

body.portal .disposicion--simple {
  box-sizing: border-box;
  width: min(calc(100% - 2rem), var(--rp-ancho-contenido));
  max-width: var(--rp-ancho-contenido);
  margin-inline: auto;
  padding: 0;
}

body.portal .disposicion--simple > main { min-width: 0; }

body.portal .ficha,
body.portal .industria-ficha,
body.portal .guia-comercial,
body.portal .ferias-pagina,
body.portal .busqueda-pagina {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--rp-ancho-contenido);
  min-width: 0;
  margin-inline: auto;
}

body.portal .guia-comercial { padding-inline: 0; }
body.portal .ferias-pagina { padding-inline: 0; }
body.portal .busqueda-pagina { padding-inline: 0; }

/* El hero, los capítulos, las fuentes y los enlaces relacionados comparten
   el mismo borde. La medida de lectura se aplica a los párrafos, no a toda
   la columna, para evitar una gran franja vacía en pantallas anchas. */
body.portal .ficha-cuerpo,
body.portal .ficha-tags,
body.portal .ficha-fuentes,
body.portal .ficha > .relaciones,
body.portal .ficha > .vecinas,
body.portal .industria-ficha > .ficha-cuerpo,
body.portal .industria-ficha > .ficha-fuentes,
body.portal .industria-ficha > .relaciones {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

body.portal .ficha-cuerpo :is(p, li, dd, dt) { max-width: 78ch; }
body.portal .ficha-cuerpo .tabla-wrap { max-width: 100%; }

body.portal .disposicion--simple > main > .metodo-bloque,
body.portal .disposicion--simple > main > .fuentes-bloque,
body.portal .disposicion--simple > main > .filtros,
body.portal .disposicion--simple > main > .tarjetas-grilla,
body.portal .disposicion--simple > main > .hub-vacio,
body.portal .disposicion--simple > main > .temas-lista {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin-inline: 0;
}

/* La fotografía relevante aparece en el primer bloque de resultados y los
   resultados filtrados se retiran del flujo accesible y visual. */
body.portal .resultado[hidden],
body.portal .resultados-filtros[hidden],
body.portal .resultados-filtros-vacio[hidden],
body.portal .resultados-filtros-limpiar[hidden] { display: none; }

/* Los filtros solo funcionan con JavaScript. Su espacio aparece desde el
   primer render cuando el marcador se ejecuta, evitando desplazar resultados. */
html:not(.con-js) body.portal .resultados-filtros { display: none; }

body.portal .resultados-filtros {
  display: grid;
  grid-template-columns: auto minmax(12rem, .8fr) minmax(14rem, 1fr) auto;
  gap: .7rem 1rem;
  align-items: end;
  margin: 0 0 1.15rem;
  padding: .85rem 1rem;
  border: 1px solid var(--linea);
  border-radius: .9rem;
  background: var(--papel-2);
}

body.portal .resultados-filtros-titulo {
  align-self: center;
  color: var(--tinta);
  font-size: .86rem;
  font-weight: 650;
}

body.portal .resultados-filtros label {
  display: grid;
  gap: .28rem;
  min-width: 0;
  color: var(--tinta-2);
  font-size: .73rem;
  font-weight: 600;
}

body.portal .resultados-filtros select {
  width: 100%;
  min-height: 2.65rem;
  padding: .45rem 2rem .45rem .65rem;
  border: 1px solid var(--linea-fuerte);
  border-radius: .55rem;
  color: var(--tinta);
  background: var(--papel-alto);
  font: inherit;
  font-size: .82rem;
}

body.portal .resultados-filtros-limpiar {
  min-height: 2.65rem;
  padding: .45rem .75rem;
  border: 1px solid var(--linea-fuerte);
  border-radius: .55rem;
  color: var(--marca-profundo);
  background: transparent;
  font: 600 .78rem var(--fuente-texto);
  cursor: pointer;
}

body.portal .resultados-filtros-limpiar:hover,
body.portal .resultados-filtros-limpiar:focus-visible {
  border-color: var(--marca-profundo);
  background: var(--papel-alto);
}

body.portal .resultados-filtros select:focus-visible,
body.portal .resultados-filtros-limpiar:focus-visible {
  outline: 3px solid rgba(150,85,0,.38);
  outline-offset: 2px;
}

body.portal .resultados-filtros-vacio {
  margin: 0 0 1rem;
  padding: 1rem;
  border: 1px solid var(--linea);
  border-radius: .8rem;
  color: var(--tinta-2);
  background: var(--papel-alto);
}

body.portal .feria-ticket-estado {
  display: table;
  width: fit-content;
  max-width: 100%;
  margin-top: .38rem;
  padding: .2rem .4rem;
  border-radius: 999px;
  font: 600 .62rem/1.35 var(--fuente-mono);
}

body.portal .feria-ticket-estado--publicada {
  color: #345a31;
  background: #e9f0df;
}

body.portal .feria-ticket-estado--pendiente {
  color: var(--marca-profundo);
  background: var(--marca-suave);
}

@media (max-width: 52rem) {
  body.portal .disposicion--simple {
    width: calc(100% - 2rem);
    padding: 0;
  }

  body.portal .ficha,
  body.portal .industria-ficha { width: 100%; }

  body.portal .ficha-cuerpo,
  body.portal .ficha-tags,
  body.portal .ficha-fuentes,
  body.portal .ficha > .relaciones,
  body.portal .ficha > .vecinas,
  body.portal .industria-ficha > .ficha-cuerpo,
  body.portal .industria-ficha > .ficha-fuentes,
  body.portal .industria-ficha > .relaciones,
  body.portal .disposicion--simple > main > .pagina-cabecera,
  body.portal .disposicion--simple > main > .metodo-bloque,
  body.portal .disposicion--simple > main > .fuentes-bloque,
  body.portal .disposicion--simple > main > .filtros,
  body.portal .disposicion--simple > main > .tarjetas-grilla,
  body.portal .disposicion--simple > main > .hub-vacio,
  body.portal .disposicion--simple > main > .temas-lista,
  body.portal .busqueda-pagina {
    width: 100%;
    max-width: none;
    margin-inline: 0;
  }

  body.portal .ficha-cuerpo { font-size: 1rem; }

  body.portal .resultados-filtros {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
  }

  body.portal .resultados-filtros-titulo { grid-column: 1 / -1; }
}

@media (max-width: 38rem) {
  body.portal .resultados-filtros { grid-template-columns: 1fr; padding: .8rem; }
  body.portal .resultados-filtros-titulo { grid-column: auto; }
  body.portal .resultados-filtros-limpiar { width: 100%; }

  body.portal .resultado--principal {
    grid-template-columns: 6.6rem minmax(0, 1fr);
    gap: .75rem;
    padding: .55rem;
  }

  body.portal .resultado--principal .resultado-imagen {
    min-height: 8.4rem;
    aspect-ratio: auto;
  }

  body.portal .resultado--principal .resultado-contenido { padding: .12rem .1rem .15rem 0; }
  body.portal .resultado--principal .resultado-seccion { margin-bottom: .28rem; font-size: .68rem; }
  body.portal .resultado--principal .resultado-detalle { margin-bottom: .28rem; font-size: .76rem; }
  body.portal .resultado--principal h2 { max-width: none; margin-bottom: .35rem; font-size: 1.04rem; line-height: 1.13; }
  body.portal .resultado--principal .resultado-resumen { font-size: .82rem; line-height: 1.45; -webkit-line-clamp: 2; }
  body.portal .resultado--principal .resultado-abrir { margin-top: auto; padding-top: .4rem; font-size: .78rem; }
}