/* PWA install dialog and existing notification onboarding styles. */

#install-dock,
.install-dock,
.pwa-install-v2,
#pwa-top-banner,
.pwa-top-banner {
  display: none !important;
}

/* Centered install dialog; the browser manages focus and background interaction. */
.pwa-bottom-cta {
  position: fixed;
  inset: 0;
  margin: auto;
  width: min(calc(100% - 32px), 440px);
  max-height: calc(100dvh - 32px);
  padding: 0;
  border: 1px solid rgba(120,190,255,.3);
  border-radius: 28px;
  background: #082344;
  color: #eef7ff;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  box-shadow: 0 24px 80px rgba(0,0,0,.5);
  overflow: auto;
}
.pwa-bottom-cta::backdrop { background: rgba(2,10,24,.72); backdrop-filter: blur(7px); }
.pwa-bottom-cta [hidden], .pwa-bottom-cta[hidden] { display: none !important; }
.pwa-bottom-cta-inner {
  position: relative;
  display: grid;
  gap: 18px;
  padding: 36px 28px 20px;
  text-align: center;
  background: radial-gradient(ellipse at top, rgba(24,125,220,.25), transparent 65%);
}
.pwa-install-icon { margin: 0 auto; border-radius: 22px; box-shadow: 0 8px 24px #0004; }
.pwa-bottom-cta-copy h2 { margin: 0; font-size: clamp(22px, 5vw, 28px); line-height: 1.2; font-weight: 800; color: #f3f8ff; }
.pwa-bottom-cta-copy p { margin: 14px 0 0; font-size: 15px; line-height: 1.6; color: #b7cee5; }
.pwa-bottom-cta button { font: inherit; cursor: pointer; }
.pwa-bottom-cta button:focus-visible { outline: 3px solid #8dd7ff; outline-offset: 3px; }
.pwa-bottom-cta-btn { min-height: 54px; width: 100%; border-radius: 16px; border: 1px solid #65bdff; background: linear-gradient(120deg,#168fff,#0761d5); color: white; font-weight: 800 !important; box-shadow: 0 6px 22px #007aff33; }
.pwa-bottom-cta-btn:hover { filter: brightness(1.12); }
.pwa-bottom-cta-x { position: absolute; top: 8px; right: 8px; width: 44px; height: 44px; border: 0; border-radius: 50%; background: transparent; color: #adc9e2; font-size: 26px !important; }
.pwa-install-later { min-height: 44px; border: 0; border-radius: 12px; background: transparent; color: #adc9e2; }
.pwa-install-later:hover, .pwa-bottom-cta-x:hover { background: #ffffff0d; }
.pwa-ios-guide { display: flex; align-items: center; gap: 12px; padding: 16px; text-align: left; border: 1px solid #477398; border-radius: 16px; background: #ffffff08; }
.pwa-ios-guide span { flex-shrink: 0; border: 2px solid #8dd7ff; border-top: 0; padding: 0 7px; color: #8dd7ff; font-size: 26px; }
.pwa-ios-guide p { margin: 0; font-size: 14px; line-height: 1.6; }
@media (max-height: 560px) { .pwa-bottom-cta-inner { padding: 24px 20px 12px; gap: 12px; } .pwa-install-icon { width: 52px; height: 52px; border-radius: 14px; } }

/* Compact tip — not fullscreen */
.pwa-install-tip {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 10100;
  padding: 12px 12px calc(12px + env(safe-area-inset-bottom) + var(--nav-h, 64px));
  pointer-events: none;
  background: transparent;
}
.pwa-install-tip-card {
  pointer-events: auto;
  margin: 0 auto;
  width: min(100%, 420px);
  padding: 14px;
  border-radius: 16px;
  background: #0b2a4d;
  border: 1px solid rgba(140,200,255,.22);
  box-shadow: 0 12px 40px rgba(0,0,0,.35);
  color: #e8f4ff;
}
.pwa-install-tip-card p { margin: 0; font-size: 14px; line-height: 1.45; }
.pwa-install-tip-ok {
  width: 100%; margin-top: 12px; height: 40px; border-radius: 12px;
  background: rgba(255,255,255,.1); color: #fff; font-size: 13px; font-weight: 800;
}

/* Notification onboarding — bottom card, home remains fully visible */
.svitlo-onboard-card {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 80;
  padding: 10px 10px calc(10px + env(safe-area-inset-bottom));
  background: transparent;
  pointer-events: none;
}
.svitlo-onboard-sheet {
  pointer-events: auto;
  margin: 0 auto 0;
  /* Sit above bottom nav */
  margin-bottom: calc(var(--nav-h, 64px) + 4px);
  width: min(100%, 440px);
  display: grid;
  grid-template-columns: 40px minmax(0,1fr);
  gap: 8px 10px;
  padding: 12px;
  border-radius: 18px;
  background: linear-gradient(160deg, rgba(8,42,78,.98), rgba(4,22,46,.99));
  border: 1px solid rgba(120,190,255,.22);
  box-shadow: 0 14px 36px rgba(0,0,0,.4);
  color: #edf7ff;
}
.svitlo-onboard-icon {
  width: 40px; height: 40px; border-radius: 14px;
  display: grid; place-items: center;
  background: rgba(255,255,255,.08); font-size: 20px;
}
.svitlo-onboard-copy { min-width: 0; }
.svitlo-onboard-copy strong { display:block; font-size:15px; font-weight:900; }
.svitlo-onboard-copy p { margin:4px 0 0; font-size:12px; line-height:1.4; color:#b7d0e6; }
.svitlo-onboard-actions {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 4px;
}
.svitlo-onboard-primary,
.svitlo-onboard-secondary {
  height: 40px; border-radius: 12px; font-size: 13px; font-weight: 900;
}
.svitlo-onboard-primary {
  background: linear-gradient(120deg,#1297ff,#0a62df);
  color: #fff; border: 1px solid rgba(160,220,255,.3);
}
.svitlo-onboard-secondary {
  background: rgba(255,255,255,.06); color: #c5dbef;
  border: 1px solid rgba(255,255,255,.08);
}

/* Settings leftovers */
.settings-sec-title {
  margin: 0 0 10px; font-size: 12px; font-weight: 900;
  letter-spacing: .14em; color: #7fb3dc; text-transform: uppercase;
}
.settings-profile {
  display: grid; grid-template-columns: 52px minmax(0,1fr);
  gap: 12px; align-items: center;
}
.settings-avatar {
  width: 52px; height: 52px; border-radius: 16px;
  object-fit: cover; background: rgba(255,255,255,.08);
}
.settings-avatar.placeholder {
  display: grid; place-items: center; font-size: 22px; color: #8eb6d8;
}
.settings-profile strong { display:block; font-size:15px; }
.settings-profile span { display:block; margin-top:3px; font-size:12px; color:#8eabc6; }
.settings-profile small { display:block; margin-top:4px; font-size:11px; color:#6f94b4; }
.settings-toggle-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; min-height: 54px;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.settings-toggle-row:last-child { border-bottom: 0; }
.settings-addr-card { padding: 10px 0; border-bottom: 1px solid rgba(255,255,255,.08); }
.settings-addr-card:last-child { border-bottom: 0; }
.settings-addr-card strong { display:block; font-size:14px; }
.settings-addr-card span { display:block; margin-top:4px; font-size:11px; color:#8eabc6; line-height:1.4; }
.settings-hint { margin-top: 8px; font-size: 11px; color: #7fa8cd; line-height: 1.45; }
.settings-btn {
  width: 100%; min-height: 46px; margin-top: 10px; border-radius: 14px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.06); color: #edf8ff;
  font-size: 13px; font-weight: 800;
}
.settings-btn.primary {
  background: linear-gradient(135deg,rgba(17,132,255,.42),rgba(15,83,185,.28));
  border-color: rgba(88,184,255,.28);
}
.settings-btn.google { display:flex; align-items:center; justify-content:center; gap:8px; }
.settings-btn[disabled] { opacity: .55; }
.settings-water-note {
  margin-top: 8px; padding: 10px; border-radius: 12px;
  background: rgba(255,170,70,.08);
  border: 1px solid rgba(255,170,70,.18);
  color: #f0d2a4; font-size: 11px; line-height: 1.45;
}

.install-guide-backdrop,
.install-guide { display: none !important; }

/* The install offer now lives in the dialog, outside the map grid. */
body.om-active .om {grid-template-rows:minmax(0,1fr) auto 72px auto}
body.om-active [data-om-guide] {padding:12px;border:1px solid #6385a4;border-radius:10px;line-height:1.5}
