/* Shine Store render-path optimizations.
 * Keep the original design on desktop and only simplify the surfaces most likely
 * to be repainted during mobile scrolling. Avoid a global `*` filter reset:
 * it changes unrelated cards/dialogs and can lose to ID-qualified declarations.
 */
@supports (content-visibility: auto) {
  .shine-app-v17 main > section:not(:first-child),
  .shine-elementor-home main > section:not(:first-child),
  .shine-home-page main > section:not(:first-child) {
    content-visibility: auto;
    contain-intrinsic-size: auto 520px;
  }
}

/* Fixed/sticky translucent chrome is visible across many scroll frames.
 * A solid, nearly opaque surface preserves contrast without sampling the page
 * behind it on every frame. This does not alter product cards or modal artwork.
 */
@media (max-width: 767px), (pointer: coarse) {
  .app-topbar,
  .shine-mobile-bottom-nav,
  .shine-v17-notice,
  .app-shop-toolbar-v16,
  .shine-checkout-page .shine-checkout-mobile-cta,
  .shine-cart-page .shine-cart-mobile-cta {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /* This bar uses an ID-qualified !important rule in the app bundle, so match
   * its specificity explicitly rather than relying on a universal selector. */
  #shine-sidebar.shine-premium-menu .shine-menu-bottom {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background-color: rgba(255, 255, 255, .98) !important;
  }

  .app-topbar {
    background-color: rgba(255, 255, 255, .98) !important;
  }

  .shine-mobile-bottom-nav {
    background-color: rgba(255, 255, 255, .98) !important;
  }

  .shine-v17-notice {
    background-color: rgba(255, 255, 255, .98) !important;
  }

  .app-shop-toolbar-v16 {
    background-color: rgba(255, 255, 255, .98) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html:focus-within {
    scroll-behavior: auto !important;
  }

  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* Avoid scroll-triggered translate/fade reveals on touch screens. These effects
 * can make content appear to lag behind the user's finger on slower devices.
 * Keep the reveal elements visible and preserve drawer, sheet and button motion.
 */
@media (max-width: 767px), (pointer: coarse) {
  .app-reveal,
  .app-reveal.is-in {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Product-page scroll pass (v4).
 * The base product stylesheet gives the large details/reviews card a backdrop blur,
 * keeps the gallery card sticky, and animates both opacity and transform on every
 * gallery slide. These effects are unnecessary during normal mobile scrolling and
 * can increase paint/compositing work on lower-end devices. Scope changes to touch/small screens.
 */
@media (max-width: 767px), (pointer: coarse) {
  /* A large blurred surface can repeatedly sample the content moving behind it. */
  .shine-v18-product-page .sp-detail-card {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background-color: rgba(255, 255, 255, .98);
    content-visibility: auto;
    contain-intrinsic-size: auto 900px;
  }

  /* Sticky gallery is useful on desktop, but adds unnecessary sticky work on mobile. */
  .shine-v18-product-page .sp-gallery-card {
    position: relative;
    top: auto;
  }

  /* Keep gallery switching responsive, but avoid transform animation while scrolling. */
  .shine-v18-product-page .sp-slide {
    transform: none;
    transition: opacity .16s ease;
  }

  .shine-v18-product-page .sp-slide.is-active {
    transform: none;
  }

  /* The active detail panel should not run an entrance animation as it enters view. */
  .shine-v18-product-page .sp-detail-panel.is-active {
    animation: none !important;
  }

  /* Remove glass blur from the small gallery controls too; keep their appearance. */
  .shine-v18-product-page .sp-gallery-topbar .sp-icon-action,
  .shine-v18-product-page .sp-gallery-control,
  .shine-v18-product-page .sp-zoom {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}


/* Drawer exclusivity active states: keep navigation feedback synchronized with
 * the currently open category/cart drawer on desktop and mobile. */
.shine-v17-shop-menu-trigger.is-active {
  box-shadow: 0 0 0 2px rgba(255, 102, 153, .22), 0 8px 20px rgba(255, 102, 153, .18);
}
.app-icon.js-app-cart.is-active {
  color: var(--app-primary, #ff6699);
  background-color: rgba(255, 102, 153, .13);
  border-color: rgba(255, 102, 153, .38);
}
.shine-bottom-item.js-app-cart.is-active,
.shine-bottom-item.shine-v17-shop-menu-trigger.is-active {
  color: var(--app-primary, #ff6699);
}
