/*
 * Storefront boundary rules. Detailed catalog, product, cart and checkout
 * presentation belongs to Checkpoints 9 through 11.
 */

body.duos-site .woocommerce {
  color: var(--color-ink);
  font-family: var(--font-text);
  font-size: var(--text-body);
  line-height: var(--leading-body);
}

body.duos-site .woocommerce :where(h1, h2, h3) {
  color: var(--color-ink);
  font-family: var(--font-display);
  font-weight: var(--weight-display-heading);
}

body.duos-site .woocommerce img {
  border-radius: 0;
}

/* Use the existing Woo archive/account templates within the DUOS shell. */
body.duos-commerce-page .content-area { width: 100%; float: none; }
body.duos-commerce-page #secondary { display: none; }
body.duos-site ul.products li.product img.duos-loop-image { height: 280px; width: 100%; object-fit: contain; }
body.duos-commerce-page .entry-title,
body.duos-commerce-page .woocommerce-products-header__title {
  font-family: var(--font-display);
  font-weight: var(--weight-display-heading);
  font-size: var(--text-heading);
}

/* CP11: retain the assigned Woo blocks and their responsive form layout. */
body.duos-site.duos-purchase .content-area { width: 100%; float: none; }
body.duos-purchase #secondary,
body.duos-purchase .storefront-handheld-footer-bar { display: none; }
body.duos-purchase .entry-title {
  font-family: var(--font-display); font-size: var(--text-heading);
  font-weight: var(--weight-display-heading); line-height: var(--leading-heading);
}
body.duos-site.duos-purchase .entry-content > :is(.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout) {
  width: 100%; max-width: 100%; margin-inline: 0;
  font-family: var(--font-text); font-size: var(--text-body);
  color: var(--color-ink);
}
body.duos-purchase .entry-content :is(h2, h3) {
  font-family: var(--font-display); font-weight: var(--weight-display-heading);
  color: var(--color-ink);
}
body.duos-purchase .entry-content a { color: var(--color-ink); }
body.duos-purchase :is(.wp-block-woocommerce-cart-totals-block, .wp-block-woocommerce-checkout-totals-block) {
  box-sizing: border-box; background: var(--surface-paper);
  border-radius: var(--radius-cards); padding: var(--card-padding);
}
body.duos-purchase .entry-content .wc-block-components-button,
body.duos-purchase .entry-content .button {
  background: var(--color-ink); color: var(--color-canvas);
  border-radius: var(--radius-buttons); min-height: 44px;
  box-shadow: none; font-family: var(--font-text);
  font-weight: var(--weight-medium);
  text-decoration: none;
}
body.duos-purchase .entry-content .wc-block-components-button:is(:hover, :focus),
body.duos-purchase .entry-content .button:is(:hover, :focus) {
  background: var(--color-graphite); color: var(--color-canvas);
}
body.duos-purchase .wc-block-components-button:disabled { opacity: 0.55; cursor: not-allowed; }
body.duos-purchase .entry-content :is(input, select, textarea) {
  font-family: var(--font-text); box-shadow: none; color: var(--color-ink);
}
body.duos-purchase .entry-content :is(button, a, input, select, textarea):focus-visible {
  outline: 2px solid var(--color-graphite); outline-offset: 3px;
}
body.duos-purchase .wc-block-cart__submit-container { background: var(--surface-canvas); }
body.duos-purchase .wc-block-cart__submit-container::before { box-shadow: none; }
@media (min-width: 768px) {
  /* Keep the CTA visible if Woo's sticky class survives a viewport change. */
  body.duos-site.duos-purchase .wc-block-cart__submit-container {
    display: block; position: static; width: 100%; transform: none;
  }
}
@media (max-width: 767px) {
  body.duos-purchase :is(.wp-block-woocommerce-cart-totals-block, .wp-block-woocommerce-checkout-totals-block) {
    padding: var(--spacing-16);
  }
}
@media (max-width: 480px) {
  /* Woo 11.1's fixed mobile columns can exceed the DUOS page gutter at 320px. */
  body.duos-purchase .wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row {
    grid-template-columns: 64px minmax(0, 1fr); column-gap: var(--spacing-14);
  }
  body.duos-purchase .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__image { padding-right: 0; }
  body.duos-purchase .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__product { grid-column: 2; min-width: 0; }
  body.duos-purchase .wc-block-cart table.wc-block-cart-items .wc-block-cart-item__total {
    grid-column: 2; grid-row: 2; justify-content: flex-start; padding-top: var(--spacing-7);
  }
}

