/* WooCommerce storefront, cart and checkout. Vanilla CSS only. */
.woocommerce #primary,
.woocommerce-page #primary {
  width: min(100% - 2rem, var(--content-max));
  margin-inline: auto;
  padding-block: var(--space-8) var(--space-16);
}

.woocommerce #primary .site-main,
.woocommerce-page #primary .site-main {
  width: 100%;
  margin: 0;
}

.woocommerce-breadcrumb {
  margin-bottom: var(--space-5) !important;
  color: var(--color-text-secondary) !important;
  font-size: var(--text-body-sm) !important;
}

.woocommerce-products-header__title,
.woocommerce div.product .product_title,
.woocommerce-cart .entry-title,
.woocommerce-checkout .entry-title {
  font-family: var(--font-ui);
  font-weight: 700;
  line-height: 1.4;
}

.woocommerce .woocommerce-result-count {
  color: var(--color-text-secondary);
}

.woocommerce .woocommerce-ordering select {
  min-height: 2.75rem;
  min-width: 14rem;
  padding-inline: var(--space-3);
  border: var(--border-default);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  color: var(--color-ink);
}

.coffeeomde-catalog-filters {
  display: grid;
  grid-template-columns: repeat(3, minmax(9rem, 1fr)) repeat(2, minmax(8rem, .8fr)) auto auto;
  align-items: end;
  gap: var(--space-3);
  clear: both;
  margin: var(--space-6) 0;
  padding: var(--space-4);
  border: var(--border-default);
  border-radius: var(--radius-md);
  background: var(--color-surface-warm);
}

.coffeeomde-catalog-filters label { display: grid; gap: var(--space-1); min-width: 0; color: var(--color-text-secondary); font-size: var(--text-utility); font-weight: 600; }
.coffeeomde-catalog-filters select,
.coffeeomde-catalog-filters input { width: 100%; min-height: var(--touch-target); border: var(--border-default); border-radius: var(--radius-sm); background: var(--color-surface); color: var(--color-ink); padding-inline: var(--space-3); }
.coffeeomde-catalog-filters button,
.coffeeomde-catalog-filters > a { min-height: var(--touch-target); display: inline-flex; align-items: center; justify-content: center; padding-inline: var(--space-4); border-radius: var(--radius-sm); font-weight: 600; white-space: nowrap; }
.coffeeomde-catalog-filters button { border: 1px solid var(--color-primary); background: var(--color-primary); color: var(--color-white); cursor: pointer; }
.coffeeomde-catalog-filters > a { border: var(--border-strong); background: var(--color-surface); color: var(--color-ink); text-decoration: none; }

.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-6);
  clear: both;
  margin: var(--space-8) 0 0 !important;
  padding: 0 !important;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after {
  display: none !important;
}

.woocommerce ul.products li.product {
  width: auto !important;
  float: none !important;
  margin: 0 !important;
  padding: var(--space-3) !important;
  display: flex;
  flex-direction: column;
  min-width: 0;
  background: var(--color-surface);
  border: var(--border-default);
  border-radius: var(--radius-md);
  transition: border-color var(--duration-state) var(--ease-standard), background-color var(--duration-state) var(--ease-standard);
}

.woocommerce ul.products li.product:hover {
  border-color: var(--color-border-strong);
  background: #fffdfa;
}

.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
  display: flex;
  flex-direction: column;
  flex: 1;
  color: var(--color-ink);
  text-decoration: none;
}

.woocommerce ul.products li.product a img {
  width: 100%;
  margin: 0 0 var(--space-4) !important;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: var(--radius-sm);
  background: var(--color-surface-warm);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  min-height: 3.2em;
  padding: 0 !important;
  margin-bottom: var(--space-3) !important;
  color: var(--color-ink);
  font-size: 1rem !important;
  font-weight: 700;
  line-height: 1.55;
}

.woocommerce ul.products li.product .price {
  margin-top: auto;
  color: var(--color-forest) !important;
  font-size: var(--text-label) !important;
  font-weight: 600 !important;
}

.coffeeomde-pending-price,
.coffeeomde-pending-stock {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: var(--space-1) var(--space-2);
  border-radius: var(--radius-pill);
  background: var(--color-forest-surface);
  color: var(--color-forest);
  font-size: var(--text-utility);
  font-weight: 600;
}

.woocommerce ul.products li.product .button {
  width: 100%;
  min-height: var(--touch-target);
  margin: var(--space-4) 0 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--color-primary);
  border-radius: var(--radius-sm);
  background: var(--color-surface) !important;
  color: var(--color-primary) !important;
  font-weight: 600 !important;
}

