/* Product filters (preview). Uses the site's design tokens from style.css. */
.facet-bar{display:grid;gap:var(--space-3);margin:var(--space-4) 0 var(--space-3);padding:var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);box-shadow:var(--shadow-sm)}
.facet-bar[hidden]{display:none}
.facet-types{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.facet-chip{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 12px;border:1px solid var(--color-border);border-radius:var(--radius-full);background:var(--color-bg);color:var(--color-text);font:inherit;font-size:var(--text-sm,0.875rem);font-weight:600;cursor:pointer;transition:border-color .15s,background .15s}
.facet-chip span{color:var(--color-text-muted);font-weight:500;font-variant-numeric:tabular-nums}
.facet-chip:hover{border-color:var(--color-primary)}
.facet-chip.is-active{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-text-inverse)}
.facet-chip.is-active span{color:inherit;opacity:.85}
.facet-menus{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:flex-start}
.facet-menu{position:relative}
.facet-menu>summary,.size-grid>summary{list-style:none;display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 12px;border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-bg);font-size:var(--text-sm,0.875rem);font-weight:600;cursor:pointer;user-select:none;white-space:nowrap}
.facet-menu>summary::-webkit-details-marker,.size-grid>summary::-webkit-details-marker{display:none}
.facet-menu>summary::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);opacity:.6}
.facet-menu[open]>summary::after{transform:translateY(2px) rotate(-135deg)}
.facet-menu.is-active>summary{border-color:var(--color-primary);color:var(--color-primary)}
.facet-options{position:absolute;z-index:30;top:calc(100% + 4px);left:0;min-width:220px;max-width:min(320px,86vw);max-height:340px;overflow:auto;padding:var(--space-2);border:1px solid var(--color-border);border-radius:var(--radius-md);background:var(--color-surface);box-shadow:var(--shadow-lg)}
.facet-option{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:6px 8px;border-radius:var(--radius-sm);font-size:var(--text-sm,0.875rem);cursor:pointer}
.facet-option:hover{background:var(--color-surface-offset)}
.facet-option input{width:16px;height:16px;margin:0;accent-color:var(--color-primary)}
.facet-option small{color:var(--color-text-muted);font-variant-numeric:tabular-nums}
.facet-reset,.facet-clear{border:0;background:none;color:var(--color-primary);font:inherit;font-size:var(--text-sm,0.875rem);font-weight:600;cursor:pointer;padding:6px 8px;text-decoration:underline;text-underline-offset:3px}
.facet-clear{min-height:36px}
.facet-count{font-size:var(--text-sm,0.875rem);color:var(--color-text-muted);font-variant-numeric:tabular-nums}
.size-grid>summary span{font-weight:500;color:var(--color-text-muted)}
.size-grid-scroll{margin-top:var(--space-2);max-height:420px;overflow:auto;border:1px solid var(--color-border);border-radius:var(--radius-md)}
.size-grid table{border-collapse:separate;border-spacing:0;font-size:12px;font-variant-numeric:tabular-nums}
.size-grid th,.size-grid td{padding:0;border-bottom:1px solid var(--color-divider,var(--color-border));border-right:1px solid var(--color-divider,var(--color-border));text-align:center;white-space:nowrap}
.size-grid thead th{position:sticky;top:0;z-index:2;background:var(--color-surface-2,var(--color-surface));padding:6px 8px;font-weight:600}
.size-grid tbody th{position:sticky;left:0;z-index:1;background:var(--color-surface-2,var(--color-surface));padding:4px 10px;font-weight:600;text-align:left}
.size-grid thead th:first-child{left:0;z-index:3}
.size-grid th.is-active{color:var(--color-primary)}
.size-grid td button{display:block;width:100%;min-width:44px;min-height:32px;border:0;background:none;color:var(--color-text);font:inherit;cursor:pointer}
.size-grid td button:hover{background:var(--color-primary-highlight,var(--color-surface-offset))}
.size-grid td button.is-active{background:var(--color-primary);color:var(--color-text-inverse);font-weight:700}
.result-spec{margin-top:4px;font-size:var(--text-sm,0.875rem);color:var(--color-text-muted)}
.results-more{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-5) 0;color:var(--color-text-muted);font-size:var(--text-sm,0.875rem)}
@media (max-width:640px){
  .facet-bar{padding:var(--space-3)}
  .facet-types{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
  .facet-chip{flex:0 0 auto}
  .facet-menu{position:static}
  .facet-menus{position:relative}
  .facet-options{left:0;right:0;max-width:none}
}
/* Compact controls: same text size as the active-filter pills (Fasteners ×). */
.facet-chip,.facet-menu>summary,.size-grid>summary,.facet-reset,.facet-clear{font-size:12px;min-height:30px;padding:4px 10px}
.facet-chip{gap:4px}
.facet-menu>summary::after{width:6px;height:6px}
.facet-option,.facet-count{font-size:12px}
/* Keep the size grid inside its tile; wide grids scroll sideways within it. */
.facet-bar{grid-template-columns:minmax(0,1fr)}
.facet-bar>*,.size-grid,.facet-menus{min-width:0;max-width:100%}
.size-grid-scroll{max-width:100%}
.size-grid table{font-size:11px}
.size-grid thead th{padding:4px 5px}
.size-grid tbody th{padding:3px 6px}
.size-grid td button{min-width:30px;min-height:26px}
/* Products page only (this file loads only there): use the full window width on wide screens. */
@media (min-width:1490px){
  .catalog-site-layout{max-width:none}
  .catalog-site-layout main>.section>.container{max-width:none}
  .site-header .container,.site-header .container.header-main{max-width:none!important;width:calc(100% - 32px)!important}
}
/* Category / search pills inside the filter panel, one Clear all at the end of the row. */
.facet-scope,.catalog-active-filters.in-facets{display:contents}
.facet-scope-row:not(:has(.catalog-active-filters:not([hidden]))){display:none}
.facet-bar .filter-chip{font-size:12px;font-weight:600}
@media (pointer:fine){
  .facet-bar .filter-chip{min-height:30px;padding:0 2px 0 10px;gap:4px}
  .facet-bar .filter-chip button{flex-basis:26px;width:26px;min-height:26px;font-size:16px}
}
.facet-bar .clear-all-filters{order:99;align-self:center;font-size:12px;font-weight:600;padding:6px 8px}
.facet-bar:has(.catalog-active-filters:not([hidden])) .facet-clear{display:none}

/* Item images in catalog result rows (same white frame as clearance tiles) */
.result-card.result-card-media{grid-template-columns:96px minmax(0,1fr) auto}
.result-image{display:flex;align-items:center;justify-content:center;width:96px;height:96px;background:#fff;border:1px solid var(--tile-border);border-radius:5px;padding:8px;box-sizing:border-box;overflow:hidden}
.result-image img{width:100%;height:100%;object-fit:contain;display:block}
.result-image-empty{background:var(--tile-bg);border:1px dashed var(--tile-border);color:var(--color-text-muted);font-size:11px;text-align:center;letter-spacing:.02em}
@media (max-width:680px){
  .result-card.result-card-media{grid-template-columns:72px minmax(0,1fr)}
  .result-card.result-card-media .result-image{width:72px;height:72px;padding:6px}
  .result-card.result-card-media .result-actions{grid-column:1 / -1}
}

/* Links to item pages (item.php) */
.result-card h3 a{color:inherit;text-decoration:none}
.result-card h3 a:hover{text-decoration:underline}
.result-detail-link{display:inline-block;margin-top:4px;font-size:var(--text-sm,0.875rem);font-weight:700;color:var(--color-primary,#8f221c);text-decoration:none}
.result-detail-link:hover{text-decoration:underline}
a.result-image{text-decoration:none}
