/* Shop body (TODO 00001.5.14). FINAL design/shop/inspiration/sections/body/r3/v2.png.
   264px quiet hairline facet sidebar on white (drawer under 992, section 6), results column with count and sort,
   the product grid as one datasheet table (section 8 product card, datasheet cell variant), numbered pagination,
   and the Shop inline AI recommendations row (ai-surface between two 1px ai hairlines). Grid, count, sort,
   pagination and recommendations are judged against the composite in 00001.5.17 (C1b) once products exist. */
.p-shop-body {
  box-sizing: border-box; background: var(--wp--preset--color--white);
  padding: var(--wp--preset--spacing--90) var(--wp--custom--gutter--desktop);
}
.p-shop-body *, .p-shop-body *::before, .p-shop-body *::after { box-sizing: border-box; }
.p-shop-body__inner {
  max-width: var(--wp--custom--layout--wide); margin-inline: auto;
  display: grid; grid-template-columns: 264px minmax(0, 1fr); column-gap: var(--wp--preset--spacing--90); align-items: stretch;
}
.p-shop-body .p-shop-body__inner > * { margin-block: 0; }
/* Facet checkbox focus: 2px orange ring (WooCommerce's own :focus rule draws 1px currentColor and outranks the line below). */
.p-shop-body__filters input[type=checkbox].wc-block-product-filter-checkbox-list__input:focus-visible {
  outline: 2px solid var(--wp--preset--color--orange); outline-offset: 2px;
}
.p-shop-body a:focus-visible, .p-shop-body button:focus-visible, .p-shop-body select:focus-visible, .p-shop-body input:focus-visible {
  outline: var(--wp--custom--focus--width) solid var(--wp--preset--color--orange); outline-offset: var(--wp--custom--focus--offset);
}

/* Sidebar: Refine results, then the WooCommerce Product Filters block shown inline (overlayMode always + the
   rules Woo applies to its own mobile overlay above its breakpoint, here from 992). */
.p-shop-body__side { padding-right: var(--wp--preset--spacing--60); border-right: 1px solid var(--wp--preset--color--line); }
.p-shop-body__refine { padding-bottom: var(--wp--preset--spacing--50); border-bottom: 1px solid var(--wp--preset--color--line); }
.p-shop-body .p-shop-body__refine-title {
  margin: 0; color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--h-4);
  font-weight: var(--wp--custom--font-weight--h-4); line-height: 1.35;
}
.p-shop-body__refine-count, .p-shop-body__refine-note {
  margin: var(--wp--preset--spacing--20) 0 0; color: var(--wp--preset--color--slate);
  font-size: var(--wp--preset--font-size--small); line-height: 1.5;
}
.p-shop-body__filters { --wc-product-filters-background-color: var(--wp--preset--color--white); --wc-product-filters-text-color: var(--wp--preset--color--ink); }
.p-shop-body__filters .wp-block-heading {
  margin: 0 0 var(--wp--preset--spacing--30); color: var(--wp--preset--color--navy);
  font-size: var(--wp--preset--font-size--h-4); font-weight: var(--wp--custom--font-weight--h-4); line-height: 1.35;
}
.p-shop-body__filters .wc-block-product-filters__overlay-content > * {
  padding-block: var(--wp--preset--spacing--50); border-bottom: 1px solid var(--wp--preset--color--line);
}
.p-shop-body__filters .wc-block-product-filters__open-overlay {
  display: inline-flex; align-items: center; gap: var(--wp--preset--spacing--30); min-height: var(--wp--custom--control);
  padding: 0 var(--wp--preset--spacing--60); background: transparent; color: var(--wp--preset--color--navy);
  border: 1px solid var(--wp--preset--color--navy); border-radius: var(--wp--custom--radius--default);
  font-family: inherit; font-size: var(--wp--preset--font-size--button); font-weight: var(--wp--custom--font-weight--button);
}
.p-shop-body__side.is-empty .p-shop-body__filters { display: none; }
/* Facet option rows (Shop composite): label left, count in a right-aligned slate column, no parentheses. */
.p-shop-body__filters .wc-block-product-filter-checkbox-list__label { display: flex; width: 100%; }
.p-shop-body__filters .wc-block-product-filter-checkbox-list__text-wrapper {
  display: flex; flex: 1 1 auto; align-items: baseline; justify-content: space-between; gap: var(--wp--preset--spacing--40); min-width: 0;
}
.p-shop-body__filters .wc-block-product-filter-checkbox-list__count { flex: none; font-size: 0; }
.p-shop-body__filters .wc-block-product-filter-checkbox-list__count > span {
  color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); font-variant-numeric: tabular-nums;
}
/* The fieldset legend stays visually hidden but does not clip its own text: a 1 px box at its place in the facet,
   painted away by clip-path, so containment checks see nothing cut or outside its box. Screen readers still read it. */