/* CP10: scope to mapped DUOS products; native Woo forms retain their behavior. */
body.duos-product .content-area { width: 100%; float: none; }
body.duos-product #secondary { display: none; }
body.duos-product div.product.type-product {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: var(--spacing-72);
  align-items: start;
  color: var(--color-ink);
  font-family: var(--font-text);
}
body.duos-product div.product::before,
body.duos-product div.product::after { display: none; }
body.duos-product .duos-product-heading,
body.duos-product div.product > .woocommerce-tabs,
body.duos-product div.product > .related,
body.duos-product div.product > .upsells { grid-column: 1 / -1; }
body.duos-product .duos-product-heading { margin-bottom: var(--spacing-29); }
body.duos-product .product_title {
  font-family: var(--font-display);
  font-size: var(--text-heading);
  font-weight: var(--weight-display-heading);
  line-height: var(--leading-heading);
}
body.duos-site.duos-product.single-product div.product > .summary {
  width: 100%; margin: 0; float: none; min-width: 0;
}
body.duos-product .duos-product-gallery {
  margin: 0; display: flex; justify-content: center; min-width: 0;
}
body.duos-product .duos-product-gallery img {
  height: calc(480px * var(--height-ratio, 1));
  width: auto; max-width: 100%; object-fit: contain;
}
body.duos-site.duos-product.single-product div.product > .woocommerce-product-gallery { width: 100%; float: none; margin: 0; min-width: 0; }
body.duos-product .woocommerce-product-gallery .woocommerce-product-gallery__image img:not(.zoomImg) {
  height: calc(480px * var(--duos-product-height-ratio, 1)); width: 100%; object-fit: contain;
}
body.duos-site.duos-product.single-product div.product .summary .price {
  font-family: var(--font-display); font-size: var(--text-price);
  font-weight: var(--weight-display-heading); color: var(--color-ink);
}
body.duos-product .summary form.cart { margin-block: var(--spacing-22); }
body.duos-product .summary .variations { margin-bottom: var(--spacing-22); }
body.duos-product .summary a { color: var(--color-ink); }
body.duos-product .summary .variations th,
body.duos-product .summary .variations td { background: transparent; padding: var(--spacing-7) 0; }
body.duos-product .summary select {
  max-width: 100%; min-height: 44px; padding: var(--spacing-10) var(--spacing-16);
  border: 1px solid var(--color-graphite); border-radius: var(--radius-tags);
  color: var(--color-ink); background: var(--surface-canvas); font: inherit;
}
body.duos-product .summary .single_add_to_cart_button {
  background: var(--color-ink); color: var(--color-canvas);
  border-radius: var(--radius-buttons); min-height: 44px;
  padding: var(--spacing-16) var(--spacing-29); font-family: var(--font-text);
}
body.duos-product .summary .single_add_to_cart_button.disabled,
body.duos-product .summary .single_add_to_cart_button:disabled { opacity: 0.55; }
body.duos-product .summary :is(button, select, input, a):focus-visible {
  outline: 2px solid var(--color-graphite); outline-offset: 3px;
}
body.duos-product .duos-product-card {
  background: var(--surface-paper); border-radius: var(--radius-cards);
  padding: var(--card-padding); margin-block: var(--spacing-22);
}
body.duos-product .duos-product-meta {
  font-family: var(--font-text); font-size: var(--text-label);
  font-weight: var(--weight-regular); line-height: var(--leading-label);
  letter-spacing: var(--tracking-label);
}
body.duos-product .duos-product-specs { margin: 0; }
body.duos-product .duos-product-specs > div {
  display: grid; grid-template-columns: 140px minmax(0, 1fr);
  gap: var(--spacing-14); padding-block: var(--spacing-14);
  border-bottom: 1px solid var(--color-graphite);
}
body.duos-product .duos-product-specs > div:last-child { border-bottom: 0; }
body.duos-product .duos-product-specs dt { font-size: var(--text-label); font-weight: var(--weight-regular); }
body.duos-product .duos-product-specs dd { margin: 0; overflow-wrap: anywhere; }
body.duos-product .duos-product-note { font-size: var(--text-caption); line-height: var(--leading-caption); }

@media (max-width: 767px) {
  body.duos-product div.product.type-product { grid-template-columns: minmax(0, 1fr); gap: var(--spacing-29); }
  body.duos-product .duos-product-gallery img { height: calc(280px * var(--height-ratio, 1)); }
  body.duos-product .woocommerce-product-gallery .woocommerce-product-gallery__image img:not(.zoomImg) { height: calc(280px * var(--duos-product-height-ratio, 1)); }
  body.duos-product .duos-product-specs > div { grid-template-columns: 100px minmax(0, 1fr); }
  body.duos-product .duos-product-card { padding: var(--spacing-16); }
}
