/* Business shares Home's glass and motion, with five green lights in Light and three in Dark.
 * The Aura control restores the original solid hero when switched off.
 */
.business-aura-backdrop { display: none; }

:where(html[data-account-aura="on"]) .phone.next-ui-theme #app-shell:has(#screen-business.active) {
  --business-aura-header-height: 74px;
  --business-aura-header-extent: calc(var(--business-aura-header-height) + var(--app-top-inset));
  display: grid;
  grid-template: minmax(0, 1fr) / minmax(0, 1fr);
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme.app-theme-refined #app-shell:has(#screen-business.active) {
  --business-aura-header-height: 80px;
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme {
  --business-aura-glass: rgb(255 255 255 / 65%);
  --business-aura-edge: rgb(255 255 255 / 82%);
  --business-aura-sheen: rgb(255 255 255 / 46%);
  --business-aura-header: rgb(255 255 255 / 44%);
  --business-aura-emerald: 16 151 103;
  --business-aura-leaf: 70 188 97;
  --business-aura-mint: 53 207 155;
  --business-aura-emerald-alpha: 32%;
  --business-aura-leaf-alpha: 26%;
  --business-aura-mint-alpha: 28%;
}

:where(html[data-account-aura="on"][data-color-scheme="dark"]) .phone.next-ui-theme {
  --business-aura-glass: var(--overview-glass);
  --business-aura-edge: var(--overview-edge);
  --business-aura-sheen: var(--overview-sheen);
  --business-aura-header: rgb(16 21 30 / 55%);
  --business-aura-emerald-alpha: 18%;
  --business-aura-leaf-alpha: 15%;
  --business-aura-mint-alpha: 16%;
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme #app-shell:has(#screen-business.active) > .app-header {
  grid-area: 1 / 1;
  align-self: start;
  position: relative;
  z-index: 20;
  height: var(--business-aura-header-extent);
  background: transparent;
  border-bottom-color: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  transition: background-color .18s ease, box-shadow .18s ease,
    -webkit-backdrop-filter .18s ease, backdrop-filter .18s ease;
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme #app-shell:has(#screen-business.active) > .app-header.has-scrolled-content {
  background: var(--business-aura-header);
  border-bottom-color: transparent;
  box-shadow: inset 0 -1px 0 var(--business-aura-edge);
  -webkit-backdrop-filter: blur(20px) saturate(110%);
  backdrop-filter: blur(20px) saturate(110%);
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme #app-shell:has(#screen-business.active) > .screen-stack {
  grid-area: 1 / 1;
  min-width: 0;
  min-height: 0;
  height: 100%;
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business {
  padding-top: var(--business-aura-header-extent);
  scroll-padding-top: var(--business-aura-header-extent);
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business > .business-aura-stage {
  background: transparent;
  border-radius: 0;
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business > .business-aura-stage::before,
:where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business > .business-aura-stage::after {
  content: none;
  display: none;
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business > .business-aura-stage > .business-aura-backdrop {
  display: block;
  position: absolute;
  inset: calc(-1 * var(--business-aura-header-extent)) 0 -180px;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  filter: blur(12px);
  -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 72px), transparent);
  mask-image: linear-gradient(to bottom, #000 calc(100% - 72px), transparent);
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business .business-aura-glow {
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: calc(1 / 1.2);
  background: radial-gradient(ellipse 65% 60% at center,
    rgb(var(--business-glow-rgb) / calc(var(--business-glow-alpha) * 1.2)), transparent 72%);
}

.business-aura-emerald {
  --business-glow-rgb: var(--business-aura-emerald);
  --business-glow-alpha: var(--business-aura-emerald-alpha);
  transform: translate3d(35%, -25%, 0);
}
.business-aura-leaf {
  --business-glow-rgb: var(--business-aura-leaf);
  --business-glow-alpha: var(--business-aura-leaf-alpha);
  transform: translate3d(-35%, 15%, 0);
}
.business-aura-mint {
  --business-glow-rgb: var(--business-aura-mint);
  --business-glow-alpha: var(--business-aura-mint-alpha);
  transform: translate3d(5%, 30%, 0);
}

/* Light's five moving lights fill the upper 70% of the visible screen. */
:where(html[data-account-aura="on"]:not([data-color-scheme="dark"])) .phone.next-ui-theme #screen-business > .business-aura-stage > .business-aura-backdrop {
  bottom: auto;
  height: var(--aura-scene-height, 70dvh);
}
.business-aura-jade {
  --business-glow-rgb: 20 174 125;
  --business-glow-alpha: 26%;
  transform: translate3d(-24%, -18%, 0);
}
.business-aura-lime {
  --business-glow-rgb: 113 196 83;
  --business-glow-alpha: 24%;
  transform: translate3d(26%, 24%, 0);
}
html[data-color-scheme="dark"] :is(.business-aura-jade, .business-aura-lime) { display: none; }

:where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business .business-aura-stage[data-aura-motion="running"] .business-aura-glow {
  will-change: transform, opacity;
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business > .next-business-summary {
  isolation: isolate;
  overflow: hidden;
  background: var(--business-aura-glass);
  border-color: var(--business-aura-edge);
  box-shadow: 0 12px 30px rgb(16 151 103 / 7%), 0 3px 9px rgb(16 151 103 / 3%);
  -webkit-backdrop-filter: blur(20px) saturate(110%);
  backdrop-filter: blur(20px) saturate(110%);
}

:where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business > .next-business-summary::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(125deg, var(--business-aura-sheen), transparent 43%, transparent 66%, var(--business-aura-sheen));
  box-shadow: inset 0 1px 0 var(--business-aura-edge), inset 1px 0 0 var(--business-aura-sheen);
}

/* Match Home's reflection stacking and depth in dark mode. */
html[data-color-scheme="dark"]:where([data-account-aura="on"]) .phone.next-ui-theme #screen-business > .next-business-summary {
  box-shadow: var(--overview-shadow);
}
html[data-color-scheme="dark"]:where([data-account-aura="on"]) .phone.next-ui-theme #screen-business > .next-business-summary::after {
  z-index: 0;
  box-shadow: inset 0 1px 0 var(--business-aura-edge),
    inset 1px 0 0 var(--business-aura-sheen), inset 0 -1px 0 var(--business-aura-sheen);
}
html[data-color-scheme="dark"]:where([data-account-aura="on"]) .phone.next-ui-theme #screen-business > .next-business-summary > * {
  position: relative;
  z-index: 1;
}

