/* Mandyju — WooCommerce Shop (Archive) styles
 * Targets block template classes from templates/archive-product.html
 */

/* Layout wrappers */
.mandyju-product-archive .mandyju-shop-header {
  --mj-gap: clamp(16px, 2vw, 28px);
}
.mandyju-product-archive .mandyju-shop-content {
  --mj-card-radius: 12px;
  --mj-card-gap: clamp(16px, 2.4vw, 28px);
  --mj-card-border: var(--wp--preset--color--contrast-3, #e5e7eb);
  --mj-card-shadow: 0 6px 22px -8px rgba(0,0,0,.15);
}

/* Header: title + sorting alignment */
.mandyju-shop-header .alignwide { max-width: 1200px; }
.mandyju-shop-header .wp-block-woocommerce-archive-title,
.mandyju-shop-header .wc-block-components-archive-title { margin: 0; }
.mandyju-shop-header .wp-block-group.alignwide {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: var(--mj-gap);
  align-items: center;
}
.mandyju-shop-header .wp-block-woocommerce-catalog-sorting,
.mandyju-shop-header .wc-block-catalog-sorting {
  justify-self: end;
}
@media (max-width: 720px) {
  .mandyju-shop-header .wp-block-group.alignwide { grid-template-columns: 1fr; }
  .mandyju-shop-header .wp-block-woocommerce-catalog-sorting,
  .mandyju-shop-header .wc-block-catalog-sorting { justify-self: start; }
}

/* Breadcrumbs */
.mandyju-shop-header .wp-block-woocommerce-breadcrumbs,
.mandyju-shop-header .woocommerce-breadcrumb {
  color: var(--wp--preset--color--contrast-2, #6b7280);
  font-size: .9rem;
}
.mandyju-shop-header .woocommerce-breadcrumb a { color: inherit; text-decoration: none; }
.mandyju-shop-header .woocommerce-breadcrumb a:hover { color: var(--wp--preset--color--primary); }

/* Toolbar */
.mandyju-shop-toolbar{display:none}

.mandyju-filter-bar{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:.5rem;
  width:100%;
  margin-bottom: var(--wp--preset--spacing--40);
  background: var(--wp--preset--color--background-base);
  border: 1px solid var(--mj-card-border);
  border-radius: 12px;
  padding: .5rem;
}
.is-layout-constrained .mandyju-filter-bar{ margin-left:0 !important; margin-right:0 !important; }
.mandyju-filter-bar label.mandyju-filter-toggle{ margin:0 !important; }

/* Reset constrained layout auto margins so flex alignment works */
.mandyju-filter-bar > * { margin-left: 0 !important; margin-right: 0 !important; }

/* Ensure the toggle hugs the right edge inside the bar */
.mandyju-filter-bar .mandyju-filter-toggle{
  /* Override block editor's auto-centering margins */
  margin-left: auto !important;
  margin-right: 0 !important;
  /* Reset default label margins for vertical centering */
  margin-top: 0;
  margin-bottom: 0;
}

.mj-filters-toolbar{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:1rem;
  margin-bottom:clamp(12px,1.6vw,20px)
}
.mj-clear-filters{
  align-self:flex-start;
  padding:.5rem .75rem;
  border:1px solid var(--mj-card-border);
  border-radius:8px;
  background:#fff;
  color:var(--wp--preset--color--contrast);
  text-decoration:none;
  font-weight:600;
}
.mj-clear-filters:hover{ color:var(--wp--preset--color--primary); border-color:var(--wp--preset--color--primary) }
.mandyju-shop-toolbar .wp-block-woocommerce-product-results-count { color: var(--wp--preset--color--contrast-2, #6b7280); }
.mandyju-shop-toolbar .wp-block-woocommerce-catalog-sorting { justify-self: end; }
.mandyju-filter-toggle {
  justify-self: end;
  padding: .55rem .85rem;
  border: 1px solid var(--mj-card-border);
  border-radius: 8px;
  background: #fff;
  color: var(--wp--preset--color--contrast);
  font-weight: 600;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}
.mandyju-filter-toggle .mj-icon{ display:inline-block }
.mandyju-shop-toolbar select { border-radius: 8px; padding: .55rem .75rem; border: 1px solid var(--mj-card-border); }

/* Content columns: product grid + sidebar */
.mandyju-products-grid .wp-block-post-template {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--mj-card-gap);
}
@media (max-width: 1024px) {
  .mandyju-products-grid .wp-block-post-template { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 640px) {
  .mandyju-products-grid .wp-block-post-template { grid-template-columns: 1fr; }
}

/* Product card */
.mandyju-product-card {
  position: relative;
  background: var(--wp--preset--color--base, #ffffff);
  border: 1px solid var(--mj-card-border);
  border-radius: var(--mj-card-radius);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.mandyju-product-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--mj-card-shadow);
  border-color: transparent;
}

/* Image */
.mandyju-product-card .wp-block-woocommerce-product-image img,
.mandyju-product-card img.wp-post-image {
  width: 100%;
  height: auto;
  border-radius: 8px;
  background: var(--wp--preset--color--base-2, #f6f7f9);
  aspect-ratio: 3 / 4;
  object-fit: cover;
}

/* Meta: category, title, price, rating */
.mandyju-product-card .wp-block-post-terms {
  font-size: 11px;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: .4px;
  color: var(--wp--preset--color--primary);
}
.mandyju-product-card .wp-block-post-title {
  margin: 0.2rem 0 .35rem;
  font-weight: 600;
  line-height: 1.3;
}
.mandyju-product-card .wp-block-post-title a { color: var(--wp--preset--color--contrast); text-decoration: none; }
.mandyju-product-card .wp-block-post-title a:hover { color: var(--wp--preset--color--primary); }

.mandyju-product-card .wp-block-woocommerce-product-price { color: var(--wp--preset--color--primary); font-weight: 700; }
.mandyju-product-card .wp-block-woocommerce-product-rating { margin: .25rem 0 .4rem; }

/* Add to cart button: reveal on hover on larger screens */
.mandyju-product-card .wp-block-woocommerce-product-button .wp-block-button__link,
.mandyju-product-card .wp-block-woocommerce-product-button a {
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4em;
  border-radius: 8px;
  background: var(--wp--preset--color--primary);
  color: #fff;
  font-weight: 700;
  padding: .85em 1em;
  text-decoration: none;
  transition: background .2s ease, opacity .2s ease;
}
.mandyju-product-card .wp-block-woocommerce-product-button .wp-block-button__link:hover,
.mandyju-product-card .wp-block-woocommerce-product-button a:hover {
  background: var(--wp--preset--color--secondary, #111827);
}
@media (min-width: 741px) {
  .mandyju-product-card .wp-block-woocommerce-product-button { opacity: 0; transform: translateY(4px); transition: opacity .2s ease, transform .2s ease; }
  .mandyju-product-card:hover .wp-block-woocommerce-product-button { opacity: 1; transform: translateY(0); }
}

/* Sale badge alignment (Woo blocks output varies) */
.mandyju-product-card .onsale,
.mandyju-product-card .wc-block-components-product-sale-badge {
  position: absolute;
  top: 10px;
  left: 10px;
  background: var(--wp--preset--color--secondary, #EF4444);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  padding: .35em .5em;
  border-radius: 4px;
  letter-spacing: .4px;
  z-index: 2;
}

/* Pagination */
.mandyju-product-archive .wp-block-query-pagination {
  gap: .5rem;
  justify-content: center;
  background: var(--wp--preset--color--background-base);
  border: 1px solid var(--mj-card-border);
  border-radius: 12px;
  padding: .5rem;
  margin-top: var(--wp--preset--spacing--40);
}
.mandyju-product-archive .wp-block-query-pagination .wp-block-query-pagination-numbers .page-numbers,
.mandyju-product-archive .wp-block-query-pagination .wp-block-query-pagination-previous,
.mandyju-product-archive .wp-block-query-pagination .wp-block-query-pagination-next {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 .75rem;
  border: 1px solid var(--mj-card-border);
  border-radius: 8px;
  background: #fff;
  text-decoration: none;
  color: var(--wp--preset--color--contrast);
  font-weight: 600;
}
.mandyju-product-archive .wp-block-query-pagination a:hover {
  color: var(--wp--preset--color--primary);
  border-color: var(--wp--preset--color--primary);
}
.mandyju-product-archive .wp-block-query-pagination .page-numbers.current {
  background: var(--wp--preset--color--primary);
  color: #fff;
  border-color: var(--wp--preset--color--primary);
}

/* Sidebar widgets spacing tweaks */
.mandyju-shop-sidebar .wp-block-woocommerce-product-categories,
.mandyju-shop-sidebar .wp-block-woocommerce-price-filter,
.mandyju-shop-sidebar .wp-block-tag-cloud {
  line-height: 1.7;
}

/* Collapsible Filters Panel (checkbox hack) */
.mandyju-shop-filters {
  border: 1px solid var(--mj-card-border);
  border-radius: 12px;
  padding: var(--wp--preset--spacing--40);
  background: #fff;
  box-shadow: 0 4px 14px -8px rgba(0,0,0,.12);
  margin-bottom: var(--wp--preset--spacing--50);
  display: none;
}
.mandyju-filter-checkbox:checked ~ .mandyju-shop-filters { display:block }
.mandyju-filter-toggle { user-select: none }

/* Filters: homogeneous heading styles */
.mandyju-shop-filters .wp-block-heading,
.mandyju-shop-filters h2,
.mandyju-shop-filters h3,
.mandyju-shop-filters h4 {
  font-family: var(--wp--preset--font-family--heading) !important;
  font-weight: 600;
  font-size: var(--wp--preset--font-size--medium) !important;
  line-height: 1.35;
  margin: 0 0 var(--wp--preset--spacing--20);
}

/* Ensure the search label matches heading treatment */
.mandyju-shop-filters .wc-block-product-search__label {
  display: block;
  margin: 0 0 var(--wp--preset--spacing--20);
  font-family: var(--wp--preset--font-family--heading);
  font-weight: 600;
  font-size: var(--wp--preset--font-size--medium);
}

/* Tidy toolbar text sizing to body scale */
.mj-filters-toolbar .woocommerce-result-count,
.mj-filters-toolbar .woocommerce-ordering select {
  font-size: 0.95rem;
}

/* Product search compact styles */
.wc-block-product-search .wc-block-product-search__fields,
.wp-block-woocommerce-product-search .wc-block-product-search__fields {
  border: 1px solid var(--mj-card-border);
  border-radius: 10px;
  padding: 6px 8px;
}
.wc-block-product-search input[type="search"] { border: 0; outline: none; }
.wc-block-product-search button { border-radius: 8px; }

/* Min/Max price filter form */
.mj-price-filter .mj-price-inputs {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto;
  align-items: center;
  gap: .5rem;
}
.mj-price-filter input[type="number"] {
  width: 100%;
  padding: .5rem .65rem;
  border: 1px solid var(--mj-card-border);
  border-radius: 8px;
}
.mj-price-filter .mj-price-apply {
  padding: .55rem .9rem;
  border: 1px solid var(--mj-card-border);
  border-radius: 8px;
  background: var(--wp--preset--color--primary);
  color: #fff;
  font-weight: 700;
}
