/**
 * W5-01 — PWA polish: safe-area sticky bar + reduced-motion banner slide-in.
 * Linked from _layout.php by integrator (not edited in this task).
 * data-testid hosts remain in markup: pwa-install-soft, mobile-sticky-cta.
 */

/* Sticky install banner — pad for notch / home indicator */
.rcl-pwa-install {
  padding-left: calc(0.9rem + env(safe-area-inset-left, 0px));
  padding-right: calc(0.9rem + env(safe-area-inset-right, 0px));
  padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
  bottom: calc(4.75rem + env(safe-area-inset-bottom, 0px));
}

/* Soft slide-in when client reveals banner (no blocking modal) */
.rcl-pwa-install.is-visible {
  animation: rcl-pwa-banner-in 0.32s ease-out both;
}

@keyframes rcl-pwa-banner-in {
  from {
    opacity: 0;
    transform: translateY(0.75rem);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .rcl-pwa-install.is-visible {
    animation: none;
  }
}

/* Sticky mobile CTA — reinforce safe-area padding */
.rcl-mobile-cta[data-testid="mobile-sticky-cta"],
.rcl-mobile-cta {
  padding-left: calc(0.85rem + env(safe-area-inset-left, 0px));
  padding-right: calc(0.85rem + env(safe-area-inset-right, 0px));
  padding-bottom: calc(0.65rem + env(safe-area-inset-bottom, 0px));
}

@media (min-width: 721px) {
  .rcl-pwa-install {
    bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px));
    padding-bottom: 0.75rem;
  }
}