.p-shop-body__filters legend.screen-reader-text {
  position: absolute !important; width: 1px !important; height: 1px !important; margin: 0 !important; padding: 0 !important;
  overflow: visible !important; white-space: nowrap; clip: auto !important; clip-path: inset(50%) !important; border: 0 !important;
}
@media (min-width: 992px) {
  .p-shop-body__filters { display: flex; }
  .p-shop-body__filters .wc-block-product-filters__overlay-header,
  .p-shop-body__filters .wc-block-product-filters__overlay-footer,
  .p-shop-body__filters .wc-block-product-filters__open-overlay { display: none; }
  .p-shop-body__filters .wc-block-product-filters__overlay {
    position: relative; pointer-events: auto; inset: 0; z-index: auto; background: inherit; color: inherit;
    transition: none; flex-grow: 1;
  }
  .p-shop-body__filters .wc-block-product-filters__overlay-wrapper { width: auto; height: auto; background: inherit; color: inherit; }
  .p-shop-body__filters .wc-block-product-filters__overlay-dialog {
    position: relative; width: auto; transform: none; transition: none; background: inherit; color: inherit;
  }
  .p-shop-body__filters .wc-block-product-filters__overlay-content { padding: 0; overflow: visible; flex-grow: 1; background: inherit; color: inherit; }
}

/* Results column: count left, sort right (section 8 D4). */
.p-shop-body__results { min-width: 0; }
.p-shop-body__results > * { margin-block: 0; }
.p-shop-body__bar {
  display: flex; align-items: center; justify-content: space-between; gap: var(--wp--preset--spacing--50);
  color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small);
}
.p-shop-body__bar:has(.wc-block-catalog-sorting) { margin-bottom: var(--wp--preset--spacing--50); }
.p-shop-body__total { margin: 0; color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--small); font-weight: 600; }
.p-shop-body__bar select {
  min-height: var(--wp--custom--touch); padding: 0 var(--wp--preset--spacing--70) 0 var(--wp--preset--spacing--40);
  border: 1px solid var(--wp--preset--color--slate); border-radius: var(--wp--custom--radius--default);
  background-color: var(--wp--preset--color--white); color: var(--wp--preset--color--ink); font: inherit;
}

