/* Amaron — WooCommerce pages. Clarity over spectacle: no motion, no tilt, no scenes here.
   Styling only; WooCommerce renders and calculates everything. */

.am-shop { padding-top: 40px; }
.am-shop .woocommerce-products-header__title, .am-shop .page-title { font-size: clamp(36px, 4.6vw, 64px); line-height: 1.08; margin: 0 0 12px; }
.am-shop .term-description { max-width: 60ch; font-size: 17px; }
.am-shop.am-theme-supplements .woocommerce-products-header, .am-shop.am-theme-superfoods .woocommerce-products-header, .am-shop.am-theme-botanicals .woocommerce-products-header { background: var(--cat-bg); color: var(--cat-ink); padding: 32px; margin-bottom: 32px; }
.woocommerce .woocommerce-result-count { font-size: 14px; color: var(--am-muted); }
.woocommerce .woocommerce-ordering select { min-height: 44px; }
.woocommerce ul.products { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 40px 24px; margin: 24px 0 0 !important; padding: 0; }
.woocommerce ul.products::before, .woocommerce ul.products::after { display: none !important; }
.woocommerce ul.products li.am-loop-item { width: auto !important; margin: 0 !important; float: none !important; list-style: none; }
@media (max-width: 900px) { .woocommerce ul.products { grid-template-columns: 1fr 1fr; gap: 28px 16px; } }
@media (max-width: 480px) { .woocommerce ul.products { grid-template-columns: 1fr; } }
.woocommerce nav.woocommerce-pagination ul { border: 0; display: flex; gap: 8px; }
.woocommerce nav.woocommerce-pagination ul li { border: 0; }
.woocommerce nav.woocommerce-pagination ul li a, .woocommerce nav.woocommerce-pagination ul li span { min-width: 44px; min-height: 44px; display: grid; place-items: center; border: 1px solid var(--am-line); }

