/* =====================================================================
   SITAARA — WOOCOMMERCE LAYER (design-token styles ONLY)
   The preserved styles.css/pages.css are untouched. WC core enqueue is
   stripped, so the commerce widgets (single add-to-cart, cart, checkout,
   account, notices, forms) are styled here with the site tokens so they
   read as Sitaara, not "default WooCommerce".
   Tokens: --paper #fbfaf7 · --cream #f2ece3 · --maroon #5A1825 · --ink #171311
           --muted #776e65 · --line #d9d0c5 · --serif·--sans · --cardR · --fs-*
   ===================================================================== */

/* ---- Shared bleed-fix: WC page wrappers sit below the fixed header ---- */
.woocommerce-page .p-page,
.woocommerce .p-page { padding-top: clamp(110px, 13vw, 150px) }

/* ---- Typography for the price system ---- */
.woocommerce .price,
.woocommerce .woocommerce-Price-amount,
.cart_totals table th .woocommerce-Price-amount { color: var(--maroon); font-family: var(--serif); font-size: var(--fs-name); white-space: nowrap }
.catalogue-product-purchase .price { font-size: clamp(28px, 3.4vw, 40px); color: var(--ink); font-family: var(--serif) }
.catalogue-product-purchase .price .woocommerce-Price-amount { color: var(--ink) }
.woocommerce del .woocommerce-Price-amount { color: var(--muted); text-decoration: line-through }
.woocommerce ins { text-decoration: none }

