/**
 * LuxShop responsive and performance refinements.
 * Additive overrides: preserve existing theme components and WooCommerce behavior.
 */

/* Prevent intrinsic media dimensions from creating horizontal overflow. */
*,
*::before,
*::after {
  box-sizing: border-box;
}

img,
picture,
video,
canvas,
svg,
iframe,
embed,
object {
  max-width: 100%;
}

img,
video {
  height: auto;
}

iframe,
video {
  display: block;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: calc(var(--lux-header-h, 0px) + 1rem);
}

body {
  min-width: 0;
  overflow-wrap: break-word;
}

.lux-site,
.lux-container,
.lux-header__inner,
.lux-section,
.lux-section__header,
.lux-product,
.lux-shop-layout,
.woocommerce,
.woocommerce-page {
  min-width: 0;
}

.lux-container {
  width: min(100% - 2rem, var(--lux-container, 1200px));
  margin-inline: auto;
}

/* Stable media boxes reduce layout shift while images load. */
.lux-category-card__media,
.lux-product-card__media,
.lux-instagram__item,
.lux-post-card__media {
  min-width: 0;
  overflow: hidden;
}

.lux-category-card__image,
.lux-product-card img,
.lux-instagram__item img,
.lux-post-card__media img {
  max-width: 100%;
}

/* Long product names, URLs, and form values must not widen the viewport. */
.lux-product-card__title,
.woocommerce-loop-product__title,
.product_title,
.lux-footer,
.lux-content,
.entry-content {
  overflow-wrap: anywhere;
}

input,
select,
textarea,
button {
  max-width: 100%;
  font: inherit;
}

input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
select,
textarea {
  min-width: 0;
}

button,
a,
input,
select,
textarea {
  touch-action: manipulation;
}

.lux-btn,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
  min-height: 44px;
}

/* Avoid accidental overflow from wide tables and embedded content. */
.lux-table,
.woocommerce table.shop_table {
  width: 100%;
  max-width: 100%;
}

.lux-map,
.lux-map iframe,
.wp-block-embed,
.wp-block-embed__wrapper {
  max-width: 100%;
}

.wp-block-embed__wrapper {
  position: relative;
}

/* Flexible type scales without forcing oversized headings on small screens. */
.lux-section__title {
  font-size: clamp(1.6rem, 4vw, 2.5rem);
  line-height: 1.15;
  text-wrap: balance;
}

.lux-section__subtitle,
.lux-hero__text {
  text-wrap: pretty;
}

@media (max-width: 900px) {
  .lux-container {
    width: min(100% - 2rem, var(--lux-container, 1200px));
  }

  .lux-shop-layout,
  .lux-product,
  .lux-cart,
  .lux-checkout__grid,
  .lux-contact__grid,
  .lux-about__story,
  .lux-about__mv-grid,
  .lux-quick-view__grid,
  .lux-testimonials__grid,
  .lux-posts-grid {
    min-width: 0;
  }

  .lux-product__gallery,
  .lux-product__summary,
  .lux-shop-main,
  .lux-shop-sidebar {
    min-width: 0;
    max-width: 100%;
  }

  .woocommerce div.product div.images,
  .woocommerce div.product div.summary {
    float: none;
    width: 100%;
  }
}

@media (max-width: 640px) {
  .lux-container {
    width: calc(100% - 2rem);
  }

  .lux-hero {
    min-height: min(78svh, 720px);
    min-height: min(78vh, 720px);
  }

  .lux-hero__content {
    max-width: 100%;
  }

  .lux-hero__title {
    font-size: clamp(2rem, 10vw, 3.25rem);
    line-height: 1.08;
    overflow-wrap: anywhere;
  }

  .lux-header__inner {
    gap: clamp(0.35rem, 2vw, 0.75rem);
  }

  .lux-header__actions {
    min-width: 0;
    gap: clamp(0.15rem, 1.5vw, 0.5rem);
  }

  .lux-header__brand img,
  .custom-logo {
    max-width: min(42vw, 180px);
    height: auto;
  }

  .lux-section {
    min-width: 0;
  }

  .lux-newsletter-form input,
  .lux-search-form input,
  .woocommerce .quantity .qty {
    min-width: 0;
    max-width: 100%;
  }

  .woocommerce ul.products li.product,
  .woocommerce-page ul.products li.product {
    width: 100%;
    margin-inline: 0;
  }

  .woocommerce div.product .woocommerce-tabs ul.tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
  }

  .woocommerce div.product .woocommerce-tabs ul.tabs li {
    margin: 0;
  }

  .woocommerce table.shop_table_responsive tr td,
  .woocommerce-page table.shop_table_responsive tr td {
    overflow-wrap: anywhere;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