@media (max-width: 767px) {
  :where(html[data-account-aura="on"]) .phone.next-ui-theme:has(#app-shell.active #screen-business.active) {
    padding-top: 0;
    background: var(--biz-canvas, var(--next-app-background));
  }
  :where(html[data-account-aura="on"]) .phone.next-ui-theme:has(#app-shell.active #screen-business.active) > .app-status-surface {
    display: none;
  }
  :where(html[data-account-aura="on"]) .phone.next-ui-theme #app-shell:has(#screen-business.active) > .app-header {
    padding-top: calc(var(--app-top-inset) + var(--app-header-padding-top));
  }
}

@media (prefers-reduced-motion: reduce) {
  :where(html[data-account-aura="on"]) .phone.next-ui-theme #app-shell:has(#screen-business.active) > .app-header { transition: none; }
}

@media (forced-colors: active) {
  :where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business > .business-aura-stage > .business-aura-backdrop { display: none; }
  :where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business > .next-business-summary,
  :where(html[data-account-aura="on"]) .phone.next-ui-theme #app-shell:has(#screen-business.active) > .app-header,
  :where(html[data-account-aura="on"]) .phone.next-ui-theme #app-shell:has(#screen-business.active) > .app-header.has-scrolled-content {
    background: Canvas;
    border-color: CanvasText;
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
  :where(html[data-account-aura="on"]) .phone.next-ui-theme #screen-business > .next-business-summary::after { display: none; }
}