/* Product page */
.woocommerce div.product { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(28px, 5vw, 80px); align-items: start; }
.woocommerce div.product > .woocommerce-product-gallery, .woocommerce div.product > .summary { width: auto !important; float: none !important; margin: 0 !important; }
.woocommerce div.product > .woocommerce-product-gallery { position: sticky; top: 110px; }
.woocommerce div.product > .woocommerce-tabs, .woocommerce div.product > .related, .woocommerce div.product > .am-knowledge, .woocommerce div.product > .upsells { grid-column: 1 / -1; }
.woocommerce div.product .product_title { font-size: clamp(36px, 4vw, 58px); line-height: 1.08; }
.woocommerce div.product p.price, .woocommerce div.product span.price { color: var(--am-ink); font: 500 22px/1.3 var(--am-sans); }
.am-price-state { font: 400 18px/1.3 var(--am-sans); color: var(--am-muted); }
.am-pdp__pack { color: var(--am-muted); margin-top: -6px; }
.am-pdp__sample { margin: 16px 0; }
.am-state-panel { margin: 22px 0; display: grid; gap: 12px; justify-items: start; }
.am-state-panel p { margin: 0; }
.woocommerce div.product form.cart { display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch; margin: 24px 0; }
.woocommerce div.product form.cart .quantity .qty { width: 72px; min-height: 52px; text-align: center; }
.woocommerce div.product form.cart .single_add_to_cart_button { flex: 1; min-width: 200px; }
.woocommerce div.product .woocommerce-tabs ul.tabs { padding: 0; margin: 0 0 24px; border-bottom: 1px solid var(--am-line); display: flex; flex-wrap: wrap; gap: 4px 24px; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::before, .woocommerce div.product .woocommerce-tabs ul.tabs li::after { display: none; }
.woocommerce div.product .woocommerce-tabs ul.tabs li { background: none; border: 0; margin: 0; padding: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { padding: 12px 0; display: block; font-weight: 500; }
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { border-bottom: 2px solid var(--am-olive); }
.woocommerce div.product .woocommerce-tabs .panel { max-width: 760px; }
.woocommerce .related > h2 { font-size: clamp(28px, 3vw, 42px); }
.woocommerce span.onsale { display: none; }
@media (max-width: 900px) {
  /* plain flow on phones/tablets: the gallery slider resizes itself after layout, which a grid row did not follow */
  .woocommerce div.product { display: block; }
  .woocommerce div.product > .woocommerce-product-gallery { position: relative; top: auto; } /* the desktop sticky offset (top: 110px) shifted it over the title */
  .woocommerce div.product > .summary, .woocommerce div.product > .am-knowledge, .woocommerce div.product > .related, .woocommerce div.product > .woocommerce-tabs { margin-top: 32px !important; }
  .woocommerce div.product div.images .flex-control-thumbs { display: flex; gap: 8px; overflow-x: auto; scroll-snap-type: x mandatory; padding-top: 8px; }
  .woocommerce div.product div.images .flex-control-thumbs li { flex: 0 0 22%; width: auto !important; float: none !important; scroll-snap-align: start; }
}

/* Notices */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .wc-block-components-notice-banner { border: 1px solid var(--am-line); border-left: 3px solid var(--am-olive); background: var(--am-paper); color: var(--am-ink); border-radius: 0; }
.woocommerce-error { border-left-color: var(--am-error); }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { color: var(--am-olive); }

/* Cart, checkout, account: calm, readable, generous targets */
.am-transactional .am-main { background: var(--am-paper); }
.am-transactional .am-main .page-header .entry-title, .am-transactional h1.entry-title { font-size: clamp(32px, 4vw, 52px); max-width: var(--am-max); margin: 0 auto; padding: 48px var(--am-gutter) 8px; box-sizing: border-box; }
.am-transactional .page-content, .am-transactional .woocommerce { max-width: var(--am-max); margin: 0 auto; padding: 16px var(--am-gutter) 72px; box-sizing: border-box; }
.wc-block-cart, .wc-block-checkout { font-family: var(--am-sans); }
.wc-block-components-text-input input, .wc-block-components-combobox .wc-block-components-combobox-control input, .wc-blocks-components-select select { border-radius: 0 !important; }
.wc-block-components-button, .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button { border-radius: 0 !important; min-height: 52px; }
.wc-block-components-totals-wrapper, .wc-block-components-order-summary { border-color: var(--am-line) !important; }
.woocommerce table.shop_table { border-radius: 0; border-color: var(--am-line); }
.woocommerce form .form-row input.input-text, .woocommerce form .form-row textarea, .woocommerce form .form-row select { min-height: 48px; }
.woocommerce-checkout #payment { background: var(--am-cream); border-radius: 0; }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--am-line); }
.woocommerce-MyAccount-navigation li a { display: block; padding: 12px 0; border-bottom: 1px solid var(--am-line); text-decoration: none; min-height: 44px; box-sizing: border-box; }
.woocommerce-MyAccount-navigation li.is-active a { font-weight: 600; color: var(--am-olive); }
@media (min-width: 901px) {
  .woocommerce-account.logged-in .woocommerce { display: grid; grid-template-columns: 220px 1fr; gap: 48px; }
  .woocommerce-account .woocommerce-MyAccount-navigation, .woocommerce-account .woocommerce-MyAccount-content { width: auto; float: none; }
}
@media (max-width: 900px) {
  .woocommerce-MyAccount-navigation ul { display: flex; overflow-x: auto; gap: 18px; border: 0; border-bottom: 1px solid var(--am-line); }
  .woocommerce-MyAccount-navigation li a { white-space: nowrap; border: 0; }
}

/* Checkout header/footer are reduced to the essentials */
.am-header--checkout .am-header__inner { justify-content: space-between; min-height: 72px; }
.am-footer--checkout { padding-top: 24px; }

/* the Cart block renders after load: reserve its space so the footer does not jump (CLS) */
.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout { min-height: 60vh; }

/* WooCommerce hides the gallery (opacity 0) until its script runs, which delays LCP on product pages.
   The first image is shown at once; the slider enhances it later. */
.woocommerce div.product div.images.woocommerce-product-gallery { opacity: 1 !important; }

/* WooCommerce's purple .alt buttons (single add to cart, checkout) take the brand olive */
.woocommerce button.button.alt, .woocommerce a.button.alt, .woocommerce input.button.alt, .woocommerce #respond input#submit.alt { background: var(--am-olive); color: var(--am-paper); border: 1px solid var(--am-olive); border-radius: 0; font: 500 14px/1.5 var(--am-sans); padding: 15px 24px; }
.woocommerce button.button.alt:hover, .woocommerce a.button.alt:hover, .woocommerce input.button.alt:hover { background: var(--am-ink); border-color: var(--am-ink); color: var(--am-paper); }
.woocommerce button.button.alt.disabled, .woocommerce button.button.alt:disabled { background: var(--am-olive); opacity: .5; }

/* sign-in / register: one calm column */
.woocommerce-account:not(.logged-in) .woocommerce { max-width: 520px; }
.woocommerce-account:not(.logged-in) .woocommerce form.login, .woocommerce-account:not(.logged-in) .woocommerce form.register { border: 1px solid var(--am-line); border-radius: 0; padding: 28px; margin: 16px 0 0; }
.woocommerce form .form-row input.input-text { width: 100%; }
.woocommerce-account:not(.logged-in) .col2-set .col-1, .woocommerce-account:not(.logged-in) .col2-set .col-2 { width: 100%; float: none; }