/* Shared storefront water backdrop. Its shader lives in the companion script. */
body.customer-restored.recharge-page {
  position: relative;
  isolation: isolate;
}

body.customer-restored.recharge-page > .daison-storefront-backdrop {
  position: fixed;
  z-index: -1;
  inset: 0;
  display: none;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 0% 34%, rgb(125 94 27 / 14%), transparent 24%),
    radial-gradient(ellipse at 100% 28%, rgb(148 113 36 / 15%), transparent 24%),
    #08090b;
}

body.customer-restored.recharge-page.theme-dark > .daison-storefront-backdrop {
  display: block;
}

.daison-storefront-backdrop::before {
  position: absolute;
  inset: 0;
  content: '';
  pointer-events: none;
  background:
    radial-gradient(ellipse at 82% 4%, rgb(189 145 39 / 42%), transparent 53%),
    radial-gradient(ellipse at 62% 0%, rgb(115 79 18 / 12%), transparent 63%);
  opacity: 0;
  transition: opacity .7s ease;
}

.daison-storefront-backdrop.is-hero::before { opacity: 1; }
.daison-storefront-liquid {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.daison-storefront-backdrop.is-fallback .daison-storefront-liquid { opacity: 0; }

/* Same visible hero interval as the storefront; this marker has no layout. */
body.customer-restored.recharge-page > .daison-catalog-hero-sentinel {
  position: absolute;
  top: 74px;
  left: 0;
  width: 1px;
  height: 620px;
  pointer-events: none;
  visibility: hidden;
}

@media (max-width: 760px) {
  body.customer-restored.recharge-page > .daison-catalog-hero-sentinel { height: 740px; }
}

@media (prefers-reduced-motion: reduce) {
  .daison-storefront-backdrop::before { transition: none; }
}