.woocommerce ul.products li.product .button:hover {
  background: var(--color-primary) !important;
  color: var(--color-white) !important;
}

.woocommerce nav.woocommerce-pagination ul {
  display: flex;
  gap: var(--space-2);
  border: 0 !important;
}

.woocommerce nav.woocommerce-pagination ul li {
  border: 0 !important;
}

.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  display: grid;
  place-items: center;
  min-width: 2.75rem;
  min-height: 2.75rem;
  border: var(--border-default);
  border-radius: var(--radius-sm);
  background: var(--color-surface) !important;
  color: var(--color-ink) !important;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
  border-color: var(--color-primary);
  background: var(--color-primary) !important;
  color: var(--color-white) !important;
}

/* Single product */
.woocommerce div.product {
  display: flow-root;
}

.woocommerce div.product div.images img {
  border: var(--border-default);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}

.woocommerce div.product div.summary {
  padding: var(--space-6);
  border: var(--border-default);
  border-radius: var(--radius-lg);
  background: var(--color-surface);
}

.woocommerce div.product .product_meta {
  display: grid;
  gap: var(--space-2);
  padding-top: var(--space-4);
  border-top: var(--border-default);
  color: var(--color-text-secondary);
  font-size: var(--text-body-sm);
}

.woocommerce div.product .woocommerce-tabs,
.woocommerce div.product .related {
  clear: both;
  padding-top: var(--space-10);
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
  margin: 0 0 var(--space-5) !important;
  padding: 0 !important;
}

.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 !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  border: var(--border-default) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--color-surface) !important;
}

.woocommerce div.product .woocommerce-tabs .panel {
  padding: var(--space-6);
  border: var(--border-default);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}

/* Notices and forms */
.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
  border-radius: var(--radius-sm);
  background: var(--color-surface) !important;
  border: var(--border-default);
  border-top: 0 !important;
}

.woocommerce-info,
.woocommerce-message {
  border-inline-start: 4px solid var(--color-forest) !important;
}

.woocommerce-error {
  border-inline-start: 4px solid var(--color-danger) !important;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.select2-container .select2-selection--single {
  min-height: 3rem;
  border: var(--border-default) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--color-surface);
  color: var(--color-ink);
  padding: var(--space-3);
}

.woocommerce form .form-row textarea {
  min-height: 7rem;
}

#billing_phone_field label .optional { display: none; }
#billing_phone_field label::after { content: " *"; color: var(--color-danger); font-weight: 700; }

/* Cart and checkout */
.woocommerce-cart-form,
.cart_totals,
.woocommerce-checkout-review-order,
.woocommerce-billing-fields,
.woocommerce-additional-fields,
.coffeeomde-shipping-preference {
  padding: var(--space-6);
  border: var(--border-default);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}

.woocommerce table.shop_table {
  border: var(--border-default) !important;
  border-collapse: separate !important;
  border-spacing: 0;
  border-radius: var(--radius-md) !important;
  overflow: hidden;
  background: var(--color-surface);
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
  padding: var(--space-4) !important;
  border-color: var(--color-border) !important;
}

.woocommerce #payment {
  border: var(--border-default);
  border-radius: var(--radius-md) !important;
  background: var(--color-surface-warm) !important;
}

.woocommerce #payment #place_order,
.woocommerce a.checkout-button,
.woocommerce button.button.alt {
  min-height: 3rem;
  border-radius: var(--radius-sm) !important;
  background: var(--color-primary) !important;
  color: var(--color-white) !important;
  font-weight: 700 !important;
}

.woocommerce #payment #place_order:hover,
.woocommerce a.checkout-button:hover,
.woocommerce button.button.alt:hover {
  background: var(--color-primary-hover) !important;
}

/* B2B price table */
.coffeeomde-price-table-wrap {
  width: 100%;
  overflow-x: auto;
  margin-top: var(--space-6);
  border: var(--border-default);
  border-radius: var(--radius-md);
  background: var(--color-surface);
}

.coffeeomde-price-table {
  width: 100%;
  min-width: 62rem;
  border-collapse: collapse;
  text-align: right;
}

.coffeeomde-price-table th,
.coffeeomde-price-table td {
  padding: var(--space-3) var(--space-4);
  border-bottom: var(--border-default);
  vertical-align: middle;
}

.coffeeomde-price-table thead th {
  position: sticky;
  top: var(--header-height);
  z-index: var(--z-sticky);
  background: var(--color-ink);
  color: var(--color-white);
  white-space: nowrap;
}

.coffeeomde-price-table tbody th {
  min-width: 17rem;
}

