/*
 * BOLEPIX_LOGIN_ADM_MOBILE_IGUAL_CLIENTE_V5703Z95
 *
 * O cliente e o ADM usam o mesmo card #bpLoginOtpV5703z67.
 * A diferença visual mobile vinha de regras exclusivas da etapa
 * #bpLoginOtpPasswordStepV5703z67, principalmente a V5703Z40.
 * Aqui o ADM volta a usar as mesmas medidas do login do cliente.
 */

@media (max-width: 620px) {

  /* MESMO SHELL MOBILE DO CLIENTE — styles.css */
  body:has(#bpLoginOtpPasswordStepV5703z67:not([hidden]))
  .auth-shell {
    position: relative !important;
    z-index: 1 !important;
    width: 100% !important;
    max-width: 1180px !important;
    margin: 0 auto !important;
    padding: 24px 16px 60px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    align-content: normal !important;
    min-height: initial !important;
    height: auto !important;
  }

  /* MESMO CARD MOBILE DO CLIENTE */
  body:has(#bpLoginOtpPasswordStepV5703z67:not([hidden]))
  #bpLoginOtpV5703z67 {
    width: calc(100vw - 24px) !important;
    max-width: 460px !important;
    min-width: 0 !important;
    margin: 0 auto !important;
    padding: 22px !important;
    border-radius: 24px !important;
    transform: none !important;
    box-sizing: border-box !important;
  }

  /*
   * A faixa do login do cliente compensa os 22px do card mobile.
   * Remove a margem/padding exclusivos que a V5703Z40 aplicava no ADM.
   */
  body:has(#bpLoginOtpPasswordStepV5703z67:not([hidden]))
  #bpLoginOtpV5703z67
  .m3d-login-brand-bar-v14.m3d-v183-gradient-with-title {
    width: auto !important;
    max-width: none !important;
    min-height: 78px !important;
    height: 78px !important;
    margin: -22px -22px 22px !important;
    padding: 0 !important;
    border-radius: 24px 24px 0 0 !important;
    box-sizing: border-box !important;
  }

  /* MESMA GRADE DO FORMULÁRIO DO CLIENTE */
  #bpLoginOtpV5703z67
  #bpLoginOtpPasswordStepV5703z67 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  #bpLoginOtpV5703z67
  #bpLoginOtpPasswordStepV5703z67[hidden] {
    display: none !important;
  }

  /* LABEL NO MESMO PADRÃO */
  #bpLoginOtpV5703z67
  #bpLoginOtpPasswordStepV5703z67 label {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    color: #0f2942 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
  }

  /* CAMPO SENHA COM O MESMO TAMANHO VISUAL DO CAMPO DO CLIENTE */
  #bpLoginOtpV5703z67
  #bpLoginOtpPasswordV5703z67 {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 52px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 13px 14px !important;
    color: #071833 !important;
    background: #ffffff !important;
    border: 1px solid #d5e0ef !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    font: inherit !important;
    font-size: 16px !important;
    box-sizing: border-box !important;
    outline: none !important;
  }

  #bpLoginOtpV5703z67
  #bpLoginOtpPasswordV5703z67:focus {
    border-color: #168cf4 !important;
    box-shadow: 0 0 0 4px rgba(22, 140, 244, .14) !important;
  }

  /* BOTÃO PRINCIPAL IGUAL AO LOGIN DO CLIENTE */
  #bpLoginOtpV5703z67
  #bpLoginOtpPasswordSubmitV5703z67 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: 13px 18px !important;
    color: #ffffff !important;
    background: linear-gradient(105deg,#075bea 0%,#168cf4 56%,#14cdb2 100%) !important;
    border: 0 !important;
    border-radius: 13px !important;
    box-shadow: 0 12px 26px rgba(7,91,234,.22) !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    box-sizing: border-box !important;
  }

  /* AVISO COM O MESMO CARD VERDE DO FLUXO DO CLIENTE */
  #bpLoginOtpV5703z67
  #bpLoginOtpPasswordInfoV5703z67 {
    width: 100% !important;
    margin: 0 !important;
    padding: 12px 14px !important;
    color: #0f5132 !important;
    background: #ecfdf3 !important;
    border: 1px solid #a7e4bf !important;
    border-radius: 12px !important;
    font-size: 14px !important;
    line-height: 1.5 !important;
    box-sizing: border-box !important;
  }

  /* AÇÕES SECUNDÁRIAS: UMA POR LINHA COMO NO CLIENTE MOBILE */
  #bpLoginOtpV5703z67
  #bpLoginOtpPasswordStepV5703z67
  .bp-login-otp-actions-v5703z67 {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 9px !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #bpLoginOtpV5703z67
  #bpLoginOtpPasswordStepV5703z67
  .bp-login-otp-actions-v5703z67 button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 11px 14px !important;
    color: #075bea !important;
    background: #ffffff !important;
    border: 1px solid #d5e0ef !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    box-sizing: border-box !important;
  }

  /* TÍTULO/CONTEÚDO INTERNO SEM MARGEM EXTRA EXCLUSIVA DO ADM */
  body:has(#bpLoginOtpPasswordStepV5703z67:not([hidden]))
  #bpLoginOtpV5703z67 h1,
  body:has(#bpLoginOtpPasswordStepV5703z67:not([hidden]))
  #bpLoginOtpV5703z67 h2,
  body:has(#bpLoginOtpPasswordStepV5703z67:not([hidden]))
  #bpLoginOtpV5703z67 h3 {
    margin-top: 0 !important;
  }
}
