/*
 * Rowland Made Website V159
 * Flat Interactive Surfaces — card, category and image-frame standard.
 *
 * Rest state: no hard offset shadow; either a single quiet 1px border or no
 * border for image-only frames. Pointer and keyboard interaction adds a small
 * vertical lift and a soft ambient shadow without changing layout.
 */

:root {
  --rm-flat-surface-border: rgba(7, 30, 61, 0.14);
  --rm-flat-surface-hover-shadow: 0 12px 26px rgba(7, 30, 61, 0.11);
  --rm-flat-surface-focus: var(--pink, #f68da8);
}

/* Clickable category, product, promotional and gallery-summary cards. */
:is(
  .rm-live-pc-category-card,
  .rm-live-pc-catalogue-card,
  .rm-live-pc-promo-card,
  .rm-live-pc-link-banner,
  .home-vibe .cat,
  .mobile-category-card,
  .desktop-category-card-v127,
  .desktop-category-card-v141,
  .card[data-product-card],
  .mobile-shop-product-card[data-product-card],
  .rm-past-card,
  .rm-ymal-card
) {
  border: 1px solid var(--rm-flat-surface-border) !important;
  box-shadow: none !important;
  transform: translateY(0);
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease;
}

/* Image-only presentation frames stay completely flat. */
:is(
  .rm-live-pc-image-text > figure,
  .rm-live-pc-feature-image,
  .rm-live-pc-gallery figure,
  .story-img,
  .meet-rowlands-family-image,
  .rowland-maker-image,
  .pdp-carousel
) {
  border: 0 !important;
  box-shadow: none !important;
}

/* Gallery images are interactive only when their lightbox button is present. */
.rm-live-pc-gallery figure:has(.rm-live-pc-gallery-button) {
  transform: translateY(0);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

@media (hover: hover) and (pointer: fine) {
  :is(
    .rm-live-pc-category-card,
    .rm-live-pc-catalogue-card,
    .rm-live-pc-promo-card,
    .rm-live-pc-link-banner,
    .home-vibe .cat,
    .mobile-category-card,
    .desktop-category-card-v127,
    .desktop-category-card-v141,
    .card[data-product-card],
    .mobile-shop-product-card[data-product-card],
    .rm-past-card,
    .rm-ymal-card
  ):hover,
  .rm-live-pc-gallery figure:has(.rm-live-pc-gallery-button):hover {
    border-color: rgba(7, 30, 61, 0.2) !important;
    box-shadow: var(--rm-flat-surface-hover-shadow) !important;
    transform: translateY(-3px);
  }
}

:is(
  .rm-live-pc-category-card,
  .rm-live-pc-catalogue-card,
  .rm-live-pc-promo-card,
  .rm-live-pc-link-banner,
  .home-vibe .cat,
  .mobile-category-card,
  .desktop-category-card-v127,
  .desktop-category-card-v141
):focus-visible,
:is(
  .card[data-product-card],
  .mobile-shop-product-card[data-product-card],
  .rm-past-card,
  .rm-ymal-card,
  .rm-live-pc-gallery figure
):focus-within {
  outline: 3px solid var(--rm-flat-surface-focus);
  outline-offset: 3px;
  box-shadow: var(--rm-flat-surface-hover-shadow) !important;
  transform: translateY(-3px);
}

@media (prefers-reduced-motion: reduce) {
  :is(
    .rm-live-pc-category-card,
    .rm-live-pc-catalogue-card,
    .rm-live-pc-promo-card,
    .rm-live-pc-link-banner,
    .home-vibe .cat,
    .mobile-category-card,
    .desktop-category-card-v127,
    .desktop-category-card-v141,
    .card[data-product-card],
    .mobile-shop-product-card[data-product-card],
    .rm-past-card,
    .rm-ymal-card,
    .rm-live-pc-gallery figure
  ) {
    transition: none !important;
  }

  :is(
    .rm-live-pc-category-card,
    .rm-live-pc-catalogue-card,
    .rm-live-pc-promo-card,
    .rm-live-pc-link-banner,
    .home-vibe .cat,
    .mobile-category-card,
    .desktop-category-card-v127,
    .desktop-category-card-v141,
    .card[data-product-card],
    .mobile-shop-product-card[data-product-card],
    .rm-past-card,
    .rm-ymal-card,
    .rm-live-pc-gallery figure
  ):hover,
  :is(
    .rm-live-pc-category-card,
    .rm-live-pc-catalogue-card,
    .rm-live-pc-promo-card,
    .rm-live-pc-link-banner,
    .home-vibe .cat,
    .mobile-category-card,
    .desktop-category-card-v127,
    .desktop-category-card-v141,
    .card[data-product-card],
    .mobile-shop-product-card[data-product-card],
    .rm-past-card,
    .rm-ymal-card,
    .rm-live-pc-gallery figure
  ):focus-within {
    transform: none;
  }
}
