/*
 * Gentle depth, without changing image crops or moving page layout.
 * No scroll listeners, entrance effects, permanent compositing or dependencies.
 */
:root {
  --tbb-soft-rest: 0 3px 12px rgb(24 28 25 / 5%);
  --tbb-soft-hover: 0 7px 18px rgb(24 28 25 / 9%);
  --tbb-soft-ease: cubic-bezier(.16, 1, .3, 1);
}

/* Frame-level effects preserve the product-specific transforms inside images. */
html body :is(.tbb15__product-img, .tbbg2__card-img),
body.tbb-bundle-motion :is(.photo-stage, .thumbnail, .scent-photo) {
  box-shadow: var(--tbb-soft-rest);
  transition: box-shadow 220ms var(--tbb-soft-ease), translate 220ms var(--tbb-soft-ease);
}

/* The product gallery is not a button; give it depth, not hover movement. */
html body .tbb-single2__hero-img {
  box-shadow: var(--tbb-soft-rest) !important;
}

body.tbb-bundle-motion .bundle-option {
  transition: background-color 180ms var(--tbb-soft-ease), border-color 180ms var(--tbb-soft-ease);
}

/* Existing selected outlines and inset borders stay authoritative. */
body.tbb-bundle-motion .bundle-option:focus-within {
  outline: 2px solid var(--green);
  outline-offset: 3px;
}

html body :is(.elementor-button, .tbb15__panel-cta, .tbb15__product-cart,
  .tbbg2__card-cart, .tbb-single2__cart, .tbb-sub2__btn,
  .tbb-post2__content-cta, .tbb-post2__related-all),
body.tbb-bundle-motion :is(.primary-button, .quantity button) {
  transition: background-color 180ms var(--tbb-soft-ease),
    color 180ms var(--tbb-soft-ease), border-color 180ms var(--tbb-soft-ease),
    box-shadow 180ms var(--tbb-soft-ease), translate 180ms var(--tbb-soft-ease);
}

/* Pointer-only feedback: no sticky hover lifts on touch screens. */
@media (hover: hover) and (pointer: fine) {
  html body :is(.tbb15__product, .tbbg2__card):hover :is(.tbb15__product-img, .tbbg2__card-img),
  body.tbb-bundle-motion :is(.thumbnail, .scent-photo):hover:not(:disabled) {
    box-shadow: var(--tbb-soft-hover);
  }

  body.tbb-bundle-motion .bundle-option:hover:not(:has(input:checked)) {
    background-color: #f4f0e7;
    border-color: #9caaa1;
  }

  html body :is(.elementor-button, .tbb15__panel-cta, .tbb15__product-cart,
    .tbbg2__card-cart, .tbb-single2__cart, .tbb-sub2__btn,
    .tbb-post2__content-cta, .tbb-post2__related-all):hover:not(:disabled, .disabled, .loading, [aria-disabled="true"]),
  body.tbb-bundle-motion .primary-button:hover:not(:disabled) {
    box-shadow: 0 4px 12px rgb(24 28 25 / 10%);
  }
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html body :is(.tbb15__product, .tbbg2__card):hover :is(.tbb15__product-img, .tbbg2__card-img),
  body.tbb-bundle-motion :is(.thumbnail, .scent-photo):hover:not(:disabled) {
    translate: 0 -2px;
  }

  /* Never move checkout/payment or form submission controls. */
  html body:not(.woocommerce-checkout):not(.woocommerce-cart)
    :is(a.elementor-button, .tbb15__panel-cta, .tbb15__product-cart,
    .tbbg2__card-cart, .tbb-single2__cart, .tbb-sub2__btn,
    .tbb-post2__content-cta, .tbb-post2__related-all):hover:not(.disabled, .loading, [aria-disabled="true"]),
  body.tbb-bundle-motion .primary-button:hover:not(:disabled) {
    translate: 0 -1px;
  }

  body.tbb-bundle-motion :is(.primary-button, .thumbnail, .scent-photo):active:not(:disabled) {
    translate: 0 0;
  }
}

/* Keep keyboard feedback visible without introducing spatial animation. */
html body :is(.tbb15__product, .tbbg2__card):focus-within :is(.tbb15__product-img, .tbbg2__card-img),
body.tbb-bundle-motion :is(.thumbnail, .scent-photo):focus-visible {
  box-shadow: var(--tbb-soft-hover);
}

/* Existing editorial cards already lift 4px; soften that to the same 2px rhythm. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  html body .tbb-blog2__post:hover {
    transform: translateY(-2px);
    box-shadow: var(--tbb-soft-hover);
  }
}

@media (prefers-reduced-motion: reduce) {
  html body :is(.tbb15__product-img, .tbbg2__card-img, .tbb-blog2__post),
  body.tbb-bundle-motion :is(.photo-stage, .thumbnail, .scent-photo, .primary-button) {
    transition: none;
    translate: none;
  }
  html body .tbb-blog2__post:hover {
    transform: none;
  }
}