/* MORFáR v1.0.2 — corrección de desborde horizontal */

/* Permite que las columnas del bloque de reserva se achiquen dentro
   del ancho disponible, sin empujar toda la página hacia la derecha. */
.reserve,
.reserve > *,
.form,
.student-card,
.reserve-grid{
  min-width:0;
}

/* El desplazamiento horizontal queda limitado al calendario,
   no a toda la página. */
.reserve-grid{
  width:100%;
  max-width:100%;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
}

/* Mantiene los cinco días con el mismo ancho.
   La tabla puede ser más ancha, pero se desplaza sólo dentro de su caja. */
.reserve-grid table{
  width:1120px;
  min-width:1120px;
  max-width:none;
  table-layout:fixed;
}

/* Columna Semana fija y cinco días iguales. */
.reserve-grid th:first-child,
.reserve-grid td:first-child{
  width:145px;
}

.reserve-grid th:not(:first-child),
.reserve-grid td:not(:first-child){
  width:185px;
}

/* Evita que cualquier contenido genere desplazamiento en toda la web. */
html,
body{
  max-width:100%;
  overflow-x:hidden;
}

/* En pantallas amplias, el formulario aprovecha correctamente su espacio. */
@media(min-width:901px){
  .reserve{
    grid-template-columns:minmax(230px,.72fr) minmax(0,2.28fr);
    align-items:start;
  }
}

/* En tablet y celular, el resumen pasa arriba y el calendario
   conserva su desplazamiento interno. */
@media(max-width:900px){
  .reserve{
    grid-template-columns:minmax(0,1fr);
  }

  .reserve-grid table{
    width:1080px;
    min-width:1080px;
  }
}
