/* ==========================================================================
   Qelq — global WooCommerce baseline (cartify-child/assets/css/woocommerce.css)
   Applies wherever WooCommerce renders outside our page CSS. Page agents
   (q-pg-cart__*, q-pg-checkout__*, q-pg-product__*) refine on top of this.
   Everything is scoped to .woocommerce / .woocommerce-page (both are also
   body classes) or to WooCommerce-only components (mini-cart, select2).
   Tokens come from tokens.css; fallbacks keep this file safe standalone.
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Base typography on shop pages
   -------------------------------------------------------------------------- */
body.woocommerce,
body.woocommerce-page {
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  color: var(--q-navy, #10233F);
}

:is(.woocommerce, .woocommerce-page) :is(
  .product_title,
  .woocommerce-products-header__title,
  .woocommerce-billing-fields > h3,
  .woocommerce-shipping-fields h3,
  .woocommerce-additional-fields > h3,
  #order_review_heading,
  .cart_totals > h2,
  .cross-sells > h2,
  .related.products > h2,
  .up-sells > h2,
  .woocommerce-Reviews-title,
  #reply-title,
  .woocommerce-order-details__title,
  .woocommerce-customer-details h2,
  .woocommerce-column__title,
  .woocommerce-MyAccount-content h2,
  .woocommerce-MyAccount-content h3,
  .woocommerce-Address-title h3,
  .woocommerce-form-login-wrapper h2,
  .u-column1 > h2,
  .u-column2 > h2
) {
  font-family: var(--q-font-display, 'Space Grotesk', system-ui, sans-serif);
  font-weight: 500;
  color: var(--q-navy, #10233F);
  letter-spacing: -0.01em;
  line-height: 1.25;
}

:is(.woocommerce, .woocommerce-page) :is(
  .woocommerce-billing-fields > h3,
  .woocommerce-shipping-fields h3,
  .woocommerce-additional-fields > h3,
  #order_review_heading,
  .woocommerce-order-details__title,
  .woocommerce-customer-details h2,
  .woocommerce-column__title,
  .woocommerce-MyAccount-content h2,
  .woocommerce-Address-title h3,
  .woocommerce-form-login-wrapper h2,
  .u-column1 > h2,
  .u-column2 > h2
) {
  font-size: 24px;
  margin: 0 0 16px;
}

:is(.woocommerce, .woocommerce-page) :is(.cart_totals > h2, .cross-sells > h2, .related.products > h2, .up-sells > h2) {
  font-size: 26px;
  line-height: 1.2;
  margin: 0 0 20px;
}

/* --------------------------------------------------------------------------
   1. Notices (classic + block-style banners)
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) :is(.woocommerce-message, .woocommerce-info, .woocommerce-error),
:is(.woocommerce, .woocommerce-page) .wc-block-components-notice-banner {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 16px;
  margin: 0 0 24px;
  padding: 16px 20px;
  list-style: none;
  border: 0;
  border-left: 4px solid var(--q-navy, #10233F);
  border-radius: 0;
  background: var(--q-paper, #FDF3E1);
  color: var(--q-navy, #10233F);
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  font-size: 16px;
  line-height: 1.5;
  box-shadow: none;
  outline: 0;
}

:is(.woocommerce, .woocommerce-page) .woocommerce-info {
  border-left-color: var(--q-border, #8A93A3);
  background: var(--q-linen, #FBF8F2);
}

:is(.woocommerce, .woocommerce-page) .woocommerce-error,
:is(.woocommerce, .woocommerce-page) .wc-block-components-notice-banner.is-error {
  flex-direction: column;
  align-items: flex-start;
  border-left-color: var(--q-error, #9B2C2C);
  background: #FBF1EE;
}

:is(.woocommerce, .woocommerce-page) .woocommerce-error li {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Woo icon font glyphs: replaced by the coloured left rule */
:is(.woocommerce, .woocommerce-page) :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::before,
:is(.woocommerce, .woocommerce-page) :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::after {
  content: none;
  display: none;
}

:is(.woocommerce, .woocommerce-page) .wc-block-components-notice-banner > svg {
  flex: none;
  fill: currentColor;
  background: transparent;
  border-radius: 0;
  padding: 0;
}

:is(.woocommerce, .woocommerce-page) :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) a:not(.button),
:is(.woocommerce, .woocommerce-page) .wc-block-components-notice-banner a:not(.button) {
  color: var(--q-navy, #10233F);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* "Shiko shportën" etc. inside a notice: link-style, not a big block */
body :is(.woocommerce, .woocommerce-page) :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a, button).button,
body :is(.woocommerce, .woocommerce-page) .wc-block-components-notice-banner :is(a, button).button {
  order: 2;
  float: none;
  min-height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--q-navy, #10233F);
  font-size: 16px;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 5px;
}

body :is(.woocommerce, .woocommerce-page) :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) :is(a, button).button:hover,
body :is(.woocommerce, .woocommerce-page) .wc-block-components-notice-banner :is(a, button).button:hover {
  background: transparent;
  color: var(--q-ink, #010D30);
  text-decoration-thickness: 2px;
}

/* --------------------------------------------------------------------------
   2. Buttons
   Primary (navy, = q-btn--navy): .button (default), .alt, add to cart,
   checkout button, #place_order. Secondary (outline navy): update cart,
   apply coupon, "view" buttons, mini-cart "view cart".
   -------------------------------------------------------------------------- */
body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button,
body :is(.woocommerce, .woocommerce-page) #respond input#submit,
body :is(.woocommerce, .woocommerce-page) .single_add_to_cart_button,
body :is(.woocommerce, .woocommerce-page) .checkout-button,
body :is(.woocommerce, .woocommerce-page) #place_order {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 52px;
  padding: 0 28px;
  box-sizing: border-box;
  border: 1.5px solid var(--q-navy, #10233F);
  border-radius: var(--q-radius, 4px);
  background: var(--q-navy, #10233F);
  color: var(--q-white, #FFFFFF);
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0;
  text-align: center;
  text-transform: none;
  text-decoration: none;
  text-shadow: none;
  box-shadow: none;
  cursor: pointer;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button:hover,
body :is(.woocommerce, .woocommerce-page) #respond input#submit:hover,
body :is(.woocommerce, .woocommerce-page) .single_add_to_cart_button:hover,
body :is(.woocommerce, .woocommerce-page) .checkout-button:hover,
body :is(.woocommerce, .woocommerce-page) #place_order:hover {
  border-color: var(--q-ink, #010D30);
  background: var(--q-ink, #010D30);
  color: var(--q-white, #FFFFFF);
}

body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button.alt,
body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button.alt:hover {
  border-color: var(--q-navy, #10233F);
  background: var(--q-navy, #10233F);
  color: var(--q-white, #FFFFFF);
}
body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button.alt:hover {
  border-color: var(--q-ink, #010D30);
  background: var(--q-ink, #010D30);
}

/* Checkout CTAs as in the design: 56px, 17px */
body :is(.woocommerce, .woocommerce-page) #place_order,
body :is(.woocommerce, .woocommerce-page) .wc-proceed-to-checkout .checkout-button {
  width: 100%;
  min-height: 56px;
  font-size: 17px;
}

body :is(.woocommerce, .woocommerce-page) .wc-proceed-to-checkout {
  padding: 0;
}
body :is(.woocommerce, .woocommerce-page) .wc-proceed-to-checkout .checkout-button {
  margin: 0;
}

/* Secondary — outline navy (= q-btn--outline-navy) */
body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button:is(
  [name="update_cart"],
  [name="apply_coupon"],
  .woocommerce-button--previous,
  .woocommerce-button--next,
  .view,
  .order-again a,
  .wc-forward:not(.checkout):not(.checkout-button)
),
body :is(.woocommerce, .woocommerce-page) .order-again :is(a, button).button,
body :is(.woocommerce, .woocommerce-page) .woocommerce-Address .edit {
  border-color: var(--q-navy, #10233F);
  background: var(--q-white, #FFFFFF);
  color: var(--q-navy, #10233F);
}

body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button:is(
  [name="update_cart"],
  [name="apply_coupon"],
  .woocommerce-button--previous,
  .woocommerce-button--next,
  .view,
  .wc-forward:not(.checkout):not(.checkout-button)
):hover,
body :is(.woocommerce, .woocommerce-page) .order-again :is(a, button).button:hover {
  border-color: var(--q-navy, #10233F);
  background: var(--q-mist, #F7F4EE);
  color: var(--q-navy, #10233F);
}

/* Small table buttons (orders list "Shiko", downloads) */
body :is(.woocommerce, .woocommerce-page) .shop_table :is(a, button).button {
  min-height: 44px;
  padding: 0 18px;
  font-size: 15px;
}

/* Disabled */
body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button:is(:disabled, .disabled, [disabled]),
body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button:is(:disabled, .disabled, [disabled]):hover {
  opacity: .45;
  cursor: not-allowed;
  border-color: var(--q-navy, #10233F);
  background: var(--q-navy, #10233F);
  color: var(--q-white, #FFFFFF);
  padding: 0 28px;
}
body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button[name="update_cart"]:is(:disabled, .disabled, [disabled]),
body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button[name="update_cart"]:is(:disabled, .disabled, [disabled]):hover {
  background: var(--q-white, #FFFFFF);
  color: var(--q-navy, #10233F);
}

/* Ajax states */
body :is(.woocommerce, .woocommerce-page) .button.loading {
  opacity: .7;
}
body :is(.woocommerce, .woocommerce-page) .button.loading::after {
  border-color: currentColor;
}
body :is(.woocommerce, .woocommerce-page) a.added_to_cart {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 4px;
  color: var(--q-navy, #10233F);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 5px;
}

/* Focus ring (keyboard) */
body :is(.woocommerce, .woocommerce-page) :is(a, button, input).button:focus-visible,
body :is(.woocommerce, .woocommerce-page) .single_add_to_cart_button:focus-visible,
body :is(.woocommerce, .woocommerce-page) #place_order:focus-visible {
  outline: 2px solid var(--q-navy, #10233F);
  outline-offset: 3px;
}

/* --------------------------------------------------------------------------
   3. Form fields
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) form .form-row {
  margin: 0 0 18px;
  padding: 0;
}

:is(.woocommerce, .woocommerce-page) form .form-row label,
:is(.woocommerce, .woocommerce-page) form label.woocommerce-form__label:not(.woocommerce-form__label-for-checkbox) {
  display: block;
  margin: 0 0 6px;
  color: var(--q-navy, #10233F);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}

:is(.woocommerce, .woocommerce-page) form .form-row .required {
  color: var(--q-muted, #4A5568);
  font-weight: 600;
  text-decoration: none;
  border: 0;
}

:is(.woocommerce, .woocommerce-page) form .form-row .optional {
  color: var(--q-muted, #4A5568);
  font-weight: 400;
}

body :is(.woocommerce, .woocommerce-page) form .form-row :is(input.input-text, input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], input[type="search"], input[type="url"], input[type="date"], select, textarea),
body :is(.woocommerce, .woocommerce-page) form :is(.woocommerce-Input, .input-text),
body :is(.woocommerce, .woocommerce-page) :is(#coupon_code, .coupon .input-text),
body :is(.woocommerce, .woocommerce-page) .woocommerce-ordering select,
body :is(.woocommerce, .woocommerce-page) .variations select,
body :is(.woocommerce, .woocommerce-page) #respond :is(input[type="text"], input[type="email"], textarea) {
  width: 100%;
  height: 52px;
  margin: 0;
  padding: 0 14px;
  box-sizing: border-box;
  border: 1px solid var(--q-border, #8A93A3);
  border-radius: var(--q-radius, 4px);
  background-color: var(--q-white, #FFFFFF);
  color: var(--q-navy, #10233F);
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  font-size: 16px;
  line-height: 1.5;
  box-shadow: none;
  outline: 0;
}

body :is(.woocommerce, .woocommerce-page) form .form-row textarea,
body :is(.woocommerce, .woocommerce-page) form textarea.input-text,
body :is(.woocommerce, .woocommerce-page) #respond textarea {
  height: auto;
  min-height: 96px;
  padding: 12px 14px;
  resize: vertical;
}

/* native select arrow */
body :is(.woocommerce, .woocommerce-page) form .form-row select,
body :is(.woocommerce, .woocommerce-page) .woocommerce-ordering select,
body :is(.woocommerce, .woocommerce-page) .variations select {
  padding-right: 40px;
  -webkit-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2310233F' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  background-size: 14px 14px;
  cursor: pointer;
}

body :is(.woocommerce, .woocommerce-page) form .form-row :is(input, select, textarea)::placeholder,
body :is(.woocommerce, .woocommerce-page) :is(#coupon_code, .input-text)::placeholder {
  color: var(--q-muted, #4A5568);
  opacity: 1;
}

body :is(.woocommerce, .woocommerce-page) form .form-row :is(input.input-text, input[type="text"], input[type="email"], input[type="tel"], input[type="password"], input[type="number"], select, textarea):focus,
body :is(.woocommerce, .woocommerce-page) :is(#coupon_code, .input-text, .woocommerce-ordering select, .variations select):focus {
  border-color: var(--q-navy, #10233F);
  box-shadow: 0 0 0 1px var(--q-navy, #10233F);
  outline: 0;
}

/* invalid (validation runs on blur / submit) */
body :is(.woocommerce, .woocommerce-page) form .form-row.woocommerce-invalid :is(input.input-text, select, textarea),
body :is(.woocommerce, .woocommerce-page) form .form-row.woocommerce-invalid .select2-container .select2-selection,
body :is(.woocommerce, .woocommerce-page) form .form-row [aria-invalid="true"] {
  border-color: var(--q-error, #9B2C2C);
}
body :is(.woocommerce, .woocommerce-page) form .form-row.woocommerce-invalid label {
  color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) form .form-row .checkout-inline-error-message,
:is(.woocommerce, .woocommerce-page) form .form-row .woocommerce-error {
  margin: 6px 0 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--q-error, #9B2C2C);
  font-size: 14px;
  display: block;
}
/* Do not paint valid fields green */
body :is(.woocommerce, .woocommerce-page) form .form-row.woocommerce-validated :is(input.input-text, select, textarea) {
  border-color: var(--q-border, #8A93A3);
}
body :is(.woocommerce, .woocommerce-page) form .form-row.woocommerce-validated :is(input.input-text, select, textarea):focus {
  border-color: var(--q-navy, #10233F);
}

/* helper text */
:is(.woocommerce, .woocommerce-page) form .form-row .description,
:is(.woocommerce, .woocommerce-page) .woocommerce-password-hint {
  margin-top: 6px;
  color: var(--q-muted, #4A5568);
  font-size: 14px;
  line-height: 1.45;
}

/* Checkboxes & radios */
:is(.woocommerce, .woocommerce-page) :is(form, .shop_table) :is(input[type="checkbox"], input[type="radio"]) {
  width: 22px;
  height: 22px;
  margin: 2px 0 0;
  flex: none;
  accent-color: var(--q-navy, #10233F);
  cursor: pointer;
  vertical-align: top;
}

:is(.woocommerce, .woocommerce-page) :is(label.checkbox, .woocommerce-form__label-for-checkbox) {
  display: inline-flex;
  align-items: flex-start;
  gap: 12px;
  color: var(--q-navy, #10233F);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.45;
  cursor: pointer;
}

/* Password show/hide */
:is(.woocommerce, .woocommerce-page) .password-input .show-password-input {
  top: 50%;
  right: 6px;
  width: 44px;
  height: 44px;
  transform: translateY(-50%);
  color: var(--q-muted, #4A5568);
}

/* --------------------------------------------------------------------------
   4. select2 / selectWoo (country, state). Dropdown is appended to <body>,
      so it is scoped with the body classes.
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) .select2-container {
  width: 100% !important; /* select2 sets an inline pixel width */
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
}

:is(.woocommerce, .woocommerce-page) .select2-container .select2-selection--single {
  height: 52px;
  margin: 0;
  box-sizing: border-box;
  border: 1px solid var(--q-border, #8A93A3);
  border-radius: var(--q-radius, 4px);
  background: var(--q-white, #FFFFFF);
  outline: 0;
}

:is(.woocommerce, .woocommerce-page) .select2-container .select2-selection--single .select2-selection__rendered {
  padding: 0 40px 0 14px;
  color: var(--q-navy, #10233F);
  font-size: 16px;
  line-height: 50px;
}

:is(.woocommerce, .woocommerce-page) .select2-container .select2-selection--single .select2-selection__placeholder {
  color: var(--q-muted, #4A5568);
}

:is(.woocommerce, .woocommerce-page) .select2-container .select2-selection--single .select2-selection__arrow {
  top: 1px;
  right: 8px;
  width: 28px;
  height: 50px;
}

:is(.woocommerce, .woocommerce-page) .select2-container .select2-selection--single .select2-selection__arrow b {
  border-color: var(--q-navy, #10233F) transparent transparent;
  border-width: 6px 5px 0;
}
:is(.woocommerce, .woocommerce-page) .select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--q-navy, #10233F);
  border-width: 0 5px 6px;
}

:is(.woocommerce, .woocommerce-page) :is(.select2-container--focus, .select2-container--open) .select2-selection--single {
  border-color: var(--q-navy, #10233F);
  box-shadow: 0 0 0 1px var(--q-navy, #10233F);
}

:is(.woocommerce, .woocommerce-page) .select2-dropdown {
  border: 1px solid var(--q-navy, #10233F);
  border-radius: var(--q-radius, 4px);
  background: var(--q-white, #FFFFFF);
  color: var(--q-navy, #10233F);
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  font-size: 16px;
  box-shadow: 0 8px 24px rgba(16, 35, 63, .12);
}

:is(.woocommerce, .woocommerce-page) .select2-search--dropdown {
  padding: 8px;
}

:is(.woocommerce, .woocommerce-page) .select2-search--dropdown .select2-search__field {
  height: 44px;
  padding: 0 12px;
  box-sizing: border-box;
  border: 1px solid var(--q-border, #8A93A3);
  border-radius: var(--q-radius, 4px);
  color: var(--q-navy, #10233F);
  font-family: inherit;
  font-size: 16px;
}

:is(.woocommerce, .woocommerce-page) .select2-results__option {
  min-height: 44px;
  padding: 10px 14px;
  box-sizing: border-box;
  line-height: 1.4;
}

:is(.woocommerce, .woocommerce-page) .select2-results__option[aria-selected="true"],
:is(.woocommerce, .woocommerce-page) .select2-results__option[data-selected="true"] {
  background: var(--q-mist, #F7F4EE);
  color: var(--q-navy, #10233F);
}

:is(.woocommerce, .woocommerce-page) .select2-container--default .select2-results__option--highlighted[aria-selected],
:is(.woocommerce, .woocommerce-page) .select2-container--default .select2-results__option--highlighted[data-selected],
:is(.woocommerce, .woocommerce-page) .select2-results__option.select2-results__option--highlighted {
  background: var(--q-navy, #10233F);
  color: var(--q-white, #FFFFFF);
}

/* --------------------------------------------------------------------------
   5. Quantity
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) .quantity {
  display: inline-flex;
  align-items: stretch;
}

body :is(.woocommerce, .woocommerce-page) .quantity input.qty {
  width: 72px;
  height: 52px;
  margin: 0;
  padding: 0 6px;
  box-sizing: border-box;
  border: 1px solid var(--q-border, #8A93A3);
  border-radius: var(--q-radius, 4px);
  background: var(--q-white, #FFFFFF);
  color: var(--q-navy, #10233F);
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  font-size: 16px;
  font-weight: 600;
  text-align: center;
  -moz-appearance: textfield;
}
body :is(.woocommerce, .woocommerce-page) .quantity input.qty:focus {
  border-color: var(--q-navy, #10233F);
  box-shadow: 0 0 0 1px var(--q-navy, #10233F);
  outline: 0;
}

/* Theme +/- steppers (Cartify and others) */
body :is(.woocommerce, .woocommerce-page) .quantity :is(.minus, .plus, button, [class*="qty-btn"], [class*="quantity-btn"]) {
  min-width: 44px;
  border: 1px solid var(--q-border, #8A93A3);
  border-radius: var(--q-radius, 4px);
  background: var(--q-white, #FFFFFF);
  color: var(--q-navy, #10233F);
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  font-size: 18px;
  cursor: pointer;
}
body :is(.woocommerce, .woocommerce-page) .quantity :is(.minus, .plus, button, [class*="qty-btn"], [class*="quantity-btn"]):hover {
  background: var(--q-mist, #F7F4EE);
}

/* "sold individually" products show a hidden qty — keep it hidden */
:is(.woocommerce, .woocommerce-page) .quantity.hidden {
  display: none;
}

/* --------------------------------------------------------------------------
   6. Prices
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) :is(.price, .amount) {
  color: var(--q-navy, #10233F);
}

:is(.woocommerce, .woocommerce-page) .price {
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  font-size: 16px;
  font-weight: 600;
}

:is(.woocommerce, .woocommerce-page) div.product :is(p.price, span.price) {
  font-family: var(--q-font-display, 'Space Grotesk', system-ui, sans-serif);
  font-size: 28px;
  font-weight: 500;
  line-height: 1.2;
  color: var(--q-navy, #10233F);
}

:is(.woocommerce, .woocommerce-page) .price del,
:is(.woocommerce, .woocommerce-page) del .amount {
  color: var(--q-muted, #4A5568);
  font-weight: 400;
  opacity: 1;
  text-decoration-thickness: 1px;
}

:is(.woocommerce, .woocommerce-page) .price ins {
  color: var(--q-navy, #10233F);
  background: none;
  text-decoration: none;
  font-weight: inherit;
}

:is(.woocommerce, .woocommerce-page) .price del + ins {
  margin-left: 8px;
}

/* --------------------------------------------------------------------------
   7. Star ratings
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) .star-rating {
  color: var(--q-navy, #10233F);
  font-size: 15px;
}
:is(.woocommerce, .woocommerce-page) .star-rating::before {
  color: var(--q-border, #8A93A3);
  opacity: .6;
}
:is(.woocommerce, .woocommerce-page) .star-rating span,
:is(.woocommerce, .woocommerce-page) .star-rating span::before {
  color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) p.stars a {
  color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) .woocommerce-review-link {
  color: var(--q-muted, #4A5568);
  font-size: 15px;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Reviews list */
:is(.woocommerce, .woocommerce-page) #reviews #comments ol.commentlist li .comment-text {
  border: 1px solid var(--q-line, #E8E2D6);
  border-radius: var(--q-radius, 4px);
}
:is(.woocommerce, .woocommerce-page) #reviews #comments ol.commentlist li .comment-text p.meta {
  color: var(--q-muted, #4A5568);
  font-size: 14px;
}
:is(.woocommerce, .woocommerce-page) #reviews #comments ol.commentlist li img.avatar {
  border: 0;
  background: var(--q-stone, #F4EFE7);
}

/* --------------------------------------------------------------------------
   8. Badges & stock
   -------------------------------------------------------------------------- */
body :is(.woocommerce, .woocommerce-page) span.onsale,
body :is(.woocommerce, .woocommerce-page) .wc-block-components-product-sale-badge {
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 5px 10px;
  border: 0;
  border-radius: 2px;
  background: var(--q-navy, #10233F);
  color: var(--q-white, #FFFFFF);
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: .08em;
  text-transform: uppercase;
}
body :is(.woocommerce, .woocommerce-page) :is(ul.products li.product, div.product, .woocommerce-product-gallery) span.onsale {
  position: absolute;
  top: 12px;
  left: 12px;
  right: auto;
  z-index: 3;
}

:is(.woocommerce, .woocommerce-page) .stock,
:is(.woocommerce, .woocommerce-page) div.product .stock {
  margin: 0;
  color: var(--q-navy, #10233F);
  font-size: 15px;
  font-weight: 600;
}
:is(.woocommerce, .woocommerce-page) .stock.out-of-stock,
:is(.woocommerce, .woocommerce-page) div.product .stock.out-of-stock {
  color: var(--q-muted, #4A5568);
}
:is(.woocommerce, .woocommerce-page) :is(.out-of-stock-badge, .outofstock-badge, .soldout, .sold-out) {
  padding: 5px 10px;
  border-radius: 2px;
  background: var(--q-navy, #10233F);
  color: var(--q-white, #FFFFFF);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* --------------------------------------------------------------------------
   9. Product gallery (flexslider + zoom + photoswipe trigger)
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) div.product div.images .woocommerce-product-gallery__wrapper,
:is(.woocommerce, .woocommerce-page) .woocommerce-product-gallery .flex-viewport {
  background: var(--q-stone, #F4EFE7);
}

:is(.woocommerce, .woocommerce-page) .woocommerce-product-gallery__image img {
  mix-blend-mode: multiply;
}

:is(.woocommerce, .woocommerce-page) div.product div.images .flex-control-thumbs {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin: 12px 0 0;
  padding: 0;
  list-style: none;
}
:is(.woocommerce, .woocommerce-page) div.product div.images .flex-control-thumbs li {
  width: auto;
  float: none;
  margin: 0;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: var(--q-stone, #F4EFE7);
}
:is(.woocommerce, .woocommerce-page) div.product div.images .flex-control-thumbs li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  mix-blend-mode: multiply;
  opacity: 1;
  cursor: pointer;
  outline: 2px solid transparent;
  outline-offset: -2px;
  transition: outline-color .15s ease;
}
:is(.woocommerce, .woocommerce-page) div.product div.images .flex-control-thumbs li img:hover {
  outline-color: var(--q-border, #8A93A3);
}
:is(.woocommerce, .woocommerce-page) div.product div.images .flex-control-thumbs li img.flex-active {
  outline-color: var(--q-navy, #10233F);
}

:is(.woocommerce, .woocommerce-page) div.product div.images .woocommerce-product-gallery__trigger {
  top: 12px;
  right: 12px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--q-white, #FFFFFF);
  box-shadow: 0 1px 3px rgba(16, 35, 63, .15);
}
:is(.woocommerce, .woocommerce-page) div.product div.images .woocommerce-product-gallery__trigger::before {
  top: 12px;
  left: 12px;
  border-color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) div.product div.images .woocommerce-product-gallery__trigger::after {
  top: 26px;
  left: 27px;
  background: var(--q-navy, #10233F);
}

@media (max-width: 767px) {
  :is(.woocommerce, .woocommerce-page) div.product div.images .flex-control-thumbs {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-top: 8px;
  }
}

/* Single product basics (outside our product template) */
:is(.woocommerce, .woocommerce-page) div.product .product_title {
  font-size: 36px;
  line-height: 1.15;
  margin: 0 0 12px;
  text-wrap: balance;
}
:is(.woocommerce, .woocommerce-page) div.product form.cart {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 12px;
}
:is(.woocommerce, .woocommerce-page) div.product form.cart::before,
:is(.woocommerce, .woocommerce-page) div.product form.cart::after {
  content: none;
}
:is(.woocommerce, .woocommerce-page) div.product form.cart.variations_form,
:is(.woocommerce, .woocommerce-page) div.product form.cart.grouped_form {
  display: block;
}
body :is(.woocommerce, .woocommerce-page) div.product form.cart .single_add_to_cart_button {
  flex: 1 1 200px;
  float: none;
}
:is(.woocommerce, .woocommerce-page) div.product form.cart .quantity {
  float: none;
  margin: 0;
}
:is(.woocommerce, .woocommerce-page) div.product .woocommerce-product-details__short-description {
  color: var(--q-body, #2B3A55);
  font-size: 17px;
  line-height: 1.6;
}
:is(.woocommerce, .woocommerce-page) div.product .product_meta {
  color: var(--q-muted, #4A5568);
  font-size: 14px;
}
:is(.woocommerce, .woocommerce-page) .variations th.label label {
  font-size: 14px;
  font-weight: 600;
  color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) .reset_variations {
  color: var(--q-muted, #4A5568);
  font-size: 15px;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Product tabs (classic) */
:is(.woocommerce, .woocommerce-page) div.product .woocommerce-tabs ul.tabs {
  padding: 0;
  margin: 0 0 24px;
  border-bottom: 1px solid var(--q-line, #E8E2D6);
}
:is(.woocommerce, .woocommerce-page) div.product .woocommerce-tabs ul.tabs::before {
  border-bottom: 0;
}
:is(.woocommerce, .woocommerce-page) div.product .woocommerce-tabs ul.tabs li {
  margin: 0 24px 0 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}
:is(.woocommerce, .woocommerce-page) div.product .woocommerce-tabs ul.tabs li::before,
:is(.woocommerce, .woocommerce-page) div.product .woocommerce-tabs ul.tabs li::after {
  display: none;
}
:is(.woocommerce, .woocommerce-page) div.product .woocommerce-tabs ul.tabs li a {
  display: inline-flex;
  align-items: center;
  min-height: 52px;
  padding: 0;
  color: var(--q-muted, #4A5568);
  font-family: var(--q-font-display, 'Space Grotesk', system-ui, sans-serif);
  font-size: 18px;
  font-weight: 500;
  border-bottom: 2px solid transparent;
}
:is(.woocommerce, .woocommerce-page) div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--q-navy, #10233F);
  border-bottom-color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) div.product .woocommerce-tabs .panel {
  color: var(--q-body, #2B3A55);
  font-size: 17px;
  line-height: 1.6;
}

/* --------------------------------------------------------------------------
   10. Tables (.shop_table: cart, order review, order details, account)
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) table.shop_table {
  width: 100%;
  margin: 0 0 24px;
  border: 0;
  border-collapse: collapse;
  border-radius: 0;
  color: var(--q-navy, #10233F);
  font-size: 16px;
  line-height: 1.45;
}

:is(.woocommerce, .woocommerce-page) table.shop_table :is(th, td) {
  padding: 14px 12px;
  border: 0;
  border-top: 1px solid var(--q-line, #E8E2D6);
  background: transparent;
  text-align: left;
  vertical-align: middle;
}
:is(.woocommerce, .woocommerce-page) table.shop_table :is(th, td):first-child {
  padding-left: 0;
}
:is(.woocommerce, .woocommerce-page) table.shop_table :is(th, td):last-child {
  padding-right: 0;
}

:is(.woocommerce, .woocommerce-page) table.shop_table thead th {
  border-top: 0;
  border-bottom: 1px solid var(--q-line, #E8E2D6);
  padding-top: 0;
  color: var(--q-muted, #4A5568);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}
:is(.woocommerce, .woocommerce-page) table.shop_table thead + tbody tr:first-child :is(th, td) {
  border-top: 0;
}

:is(.woocommerce, .woocommerce-page) table.shop_table tbody th,
:is(.woocommerce, .woocommerce-page) table.shop_table tfoot :is(th, td) {
  font-weight: 400;
}

/* totals rows (cart totals, order review, order details) */
:is(.woocommerce, .woocommerce-page) table.shop_table tfoot :is(th, td),
:is(.woocommerce, .woocommerce-page) .cart_totals table.shop_table :is(th, td) {
  padding-top: 10px;
  padding-bottom: 10px;
  border-top: 0;
}
:is(.woocommerce, .woocommerce-page) :is(table.shop_table, .cart_totals table) tr:is(.order-total, .order_total) :is(th, td),
:is(.woocommerce, .woocommerce-page) table.woocommerce-table--order-details tfoot tr:last-child :is(th, td) {
  padding-top: 14px;
  border-top: 1px solid rgba(16, 35, 63, .2);
  font-size: 20px;
  font-weight: 600;
}
:is(.woocommerce, .woocommerce-page) table.shop_table :is(td, th):last-child:not(:first-child),
:is(.woocommerce, .woocommerce-page) table.shop_table .product-total,
:is(.woocommerce, .woocommerce-page) table.shop_table .product-subtotal {
  text-align: right;
}
:is(.woocommerce, .woocommerce-page) table.shop_table .product-name a {
  color: var(--q-navy, #10233F);
  font-weight: 600;
  text-decoration: none;
}
:is(.woocommerce, .woocommerce-page) table.shop_table .product-name a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}
:is(.woocommerce, .woocommerce-page) table.shop_table .product-quantity,
:is(.woocommerce, .woocommerce-page) table.shop_table :is(.wc-item-meta, .variation) {
  color: var(--q-muted, #4A5568);
  font-size: 14px;
}
:is(.woocommerce, .woocommerce-page) table.shop_table .product-thumbnail img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  background: var(--q-stone, #F4EFE7);
  mix-blend-mode: multiply;
}
:is(.woocommerce, .woocommerce-page) table.shop_table td.actions {
  padding-top: 20px;
}
:is(.woocommerce, .woocommerce-page) table.shop_table td.actions .coupon {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
}
body :is(.woocommerce, .woocommerce-page) table.shop_table td.actions .coupon .input-text {
  width: 200px;
  margin: 0;
}

/* remove "×" in cart */
body :is(.woocommerce, .woocommerce-page) a.remove {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: var(--q-muted, #4A5568) !important; /* Woo sets #e2401c !important */
  font-size: 22px;
  font-weight: 400;
  line-height: 1;
}
body :is(.woocommerce, .woocommerce-page) a.remove:hover {
  background: var(--q-mist, #F7F4EE);
  color: var(--q-navy, #10233F) !important;
}

/* responsive stacked tables */
@media (max-width: 767px) {
  :is(.woocommerce, .woocommerce-page) table.shop_table_responsive tr td,
  :is(.woocommerce, .woocommerce-page) table.shop_table_responsive tr:nth-child(2n) td {
    background: transparent;
  }
  :is(.woocommerce, .woocommerce-page) table.shop_table_responsive tr td::before {
    color: var(--q-muted, #4A5568);
    font-weight: 600;
  }
  :is(.woocommerce, .woocommerce-page) table.shop_table_responsive tbody tr:first-child td:first-child {
    border-top: 0;
  }
  :is(.woocommerce, .woocommerce-page) table.shop_table :is(th, td):first-child,
  :is(.woocommerce, .woocommerce-page) table.shop_table :is(th, td):last-child {
    padding-left: 0;
    padding-right: 0;
  }
  body :is(.woocommerce, .woocommerce-page) table.shop_table td.actions .coupon {
    display: flex;
  }
  body :is(.woocommerce, .woocommerce-page) table.shop_table td.actions .coupon .input-text {
    flex: 1 1 160px;
    width: auto;
  }
  body :is(.woocommerce, .woocommerce-page) table.shop_table td.actions :is(.button, .coupon .button) {
    width: 100%;
  }
}

/* Cart totals / order review boxes */
:is(.woocommerce, .woocommerce-page) .cart-collaterals .cart_totals,
:is(.woocommerce, .woocommerce-page) .woocommerce-checkout-review-order {
  color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) .woocommerce-shipping-totals td,
:is(.woocommerce, .woocommerce-page) ul#shipping_method li {
  font-size: 15px;
}
:is(.woocommerce, .woocommerce-page) ul#shipping_method li {
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 8px;
  margin: 0 0 6px;
  text-indent: 0;
}
:is(.woocommerce, .woocommerce-page) ul#shipping_method li input {
  margin: 0;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-shipping-destination,
:is(.woocommerce, .woocommerce-page) .shipping-calculator-button {
  color: var(--q-muted, #4A5568);
  font-size: 14px;
}

/* --------------------------------------------------------------------------
   11. Checkout payment box (neutralise Woo grey)
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) #payment,
:is(.woocommerce, .woocommerce-page) .woocommerce-checkout #payment {
  background: transparent;
  border-radius: 0;
}
:is(.woocommerce, .woocommerce-page) #payment ul.payment_methods {
  padding: 0 0 16px;
  border-bottom: 0;
}
:is(.woocommerce, .woocommerce-page) #payment ul.payment_methods li {
  margin: 0 0 10px;
  padding: 14px 16px;
  border: 1px solid var(--q-border, #8A93A3);
  border-radius: var(--q-radius, 4px);
  background: var(--q-white, #FFFFFF);
  line-height: 1.45;
}
:is(.woocommerce, .woocommerce-page) #payment ul.payment_methods li:has(> input:checked) {
  border: 2px solid var(--q-navy, #10233F);
  padding: 13px 15px;
}
:is(.woocommerce, .woocommerce-page) #payment ul.payment_methods li > label {
  display: inline;
  font-size: 16px;
  font-weight: 600;
  color: var(--q-navy, #10233F);
  cursor: pointer;
}
:is(.woocommerce, .woocommerce-page) #payment ul.payment_methods li > input {
  margin: 0 10px 0 0;
  vertical-align: middle;
}
:is(.woocommerce, .woocommerce-page) #payment div.payment_box {
  margin: 12px 0 0;
  padding: 12px 14px;
  border-radius: var(--q-radius, 4px);
  background: var(--q-paper, #FDF3E1);
  color: var(--q-body, #2B3A55);
  font-size: 15px;
}
:is(.woocommerce, .woocommerce-page) #payment div.payment_box::before {
  border-color: var(--q-paper, #FDF3E1);
  border-right-color: transparent;
  border-left-color: transparent;
  border-top-color: transparent;
}
:is(.woocommerce, .woocommerce-page) #payment div.form-row {
  padding: 0;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-terms-and-conditions-wrapper,
:is(.woocommerce, .woocommerce-page) .woocommerce-privacy-policy-text {
  color: var(--q-body, #2B3A55);
  font-size: 15px;
  line-height: 1.5;
  margin-bottom: 16px;
}

/* Coupon / login toggles on checkout */
:is(.woocommerce, .woocommerce-page) form:is(.checkout_coupon, .login, .register, .lost_reset_password) {
  margin: 0 0 24px;
  padding: 20px;
  border: 1px solid var(--q-line, #E8E2D6);
  border-radius: var(--q-radius, 4px);
  background: var(--q-white, #FFFFFF);
}

/* --------------------------------------------------------------------------
   12. Order received / order details
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) .woocommerce-thankyou-order-received {
  font-family: var(--q-font-display, 'Space Grotesk', system-ui, sans-serif);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.25;
  color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) ul.order_details {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 0;
  margin: 0 0 32px;
  padding: 20px 24px;
  background: var(--q-paper, #FDF3E1);
  list-style: none;
}
:is(.woocommerce, .woocommerce-page) ul.order_details::before,
:is(.woocommerce, .woocommerce-page) ul.order_details::after {
  content: none;
}
:is(.woocommerce, .woocommerce-page) ul.order_details li {
  float: none;
  margin: 0 24px 0 0;
  padding: 0 24px 0 0;
  border-right: 1px solid rgba(16, 35, 63, .2);
  color: var(--q-muted, #4A5568);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .1em;
  line-height: 1.4;
  text-transform: uppercase;
}
:is(.woocommerce, .woocommerce-page) ul.order_details li:last-child {
  margin-right: 0;
  padding-right: 0;
  border-right: 0;
}
:is(.woocommerce, .woocommerce-page) ul.order_details li strong {
  display: block;
  margin-top: 4px;
  color: var(--q-navy, #10233F);
  font-size: 16px;
  letter-spacing: 0;
  text-transform: none;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-customer-details address {
  padding: 16px 20px;
  border: 1px solid var(--q-line, #E8E2D6);
  border-radius: var(--q-radius, 4px);
  color: var(--q-body, #2B3A55);
  font-style: normal;
  line-height: 1.6;
}
:is(.woocommerce, .woocommerce-page) mark:is(.order-number, .order-date, .order-status) {
  background: none;
  color: var(--q-navy, #10233F);
  font-weight: 600;
}

/* --------------------------------------------------------------------------
   13. My Account
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-navigation ul {
  margin: 0;
  padding: 0;
  list-style: none;
  border-top: 1px solid var(--q-line, #E8E2D6);
}
:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-navigation li {
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--q-line, #E8E2D6);
}
:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-navigation li a {
  display: flex;
  align-items: center;
  min-height: 52px;
  padding: 0 16px;
  border-left: 3px solid transparent;
  color: var(--q-navy, #10233F);
  font-size: 16px;
  font-weight: 400;
  text-decoration: none;
  transition: background-color .15s ease;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-navigation li a:hover {
  background: var(--q-mist, #F7F4EE);
}
:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-navigation li.is-active a {
  border-left-color: var(--q-navy, #10233F);
  background: var(--q-paper, #FDF3E1);
  font-weight: 600;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a {
  color: var(--q-muted, #4A5568);
}

:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-content {
  color: var(--q-body, #2B3A55);
  font-size: 16px;
  line-height: 1.6;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-content > p:first-child strong {
  color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-content a:not(.button) {
  color: var(--q-navy, #10233F);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 4px;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-content fieldset {
  margin: 24px 0;
  padding: 20px;
  border: 1px solid var(--q-line, #E8E2D6);
  border-radius: var(--q-radius, 4px);
}
:is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-content legend {
  padding: 0 8px;
  font-family: var(--q-font-display, 'Space Grotesk', system-ui, sans-serif);
  font-size: 20px;
  font-weight: 500;
  color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) .woocommerce-Addresses .woocommerce-Address {
  padding: 20px;
  background: var(--q-linen, #FBF8F2);
}
:is(.woocommerce, .woocommerce-page) .woocommerce-Address-title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-Address-title::before,
:is(.woocommerce, .woocommerce-page) .woocommerce-Address-title::after {
  content: none;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-Address-title h3,
:is(.woocommerce, .woocommerce-page) .woocommerce-Address-title .edit {
  float: none;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-Address address {
  font-style: normal;
}

@media (max-width: 767px) {
  :is(.woocommerce, .woocommerce-page) .woocommerce-MyAccount-navigation {
    margin-bottom: 32px;
  }
}

/* Login / register */
:is(.woocommerce, .woocommerce-page) .woocommerce-form-login .woocommerce-form-login__rememberme {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 16px;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-LostPassword a {
  color: var(--q-muted, #4A5568);
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* --------------------------------------------------------------------------
   14. Pagination (Woo archives — our grid uses .q-pagination)
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) nav.woocommerce-pagination {
  margin-top: 48px;
  text-align: center;
}
:is(.woocommerce, .woocommerce-page) nav.woocommerce-pagination ul {
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 0;
  border: 0;
}
:is(.woocommerce, .woocommerce-page) nav.woocommerce-pagination ul li {
  float: none;
  border: 0;
  overflow: visible;
}
:is(.woocommerce, .woocommerce-page) nav.woocommerce-pagination ul li :is(a, span) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 44px;
  padding: 0 12px;
  box-sizing: border-box;
  border: 1px solid var(--q-border, #8A93A3);
  border-radius: var(--q-radius, 4px);
  background: var(--q-white, #FFFFFF);
  color: var(--q-navy, #10233F);
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
}
:is(.woocommerce, .woocommerce-page) nav.woocommerce-pagination ul li a:is(:hover, :focus) {
  background: var(--q-mist, #F7F4EE);
  color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) nav.woocommerce-pagination ul li span.current {
  border-color: var(--q-navy, #10233F);
  background: var(--q-navy, #10233F);
  color: var(--q-white, #FFFFFF);
}
:is(.woocommerce, .woocommerce-page) nav.woocommerce-pagination ul li span.dots {
  border-color: transparent;
  background: transparent;
}

/* Result count / ordering (classic archives) */
:is(.woocommerce, .woocommerce-page) .woocommerce-result-count {
  color: var(--q-muted, #4A5568);
  font-size: 15px;
}

/* --------------------------------------------------------------------------
   15. Breadcrumb (Woo default; our pages use [qelq_breadcrumbs])
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) .woocommerce-breadcrumb {
  color: var(--q-muted, #4A5568);
  font-size: 14px;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-breadcrumb a {
  color: var(--q-muted, #4A5568);
  text-decoration: none;
}
:is(.woocommerce, .woocommerce-page) .woocommerce-breadcrumb a:hover {
  color: var(--q-navy, #10233F);
  text-decoration: underline;
}

/* --------------------------------------------------------------------------
   16. Mini-cart / Cartify side cart (agni-ajax-sidecart)
       Colours & typography only — layout/JS behaviour stays Cartify's.
   -------------------------------------------------------------------------- */
:is(.agni-ajax-sidecart, .agni-sidecart, [class*="agni-sidecart"], .widget_shopping_cart_content, .woocommerce-mini-cart) {
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  color: var(--q-navy, #10233F);
}
:is(.agni-ajax-sidecart, .agni-sidecart) {
  background-color: var(--q-white, #FFFFFF);
}
:is(.agni-ajax-sidecart, .agni-sidecart, [class*="agni-sidecart"]) :is(h1, h2, h3, h4, h5, [class*="title"]):not(a):not(.woocommerce-mini-cart-item *) {
  font-family: var(--q-font-display, 'Space Grotesk', system-ui, sans-serif);
  font-weight: 500;
  color: var(--q-navy, #10233F);
}
:is(.agni-ajax-sidecart, .agni-sidecart, [class*="agni-sidecart"]) :is(button, [class*="close"]):not(.button) {
  color: var(--q-navy, #10233F);
}

.woocommerce-mini-cart .woocommerce-mini-cart-item,
:is(.agni-ajax-sidecart, .agni-sidecart) .mini_cart_item {
  border-color: var(--q-line, #E8E2D6);
  color: var(--q-navy, #10233F);
  font-size: 16px;
}
.woocommerce-mini-cart .woocommerce-mini-cart-item a:not(.remove),
:is(.agni-ajax-sidecart, .agni-sidecart) .mini_cart_item a:not(.remove) {
  color: var(--q-navy, #10233F);
  font-weight: 600;
  text-decoration: none;
}
.woocommerce-mini-cart .woocommerce-mini-cart-item img {
  background: var(--q-stone, #F4EFE7);
}
.woocommerce-mini-cart .woocommerce-mini-cart-item .quantity,
.woocommerce-mini-cart .woocommerce-mini-cart-item .variation {
  color: var(--q-muted, #4A5568);
  font-size: 14px;
}
.woocommerce-mini-cart .woocommerce-mini-cart-item a.remove,
:is(.agni-ajax-sidecart, .agni-sidecart) a.remove {
  color: var(--q-muted, #4A5568) !important; /* Woo sets #e2401c !important */
}
.woocommerce-mini-cart .woocommerce-mini-cart-item a.remove:hover,
:is(.agni-ajax-sidecart, .agni-sidecart) a.remove:hover {
  background: var(--q-mist, #F7F4EE);
  color: var(--q-navy, #10233F) !important;
}

.woocommerce-mini-cart__total,
:is(.agni-ajax-sidecart, .agni-sidecart) .total {
  border-color: rgba(16, 35, 63, .2);
  color: var(--q-navy, #10233F);
  font-size: 18px;
}
.woocommerce-mini-cart__total strong,
.woocommerce-mini-cart__total .amount {
  font-weight: 600;
  color: var(--q-navy, #10233F);
}

.woocommerce-mini-cart__empty-message {
  color: var(--q-muted, #4A5568);
  font-size: 16px;
}

/* mini-cart buttons: checkout = navy primary, view cart = outline */
.woocommerce-mini-cart__buttons a.button,
:is(.agni-ajax-sidecart, .agni-sidecart) .buttons a.button {
  border: 1.5px solid var(--q-navy, #10233F);
  border-radius: var(--q-radius, 4px);
  background: var(--q-white, #FFFFFF);
  color: var(--q-navy, #10233F);
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  font-size: 16px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0;
  text-decoration: none;
  box-shadow: none;
}
.woocommerce-mini-cart__buttons a.button:hover,
:is(.agni-ajax-sidecart, .agni-sidecart) .buttons a.button:hover {
  background: var(--q-mist, #F7F4EE);
  color: var(--q-navy, #10233F);
}
.woocommerce-mini-cart__buttons a.button.checkout,
:is(.agni-ajax-sidecart, .agni-sidecart) .buttons a.button.checkout {
  background: var(--q-navy, #10233F);
  color: var(--q-white, #FFFFFF);
}
.woocommerce-mini-cart__buttons a.button.checkout:hover,
:is(.agni-ajax-sidecart, .agni-sidecart) .buttons a.button.checkout:hover {
  border-color: var(--q-ink, #010D30);
  background: var(--q-ink, #010D30);
  color: var(--q-white, #FFFFFF);
}

/* --------------------------------------------------------------------------
   17. Classic product loop (where Woo renders ul.products, e.g. related
       products from Woo templates) — light baseline; our grid is .q-products
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) ul.products li.product {
  position: relative;
}
:is(.woocommerce, .woocommerce-page) ul.products li.product a img {
  background: var(--q-stone, #F4EFE7);
  mix-blend-mode: multiply;
}
:is(.woocommerce, .woocommerce-page) ul.products li.product :is(.woocommerce-loop-product__title, h2, h3) {
  padding: 0;
  font-family: var(--q-font-display, 'Space Grotesk', system-ui, sans-serif);
  font-size: 18px;
  font-weight: 500;
  line-height: 1.3;
  color: var(--q-navy, #10233F);
}
:is(.woocommerce, .woocommerce-page) ul.products li.product .price {
  color: var(--q-navy, #10233F);
  font-size: 16px;
  font-weight: 600;
}
:is(.woocommerce, .woocommerce-page) ul.products li.product.outofstock a img {
  opacity: .4;
}

/* --------------------------------------------------------------------------
   18. Block-checkout / blocks fallback (in case a page uses Woo blocks)
   -------------------------------------------------------------------------- */
:is(.woocommerce, .woocommerce-page) :is(.wc-block-components-button:not(.is-link), .wc-block-cart__submit-button, .wc-block-components-checkout-place-order-button) {
  min-height: 52px;
  border-radius: var(--q-radius, 4px);
  background: var(--q-navy, #10233F);
  color: var(--q-white, #FFFFFF);
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
  font-size: 16px;
  font-weight: 600;
}
:is(.woocommerce, .woocommerce-page) .wc-block-components-text-input :is(input, textarea),
:is(.woocommerce, .woocommerce-page) .wc-block-components-combobox .components-combobox-control input {
  border-color: var(--q-border, #8A93A3);
  border-radius: var(--q-radius, 4px);
  color: var(--q-navy, #10233F);
  font-family: var(--q-font-body, 'Source Sans 3', system-ui, sans-serif);
}
