/* ASU RICO - ETAPA 71 - PWA */

:root{
  --asu-pwa-teal:#0f766e;
  --asu-pwa-dark:#17343c;
  --asu-pwa-danger:#b42318;
}

.asu-pwa-toast{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:999999;
  width:min(360px,calc(100vw - 28px));
  padding:12px;
  border-radius:15px;
  background:#fff;
  border:1px solid #dce7e9;
  box-shadow:0 18px 55px rgba(15,56,66,.22);
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--asu-pwa-dark);
  font-family:Arial,sans-serif;
}

.asu-pwa-toast.is-offline{
  border-color:#fed7aa;
  background:#fff7ed;
}

.asu-pwa-toast__icon{
  width:40px;
  height:40px;
  flex:0 0 40px;
  border-radius:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#e8f7f4;
  color:var(--asu-pwa-teal);
  font-size:18px;
}

.asu-pwa-toast.is-offline .asu-pwa-toast__icon{
  background:#ffedd5;
  color:#c2410c;
}

.asu-pwa-toast__content{
  min-width:0;
  flex:1;
}

.asu-pwa-toast__content strong{
  display:block;
  font-size:12px;
  font-weight:900;
}

.asu-pwa-toast__content span{
  display:block;
  margin-top:2px;
  color:#64777d;
  font-size:10px;
  line-height:1.35;
}

.asu-pwa-toast__actions{
  display:flex;
  gap:6px;
  align-items:center;
}

.asu-pwa-btn{
  border:0;
  border-radius:9px;
  padding:8px 10px;
  font-size:10px;
  font-weight:900;
  cursor:pointer;
  white-space:nowrap;
}

.asu-pwa-btn.primary{
  background:var(--asu-pwa-teal);
  color:#fff;
}

.asu-pwa-btn.ghost{
  background:#eef3f4;
  color:#53676d;
}

.asu-pwa-online-indicator{
  position:fixed;
  left:50%;
  transform:translateX(-50%);
  top:8px;
  z-index:999999;
  border-radius:999px;
  padding:7px 12px;
  background:#991b1b;
  color:#fff;
  font-size:10px;
  font-weight:900;
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}

@media (display-mode: standalone){
  body{
    overscroll-behavior-y:none;
  }
}

@media(max-width:767px){
  .asu-pwa-toast{
    right:14px;
    left:14px;
    width:auto;
    /* Deja libre la navegación inferior móvil del Mesero/Cajero. */
    bottom:calc(82px + env(safe-area-inset-bottom,0px));
  }

  .asu-pwa-online-indicator{
    top:calc(6px + env(safe-area-inset-top,0px));
  }
}