/* Grid: datasheet cells sharing their 1px line hairlines edge to edge (C1b in 00001.5.17). */
.p-shop-body__grid .wc-block-product-template {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0; padding: 0; list-style: none;
  border-top: 1px solid var(--wp--preset--color--line); border-left: 1px solid var(--wp--preset--color--line);
}
.p-shop-body__grid .wc-block-product {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--wp--preset--spacing--50);
  margin: 0; padding: var(--wp--preset--spacing--40); width: auto; max-width: none;
  border-right: 1px solid var(--wp--preset--color--line); border-bottom: 1px solid var(--wp--preset--color--line);
}
/* The photo fills its half of the card top to bottom (Shop composite), cropped from the centre of the 4:3 file. */
.p-shop-body__grid .wc-block-components-product-image {
  position: relative; margin: 0; height: 100%; min-height: var(--wp--preset--spacing--130); overflow: hidden; background: var(--wp--preset--color--mist);
}
.p-shop-body__grid .wc-block-components-product-image a { position: absolute; inset: 0; display: block; }
.p-shop-body__grid .wc-block-components-product-image img {
  position: absolute; inset: 0; display: block; width: 100%; height: 100% !important; aspect-ratio: auto !important; object-fit: cover;
}
.p-shop-body__cell > * { margin-block: 0; }
.p-shop-body__cell .wp-block-post-title {
  color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--h-3);
  font-weight: var(--wp--custom--font-weight--h-3); line-height: 1.25;
}
.p-shop-body__cell .wp-block-post-title a { color: inherit; text-decoration: none; }
.p-shop-body__cell .wc-block-components-product-price { color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--price); font-weight: 700; }
.p-shop-body__spec { margin-top: var(--wp--preset--spacing--30) !important; color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); line-height: 1.5; }
.p-shop-body__spec p { margin: 0; }
.p-shop-body__add { margin-top: var(--wp--preset--spacing--50) !important; }
.p-shop-body__add .wp-element-button, .p-shop-body__recs .wp-element-button {
  min-height: var(--wp--preset--spacing--80); padding: 0 var(--wp--preset--spacing--50); background: var(--wp--preset--color--orange);
  color: var(--wp--preset--color--navy); border: 0; border-radius: var(--wp--custom--radius--default);
  font-size: var(--wp--preset--font-size--small); font-weight: var(--wp--custom--font-weight--button);
}

/* Foot row (Shop composite): pagination left, "Showing 1-9 of 12 instruments" right. */
.p-shop-body__foot {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--wp--preset--spacing--40) var(--wp--preset--spacing--60);
  margin-top: var(--wp--preset--spacing--50);
}
.p-shop-body__foot > * { margin-block: 0; }
.p-shop-body__foot .wc-block-product-results-count { margin-left: auto; }
.p-shop-body__foot .woocommerce-result-count { margin: 0; color: var(--wp--preset--color--slate); font-size: var(--wp--preset--font-size--small); }
/* Pagination: 44px squares, current navy (section 8). */
.p-shop-body__pages { margin: 0; gap: var(--wp--preset--spacing--30); font-size: var(--wp--preset--font-size--small); }
.p-shop-body__pages .page-numbers, .p-shop-body__pages a {
  display: inline-flex; align-items: center; justify-content: center; min-width: var(--wp--custom--touch); min-height: var(--wp--custom--touch);
  padding: 0 var(--wp--preset--spacing--30); border: 1px solid var(--wp--preset--color--line);
  border-radius: var(--wp--custom--radius--default); color: var(--wp--preset--color--navy); text-decoration: none;
}
.p-shop-body__pages .wp-block-query-pagination-previous.is-disabled {
  display: inline-flex; align-items: center; justify-content: center; min-width: var(--wp--custom--touch); min-height: var(--wp--custom--touch);
  padding: 0 var(--wp--preset--spacing--30); border: 1px solid var(--wp--preset--color--line);
  border-radius: var(--wp--custom--radius--default); color: var(--wp--preset--color--slate); cursor: default;
}
.p-shop-body__pages .page-numbers.current { background: var(--wp--preset--color--navy); border-color: var(--wp--preset--color--navy); color: var(--wp--preset--color--white); }

/* Honest empty state while the catalogue is empty. */
.p-shop-body__empty {
  padding: var(--wp--preset--spacing--90) var(--wp--preset--spacing--70);
  border: 1px solid var(--wp--preset--color--line); border-radius: var(--wp--custom--radius--default);
}
.p-shop-body__empty-title {
  margin: 0; color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--h-3);
  font-weight: var(--wp--custom--font-weight--h-3); line-height: 1.25;
}
.p-shop-body__empty-text { margin: var(--wp--preset--spacing--40) 0 0; color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--body); line-height: 1.6; }
.p-shop-body__empty-text a { color: var(--wp--preset--color--navy); font-weight: 500; text-decoration: underline 1px; text-underline-offset: 3px; }