/* ---- Quantity + purchase controls (single product) ---- */
.catalogue-product-purchase { display: grid; gap: 18px }
.catalogue-product-purchase .quantity { display: inline-grid; grid-auto-flow: column; align-items: center; gap: 0 }
.catalogue-product-purchase .quantity input { width: 64px; border: 0; border-bottom: 1px solid var(--line); background: transparent; padding: 12px 12px 12px 0; font: inherit; color: inherit; outline: none; text-align: center }
.catalogue-product-purchase .quantity input:focus { border-color: var(--ink) }
.catalogue-product-purchase .single_add_to_cart_button,
.catalogue-product-purchase a.button { position: relative; width: fit-content; padding: 15px 30px; background: var(--maroon); color: #fff; text-align: center; text-transform: uppercase; letter-spacing: .13em; font-size: var(--fs-ui); border: 0; cursor: pointer; transition: opacity .25s ease }
.catalogue-product-purchase .single_add_to_cart_button:hover { opacity: .88 }
.catalogue-product-purchase .single_add_to_cart_button.loading { opacity: .6; pointer-events: none }
.catalogue-product-purchase .single_add_to_cart_button.added::after { content: " ✓"; font-size: .8em }
.catalogue-product-purchase .stock { font-size: var(--fs-label); letter-spacing: .12em; text-transform: uppercase; color: var(--muted) }
.catalogue-product-purchase .stock.in-stock::before { content: "● "; color: #3a7d44 }

/* ---- Generic buttons used across WC templates ---- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit { display: inline-block; padding: 14px 26px; background: var(--ink); color: #fff; text-transform: uppercase; letter-spacing: .13em; font-size: var(--fs-ui); border: 0; border-radius: 0; cursor: pointer; transition: opacity .25s ease; font-weight: normal }
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover { opacity: .85; color: #fff; background: var(--ink) }
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt { background: var(--maroon); color: #fff }
.woocommerce a.button.alt:hover { background: var(--maroon); opacity: .88; color: #fff }
.woocommerce a.button.disabled,
.woocommerce button.button.disabled { opacity: .5; cursor: not-allowed; pointer-events: none }
.woocommerce a.button:disabled { opacity: .5; cursor: not-allowed }
.woocommerce-cart .return-to-shop a.button { background: var(--maroon) }

/* ---- Tables (cart, order review, my-account) ---- */
.woocommerce table.shop_table { width: 100%; border-collapse: collapse; border: 0; margin: 0 }
.woocommerce table.shop_table th { font-family: var(--sans); font-size: var(--fs-label); letter-spacing: .13em; text-transform: uppercase; color: var(--muted); font-weight: 600; padding: 14px 10px; border: 0; border-bottom: 1px solid var(--line) }
.woocommerce table.shop_table td { padding: 18px 10px; border: 0; border-bottom: 1px solid var(--line); vertical-align: middle }
.woocommerce table.shop_table tfoot th { font-family: var(--sans); font-style: normal; border-top: 1px solid var(--line) }
.woocommerce table.shop_table tfoot td { border-top: 1px solid var(--line) }
.woocommerce table.shop_table .product-thumbnail { width: 70px }
.woocommerce table.shop_table img { width: 62px; height: 88px; object-fit: contain; background: var(--cream); border-radius: 6px }
.woocommerce table.shop_table td.product-name a, .woocommerce table.shop_table a { color: var(--ink); font-family: var(--serif); font-size: 18px; text-decoration: none }
.woocommerce table.shop_table td.product-name a:hover { color: var(--maroon) }
.woocommerce table.shop_table .product-quantity input.qty { width: 60px; border: 0; border-bottom: 1px solid var(--line); background: transparent; padding: 10px 0; font: inherit; outline: none; text-align: center }
.woocommerce table.shop_table td.product-remove { width: 44px }
.woocommerce a.remove { color: var(--muted) !important; font-size: 26px; line-height: 1; text-decoration: none }
.woocommerce a.remove:hover { color: var(--maroon) !important; background: transparent !important }

/* ---- Cart layout ---- */
.woocommerce-cart table.shop_table.cart { max-width: 860px }
.woocommerce-cart .cart-collaterals { margin-top: 46px }
.cart_totals { max-width: 480px; margin-left: auto; background: var(--cream); border: 1px solid rgba(23,19,17,.1); padding: clamp(26px,3.5vw,40px) }
.cart_totals h2 { font: clamp(26px,3vw,38px) var(--serif); font-weight: 400; margin: 0 0 18px }
.cart_totals .shop_table tr:nth-last-child(2) th, .cart_totals .shop_table tr:nth-last-child(2) td { border-top: 1px solid var(--line) }
.woocommerce-cart .wc-proceed-to-checkout { padding: 0; margin-top: 26px }
.woocommerce-cart .wc-proceed-to-checkout a.button { flex: 1; min-width: 100%; text-align: center; background: var(--maroon) }
.woocommerce-cart .before-cart { margin-bottom: 14px }

/* ---- Coupon ---- */
.woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register,
.woocommerce form.lost_reset_password { background: var(--cream); border: 1px solid rgba(23,19,17,.1); border-radius: 0; padding: clamp(24px,3vw,34px); margin: 26px 0; overflow: visible }
.woocommerce form.checkout_coupon .form-row { margin: 0 0 10px }
.woocommerce form.checkout_coupon .form-row-last { margin-bottom: 16px }

/* ---- Checkout ---- */
.woocommerce-checkout #customer_details .col-1, .woocommerce-checkout #customer_details .col-2 { width: 48% }
.woocommerce-checkout h3, .woocommerce-order-details h2 { font: clamp(22px,3vw,30px) var(--serif); font-weight: 400; margin: 34px 0 12px }
.woocommerce-checkout .col-1 h3:first-child, .woocommerce-checkout .col-2 h3:first-child { margin-top: 0 }
.woocommerce .form-row { margin: 0 0 16px; display: block }
.woocommerce .form-row label { display: block; font-size: var(--fs-label); letter-spacing: .13em; text-transform: uppercase; color: var(--ink); margin: 0 0 6px }
.woocommerce .form-row abbr.required { color: var(--maroon); border: 0; text-decoration: none }
.woocommerce input.input-text, .woocommerce textarea.input-text, .woocommerce select,
.woocommerce-billing-fields .form-row .woocommerce-input-wrapper input,
.woocommerce-checkout .form-row input, .woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select, .woocommerce-account .form-row input,
.woocommerce-account .form-row textarea, .woocommerce-account .form-row select {
  width: 100%; min-width: 0; box-sizing: border-box; border: 0; border-bottom: 1px solid var(--line);
  background: transparent; padding: 12px 0; font: inherit; color: inherit; outline: none; border-radius: 0 }
.woocommerce .form-row input:focus, .woocommerce .form-row textarea:focus,
.woocommerce .form-row select:focus { border-color: var(--ink) }
.woocommerce .form-row .select2-container { width: 100% !important }
.woocommerce .select2-container--default .select2-selection--single { border: 0; border-radius: 0; border-bottom: 1px solid var(--line); padding: 10px 0; height: auto; background: transparent }
.woocommerce .password-input { width: 100% }
.woocommerce .input-checkbox, .woocommerce input[type="checkbox"], .woocommerce input[type="radio"] { width: auto; margin-right: 8px }
.woocommerce .form-row.woocommerce-invalid input { border-color: var(--maroon) }
.woocommerce .woocommerce-error .woocommerce-input-wrapper input { border-color: #fff }

#order_review { margin-top: 42px }
#order_review_heading { margin-top: 54px }
#payment { background: transparent }
#payment .payment_methods { list-style: none; margin: 0 0 26px; padding: 0 }
#payment .payment_methods li { border-bottom: 1px solid var(--line); padding: 14px 0 }
#payment .payment_methods li .payment_box { background: var(--cream); padding: 14px 18px; margin-top: 12px; font-size: var(--fs-label); color: var(--muted) }
#payment .place-order { margin-top: 22px }
#payment #place_order { width: 100%; text-align: center; background: var(--maroon); padding: 16px 30px }

.woocommerce-checkout #payment div.payment_box::before, .woocommerce-checkout #payment ul.payment_methods li:first-child { border-top: 0 }
.woocommerce form .form-row .required { color: var(--maroon) }

/* ---- Notices ---- */
.woocommerce-message, .woocommerce-info, .woocommerce-error, .woocommerce-noreviews {
  margin: 18px 0 28px; padding: 15px 20px 15px 20px; font-size: var(--fs-ui);
  list-style: none; border: 0; border-left: 3px solid var(--ink); background: var(--cream); color: var(--ink) }
.woocommerce-info { border-left-color: var(--maroon) }
.woocommerce-error { background: #f7e9e9; border-left: 3px solid var(--maroon) }
.woocommerce-message { border-left-color: #3a7d44; background: #eef4ec }
.woocommerce-message::before, .woocommerce-info::before, .woocommerce-error::before { content: none }
.woocommerce-info a, .woocommerce-message a, .woocommerce-error a { color: var(--maroon); text-decoration: underline }
.woocommerce-error li { margin: 0 }

/* ---- Cart empty / thank-you ---- */
.woocommerce-cart .cart-empty { text-align: center; font: 26px var(--serif); border-left-width: 0; padding: clamp(40px,6vw,70px) 20px; border-block: 1px solid var(--line); background: transparent }
.woocommerce-cart .cart-empty::before { content: none }
.woocommerce-cart .return-to-shop { text-align: center; margin-bottom: 40px }
.woocommerce .woocommerce-order { max-width: 720px; margin: 0 auto }
.woocommerce .woocommerce-order p, .woocommerce-order-details td, .woocommerce-order-details th { text-align: left }
.woocommerce .woocommerce-customer-details address { font-style: normal; border: 1px solid var(--line); padding: 18px }

/* ---- My Account ---- */
.woocommerce-account .p-page { max-width: 1060px }
.woocommerce-MyAccount-navigation { margin: 0 0 40px }
.woocommerce-MyAccount-navigation ul { list-style: none; display: flex; flex-wrap: wrap; gap: 4px 26px; margin: 0; padding: 0 0 16px; border-bottom: 1px solid var(--line) }
.woocommerce-MyAccount-navigation li a { font-size: var(--fs-label); letter-spacing: .13em; text-transform: uppercase; color: var(--muted); padding-bottom: 16px; border-bottom: 2px solid transparent; margin-bottom: -17px }
.woocommerce-MyAccount-navigation li.is-active a { color: var(--maroon); border-bottom-color: var(--maroon) }
.woocommerce-MyAccount-content .woocommerce-form-login, .woocommerce-MyAccount-content .woocommerce-form-register { background: transparent; border: 0; padding: 0 }
.woocommerce-orders-table__cell-order-number a { font-family: var(--serif) }
.woocommerce-Address, .woocommerce-customer-details { background: var(--cream); border: 1px solid rgba(23,19,17,.1); padding: clamp(22px,3vw,30px) }
.woocommerce-Address h3 { font: 24px var(--serif); font-weight: 400; margin: 0 0 8px }
.woocommerce-Address .edit { text-transform: uppercase; font-size: var(--fs-label); letter-spacing: .13em; color: var(--maroon) }
.woocommerce-MyAccount-content > h2:first-child, .woocommerce-MyAccount-content > h3 { font: clamp(26px,3.4vw,40px) var(--serif); font-weight: 400 }

/* ---- Shared header removal guard: hidden breadcrumbs from forcing layout ---- */
.woocommerce-breadcrumb { display: none }

/* ---- Responsive ---- */
@media (max-width: 900px) {
  .woocommerce-checkout #customer_details .col-1, .woocommerce-checkout #customer_details .col-2 { width: 100% }
  .cart_totals { max-width: none }
}
@media (max-width: 600px) {
  .woocommerce table.shop_table th, .woocommerce table.shop_table td { padding-left: 6px; padding-right: 6px }
  .woocommerce table.shop_table .product-quantity .qty { width: 46px }
  .woocommerce table.shop_table img { width: 50px; height: 72px }
  .woocommerce table.shop_table .product-remove { width: 30px }
}

/* ---- Cart / Checkout BLOCKS (Woo block templates) ----
   The store's /cart/ page is the Woo CART BLOCK, not the classic
   table.shop_table the rules above style. Below 699px the block turns each
   cart row into a grid (.wc-block-cart-items__row) of "80px 132px" with a 16px
   column gap, and the product cell spans columns 2–4, so the row's min width is
   ~318px inside a 288px content box at a 320px viewport — the row is 18px wider
   than the page. Give the product track minmax(0,1fr) so it can shrink, drop the
   empty implicit track, and let the product text wrap. Scoped to the block
   classes; the classic cart (table.shop_table) is untouched. */
@media (max-width: 480px) {
  .wc-block-cart table.wc-block-cart-items { border-spacing: 0 !important }
  .wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row {
    grid-template-columns: 64px minmax(0, 1fr) 0 62px !important;
    column-gap: 10px !important;
  }
  .wc-block-cart-item__product { min-width: 0 !important }
  .wc-block-cart-item__product,
  .wc-block-cart-item__product * { overflow-wrap: anywhere }
}
@media (prefers-reduced-motion: reduce) { .woocommerce a.button, .woocommerce button.button, .woocommerce input.button { transition: none } }

/* =====================================================================
   CATALOGUE MODE (SITAARA_CATALOGUE_MODE) — no purchase affordances.
   When the flag is flipped for the commerce phase, this block simply stops
   being used (the WC price + add-to-cart markup returns in single-product.php).
   ===================================================================== */
.catalogue-hold-note { margin: 0; max-width: 380px; color: var(--muted); font-size: var(--fs-label); line-height: 1.65 }
.catalogue-bag-button { display: inline-block; width: fit-content; padding: 15px 30px; background: var(--maroon); color: #fff; text-align: center; text-transform: uppercase; letter-spacing: .13em; font-size: var(--fs-ui); border: 0; cursor: pointer; transition: opacity .25s ease }
.catalogue-bag-button:hover { opacity: .88 }
.catalogue-bag-button.is-saved { background: var(--ink) }