/* GuaniHub PWA · aislado del resto del CRM. */
html.gd-pwa-modal-open,
html.gd-pwa-modal-open body { overflow: hidden !important; }

.gd-pwa-install[hidden], .gd-pwa-modal[hidden],
.gd-pwa-modal [hidden] { display: none !important; }

.gd-pwa-install {
  position: fixed;
  left: max(14px, env(safe-area-inset-left));
  right: max(14px, env(safe-area-inset-right));
  bottom: max(14px, calc(env(safe-area-inset-bottom) + 10px));
  z-index: 10150;
  pointer-events: none;
}
.gd-pwa-install-card {
  contain: layout paint;
  pointer-events: auto;
  width: min(720px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 48px minmax(0,1fr) auto 34px;
  align-items: center;
  gap: 12px;
  padding: 12px;
  border: 1px solid rgba(135,191,20,.34);
  border-radius: 18px;
  background: rgba(8,25,8,.97);
  color: #f4f8f0;
  box-shadow: 0 14px 34px rgba(0,0,0,.38);
}
.gd-pwa-app-icon {
  width: 48px; height: 48px; border-radius: 14px; overflow: hidden; background:#0b1d0a; flex:0 0 auto;
  box-shadow: inset 0 0 0 1px rgba(135,191,20,.28);
}
.gd-pwa-app-icon img { display:block; width:100%; height:100%; object-fit:cover; }
.gd-pwa-app-icon--large { width:58px; height:58px; border-radius:17px; }
.gd-pwa-install-copy { min-width:0; display:flex; flex-direction:column; gap:3px; }
.gd-pwa-install-copy strong { font-size:14px; color:#fff; }
.gd-pwa-install-copy span { font-size:12px; line-height:1.35; color:#aebba8; }
.gd-pwa-install-button,
.gd-pwa-primary {
  appearance:none !important; -webkit-appearance:none !important;
  border:1px solid #87bf14 !important; background:#87bf14 !important; color:#102006 !important;
  border-radius:11px !important; font-weight:800 !important; cursor:pointer; box-shadow:none !important; text-decoration:none !important;
}
.gd-pwa-install-button { padding:10px 14px !important; font-size:13px !important; }
.gd-pwa-primary { width:100%; padding:13px 18px !important; font-size:15px !important; margin-top:18px; }
.gd-pwa-install-button:hover,.gd-pwa-install-button:focus-visible,.gd-pwa-primary:hover,.gd-pwa-primary:focus-visible { background:#9bd62a !important; border-color:#9bd62a !important; color:#0b1906 !important; transform:translateY(-1px); }
.gd-pwa-install-button:active,.gd-pwa-primary:active { background:#76a911 !important; border-color:#76a911 !important; transform:translateY(0); }
.gd-pwa-dismiss,
.gd-pwa-modal-close {
  appearance:none !important; -webkit-appearance:none !important; border:1px solid rgba(135,191,20,.18) !important;
  color:#cbd7c5 !important; background:rgba(255,255,255,.03) !important; display:grid; place-items:center; cursor:pointer; box-shadow:none !important;
}
.gd-pwa-dismiss { width:34px; height:34px; border-radius:10px !important; padding:0 !important; }
.gd-pwa-dismiss svg,.gd-pwa-modal-close svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }
.gd-pwa-dismiss:hover,.gd-pwa-dismiss:focus-visible,.gd-pwa-modal-close:hover,.gd-pwa-modal-close:focus-visible { color:#0e2107 !important; background:#87bf14 !important; border-color:#87bf14 !important; }
.gd-pwa-dismiss:active,.gd-pwa-modal-close:active { background:#76a911 !important; }

.gd-pwa-modal { position:fixed; inset:0; z-index:10220; display:grid; place-items:center; padding:18px; }
.gd-pwa-modal-backdrop { position:absolute; inset:0; background:rgba(0,9,0,.88); }
.gd-pwa-modal-panel {
  position:relative; z-index:1; width:min(570px,100%); max-height:min(780px,calc(100vh - 36px)); overflow:auto;
  color:#eff6eb; background:#091a09; border:1px solid rgba(135,191,20,.28); border-radius:24px; box-shadow:0 28px 90px rgba(0,0,0,.58);
}
.gd-pwa-modal-head { position:relative; display:grid; grid-template-columns:58px minmax(0,1fr) 42px; gap:14px; align-items:center; padding:20px 20px 18px; border-bottom:1px solid rgba(135,191,20,.18); }
.gd-pwa-modal-head > div:nth-child(2) { min-width:0; }
.gd-pwa-modal-head span { display:block; margin-bottom:3px; color:#87bf14; font-size:10px; letter-spacing:.14em; font-weight:900; }
.gd-pwa-modal-head h2 { margin:0 0 4px; color:#fff; font-size:22px; line-height:1.15; }
.gd-pwa-modal-head p { margin:0; color:#aebba8; font-size:13px; line-height:1.45; }
.gd-pwa-modal-close { align-self:start; width:42px; height:42px; border-radius:12px !important; padding:0 !important; }
.gd-pwa-modal-body { padding:20px; }
.gd-pwa-feature-list { display:grid; gap:10px; }
.gd-pwa-feature-list > div { display:grid; grid-template-columns:38px minmax(0,1fr); gap:11px; align-items:start; padding:12px; border:1px solid rgba(135,191,20,.14); border-radius:14px; background:rgba(255,255,255,.025); }
.gd-pwa-feature-list svg,.gd-pwa-privacy-note svg,.gd-pwa-manual-pill svg { width:24px; height:24px; fill:none; stroke:#87bf14; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.gd-pwa-feature-list span { color:#aebba8; font-size:12.5px; line-height:1.45; }
.gd-pwa-feature-list strong { display:block; margin-bottom:2px; color:#f4f8f0; font-size:13.5px; }
.gd-pwa-instruction-intro { margin:0 0 14px; color:#bec9b9; font-size:13px; line-height:1.55; }
.gd-pwa-steps { list-style:none; padding:0; margin:0; display:grid; gap:10px; }
.gd-pwa-steps li { display:grid; grid-template-columns:32px minmax(0,1fr) 28px; align-items:center; gap:10px; padding:12px; border:1px solid rgba(135,191,20,.14); border-radius:14px; background:rgba(255,255,255,.025); }
.gd-pwa-steps li > span { width:32px; height:32px; display:grid; place-items:center; border-radius:10px; background:rgba(135,191,20,.13); color:#9bd62a; font-size:12px; font-weight:900; }
.gd-pwa-steps strong { display:block; color:#f4f8f0; font-size:13px; margin-bottom:2px; }
.gd-pwa-steps small { display:block; color:#aebba8; font-size:11.5px; line-height:1.4; }
.gd-pwa-steps svg { width:22px; height:22px; fill:none; stroke:#87bf14; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.gd-pwa-manual-pill { display:flex; align-items:center; gap:11px; padding:14px; border-radius:14px; border:1px solid rgba(135,191,20,.2); background:rgba(135,191,20,.07); color:#eef7e8; font-size:13px; font-weight:700; }
.gd-pwa-installed-confirm {
  appearance:none !important; -webkit-appearance:none !important; width:100%; margin-top:12px; padding:11px 14px !important;
  border:1px solid rgba(135,191,20,.32) !important; border-radius:11px !important; background:transparent !important; color:#cdea93 !important;
  font-size:12px !important; font-weight:800 !important; cursor:pointer; box-shadow:none !important;
}
.gd-pwa-installed-confirm:hover,.gd-pwa-installed-confirm:focus-visible,.gd-pwa-installed-confirm:active {
  border-color:#87bf14 !important; background:rgba(135,191,20,.10) !important; color:#eff8df !important; outline:none !important;
}
.gd-pwa-privacy-note { display:grid; grid-template-columns:30px minmax(0,1fr); gap:10px; align-items:start; margin-top:18px; padding:13px; border-radius:14px; background:rgba(255,255,255,.025); border:1px solid rgba(255,255,255,.07); }
.gd-pwa-privacy-note p { margin:0; color:#aebba8; font-size:11.5px; line-height:1.55; }
.gd-pwa-privacy-note strong { color:#e7efe2; }

@media (min-width:821px) {
  .gd-pwa-install { left:auto; right:20px; width:420px; }
  .gd-pwa-install-card { grid-template-columns:44px minmax(0,1fr) auto 34px; }
  .gd-pwa-app-icon { width:44px; height:44px; border-radius:13px; }
}
@media (max-width:640px) {
  .gd-pwa-install-card { grid-template-columns:44px minmax(0,1fr) auto; padding:10px; border-radius:16px; }
  .gd-pwa-app-icon { width:44px; height:44px; border-radius:13px; }
  .gd-pwa-install-copy span { display:none; }
  .gd-pwa-dismiss { position:absolute; right:6px; top:-42px; background:#091a09 !important; }
  .gd-pwa-modal { padding:10px; padding-top:max(10px,env(safe-area-inset-top)); padding-bottom:max(10px,env(safe-area-inset-bottom)); }
  .gd-pwa-modal-panel { max-height:calc(100dvh - 20px); border-radius:20px; }
  .gd-pwa-modal-head { grid-template-columns:50px minmax(0,1fr) 38px; gap:11px; padding:16px; }
  .gd-pwa-app-icon--large { width:50px; height:50px; border-radius:15px; }
  .gd-pwa-modal-head h2 { font-size:19px; }
  .gd-pwa-modal-head p { font-size:11.5px; }
  .gd-pwa-modal-close { width:38px; height:38px; }
  .gd-pwa-modal-body { padding:16px; }
}

/* 1.36.50 · Coordinación mobile de PWA + controles flotantes. Desktop intacto. */
@media (max-width:820px) {
  .gd-pwa-modal { z-index:100220; }

  /* Mientras el aviso está visible, respeta la jerarquía existente: volver arriba abajo, Guani encima. */
  body.gd-pwa-install-visible .gd-help-chatbot {
    bottom:calc(156px + env(safe-area-inset-bottom)) !important;
  }
  body.gd-pwa-install-visible #ast-scroll-top,
  body.gd-pwa-install-visible .ast-scroll-to-top-right,
  body.gd-pwa-install-visible .ast-scroll-to-top-left {
    bottom:calc(98px + env(safe-area-inset-bottom)) !important;
  }

  /* En un formulario/modal la prioridad es el contenido y sus acciones. */
  body.gd-modal-abierto .gd-pwa-install,
  body.gd-modal-open .gd-pwa-install,
  body.gd-commercial-modal-open .gd-pwa-install,
  body.gd-document-modal-open .gd-pwa-install { display:none !important; }
}

/* 1.36.51 · Stack flotante mobile: CTA -> Volver arriba -> Guani. */
@media (max-width:820px) {
  /* Incluye el botón propio del CRM; 1.36.50 sólo contemplaba los de Astra. */
  body.gd-pwa-install-visible .gd-scroll-top {
    bottom:calc(98px + env(safe-area-inset-bottom)) !important;
  }

  /* Si Catálogo abre un formulario contextual, el CTA tampoco puede cubrirlo. */
  body.gd-catalog-dialog-open .gd-pwa-install {
    display:none !important;
  }
}