/* VAREXIQ 2.5.0 · Mobile App Shell
   Objetivo: comportamiento de app instalada sin zoom accidental ni pull-to-refresh.
   No contiene estilos de negocio ni altera cálculos del POS. */

html.averixo-mobile-app,
html.averixo-mobile-app body{
  width:100%;
  min-width:0;
  min-height:100%;
  overscroll-behavior:none!important;
  -webkit-text-size-adjust:100%!important;
  text-size-adjust:100%!important;
  background:#F5F7FA;
}

html.averixo-mobile-app #averixo-pos{
  touch-action:pan-x pan-y!important;
  overscroll-behavior:none!important;
  -webkit-tap-highlight-color:transparent!important;
}

/* Conservar gestos nativos de texto (selección, copiar, toque prolongado).
   Solo los controles tipo botón evitan el menú contextual accidental. */
html.averixo-mobile-app #averixo-pos button,
html.averixo-mobile-app #averixo-pos [role="button"],
html.averixo-mobile-app #averixo-pos .averixo-icon-btn{
  -webkit-touch-callout:none;
  touch-action:manipulation;
}

/* Los campos siguen siendo editables/selectables. */
html.averixo-mobile-app #averixo-pos input,
html.averixo-mobile-app #averixo-pos textarea,
html.averixo-mobile-app #averixo-pos select,
html.averixo-mobile-app #averixo-pos [contenteditable="true"]{
  -webkit-touch-callout:default!important;
  touch-action:pan-x pan-y!important;
}

/* iOS hace zoom automático en inputs <16px. Mantener 16px evita ese salto. */
html.averixo-ios.averixo-mobile-app #averixo-pos input,
html.averixo-ios.averixo-mobile-app #averixo-pos textarea,
html.averixo-ios.averixo-mobile-app #averixo-pos select{
  font-size:16px!important;
}

/* Modo instalado / acceso directo: WordPress desaparece visualmente y VAREXIQ usa todo el viewport. */
body.averixo-standalone-pos{
  margin:0!important;
  padding:0!important;
  overflow:hidden!important;
  background:#F5F7FA!important;
}
body.averixo-standalone-pos #wpadminbar,
body.averixo-standalone-pos #adminmenumain,
body.averixo-standalone-pos #wpfooter,
body.averixo-standalone-pos #screen-meta-links,
body.averixo-standalone-pos #screen-meta{
  display:none!important;
}
body.averixo-standalone-pos #wpwrap,
body.averixo-standalone-pos #wpcontent,
body.averixo-standalone-pos #wpbody,
body.averixo-standalone-pos #wpbody-content{
  position:relative!important;
  margin:0!important;
  padding:0!important;
  width:100%!important;
  min-width:0!important;
  height:100dvh!important;
  min-height:100dvh!important;
  max-height:100dvh!important;
  overflow:hidden!important;
}
body.averixo-standalone-pos #averixo-pos{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100dvh!important;
  min-height:100dvh!important;
  max-height:100dvh!important;
  margin:0!important;
  overflow:hidden!important;
}

/* Fallback para navegadores que aún no entienden dvh. */
@supports not (height:100dvh){
  body.averixo-standalone-pos #wpwrap,
  body.averixo-standalone-pos #wpcontent,
  body.averixo-standalone-pos #wpbody,
  body.averixo-standalone-pos #wpbody-content,
  body.averixo-standalone-pos #averixo-pos{
    height:100vh!important;
    min-height:100vh!important;
    max-height:100vh!important;
  }
}

/* Safe areas: notch, Dynamic Island y barras gestuales. */
html.averixo-installed-app body.averixo-standalone-pos #averixo-pos{
  padding-left:env(safe-area-inset-left)!important;
  padding-right:env(safe-area-inset-right)!important;
  box-sizing:border-box!important;
}

/* Onboarding de instalación: una sola capa simple y ligera. */
#averixo-app-install-guide[hidden]{display:none!important;pointer-events:none!important;}
#averixo-app-install-guide{
  position:fixed;
  inset:0;
  z-index:2147483646;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));
  background:rgba(5,18,37,.56);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.averixo-app-install-card{
  width:min(520px,100%);
  max-height:min(82dvh,680px);
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  background:#fff;
  border:1px solid rgba(11,31,58,.10);
  border-radius:22px;
  padding:18px;
  box-shadow:0 28px 90px rgba(5,18,37,.32);
  color:#142033;
}
.averixo-app-install-head{display:flex;align-items:center;gap:12px;margin-bottom:12px;}
.averixo-app-install-head img{width:48px;height:48px;border-radius:12px;object-fit:cover;box-shadow:0 3px 12px rgba(11,31,58,.10);}
.averixo-app-install-head h3{margin:0;font-size:19px;line-height:1.2;color:#0B1F3A;}
.averixo-app-install-head p{margin:3px 0 0;color:#65758b;font-size:12px;}
.averixo-app-install-close{margin-left:auto;width:38px;height:38px;border-radius:11px;border:1px solid #dce5ef;background:#f7f9fc;color:#0B1F3A;font-size:22px;line-height:1;cursor:pointer;touch-action:manipulation;}
.averixo-app-install-copy{font-size:13px;line-height:1.55;color:#40536b;}
.averixo-app-install-steps{margin:12px 0 0;padding:0;display:grid;gap:8px;counter-reset:step;list-style:none;}
.averixo-app-install-steps li{position:relative;padding:10px 11px 10px 42px;border:1px solid #e0e7f0;border-radius:12px;background:#f8fbff;color:#23384f;font-size:13px;line-height:1.45;}
.averixo-app-install-steps li::before{counter-increment:step;content:counter(step);position:absolute;left:10px;top:9px;width:23px;height:23px;border-radius:8px;background:#1677FF;color:#fff;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:900;}
.averixo-app-install-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;}
.averixo-app-install-actions button{min-height:44px;border-radius:11px;padding:9px 14px;font-weight:900;font-size:13px;cursor:pointer;touch-action:manipulation;}
.averixo-app-install-native{flex:1 1 180px;border:1px solid #1677FF;background:#1677FF;color:#fff;}
.averixo-app-install-later{border:1px solid #d5dfeb;background:#fff;color:#0B1F3A;}
.averixo-app-install-ok{padding:10px 12px;border-radius:12px;background:#eafaf0;border:1px solid #bfe8cf;color:#087a35;font-size:12px;font-weight:800;line-height:1.45;}

@media(max-width:700px),(pointer:coarse){
  #averixo-app-install-guide{align-items:flex-end;padding:8px 8px max(8px,env(safe-area-inset-bottom));}
  .averixo-app-install-card{width:100%;max-height:88dvh;border-radius:22px 22px 14px 14px;padding:16px;}
  .averixo-app-install-actions{display:grid;grid-template-columns:1fr;}
  .averixo-app-install-actions button{width:100%;}
}