/* Presentation contract: --wf-* properties, then the Wooptima theme tokens, then a neutral value (docs/THEMING.md). */
.wf-catalog { display:grid; grid-template-columns:var(--wf-sidebar-width, 262px) minmax(0,1fr); grid-template-rows:auto 1fr; column-gap:var(--wf-gap, 24px); row-gap:var(--wf-row-gap, 18px); align-items:start; min-width:0; font-family:var(--wf-font, var(--font-body, sans-serif)); color:var(--wf-text, var(--color-neutral-1000, #18181b)); }
.wf-catalog [hidden] { display:none !important; }
.wf-filters { grid-column:1; grid-row:1 / span 2; min-width:0; }
.wf-filters > summary,.wf-filters__heading { display:none; }
.wf-filters__form { display:flex; flex-direction:column; gap:8px; margin:0; }
.wf-filters__panel { min-width:0; }
.wf-toolbar { grid-column:2; grid-row:1; display:flex; justify-content:space-between; align-items:center; gap:16px; min-width:0; }
.wf-sort { display:flex; align-items:center; gap:10px; font-size:14px; color:var(--wf-muted, var(--color-neutral-800, #52525b)); }
.wf-sort select { width:auto; max-width:100%; min-height:46px; padding:10px 32px 10px 14px; border:1px solid var(--wf-border, var(--color-neutral-400, #e4e4e7)); border-radius:var(--wf-radius-control, 10px); background:var(--wf-surface, var(--color-white, #fff)); color:var(--wf-text, var(--color-neutral-1000, #18181b)); font:600 14px var(--wf-font, var(--font-body, sans-serif)); }
.wf-count { margin:0; font-size:14px; color:var(--wf-muted, var(--color-neutral-800, #52525b)); }
.wf-results { grid-column:2; grid-row:2; min-width:0; }
.wf-sort,.wf-results { scroll-margin-top:var(--wf-scroll-offset, 24px); }
.wf-results > [data-wf-empty] { padding:32px; border:1px solid var(--wf-border, var(--color-neutral-400, #e4e4e7)); border-radius:var(--wf-radius-panel, 16px); background:var(--wf-surface, var(--color-white, #fff)); }
.wf-apply { display:flex; justify-content:center; align-items:center; min-height:48px; width:100%; margin-top:8px; padding:12px 16px; background:var(--wf-action, var(--color-conversion-500, #15803d)); color:var(--wf-on-action, var(--color-white, #fff)); border:0; border-radius:var(--wf-radius-action, 12px); font:700 15px var(--wf-font, var(--font-body, sans-serif)); cursor:pointer; }
.wf-apply:hover { filter:brightness(.94); }
.wf-reset { display:block; padding:14px 8px; text-align:center; font-size:13px; color:var(--wf-muted, var(--color-neutral-800, #52525b)); text-decoration:underline; }
.wf-range__inputs { clear:both; display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.wf-range__inputs label { display:grid; gap:6px; font-size:12px; color:var(--wf-muted, var(--color-neutral-800, #52525b)); }
.wf-range__inputs input { width:100%; min-width:0; min-height:42px; padding:8px 10px; border:1px solid var(--wf-field-border, var(--color-neutral-500, #d4d4d8)); border-radius:var(--wf-radius-field, 9px); background:var(--wf-surface, var(--color-white, #fff)); color:var(--wf-text, var(--color-neutral-1000, #18181b)); font:600 14px var(--wf-font, var(--font-body, sans-serif)); }
.wf-pagination { display:flex; justify-content:center; gap:8px; margin-top:28px; flex-wrap:wrap; }
.wf-pagination a { min-width:42px; min-height:42px; display:inline-flex; justify-content:center; align-items:center; padding:8px; border:1px solid var(--wf-border, var(--color-neutral-400, #e4e4e7)); border-radius:var(--wf-radius-control, 10px); background:var(--wf-surface, var(--color-white, #fff)); color:var(--wf-accent, var(--color-primary-500, #3f3f46)); font-weight:600; }
.wf-pagination a[aria-current] { background:var(--wf-accent, var(--color-primary-500, #3f3f46)); color:var(--wf-on-accent, var(--color-white, #fff)); }
.wf-catalog :is(button,a,input,select,summary):focus-visible { outline:2px solid var(--wf-accent, var(--color-primary-500, #3f3f46)); outline-offset:3px; }
.wf-archive-layout { display:grid; grid-template-columns:var(--wf-sidebar-width, 262px) minmax(0,1fr); grid-template-rows:auto auto 1fr; column-gap:var(--wf-gap, 24px); row-gap:var(--wf-row-gap, 18px); align-items:start; }
.wf-archive-layout > .wf-catalog { display:contents; }
.wf-archive-extras { grid-column:2; grid-row:1; min-width:0; }
.wf-archive-extras:empty { display:none; }
.wf-archive-layout .wf-filters { grid-row:1 / span 3; }
.wf-archive-layout .wf-toolbar { grid-row:2; }
.wf-archive-layout .wf-results { grid-row:3; }
.wf-archive-layout:has(> .wf-archive-extras:empty) .wf-toolbar { grid-row:1; }
.wf-archive-layout:has(> .wf-archive-extras:empty) .wf-results { grid-row:2; }
.wf-archive-layout:has(> .wf-archive-extras:empty) .wf-filters { grid-row:1 / span 2; }
.wf-archive-layout:has(> .wf-archive-extras:empty) { grid-template-rows:auto 1fr; }
.wf-filter-dialog { padding:0; border:0; width:100%; max-width:100%; max-height:86dvh; margin:auto 0 0; border-radius:var(--wf-radius-sheet, 24px) var(--wf-radius-sheet, 24px) 0 0; background:var(--wf-canvas, var(--color-neutral-100, #fafafa)); color:var(--wf-text, var(--color-neutral-1000, #18181b)); overscroll-behavior:contain; }
.wf-filter-dialog::backdrop { background:var(--wf-backdrop, rgb(0 0 0 / .5)); }
.wf-filter-dialog .wf-filters__panel { padding:20px 16px max(16px,env(safe-area-inset-bottom)); }
.wf-filter-dialog .wf-filters__heading { display:flex; align-items:center; justify-content:space-between; margin-bottom:16px; }
.wf-filters__heading h2 { margin:0; font:700 20px var(--wf-heading-font, var(--font-heading, sans-serif)); }
.wf-filters__heading button { width:44px; height:44px; border-radius:50%; background:var(--wf-tint, var(--color-primary-100, #f4f4f5)); color:var(--wf-accent, var(--color-primary-500, #3f3f46)); font-size:26px; cursor:pointer; }
@media (max-width:990px) {
 .wf-catalog { grid-template-columns:minmax(0,1fr) minmax(0,1fr); grid-template-rows:none; column-gap:10px; row-gap:14px; }
 .wf-filters { grid-column:1; grid-row:1; }
 .wf-filters > summary { display:flex; min-height:46px; align-items:center; justify-content:center; gap:8px; padding:10px; background:var(--wf-accent, var(--color-primary-500, #3f3f46)); color:var(--wf-on-accent, var(--color-white, #fff)); border-radius:var(--wf-radius-control, 10px); font-weight:700; cursor:pointer; list-style:none; }
 .wf-filters > summary::-webkit-details-marker { display:none; }
 .wf-filters > summary::before { content:'☰'; font-size:17px; }
 .wf-toolbar { display:contents; }
 .wf-sort { grid-column:2; grid-row:1; min-width:0; }
 .wf-sort > span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
 .wf-sort select { width:100%; font-size:13px; }
 .wf-count { grid-column:1 / -1; grid-row:2; }
 .wf-results { grid-column:1 / -1; grid-row:3; }
 .wf-filters[open] { grid-column:1 / -1; }
 .wf-filters[open] ~ .wf-toolbar .wf-sort { grid-row:2; }
 .wf-filters[open] ~ .wf-toolbar .wf-count { grid-row:3; }
 .wf-filters[open] ~ .wf-results { grid-row:4; }
 .wf-filters[open] .wf-filters__panel { padding-top:12px; }
 .wf-results ul.products { gap:10px; }
 .wf-archive-layout { display:block; }
 .wf-archive-layout > .wf-catalog { display:grid; }
 .wf-archive-layout .wf-filters { grid-row:1; }
 .wf-archive-layout .wf-toolbar { display:contents; }
 .wf-archive-layout .wf-results,.wf-archive-layout:has(> .wf-archive-extras:empty) .wf-results { grid-row:3; }
 .wf-archive-layout .wf-filters[open] ~ .wf-results { grid-row:4; }
}

.wf-range__sliders { clear:both; height:24px; position:relative; margin:6px 8px 14px; }
.wf-range__sliders::before { content:''; position:absolute; left:0; right:0; top:10px; height:4px; border-radius:3px; background:linear-gradient(to right,var(--wf-tint, var(--color-primary-100, #f4f4f5)) var(--wf-low),var(--wf-accent, var(--color-primary-500, #3f3f46)) var(--wf-low),var(--wf-accent, var(--color-primary-500, #3f3f46)) var(--wf-high),var(--wf-tint, var(--color-primary-100, #f4f4f5)) var(--wf-high)); }
.wf-range__sliders input { appearance:none; position:absolute; inset:0; width:100%; height:24px; margin:0; background:transparent; pointer-events:none; }
.wf-range__sliders input::-webkit-slider-thumb { appearance:none; width:18px; height:18px; border:3px solid var(--wf-accent, var(--color-primary-500, #3f3f46)); border-radius:50%; background:var(--wf-surface, var(--color-white, #fff)); pointer-events:auto; cursor:ew-resize; }
.wf-range__sliders input::-moz-range-thumb { width:13px; height:13px; border:3px solid var(--wf-accent, var(--color-primary-500, #3f3f46)); border-radius:50%; background:var(--wf-surface, var(--color-white, #fff)); pointer-events:auto; cursor:ew-resize; }

.wf-catalog-error { grid-column:1 / -1; padding:24px; border:1px solid var(--wf-border, var(--color-neutral-400, #e4e4e7)); border-radius:var(--wf-radius-panel, 16px); background:var(--wf-surface, var(--color-white, #fff)); }

.wf-filter-dialog[open] { display:flex; flex-direction:column; }
.wf-filter-dialog .wf-filters__panel { flex:1; min-height:0; overflow-y:auto; }
.wf-filter-dialog .wf-filters__form > .wf-apply { display:none; }
.wf-dialog-footer { flex:none; padding:12px 16px max(16px,env(safe-area-inset-bottom)); border-top:1px solid var(--wf-border, var(--color-neutral-400, #e4e4e7)); background:var(--wf-surface, var(--color-white, #fff)); }
.wf-dialog-footer .wf-apply { margin:0; min-height:52px; }

/* Persistent feedback lives outside every replaced result region. */
.wf-controller-feedback { grid-column: 1 / -1; }
.wf-controller-feedback:has([data-wf-controller-status]:empty):has([data-wf-controller-error][hidden]) { display: none; }
.wf-controller-feedback p { margin: 0; }
[data-wf-controller-error] { border: 1px solid var(--wf-border, var(--color-neutral-400, #e4e4e7)); border-radius:var(--wf-radius-action, 12px); padding: 12px; }
[data-wf-retry] { margin-top: 8px; text-decoration: underline; }
.wf-catalog[aria-busy="true"] .wf-results { opacity: .65; }

[data-wf-range-error] { color:var(--wf-error, var(--color-ds-critical, #b91c1c)); font-size:13px; margin-top:8px; }
[data-wf-range-status]:empty { display:none; }
[data-wf-range-status] { font-size:12px; margin-top:8px; }
.wf-range input[aria-invalid=true] { border-color:var(--wf-error, var(--color-ds-critical, #b91c1c)); }
.wf-range__sliders input:disabled { opacity:.45; }
.wf-range__sliders input:focus-visible { outline:2px solid var(--wf-accent, var(--color-primary-500, #3f3f46)); outline-offset:3px; }
.wf-range__inputs > [data-wf-range-config] { display:none; }

.wf-load-more { display:block; width:max-content; max-width:100%; margin:24px auto; padding:12px 24px; border:1px solid var(--wf-accent, var(--color-primary-500, #3f3f46)); border-radius:var(--wf-radius-control, 10px); }
.wf-dialog-footer [data-wf-preview-status] { font-size:13px; margin:0 0 8px; }
[data-wf-recovery] { display:block; text-decoration:underline; margin-top:8px; }
[data-wf-recovery][hidden] { display:none; }

.wf-dialog-footer [data-wf-preview-status]:empty { display:none; }
[data-wf-preview-retry] { min-height:44px; margin-bottom:8px; padding:8px 0; text-decoration:underline; }