/* Public shared layout utilities (aplica sólo a vistas públicas que lo incluyan) */

:root {
  --nav-offset: 0px;
  --page-max-w-md: 90%;
  --page-max-w-lg: 80%;
}

/* Scroll funcional con barras ocultas */
html, body {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: none;      /* Firefox */
  -ms-overflow-style: none;   /* IE/Edge (legado) */
}
html::-webkit-scrollbar,
body::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

/* Contenedor fluido y centrado */
.page-wrap {
  width: 100%;
  margin-inline: auto;
  padding-inline: 12px;
  box-sizing: border-box;
}
@media (min-width: 768px)  { .page-wrap { width: var(--page-max-w-md, 90%); } }
@media (min-width: 1200px) { .page-wrap { width: var(--page-max-w-lg, 80%); } }

/* Evitar scroll interno que bloquee el global */
.container-fluid {
  padding-left: 0;
  padding-right: 0;
  max-height: none !important;
  overflow: visible !important;
}

/* Tarjeta pública estandarizada */
.card-public {
  border-radius: 12px;
  border: 1px solid #e9ecef;
  box-shadow: 0 8px 30px rgba(0,0,0,.06);
  background: #fff;
}

/* Título de sección común (Mediumish-like) */
.section-title h2 span {
  background: linear-gradient(transparent 60%, #e7f1ff 0);
  padding: 0 .25rem;
  border-radius: 6px;
}

/* Utilidades de espaciado vertical ligeras */
.vspace-sm { margin-top: .25rem; margin-bottom: .25rem; }
.vspace-md { margin-top: .5rem;  margin-bottom: .5rem; }
.vspace-lg { margin-top: 1rem;   margin-bottom: 1rem; }

/* Espaciado de headings dentro de page-wrap */
.page-wrap h2 { margin: 0 0 .75rem 0; font-weight: 700; }
.page-wrap h3 { margin: 0 0 .5rem 0;  font-weight: 600; }

/* Accesibilidad: minimizar movimiento si el usuario lo prefiere */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Variante compacta opcional (sólo móviles): reduce paddings/márgenes sutilmente */
@media (max-width: 576px) {
  .page-compact .card-body { padding: clamp(12px, 1.2vw, 18px) !important; }
  .page-compact .btn { padding: .5rem .9rem !important; }
  .page-compact .section-title h2 span { padding: 0 .2rem; }
  .page-compact .page-wrap { padding-inline: 10px; }
  .page-compact h2 { margin-bottom: .5rem; }
  .page-compact h3 { margin-bottom: .4rem; }
}
