/* Mobile viewport hardening for authenticated MIRMC Academia screens. */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

[data-portal-area],
[data-portal-area] > .relative.z-10,
.vi-auth-main,
.vi-auth-main > * {
  min-width: 0;
  max-width: 100%;
}

.vi-auth-main {
  width: 100%;
  overflow-x: clip;
}

/*
 * The mobile drawer sits beside a persistent bottom dock. Keep the drawer above
 * that dock and let its navigation become the only scrollable region so the
 * account/workspace actions at the bottom always remain reachable.
 */
[data-portal-area] > .fixed.inset-0.z-40 {
  z-index: 100 !important;
}

[data-portal-area] > .fixed.inset-0.z-40 > aside {
  max-width: 100vw;
}

[data-portal-area] > .fixed.inset-0.z-40 > aside > .relative.z-10.flex.h-full.flex-col {
  min-height: 0;
}

[data-portal-area] > .fixed.inset-0.z-40 > aside > .relative.z-10.flex.h-full.flex-col > .flex.h-full.flex-col:last-child {
  height: auto !important;
  min-height: 0;
  flex: 1 1 0%;
  overflow: hidden;
}

[data-portal-area] > .fixed.inset-0.z-40 nav.overflow-y-auto {
  min-height: 0;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

[data-portal-area] > .fixed.inset-0.z-40 > aside > .relative.z-10.flex.h-full.flex-col > .flex.h-full.flex-col:last-child > div:last-child {
  flex-shrink: 0;
  padding-bottom: max(0.75rem, env(safe-area-inset-bottom));
}

/* Prevent the student directory rows from forcing the page wider than a phone. */
@media (max-width: 639px) {
  .vi-auth-main a.group[href^="/admin/estudiantes/"] {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    flex-wrap: wrap;
    overflow: hidden;
  }

  .vi-auth-main a.group[href^="/admin/estudiantes/"] > div {
    min-width: 0;
    flex: 1 1 calc(100% - 3.25rem);
  }

  .vi-auth-main a.group[href^="/admin/estudiantes/"] > div p {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .vi-auth-main a.group[href^="/admin/estudiantes/"] > span:last-child {
    width: calc(100% - 3.25rem);
    margin-left: 3.25rem;
    justify-content: flex-start;
    white-space: normal;
  }

  .vi-auth-main a.group[href^="/admin/estudiantes/"] > div span {
    max-width: 100%;
    overflow-wrap: anywhere;
  }
}