/* Bharat Swasthya Setu — PWA install banner + offline shell */
.bss-install-banner {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1080;
  padding: 0.75rem 1rem calc(0.75rem + env(safe-area-inset-bottom, 0));
  transform: translateY(110%);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.28s ease, opacity 0.28s ease;
}

.bss-install-banner.is-visible {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}

.bss-install-banner__inner {
  max-width: 42rem;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  padding: 0.95rem 1rem;
  border-radius: 1rem;
  background: var(--bss-surface-elevated, #fff);
  border: 1px solid color-mix(in srgb, var(--bss-blue, #3d63d6) 18%, transparent);
  box-shadow: 0 12px 40px rgba(15, 35, 70, 0.18);
}

.bss-install-banner__icon {
  flex: 0 0 auto;
  width: 3rem;
  height: 3rem;
  border-radius: 0.75rem;
  object-fit: cover;
  background: var(--bss-blue-soft, #eef3fb);
}

.bss-install-banner__copy {
  flex: 1 1 auto;
  min-width: 0;
}

.bss-install-banner__title {
  margin: 0 0 0.2rem;
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--bss-text, #12243d);
}

.bss-install-banner__sub {
  margin: 0;
  font-size: 0.84rem;
  line-height: 1.45;
  color: var(--bss-muted, #5a6b82);
}

.bss-install-banner__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.65rem;
}

.bss-install-banner__actions .btn {
  min-height: 44px;
  min-width: 44px;
  padding-inline: 1rem;
  font-weight: 600;
}

.bss-install-banner__ios {
  margin-top: 0.55rem;
  padding: 0.55rem 0.65rem;
  border-radius: 0.65rem;
  background: var(--bss-blue-soft, #eef3fb);
  font-size: 0.78rem;
  line-height: 1.45;
  color: var(--bss-text, #12243d);
}

.bss-install-toast {
  position: fixed;
  left: 50%;
  bottom: calc(5.5rem + env(safe-area-inset-bottom, 0));
  z-index: 1090;
  transform: translate(-50%, 120%);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.25s ease, opacity 0.25s ease;
  max-width: min(22rem, calc(100vw - 2rem));
  padding: 0.65rem 0.95rem;
  border-radius: 999px;
  background: #12876a;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  box-shadow: 0 8px 24px rgba(15, 159, 110, 0.35);
}

.bss-install-toast.is-visible {
  transform: translate(-50%, 0);
  opacity: 1;
}

.bss-offline-shell {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 2rem 1.25rem;
  text-align: center;
  background: linear-gradient(180deg, #f7f9fc 0%, #eef3fb 100%);
  color: #12243d;
}

.bss-offline-shell__card {
  max-width: 22rem;
  padding: 1.5rem;
  border-radius: 1rem;
  background: #fff;
  box-shadow: 0 10px 30px rgba(15, 35, 70, 0.08);
}

.bss-offline-shell__token {
  margin-top: 0.75rem;
  font-size: 2rem;
  font-weight: 800;
  color: var(--bss-blue, #3d63d6);
}

@media (min-width: 768px) {
  .bss-install-banner {
    padding-bottom: 1rem;
  }
}

/* Dark theme — elevated navy panel matching site chrome */
[data-theme="dark"] .bss-install-banner__inner {
  background: var(--color-bg-elevated, #1e2a3a) !important;
  color: var(--color-text-primary, #f1f4f9) !important;
  border-color: var(--color-border-subtle, #2a3648);
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.45);
}

[data-theme="dark"] .bss-install-banner__icon {
  background: var(--color-brand-soft, #1a2f45);
  box-shadow: 0 0 0 1px var(--color-border-subtle, #2a3648);
}

[data-theme="dark"] .bss-install-banner__title {
  color: var(--color-text-primary, #f1f4f9) !important;
}

[data-theme="dark"] .bss-install-banner__sub {
  color: var(--color-text-secondary, #b9c4d3) !important;
}

[data-theme="dark"] .bss-install-banner__ios {
  background: var(--color-brand-soft, #1a2f45) !important;
  color: var(--color-text-primary, #f1f4f9) !important;
  border: 1px solid var(--color-border-subtle, #2a3648);
}

[data-theme="dark"] .bss-install-banner__actions .btn-outline-secondary {
  color: var(--color-text-secondary, #b9c4d3) !important;
  background: transparent !important;
  border-color: var(--color-border-strong, #4a5972) !important;
}

[data-theme="dark"] .bss-install-banner__actions .btn-outline-secondary:hover {
  color: var(--color-text-primary, #f1f4f9) !important;
  background: var(--color-bg-muted, #24313f) !important;
  border-color: var(--color-border-strong, #4a5972) !important;
}

[data-theme="dark"] .bss-install-banner__actions .btn-primary {
  background-color: var(--color-brand-primary-solid, #0f4c81) !important;
  border-color: var(--color-brand-primary-solid, #0f4c81) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .bss-install-banner__actions .btn-primary:hover {
  background-color: #0a3a66 !important;
  border-color: #0a3a66 !important;
  color: #ffffff !important;
}