/**
 * JB Smart Search — neutral baseline (CSS-001)
 * Small, theme-friendly defaults. No third-party fonts, images or icons.
 * Store owners may override these in Smart Search JB > CSS personalizado.
 * Scoped to JBSS only; does not change the native WooCommerce loop.
 */
.jbss-results-layout {
    --jbss-ui-accent: var(--jbss-accent, #2563eb);
    --jbss-ui-border: #e2e8f0;
    --jbss-ui-text: #1e293b;
    --jbss-ui-muted: #64748b;
    --jbss-ui-surface: #fff;
    color: var(--jbss-ui-text);
    font-family: inherit;
    font-size: 1rem;
}
.jbss-results-layout *,
.jbss-results-layout *::before,
.jbss-results-layout *::after { box-sizing: border-box; }
.jbss-results-layout .jbss-results-body { gap: clamp(1rem, 3vw, 2rem); }
.jbss-results-layout .jbss-results-main { flex: 1 1 0; min-width: 0; }
.jbss-results-layout .jbss-results-toolbar { gap: .75rem; }
.jbss-results-layout .jbss-results-sorting { display: flex; align-items: center; gap: .625rem; }
.jbss-results-layout .jbss-sort {
    min-height: 42px;
    padding: .5rem .75rem;
    border: 1px solid var(--jbss-ui-border);
    border-radius: 9px;
    background: var(--jbss-ui-surface);
    color: inherit;
    font: inherit;
}
.jbss-results-layout .jbss-grid { gap: clamp(.75rem, 2vw, 1.25rem); }
.jbss-results-layout .jbss-card {
    padding: .75rem;
    background: var(--jbss-ui-surface);
    border: 1px solid var(--jbss-ui-border);
    border-radius: 12px;
    box-shadow: none;
    min-width: 0;
}
.jbss-results-layout .jbss-card:hover { box-shadow: 0 5px 18px rgb(15 23 42 / 7%); }
.jbss-results-layout .jbss-card-thumb {
    aspect-ratio: 1 / 1;
    background: #f8fafc;
    border-radius: 8px;
}
.jbss-results-layout .jbss-card-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.jbss-results-layout .jbss-card a h3 {
    color: var(--jbss-ui-text);
    font-family: inherit;
    font-size: .9375rem;
    line-height: 1.4;
    min-height: 2.625rem;
    margin: .5rem 0;
}
.jbss-results-layout .jbss-results-grid .jbss-price {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--jbss-ui-accent);
}
.jbss-results-layout .jbss-grid .jbss-card .jbss-btn-add-cart {
    min-height: 44px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    margin-top: auto;
    border: 1px solid var(--jbss-ui-border);
    border-radius: 9px;
    background: var(--jbss-ui-surface);
    color: var(--jbss-ui-text);
    text-decoration: none;
    font-family: inherit;
    font-size: .875rem;
    line-height: 1.25;
    font-weight: 600;
    text-align: center;
    text-transform: none;
    transition: border-color .15s ease, background-color .15s ease, color .15s ease;
}
.jbss-results-layout .jbss-grid .jbss-card .jbss-btn-add-cart:hover,
.jbss-results-layout .jbss-grid .jbss-card .jbss-btn-add-cart:focus-visible {
    background: var(--jbss-ui-accent);
    border-color: var(--jbss-ui-accent);
    color: #fff;
}
.jbss-results-layout .jbss-grid .jbss-card .jbss-btn-add-cart.added {
    background: var(--jbss-ui-accent);
    border-color: var(--jbss-ui-accent);
    color: #fff;
}
.jbss-results-layout .jbss-btn-add-cart:focus-visible,
.jbss-results-layout .jbss-page:focus-visible,
.jbss-results-layout .jbss-btn-filters:focus-visible,
.jbss-results-layout .jbss-sort:focus-visible {
    outline: 2px solid var(--jbss-ui-accent);
    outline-offset: 2px;
}
.jbss-results-layout .jbss-active-filters {
    padding: .75rem 1rem;
    border-color: var(--jbss-ui-border);
    border-radius: 10px;
    background: #f8fafc;
}
.jbss-results-layout .jbss-active-tags .jbss-tag {
    background: #e8eef5;
    border-radius: 20px;
    color: var(--jbss-ui-text);
    padding: .35rem .65rem;
}
.jbss-results-layout .jbss-btn-clear {
    background: transparent;
    border: 1px solid var(--jbss-ui-border);
    border-radius: 8px;
    color: inherit;
    font: inherit;
    padding: .6rem .8rem;
}
.jbss-results-layout .jbss-page.active,
.jbss-results-layout .jbss-btn-show-results,
.jbss-results-layout .jbss-price-track { background-color: var(--jbss-ui-accent); }
.jbss-results-layout .jbss-results-sidebar .jbss-filter { min-width: 0; }
.jbss-results-layout .jbss-filter-list label {
    display: flex;
    align-items: flex-start;
    gap: .45rem;
    min-height: 24px;
    line-height: 1.4;
    overflow-wrap: anywhere;
    font-size: .9rem;
}
.jbss-results-layout .jbss-filter-list input[type="checkbox"] {
    flex: 0 0 auto;
    margin-top: .2rem;
    accent-color: var(--jbss-ui-accent);
}
.jbss-results-layout .jbss-filter h4 { font-family: inherit; font-size: 1rem; line-height: 1.4; font-weight: 650; }
.jbss-results-layout .jbss-price-values { gap: .5rem; }
/* Functional controls, deliberately neutral; visual theme stays client-owned. */
.jbss-results-layout .jbss-results-sorting {
    max-width: none;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.jbss-results-layout .jbss-page-size-label {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    white-space: nowrap;
    font-family: inherit;
    font-size: .9rem;
}
.jbss-results-layout .jbss-per-page {
    min-height: 42px;
    min-width: 70px;
    padding: .45rem;
    border: 1px solid var(--jbss-ui-border);
    border-radius: 9px;
    background: var(--jbss-ui-surface);
    color: inherit;
    font: inherit;
}
.jbss-results-layout .jbss-price-values {
    display: flex;
    align-items: center;
    gap: .375rem;
    justify-content: space-between;
    font-size: .875rem;
}
.jbss-results-layout .jbss-price-values output { font-weight: 700; font-variant-numeric: tabular-nums; }
.jbss-results-layout .jbss-price-slider {
    height: 36px;
    margin: .25rem 0;
}
.jbss-results-layout .jbss-price-slider::before,
.jbss-results-layout .jbss-price-track { top: 15px; }
.jbss-results-layout .jbss-price-slider input[type="range"] {
    top: 0;
    left: 0;
    height: 36px;
    margin: 0;
    padding: 0;
    width: 100%;
    appearance: none;
    -webkit-appearance: none;
    background: transparent;
    border: 0;
    outline-offset: 4px;
    pointer-events: none;
}
.jbss-results-layout .jbss-price-slider input[type="range"]::-webkit-slider-thumb {
    appearance: none;
    -webkit-appearance: none;
    pointer-events: auto;
    width: 20px;
    height: 20px;
    border: 2px solid var(--jbss-ui-surface);
    border-radius: 50%;
    background: var(--jbss-ui-accent);
    box-shadow: 0 0 0 1px var(--jbss-ui-accent);
    cursor: grab;
    touch-action: none;
}
.jbss-results-layout .jbss-price-slider input[type="range"]::-moz-range-thumb {
    pointer-events: auto;
    width: 16px;
    height: 16px;
    border: 2px solid var(--jbss-ui-surface);
    border-radius: 50%;
    background: var(--jbss-ui-accent);
    box-shadow: 0 0 0 1px var(--jbss-ui-accent);
    cursor: grab;
}
.jbss-results-layout .jbss-price-slider input[type="range"]::-moz-range-track { background: transparent; border: 0; }
.jbss-results-layout .jbss-price-min { z-index: 3; }
.jbss-results-layout .jbss-price-max { z-index: 2; }
.jbss-results-layout .jbss-price-slider input[type="range"]:focus-visible { outline: 2px solid var(--jbss-ui-accent); }
.jbss-results-layout .jbss-page-gap { display: inline-flex; align-items: center; padding: .25rem; }

@media (max-width: 1022px) {
    .jbss-results-layout .jbss-results-main,
    .jbss-results-layout .jbss-results-sidebar { max-width: 100%; }
    .jbss-results-layout .jbss-results-sorting { max-width: none; width: 100%; }
    .jbss-results-layout .jbss-btn-filters {
        min-height: 44px;
        padding: .5rem .75rem;
        border: 1px solid var(--jbss-ui-border);
        border-radius: 9px;
        color: var(--jbss-ui-text);
    }
    .jbss-results-layout .jbss-results-sidebar {
        max-height: min(90dvh, 720px);
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .jbss-results-layout .jbss-filter h4::after {
        background: none;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: rotate(45deg);
        top: .25rem;
        width: 8px;
        height: 8px;
    }
    .jbss-results-layout .jbss-filter h4.active-item::after { transform: rotate(225deg); }
}
@media (max-width: 767px) {
    .jbss-results-layout { padding: .5rem 0; }
    .jbss-results-layout .jbss-results-toolbar { align-items: stretch; }
    .jbss-results-layout .jbss-results-sorting { gap: .5rem; margin-top: .5rem; }
    .jbss-results-layout .jbss-results-sorting > * { flex: 1 1 0; min-width: 0; }
    .jbss-results-layout .jbss-grid {
        grid-template-columns: repeat(auto-fit,minmax(min(100%,155px),1fr));
        gap: .75rem;
    }
    .jbss-results-layout .jbss-card { padding: .55rem; }
    .jbss-results-layout .jbss-card a h3 { font-size: .875rem; }
    .jbss-results-layout .jbss-grid .jbss-card .jbss-btn-add-cart { font-size: .8125rem; padding: .55rem .35rem; }
    .jbss-results-layout .jbss-active-filters-inner { gap: .5rem; }
}
@media (prefers-reduced-motion: reduce) {
    .jbss-results-layout .jbss-card,
    .jbss-results-layout .jbss-btn-add-cart { transition: none; animation: none; }
}


/* FINAL-UX-001: scoped responsive toolbar and consistent pagination.
   Never style the theme's native WooCommerce archive or general buttons. */
.jbss-results-layout .jbss-results-toolbar {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    align-items: center;
    column-gap: 1.25rem;
    row-gap: .75rem;
    margin: 0;
}
.jbss-results-layout .jbss-results-info { min-width: 0; }
.jbss-results-layout .jbss-results-count {
    color: var(--jbss-ui-muted);
    font-size: .9rem;
    line-height: 1.5;
    font-variant-numeric: tabular-nums;
}
.jbss-results-layout .jbss-results-sorting {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: .75rem;
    max-width: none;
    width: auto;
    margin: 0;
    min-width: 0;
}
.jbss-results-layout .jbss-results-sorting > * { min-width: 0; }
.jbss-results-layout .jbss-page-size-label {
    flex: 0 0 auto;
    width: auto;
    white-space: nowrap;
    gap: .45rem;
}
.jbss-results-layout .jbss-per-page {
    width: 72px;
    min-width: 72px;
    max-width: 88px;
}
.jbss-results-layout select.jbss-sort {
    flex: 0 1 214px;
    min-width: 154px;
    max-width: 240px;
    width: 100%;
    margin: 0;
    text-overflow: ellipsis;
}
.jbss-results-layout .jbss-pagination {
    display: block;
    width: 100%;
    margin-top: clamp(1.25rem,3vw,2rem);
}
.jbss-results-layout .jbss-pager {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: .4rem;
    width: 100%;
}
.jbss-results-layout button.jbss-page {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 42px;
    height: 42px;
    min-height: 42px;
    padding: .4rem .6rem;
    background: var(--jbss-ui-surface);
    border: 1px solid var(--jbss-ui-border);
    border-radius: 9px;
    box-shadow: none;
    color: var(--jbss-ui-text);
    font: inherit;
    font-size: .875rem;
    font-weight: 600;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}
.jbss-results-layout button.jbss-page:hover {
    border-color: var(--jbss-ui-accent);
    color: var(--jbss-ui-accent);
    background: var(--jbss-ui-surface);
}
.jbss-results-layout button.jbss-page.active,
.jbss-results-layout button.jbss-page[aria-current="page"] {
    border-color: var(--jbss-ui-accent);
    background: var(--jbss-ui-accent);
    color: #fff;
    cursor: default;
}
.jbss-results-layout button.jbss-page:focus-visible {
    outline: 2px solid var(--jbss-ui-accent);
    outline-offset: 2px;
}
.jbss-results-layout .jbss-results-main,
.jbss-results-layout .jbss-results-sidebar,
.jbss-results-layout .jbss-grid,
.jbss-results-layout .jbss-grid > * { min-width: 0; }
.jbss-results-layout .jbss-grid .jbss-card { width: 100%; }
.jbss-results-layout .jbss-card-thumb { overflow: hidden; }
.jbss-results-layout .jbss-grid .jbss-card .jbss-btn-add-cart { width: 100%; }
@media (max-width: 1022px) {
    .jbss-results-layout button.jbss-btn-filters {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: .5rem;
        flex: 0 0 auto;
        min-height: 44px;
        border: 1px solid var(--jbss-ui-border);
        border-radius: 9px;
        padding: .55rem .75rem;
        background: var(--jbss-ui-surface);
        color: var(--jbss-ui-text);
        font-family: inherit;
        font-weight: 600;
        line-height: 1.25;
        box-shadow: none;
        filter: none;
        white-space: nowrap;
    }
    .jbss-results-layout button.jbss-btn-filters svg { flex: 0 0 18px; width: 18px; height: 18px; }
    .jbss-results-layout .jbss-results-toolbar {
        grid-template-columns: minmax(0,1fr);
        align-items: stretch;
    }
    .jbss-results-layout .jbss-results-sorting { justify-content: flex-start; }
}
@media (max-width: 767px) {
    .jbss-results-layout .jbss-results-toolbar {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: .65rem;
        margin-bottom: 0;
    }
    .jbss-results-layout .jbss-results-info { width: 100%; }
    .jbss-results-layout .jbss-results-sorting {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        grid-template-rows: minmax(44px,auto) minmax(44px,auto);
        gap: .625rem;
        width: 100%;
        max-width: none;
        margin: 0;
        justify-content: stretch;
        align-items: stretch;
    }
    .jbss-results-layout .jbss-results-sorting > * {
        min-width: 0;
        min-height: 44px;
        max-width: none;
        margin: 0;
    }
    .jbss-results-layout button.jbss-btn-filters {
        grid-column: 1;
        grid-row: 1;
        width: 100%;
        padding: .6rem .5rem;
    }
    .jbss-results-layout select.jbss-sort {
        grid-column: 2;
        grid-row: 1;
        width: 100%;
        height: 44px;
        min-width: 0;
        max-width: none;
        padding: .5rem .65rem;
        border: 1px solid var(--jbss-ui-border);
        border-radius: 9px;
        background: var(--jbss-ui-surface);
        color: var(--jbss-ui-text);
        font-size: .875rem;
    }
    .jbss-results-layout .jbss-results-sorting label.jbss-page-size-label {
        grid-column: 1 / -1;
        grid-row: 2;
        display: inline-flex;
        justify-self: start;
        justify-content: flex-start;
        align-items: center;
        min-height: 44px;
        width: auto;
        flex: none;
        white-space: nowrap;
        font-size: .875rem;
    }
    .jbss-results-layout .jbss-per-page { width: 76px; flex: 0 0 76px; }
    .jbss-results-layout .jbss-grid {
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: .75rem;
    }
    .jbss-results-layout .jbss-grid .jbss-card { padding: .55rem; }
    .jbss-results-layout .jbss-grid .jbss-card .jbss-btn-add-cart {
        min-height: 44px;
        white-space: normal;
        line-height: 1.3;
    }
    .jbss-results-layout .jbss-pager { gap: .35rem; }
    .jbss-results-layout button.jbss-page { min-width: 40px; height: 40px; min-height: 40px; }
}
@media (max-width: 355px) {
    .jbss-results-layout .jbss-grid { grid-template-columns: minmax(0,1fr); }
    .jbss-results-layout .jbss-results-sorting { gap: .45rem; }
}


/* RC1 editorial polish: hierarchy only; inherit client typography and colors. */
.jbss-results-layout .jbss-results-count {
    color: var(--jbss-ui-text);
    font-weight: 600;
    letter-spacing: .005em;
}
.jbss-results-layout .jbss-page-size-label {
    color: var(--jbss-ui-text);
    font-weight: 500;
}
.jbss-results-layout .jbss-card a h3 {
    font-weight: 600;
    overflow-wrap: anywhere;
}
.jbss-results-layout .jbss-active-tags .jbss-tag {
    font-weight: 500;
}

/* 0.5.2 tablet: one flowing product column, overlayed filters only when enabled.
   Theme layouts with wider gutters must never collapse the product flex item. */
@media (max-width: 1022px) {
    .jbss-results-layout .jbss-results-body {
        display: block;
        min-width: 0;
        width: 100%;
    }
    .jbss-results-layout .jbss-results-main,
    .jbss-results-layout .jbss-results-sidebar {
        min-width: 0;
        width: 100%;
        max-width: 100%;
    }
    .jbss-results-layout .jbss-results-main { flex: none; }
    .jbss-results-layout .jbss-results-sidebar {
        max-width: 100%;
        box-sizing: border-box;
    }
    .jbss-results-layout .jbss-grid {
        grid-template-columns: repeat(auto-fit,minmax(min(100%,185px),1fr));
    }
}
@media (min-width: 768px) and (max-width: 1022px) {
    .jbss-results-layout .jbss-results-sidebar {
        left: 50%;
        transform: translate(-50%,calc(100% + 16px));
        width: min(100%,560px);
        border-radius: 14px 14px 0 0;
    }
    .jbss-results-layout .jbss-results-sidebar.active-filters {
        transform: translate(-50%,0);
    }
    .jbss-results-layout .jbss-results-sorting {
        flex-wrap: wrap;
        width: 100%;
    }
}

/* 0.5.2 price hierarchy: regular sale price is understated, while the
   discounted current amount has the SAME weight/size as a normal price.
   Applies identically to initial SSR and subsequently filtered AJAX cards. */
.jbss-results-layout .jbss-results-grid .jbss-price del {
    display: inline-block;
    vertical-align: baseline;
    margin-inline-end: .45em;
    font-size: .72em;
    line-height: 1.3;
    font-weight: 400;
    color: var(--jbss-ui-muted);
    opacity: .85;
    text-decoration: line-through;
}
.jbss-results-layout .jbss-results-grid .jbss-price ins {
    display: inline;
    font-size: 1em;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
    background: transparent;
    text-decoration: none;
}
.jbss-results-layout .jbss-results-grid .jbss-price.is-sale {
    font-size: 1.15rem;
    font-weight: 700;
}

/* Partial word coverage is explained; never mistake an OR fallback for a
   complete match. Hidden notices must not be displayed by theme CSS. */
.jbss-results-layout .jbss-partial-notice[hidden] { display: none !important; }
.jbss-results-layout .jbss-partial-notice {
    margin: .5rem 0 1rem;
    padding: .65rem .8rem;
    border-inline-start: 3px solid var(--jbss-ui-accent);
    background: var(--jbss-ui-surface);
    color: var(--jbss-ui-muted);
    font-size: .9rem;
    line-height: 1.5;
}