/*
 * ACMK - Area do Aluno / Aulas Online
 * Estabilidade de viewport em celulares (V87)
 * Evita zoom automatico ao focar campos e deslocamento lateral da pagina.
 */

@media (max-width: 700px) {
  html {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    overscroll-behavior-x: none;
  }

  body.portal-modelo1,
  body.portal-modelo1-login,
  body.portal-aulas-online-page {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    touch-action: manipulation;
  }

  body.portal-modelo1 *,
  body.portal-modelo1-login *,
  body.portal-aulas-online-page * {
    min-width: 0;
  }

  /* iOS aumenta automaticamente a pagina quando um campo tem fonte < 16px. */
  body.portal-modelo1 input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  body.portal-modelo1 select,
  body.portal-modelo1 textarea,
  body.portal-modelo1-login input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  body.portal-modelo1-login select,
  body.portal-modelo1-login textarea,
  body.portal-aulas-online-page input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  body.portal-aulas-online-page select,
  body.portal-aulas-online-page textarea {
    font-size: 16px !important;
  }

  /* Nenhum container principal pode alargar o viewport. */
  body.portal-modelo1 .shell,
  body.portal-modelo1 .portal-model-one-shell,
  body.portal-modelo1 .portal-app-main,
  body.portal-modelo1 .top,
  body.portal-modelo1 .top-inner,
  body.portal-modelo1 .wrap,
  body.portal-modelo1 .layout,
  body.portal-modelo1 .content-column,
  body.portal-modelo1 .card,
  body.portal-modelo1 .section-block,
  body.portal-modelo1-login .auth,
  body.portal-modelo1-login .auth-shell,
  body.portal-modelo1-login .auth-panel,
  body.portal-modelo1-login .auth-panel-inner,
  body.portal-aulas-online-page .shell,
  body.portal-aulas-online-page .portal-model-one-shell,
  body.portal-aulas-online-page .portal-app-main,
  body.portal-aulas-online-page .top,
  body.portal-aulas-online-page .top-inner,
  body.portal-aulas-online-page .wrap,
  body.portal-aulas-online-page .layout,
  body.portal-aulas-online-page .content-column,
  body.portal-aulas-online-page .card,
  body.portal-aulas-online-page .section-block {
    width: 100%;
    max-width: 100%;
  }

  img,
  video,
  canvas,
  iframe,
  svg {
    max-width: 100%;
  }

  /* Modais sempre cabem na largura real do aparelho. */
  body.portal-modelo1 .pay-dialog,
  body.portal-modelo1 .profile-required-dialog,
  body.portal-modelo1 .portal-ai-panel,
  body.portal-aulas-online-page .pay-dialog,
  body.portal-aulas-online-page .portal-ai-panel {
    max-width: calc(100dvw - 12px) !important;
  }

  /* Campos e botoes nao empurram a pagina para os lados. */
  body.portal-modelo1 form,
  body.portal-modelo1 fieldset,
  body.portal-modelo1 input,
  body.portal-modelo1 select,
  body.portal-modelo1 textarea,
  body.portal-modelo1 button,
  body.portal-modelo1-login form,
  body.portal-modelo1-login fieldset,
  body.portal-modelo1-login input,
  body.portal-modelo1-login select,
  body.portal-modelo1-login textarea,
  body.portal-modelo1-login button,
  body.portal-aulas-online-page form,
  body.portal-aulas-online-page fieldset,
  body.portal-aulas-online-page input,
  body.portal-aulas-online-page select,
  body.portal-aulas-online-page textarea,
  body.portal-aulas-online-page button {
    max-width: 100%;
  }
}

@media (max-width: 390px) {
  body.portal-modelo1 .wrap,
  body.portal-aulas-online-page .wrap {
    padding-left: 9px !important;
    padding-right: 9px !important;
  }
}

/* V88 - menu inferior sempre em uma unica linha com 5 itens. */
@media (max-width: 1100px) {
  body.portal-modelo1 .portal-mobile-bottom-nav,
  body.portal-aulas-online-page .portal-mobile-bottom-nav {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    width: 100dvw !important;
    max-width: 100dvw !important;
    margin: 0 !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    grid-auto-flow: column !important;
    grid-auto-columns: minmax(0, 1fr) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    padding: 7px max(4px, env(safe-area-inset-right)) max(7px, env(safe-area-inset-bottom)) max(4px, env(safe-area-inset-left)) !important;
  }

  body.portal-modelo1 .portal-mobile-bottom-nav > a,
  body.portal-aulas-online-page .portal-mobile-bottom-nav > a {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 4px 1px !important;
    margin: 0 !important;
    overflow: hidden !important;
    font-size: clamp(.52rem, 2.25vw, .60rem) !important;
    line-height: 1.05 !important;
  }

  body.portal-modelo1 .portal-mobile-bottom-nav > a > span,
  body.portal-aulas-online-page .portal-mobile-bottom-nav > a > span {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
    text-align: center !important;
  }

  body.portal-modelo1 .portal-mobile-bottom-nav > a > i,
  body.portal-aulas-online-page .portal-mobile-bottom-nav > a > i {
    width: 26px !important;
    height: 24px !important;
    font-size: .88rem !important;
  }
}

@media (max-width: 360px) {
  body.portal-modelo1 .portal-mobile-bottom-nav > a,
  body.portal-aulas-online-page .portal-mobile-bottom-nav > a {
    font-size: .50rem !important;
    gap: 4px !important;
  }

  body.portal-modelo1 .portal-mobile-bottom-nav > a > i,
  body.portal-aulas-online-page .portal-mobile-bottom-nav > a > i {
    width: 24px !important;
    height: 22px !important;
    font-size: .82rem !important;
  }
}