/**
 * Estilos de la pantalla genérica "función en construcción"
 * (assets/js/vistaEnConstruccion.js). Reutiliza variables de app.css, no
 * las redefine.
 */
/*
 * Ocupa el alto disponible de la vista para centrar la imagen vertical y
 * horizontalmente, sin generar una barra de scroll nueva: --head-h es el alto
 * de la barra superior (.eg-head, igual que .pagos-barra-sticky) y 54px
 * aproxima el padding vertical de .eg-body (14px arriba + 40px abajo,
 * app.css) — con eso el bloque llena el viewport visible sin desbordarlo.
 */
.en-construccion {
  display: flex; align-items: center; justify-content: center;
  text-align: center; padding: 40px 20px; box-sizing: border-box;
  min-height: calc(100vh - var(--head-h) - 54px);
}
/*
 * La imagen trae su propio texto — max-width más grande que antes para que
 * se lea bien. object-fit: contain preserva su proporción tanto si el
 * límite que manda es el ancho (max-width) como si es el alto
 * (max-height, para no desbordar el viewport verticalmente) — nunca se
 * deforma. Borde redondeado + sombra ligera, coherentes con las demás
 * tarjetas de la app (mismas variables --radius/--shadow de app.css).
 */
.en-construccion-img {
  width: 100%;
  max-width: min(1100px, 92%);
  max-height: calc(100vh - var(--head-h) - 54px - 40px);
  object-fit: contain;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}