/*
  NURYA — Header overlay mode (homepage only)
  Purely cosmetic layer on top of the existing header. Does not change
  its markup structure, menu/search/cart logic, or the sticky-header
  script — only background/text color, gated by the .nurya-header--overlay
  class added in header.liquid when template.name == 'index'.
*/

.header-wrapper.nurya-header--overlay {
  position: relative;
  z-index: 2;
  background-color: transparent;
  border-bottom-color: transparent;
  /* Recolors every descendant that reads these existing theme tokens
     (logo text, menu links, icons) — same mechanism the theme already
     uses for its own color schemes (.color-accent-1, .color-inverse...). */
  --color-foreground: 246, 241, 231;
  --color-link: 246, 241, 231;
  transition: background-color 320ms ease, border-color 320ms ease;
}

.section-header.scrolled-past-header .header-wrapper.nurya-header--overlay {
  background-color: rgba(11, 11, 13, 0.92);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

/* Product pages have no hero image behind the header, so it must be
   solid dark from the start — never transparent (unlike the homepage
   overlay above, which relies on the Hero scene behind it). */
.header-wrapper.nurya-header--solid-dark {
  background-color: rgb(11, 11, 13);
  border-bottom-color: transparent;
  --color-foreground: 246, 241, 231;
  --color-link: 246, 241, 231;
}