:root{--pwa-theme-color:var(--empresa-color, #fbf300)}
@media(display-mode:standalone){
  body::before{content:'';position:fixed;top:0;left:0;right:0;height:env(safe-area-inset-top,0px);background:var(--pwa-theme-color,#fbf300);z-index:99999;pointer-events:none}
  .navbar,.sidenav-header,.main-content .navbar{padding-top:calc(.5rem + env(safe-area-inset-top,0px))}
  .footer,.fixed-bottom{padding-bottom:calc(.5rem + env(safe-area-inset-bottom,0px))}
  .btn-floating,.fab,.whatsapp-btn,.wsp1{bottom:calc(1rem + env(safe-area-inset-bottom,0px))}
  .container,.container-fluid{padding-left:calc(15px + env(safe-area-inset-left,0px));padding-right:calc(15px + env(safe-area-inset-right,0px))}
  body{padding-top:env(safe-area-inset-top,0px)}
  .browser-only{display:none!important}
  .nav-link,.list-group-item,.dropdown-item{min-height:44px;display:flex;align-items:center}
}
.ptr-indicator{position:fixed;top:0;left:50%;transform:translateX(-50%) translateY(-60px);width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.15);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:10000;transition:transform .2s ease;pointer-events:none}
.ptr-indicator.visible{transform:translateX(-50%) translateY(20px)}
@media(display-mode:standalone){
  .ptr-indicator.visible{transform:translateX(-50%) translateY(calc(20px + env(safe-area-inset-top,0px)))}
}
.ptr-spinner{width:24px;height:24px;border:3px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%}
.ptr-spinner.spinning{animation:ptr-spin .6s linear infinite}
@keyframes ptr-spin{to{transform:rotate(360deg)}}
.pwa-progress-bar{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,#fbf300,#c9c000);z-index:99999;transform:scaleX(0);transform-origin:left;width:100%;pointer-events:none}
.pwa-progress-bar.loading{transform:scaleX(.7);transition:transform 8s cubic-bezier(.1,.05,0,1)}
.pwa-progress-bar.done{transform:scaleX(1);opacity:0;transition:transform .2s ease,opacity .3s ease .2s}
.nav-link:active,.sidenav .nav-link:active,.list-group-item:active{transform:scale(.97);opacity:.8;transition:transform .1s ease,opacity .1s ease}
.pwa-banner{position:fixed;bottom:0;left:0;right:0;background:#fff;color:#1a1a2e;display:flex;align-items:center;justify-content:space-between;padding:14px 16px;padding-left:40px;z-index:99998;transform:translateY(100%);transition:transform .4s cubic-bezier(.4,0,.2,1);font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;box-shadow:0 -2px 12px rgba(0,0,0,.12);padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}
.pwa-banner--visible{transform:translateY(0)}
.pwa-banner__close{position:absolute;top:50%;left:10px;transform:translateY(-50%);background:none;border:none;font-size:22px;line-height:1;color:#999;cursor:pointer;padding:4px}
.pwa-banner__close:hover{color:#333}
.pwa-banner__content{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.pwa-banner__icon{width:40px;height:40px;border-radius:10px;flex-shrink:0;object-fit:cover;box-shadow:0 1px 4px rgba(0,0,0,.1)}
.pwa-banner__text{display:flex;flex-direction:column;gap:2px;min-width:0}
.pwa-banner__text strong{font-size:14px;font-weight:600;color:#1a1a2e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pwa-banner__text span{font-size:12px;color:#777;white-space:normal;line-height:1.4}
.pwa-banner__actions{display:flex;align-items:center;gap:8px;flex-shrink:0;margin-left:12px}
.pwa-banner__btn{border:none;border-radius:6px;padding:8px 16px;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap;transition:opacity .2s}
.pwa-banner__btn:active{opacity:.7}
.pwa-banner__btn--install{background:var(--empresa-color, #fbf300);color:#1a1a2e}
.pwa-banner__btn--dismiss{background:transparent;color:#999;padding:8px 10px}

/* Neutralizar will-change que crea stacking context y tapa la tabbar */
.main-content .navbar-top{will-change:auto!important}

/* ============================================================
   TOP NAV — ajustes movil cuando la tabbar esta activa
   ============================================================ */
/* Sidenav abierto: z-index alto solo en movil/tablet (donde es overlay) */
@media(max-width:1199px){
  .g-sidenav-show #sidenav-main,
  .g-sidenav-pinned #sidenav-main{z-index:9999!important}
  .g-sidenav-show .backdrop,
  .g-sidenav-pinned .backdrop{z-index:9998!important}
}

@media(max-width:768px){
  /* Ocultar hamburguesa visualmente (ya esta en la tabbar), pero mantener en DOM para jQuery trigger */
  body.pwa-tabbar-on .topbar-sidenav-toggle{visibility:hidden!important;width:0!important;overflow:hidden!important;padding:0!important;margin:0!important}
  /* Ocultar buscar en mobile */
  body.pwa-tabbar-on .topbar-search-toggle{display:none!important}
  body.pwa-tabbar-on .topbar-search-wrapper{display:none!important}
  /* Mostrar botones de navegacion (back + reload) en mobile */
  body.pwa-tabbar-on .topbar-nav-buttons{display:flex!important}

  body.pwa-tabbar-on .navbar-top .nav-link{
    min-width:44px;min-height:44px;
    display:flex;align-items:center;justify-content:center;
    padding:0 8px;
  }
  body.pwa-tabbar-on .navbar-search{display:none!important}
  body.pwa-tabbar-on [data-action="search-show"]{display:none!important}
}

/* Tablet y desktop: buscador ocupa el espacio, todos los iconos juntos a la derecha */
@media(min-width:769px){
  .navbar-top .navbar-search{flex:1!important}
  .navbar-top .navbar-collapse>.navbar-nav.ml-auto{margin-left:0!important}
}