/* Shop inline AI recommendations (renders only when it has products; functions.php). */
.p-shop-body__recs {
  margin-top: var(--wp--preset--spacing--90) !important; padding: var(--wp--preset--spacing--60);
  background: var(--wp--preset--color--ai-surface);
  border-top: 1px solid var(--wp--preset--color--ai); border-bottom: 1px solid var(--wp--preset--color--ai);
}
.p-shop-body__recs > * { margin-block: 0; }
.p-shop-body__recs-label {
  display: flex; align-items: center; gap: var(--wp--preset--spacing--30); color: var(--wp--preset--color--ai);
  font-size: var(--wp--preset--font-size--label); font-weight: var(--wp--custom--font-weight--label);
  letter-spacing: var(--wp--custom--letter-spacing--label); line-height: 1.3; text-transform: uppercase;
}
.p-shop-body .p-shop-body__recs-title {
  margin-top: var(--wp--preset--spacing--30); color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--h-2);
  font-weight: var(--wp--custom--font-weight--h-2); letter-spacing: var(--wp--custom--letter-spacing--h-2); line-height: 1.15;
}
.p-shop-body__recs-grid .wc-block-product-template {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: var(--wp--preset--spacing--60) 0 0; padding: 0; list-style: none;
}
.p-shop-body__recs-grid .wc-block-product { margin: 0; padding: 0 var(--wp--preset--spacing--50); width: auto; max-width: none; }
.p-shop-body__recs-grid .wc-block-product + .wc-block-product { border-left: 1px solid var(--wp--preset--color--line); }
.p-shop-body__recs-grid .wp-block-post-title { color: var(--wp--preset--color--navy); font-size: var(--wp--preset--font-size--h-4); font-weight: var(--wp--custom--font-weight--h-4); }
.p-shop-body__recs-grid .wp-block-post-title a { color: inherit; text-decoration: none; }

@media (hover: hover) and (pointer: fine) {
  .p-shop-body__empty-text a:hover { text-decoration-thickness: 2px; }
  .p-shop-body__pages a:hover { border-color: var(--wp--preset--color--navy); }
}
@media (max-width: 1199.98px) {
  .p-shop-body__grid .wc-block-product { grid-template-columns: minmax(0, 1fr); row-gap: var(--wp--preset--spacing--60); }
  .p-shop-body__grid .wc-block-components-product-image { height: auto; min-height: 0; aspect-ratio: 4 / 3; }
  .p-shop-body__recs-grid .wc-block-product-template { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--wp--preset--spacing--60); }
}
@media (max-width: 991.98px) {
  .p-shop-body { padding: var(--wp--preset--spacing--90) var(--wp--custom--gutter--tablet); }
  .p-shop-body__inner { grid-template-columns: minmax(0, 1fr); row-gap: var(--wp--preset--spacing--60); }
  .p-shop-body__side { padding-right: 0; border-right: 0; }
  .p-shop-body__refine { display: flex; align-items: baseline; justify-content: space-between; gap: var(--wp--preset--spacing--50); flex-wrap: wrap; }
  .p-shop-body__filters { margin-top: var(--wp--preset--spacing--50); }
  .p-shop-body__grid .wc-block-product-template { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 600px) and (max-width: 991.98px) {
  /* Three across down to 600 so a 9-card page never leaves one card alone on its last row (gap-check at 768). */
  .p-shop-body__grid .wc-block-product-template { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 599.98px) {
  .p-shop-body { padding: var(--wp--preset--spacing--80) var(--wp--custom--gutter--phone); }
  .p-shop-body__grid .wc-block-product-template, .p-shop-body__recs-grid .wc-block-product-template { grid-template-columns: minmax(0, 1fr); }
  .p-shop-body__recs-grid .wc-block-product + .wc-block-product { border-left: 0; border-top: 1px solid var(--wp--preset--color--line); padding-top: var(--wp--preset--spacing--60); }
  .p-shop-body__empty { padding: var(--wp--preset--spacing--70) var(--wp--preset--spacing--60); }
}