/* BOLEPIX_WHATSAPP_CLIENTE_MOBILE_CSS_V5703Z94B */

@media (max-width: 760px){

  #clientForm [data-phone-wrap],
  #pwaClientCreate [data-phone-wrap],
  #pwaInvoiceClientCreate [data-phone-wrap],
  .pwa-client-form [data-phone-wrap]{
    position:relative!important;
    overflow:hidden!important;
    isolation:isolate!important;
  }

  /*
   * Android abre o seletor nativo mesmo quando o <select> está
   * transparente. Por isso não basta opacity:0 ou pointer-events:none:
   * nesta tela mobile ele sai totalmente do layout de interação.
   */
  #clientForm select.phone-country,
  #pwaClientCreate select.phone-country,
  #pwaInvoiceClientCreate select.phone-country,
  .pwa-client-form select.phone-country{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
    position:absolute!important;
    width:0!important;
    min-width:0!important;
    max-width:0!important;
    height:0!important;
    min-height:0!important;
    opacity:0!important;
    overflow:hidden!important;
    left:-9999px!important;
    top:-9999px!important;
  }

  /*
   * A bandeira é apenas visual. Nesta versão ela também pode receber
   * o toque, que o JavaScript redireciona para o campo do número.
   */
  #clientForm .phone-flag-button,
  #pwaClientCreate .phone-flag-button,
  #pwaInvoiceClientCreate .phone-flag-button,
  .pwa-client-form .phone-flag-button{
    position:relative!important;
    z-index:10!important;
    pointer-events:auto!important;
    cursor:text!important;
    touch-action:manipulation!important;
  }

  #clientForm .phone-flag-caret,
  #pwaClientCreate .phone-flag-caret,
  #pwaInvoiceClientCreate .phone-flag-caret,
  .pwa-client-form .phone-flag-caret{
    display:none!important;
  }

  #clientForm .phone-national,
  #pwaClientCreate .phone-national,
  #pwaInvoiceClientCreate .phone-national,
  .pwa-client-form .phone-national{
    position:relative!important;
    z-index:30!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    -webkit-user-select:text!important;
    user-select:text!important;
  }
}