.coffeeomde-price-table a {
  color: var(--color-primary-hover);
  font-weight: 600;
}

@media (max-width: 64rem) {
  .coffeeomde-catalog-filters { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .woocommerce ul.products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 48rem) {
  .coffeeomde-catalog-filters { grid-template-columns: repeat(2, minmax(0,1fr)); margin-block: var(--space-4); padding: var(--space-3); }
  .coffeeomde-catalog-filters button,
  .coffeeomde-catalog-filters > a { width: 100%; }
  .woocommerce #primary,
  .woocommerce-page #primary {
    width: min(100% - 2rem, var(--content-max));
    padding-block: var(--space-5) var(--space-12);
  }

  .woocommerce .woocommerce-result-count,
  .woocommerce .woocommerce-ordering {
    float: none !important;
    width: 100%;
  }

  .woocommerce .woocommerce-ordering select {
    width: 100%;
  }

  .woocommerce ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-3);
    margin-top: var(--space-5) !important;
  }

  .woocommerce ul.products li.product {
    padding: var(--space-2) !important;
  }

  .woocommerce ul.products li.product .woocommerce-loop-product__title {
    min-height: 4.7em;
    font-size: 0.9375rem !important;
  }

  .woocommerce ul.products li.product .button {
    font-size: var(--text-label) !important;
  }

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

  .woocommerce div.product div.summary {
    padding: var(--space-4);
  }

  .woocommerce-cart-form,
  .cart_totals,
  .woocommerce-checkout-review-order,
  .woocommerce-billing-fields,
  .woocommerce-additional-fields,
  .coffeeomde-shipping-preference {
    padding: var(--space-4);
  }
}

@media (max-width: 22.5rem) {
  .woocommerce ul.products {
    grid-template-columns: 1fr;
  }
}

/* Storefront redesign 0.8 — archive and account shells. */
.woocommerce-shop-shell { width: 100%; padding-block: clamp(1.5rem,4vw,3.5rem) clamp(4rem,7vw,7rem); }
.woocommerce-shop-shell > .site-main { width: min(100% - 2rem,var(--content-max)); margin-inline: auto; }
.woocommerce-archive-intro { position: relative; overflow: hidden; margin-bottom: 2rem; padding: clamp(1.5rem,4vw,3rem); border: 1px solid rgb(36 76 63 / 14%); border-radius: var(--radius-lg); background: linear-gradient(135deg,#edf4f1 0%,#f8f1e7 100%); }
.woocommerce-archive-intro::after { content: ""; position: absolute; inset-inline-end: -4rem; top: -6rem; width: 16rem; aspect-ratio: 1; border-radius: 50%; background: rgb(170 79 3 / 8%); }
.woocommerce-archive-intro .eyebrow { position: relative; z-index: 1; }
.woocommerce-archive-intro h1 { position: relative; z-index: 1; max-width: 25ch; margin-bottom: .75rem; }
.woocommerce-archive-intro__copy { position: relative; z-index: 1; max-width: 72ch; color: var(--color-text-secondary); line-height: 1.9; }
.woocommerce-archive-intro__copy p:last-child { margin-bottom: 0; }
.woocommerce-shop-shell .woocommerce-breadcrumb { margin-bottom: 1rem !important; }
.woocommerce-shop-shell .woocommerce-products-header { display: none; }
.woocommerce-shop-shell .woocommerce-result-count { min-height: 2.75rem; display: inline-flex; align-items: center; }
.woocommerce-shop-shell .woocommerce-ordering { margin-bottom: 1rem; }
.woocommerce-shop-shell ul.products li.product { box-shadow: 0 8px 28px rgb(23 18 15 / 5%); }
.woocommerce-shop-shell ul.products li.product:hover { box-shadow: 0 16px 38px rgb(23 18 15 / 9%); }
.woocommerce-account .woocommerce { display: grid; gap: 1.5rem; }
.woocommerce-account form.login, .woocommerce-account form.register { max-width: 46rem; margin-inline: auto; padding: clamp(1.25rem,3vw,2rem) !important; border: var(--border-default) !important; border-radius: var(--radius-lg) !important; background: var(--color-white); box-shadow: var(--shadow-md); }
.woocommerce-account .entry-title { text-align: center; }
.woocommerce-account .woocommerce-form-login__submit { min-width: 9rem; }

@media (max-width: 48rem) {
  .woocommerce-shop-shell > .site-main { width: min(100% - 1rem,var(--content-max)); }
  .woocommerce-archive-intro { padding: 1.25rem; }
  .woocommerce-archive-intro::after { width: 9rem; }
}
