/* PetGiftBox Smart Finder — LIVE */
body.pgb-smart-finder-preview-active .pgb-sf,
body.pgb-smart-finder-preview-active .pgb-sf-active-filters,
body.pgb-smart-finder-preview-active .pgb-sf-trigger {
    display: none !important;
}

body.pgb-smart-finder-preview-active .pgb-shop-stepfinder {
    overflow: visible;
}

.pgb-smart-preview {
    --pgb-smart-ink: #17110d;
    --pgb-smart-panel: #211712;
    --pgb-smart-panel-2: #2b1f18;
    --pgb-smart-cream: #f4ede5;
    --pgb-smart-paper: #fbf8f4;
    --pgb-smart-line: rgba(80, 58, 45, .16);
    --pgb-smart-muted: #7b7068;
    --pgb-smart-accent: #b7844d;
    position: relative;
    margin-top: 26px;
    color: var(--pgb-smart-ink);
}

.pgb-smart-preview__meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 10px;
}

.pgb-smart-preview__eyebrow {
    font-size: 10px;
    line-height: 1;
    letter-spacing: .19em;
    text-transform: uppercase;
    font-weight: 800;
    color: var(--pgb-smart-accent);
}

.pgb-smart-preview__safe {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 10px;
    border: 1px solid rgba(183,132,77,.22);
    border-radius: 999px;
    background: rgba(255,255,255,.55);
    color: #77675a;
    font-size: 10px;
    font-weight: 700;
}

.pgb-smart-preview__safe::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #5f9668;
    box-shadow: 0 0 0 4px rgba(95,150,104,.10);
}

.pgb-smart-preview__title {
    margin: 0;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(34px, 4.2vw, 54px);
    line-height: 1.02;
    font-weight: 400;
    letter-spacing: -.035em;
}

.pgb-smart-preview__text {
    margin: 8px 0 0;
    width: 100%;
    max-width: none;
    color: var(--pgb-smart-muted);
    font-size: 17px;
    line-height: 1.7;
}

.pgb-smart-preview__line {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 26px;
    padding: 13px 14px 13px 17px;
    min-height: 68px;
    border-radius: 22px;
    background: var(--pgb-smart-panel);
    color: #fff;
    box-shadow: 0 16px 44px rgba(29,18,12,.16);
}

.pgb-smart-preview__prompt {
    margin-right: 4px;
    color: #cdbdaf;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
}

.pgb-smart-token {
    appearance: none;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    background: var(--pgb-smart-panel-2);
    color: #fff;
    padding: 10px 14px;
    font: inherit;
    font-size: 12px;
    line-height: 1;
    font-weight: 750;
    cursor: pointer;
    transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}

.pgb-smart-token:hover,
.pgb-smart-token:focus-visible {
    transform: translateY(-1px);
    background: #382920;
    outline: none;
}

.pgb-smart-token.is-context {
    background: var(--pgb-smart-cream);
    color: #261911;
    border-color: var(--pgb-smart-cream);
}

.pgb-smart-token.is-refinement {
    background: rgba(244,237,229,.10);
    border-color: rgba(244,237,229,.18);
}

.pgb-smart-preview__plus {
    display: inline-grid;
    place-items: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.20);
    background: transparent;
    color: #fff;
    font-size: 22px;
    font-weight: 300;
    cursor: pointer;
    transition: background .18s ease, transform .18s ease;
}

.pgb-smart-preview__plus:hover,
.pgb-smart-preview__plus:focus-visible {
    background: rgba(255,255,255,.09);
    transform: rotate(8deg);
    outline: none;
}

.pgb-smart-preview__result {
    margin-left: auto;
    color: #c7b8ac;
    font-size: 10px;
    white-space: nowrap;
}

.pgb-smart-tray {
    display: none;
    margin-top: 10px;
    padding: 18px;
    border: 1px solid var(--pgb-smart-line);
    border-radius: 20px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 18px 48px rgba(45,31,22,.10);
    backdrop-filter: blur(15px);
}

.pgb-smart-tray.is-open {
    display: block;
    animation: pgbSmartIn .18s ease both;
}

@keyframes pgbSmartIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}

.pgb-smart-tray__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.pgb-smart-tray__title {
    margin: 0;
    font-size: 13px;
    font-weight: 800;
}

.pgb-smart-tray__close {
    appearance: none;
    border: 0;
    background: transparent;
    color: #7b7068;
    font-size: 11px;
    cursor: pointer;
}

.pgb-smart-options {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 9px;
}

.pgb-smart-option {
    appearance: none;
    min-height: 76px;
    padding: 13px 14px;
    border: 1px solid #e7ded6;
    border-radius: 15px;
    background: #fff;
    color: #251a14;
    text-align: left;
    cursor: pointer;
    transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

.pgb-smart-option:hover,
.pgb-smart-option:focus-visible {
    transform: translateY(-2px);
    border-color: #d3c4b7;
    background: #fcf8f3;
    outline: none;
}

.pgb-smart-option.is-selected {
    border-color: #2b1e17;
    background: #2b1e17;
    color: #fff;
}

.pgb-smart-option__label {
    display: block;
    font-size: 12px;
    font-weight: 800;
}

.pgb-smart-option__note {
    display: block;
    margin-top: 5px;
    color: #8b8178;
    font-size: 10px;
    line-height: 1.35;
}

.pgb-smart-option.is-selected .pgb-smart-option__note {
    color: #cdbeb2;
}

.pgb-smart-preview__foot {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 16px;
    margin-top: 10px;
    color: #8a8078;
    font-size: 10px;
}

.pgb-smart-preview__clear {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 0;
    color: #756a62;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

@media (max-width: 780px) {
    .pgb-smart-preview__safe { display: none; }
    .pgb-smart-preview__line {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
        border-radius: 18px;
    }
    .pgb-smart-preview__line::-webkit-scrollbar { display: none; }
    .pgb-smart-preview__prompt,
    .pgb-smart-preview__result { flex: 0 0 auto; }
    .pgb-smart-token { flex: 0 0 auto; }
    .pgb-smart-options { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .pgb-smart-tray { border-radius: 16px; }
}

/* v0.2.0 — real filter interaction states */
.pgb-smart-preview.is-busy .pgb-smart-preview__line,
.pgb-smart-preview.is-busy .pgb-smart-tray {
    opacity: .58;
    pointer-events: none;
}

.pgb-smart-preview.is-busy .pgb-smart-preview__plus {
    animation: pgbSmartPulse .8s ease-in-out infinite alternate;
}

@keyframes pgbSmartPulse {
    from { transform: scale(.96); }
    to { transform: scale(1.05); }
}

.pgb-smart-price {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto;
    gap: 10px;
    align-items: end;
}

.pgb-smart-price label > span {
    display: block;
    margin: 0 0 7px;
    color: #7b7068;
    font-size: 10px;
    font-weight: 750;
}

.pgb-smart-price label > div {
    position: relative;
}

.pgb-smart-price input {
    width: 100%;
    height: 46px;
    padding: 0 34px 0 13px;
    border: 1px solid #e2d7ce;
    border-radius: 13px;
    background: #fff;
    color: #241811;
    font: inherit;
    font-size: 13px;
    outline: none;
}

.pgb-smart-price input:focus {
    border-color: #b7844d;
    box-shadow: 0 0 0 3px rgba(183,132,77,.09);
}

.pgb-smart-price em {
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    color: #8a8078;
    font-size: 12px;
    font-style: normal;
}

.pgb-smart-price__apply {
    height: 46px;
    padding: 0 18px;
    border: 0;
    border-radius: 13px;
    background: #211712;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    cursor: pointer;
}

@media (max-width: 780px) {
    .pgb-smart-price { grid-template-columns: 1fr 1fr; }
    .pgb-smart-price__apply { grid-column: 1 / -1; }
}

/* v0.3.0 — guided Smart Line: pet → need → refinements */
.pgb-smart-preview__line.is-choice-step {
    gap: 10px;
    padding-left: 20px;
}

.pgb-smart-preview__prompt.is-question {
    color: #f1e5d9;
    font-size: 13px;
    letter-spacing: 0;
    font-weight: 800;
    margin-right: 8px;
}

.pgb-smart-token.is-pet-choice {
    padding-inline: 18px;
    background: rgba(244,237,229,.08);
    color: #fff;
    border-color: rgba(244,237,229,.22);
}

.pgb-smart-token.is-pet-choice:hover,
.pgb-smart-token.is-pet-choice:focus-visible {
    background: var(--pgb-smart-cream);
    color: #261911;
    border-color: var(--pgb-smart-cream);
}

.pgb-smart-token.is-next-step {
    position: relative;
    padding-right: 34px;
    background: rgba(255,255,255,.04);
    color: #e4d7cc;
    border-style: dashed;
}

.pgb-smart-token.is-next-step::after {
    content: '→';
    position: absolute;
    right: 13px;
    top: 50%;
    transform: translateY(-51%);
    color: #bfa993;
    font-weight: 400;
}

.pgb-smart-preview__foot-actions {
    display: inline-flex;
    align-items: center;
    gap: 18px;
}

.pgb-smart-preview__browse-all {
    appearance: none;
    border: 0;
    background: transparent;
    padding: 0;
    color: #756a62;
    font: inherit;
    font-size: 10px;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}

.pgb-smart-preview.is-guided-start .pgb-smart-preview__result,
.pgb-smart-preview.is-guided-need .pgb-smart-preview__result {
    opacity: .65;
}

@media (max-width: 780px) {
    .pgb-smart-preview__line.is-choice-step {
        align-items: center;
    }
    .pgb-smart-preview__prompt.is-question {
        flex: 0 0 auto;
    }
    .pgb-smart-preview__foot-actions {
        flex: 0 0 auto;
    }
}


/* v0.4.3 — Smart budget rail */
.pgb-smart-budget {
    padding: 4px 0 2px;
}
.pgb-smart-budget__question {
    margin-bottom: 22px;
    font-size: 14px;
    font-weight: 800;
    color: var(--pgb-smart-ink);
}
.pgb-smart-budget__readout {
    display: flex;
    align-items: baseline;
    gap: 9px;
    margin-bottom: 24px;
}
.pgb-smart-budget__readout span {
    color: var(--pgb-smart-muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
}
.pgb-smart-budget__readout strong {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(26px, 3vw, 34px);
    line-height: 1;
    font-weight: 400;
}
.pgb-smart-budget__rail-wrap {
    position: relative;
    padding: 25px 4px 8px;
}
.pgb-smart-budget__rail {
    position: relative;
    height: 6px;
    border-radius: 999px;
    background: #e8dfd6;
}
.pgb-smart-budget__fill {
    position: absolute;
    inset: 0 auto 0 0;
    width: 0;
    border-radius: inherit;
    background: var(--pgb-smart-panel);
}
.pgb-smart-budget__knob {
    position: absolute;
    top: 50%;
    left: 0;
    width: 26px;
    height: 26px;
    border: 7px solid var(--pgb-smart-panel);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 4px 13px rgba(38,22,15,.18);
    transform: translate(-50%,-50%);
    pointer-events: none;
}
.pgb-smart-budget__bubble {
    position: absolute;
    top: -18px;
    left: 0;
    padding: 6px 10px;
    border-radius: 999px;
    background: var(--pgb-smart-panel);
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    white-space: nowrap;
    transform: translateX(-50%);
    pointer-events: none;
}
.pgb-smart-budget__range {
    position: absolute;
    z-index: 3;
    top: 14px;
    left: 0;
    width: 100%;
    height: 34px;
    margin: 0;
    opacity: 0;
    cursor: ew-resize;
}
.pgb-smart-budget__scale {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
    color: #91867d;
    font-size: 10px;
    font-weight: 650;
}
.pgb-smart-budget__steps {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}
.pgb-smart-budget__step {
    border: 1px solid rgba(80,58,45,.16);
    border-radius: 999px;
    background: var(--pgb-smart-paper);
    color: #62574f;
    padding: 8px 11px;
    font-size: 11px;
    font-weight: 750;
    cursor: pointer;
    transition: background .16s ease, color .16s ease, border-color .16s ease;
}
.pgb-smart-budget__step:hover,
.pgb-smart-budget__step.is-selected {
    border-color: var(--pgb-smart-panel);
    background: var(--pgb-smart-panel);
    color: #fff;
}
.pgb-smart-budget__foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 20px;
    color: #91867d;
    font-size: 10px;
}
.pgb-smart-budget__foot button {
    appearance: none;
    border: 0;
    background: none;
    color: #6f6258;
    padding: 0;
    font: inherit;
    text-decoration: underline;
    cursor: pointer;
}
@media (max-width: 680px) {
    .pgb-smart-budget__foot {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* v0.4.4 — explicit removable Smart Line tokens */
.pgb-smart-token-wrap {
    display: inline-flex;
    align-items: stretch;
    flex: 0 0 auto;
    border-radius: 999px;
}

.pgb-smart-token-wrap .pgb-smart-token {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-right-width: 0;
}

.pgb-smart-token-remove {
    appearance: none;
    display: inline-grid;
    place-items: center;
    min-width: 30px;
    padding: 0 9px 1px 7px;
    border: 1px solid rgba(244,237,229,.18);
    border-left-color: rgba(244,237,229,.12);
    border-radius: 0 999px 999px 0;
    background: rgba(244,237,229,.10);
    color: rgba(255,255,255,.72);
    font: inherit;
    font-size: 17px;
    line-height: 1;
    cursor: pointer;
    transition: background .16s ease, color .16s ease, transform .16s ease;
}

.pgb-smart-token-remove:hover,
.pgb-smart-token-remove:focus-visible {
    background: rgba(255,255,255,.18);
    color: #fff;
    outline: none;
}

.is-context-wrap .pgb-smart-token-remove {
    border-color: var(--pgb-smart-cream);
    border-left-color: rgba(38,25,17,.12);
    background: var(--pgb-smart-cream);
    color: rgba(38,25,17,.52);
}

.is-context-wrap .pgb-smart-token-remove:hover,
.is-context-wrap .pgb-smart-token-remove:focus-visible {
    background: #eadfd5;
    color: #261911;
}

.pgb-smart-token-remove[hidden] {
    display: none !important;
}

.pgb-smart-preview__safe {
    white-space: nowrap;
}


/* v0.4.5 — visual polish: quieter removal controls, one reset, calmer price tray */
.pgb-smart-budget__readout {
    margin-bottom: 22px;
}

.pgb-smart-budget__readout strong {
    font-size: clamp(28px, 3.1vw, 36px);
}

/* The rail already has "Χωρίς όριο", so a second price-reset link is unnecessary. */
.pgb-smart-budget__foot {
    justify-content: flex-start;
    margin-top: 17px;
}

.pgb-smart-token-wrap {
    overflow: hidden;
    border: 1px solid rgba(244,237,229,.15);
}

.pgb-smart-token-wrap .pgb-smart-token {
    border: 0;
    border-radius: 999px 0 0 999px;
}

.pgb-smart-token-remove {
    min-width: 23px;
    width: 23px;
    padding: 0 5px 1px 1px;
    border: 0;
    border-radius: 0 999px 999px 0;
    background: rgba(244,237,229,.08);
    color: rgba(255,255,255,.42);
    font-size: 13px;
    font-weight: 400;
    opacity: .72;
}

.pgb-smart-token-wrap:hover .pgb-smart-token-remove,
.pgb-smart-token-remove:focus-visible {
    color: rgba(255,255,255,.82);
    opacity: 1;
    background: rgba(255,255,255,.08);
}

.is-context-wrap {
    border-color: var(--pgb-smart-cream);
    background: var(--pgb-smart-cream);
}

.is-context-wrap .pgb-smart-token {
    background: transparent;
}

.is-context-wrap .pgb-smart-token-remove {
    background: transparent;
    color: rgba(38,25,17,.30);
    opacity: .75;
}

.is-context-wrap:hover .pgb-smart-token-remove,
.is-context-wrap .pgb-smart-token-remove:focus-visible {
    background: rgba(38,25,17,.035);
    color: rgba(38,25,17,.68);
}

.pgb-smart-preview__clear {
    color: #8d837b;
    text-decoration: none;
    font-size: 10px;
    opacity: .62;
    transition: opacity .16s ease, color .16s ease;
}

.pgb-smart-preview__clear::before {
    content: '↺';
    display: inline-block;
    margin-right: 5px;
    font-size: 10px;
}

.pgb-smart-preview__clear:hover,
.pgb-smart-preview__clear:focus-visible {
    color: #5f544c;
    opacity: 1;
    outline: none;
}

.pgb-smart-preview__clear[hidden] {
    display: none !important;
}

/* v0.4.6 — unified refinement workspace */
.pgb-smart-tray.is-open {
    min-height: 236px;
}

.pgb-smart-workspace__head {
    margin-bottom: 12px;
}

.pgb-smart-workspace__eyebrow {
    display: block;
    margin-bottom: 4px;
    color: #9a8d83;
    font-size: 9px;
    line-height: 1;
    font-weight: 800;
    letter-spacing: .14em;
}

.pgb-smart-workspace__tabs {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid #eee6df;
}

.pgb-smart-workspace__tab {
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 34px;
    padding: 8px 11px;
    border: 1px solid #e4d9d0;
    border-radius: 999px;
    background: #fbf8f4;
    color: #695e56;
    font: inherit;
    font-size: 10px;
    font-weight: 750;
    cursor: pointer;
    transition: background .16s ease, color .16s ease, border-color .16s ease;
}

.pgb-smart-workspace__tab:hover,
.pgb-smart-workspace__tab:focus-visible {
    border-color: #cdbeb2;
    color: #2c2019;
    outline: none;
}

.pgb-smart-workspace__tab.is-active {
    border-color: var(--pgb-smart-panel);
    background: var(--pgb-smart-panel);
    color: #fff;
}

.pgb-smart-workspace__tab-count {
    display: inline-grid;
    place-items: center;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    border-radius: 999px;
    background: rgba(255,255,255,.16);
    font-size: 9px;
    line-height: 1;
}

.pgb-smart-workspace__tab:not(.is-active) .pgb-smart-workspace__tab-count {
    background: #ede4dc;
    color: #7b6d62;
}

.pgb-smart-workspace__body {
    min-height: 120px;
}

.pgb-smart-options--workspace {
    align-content: start;
}

.pgb-smart-options--workspace .pgb-smart-option {
    min-height: 58px;
    border-radius: 13px;
}

.pgb-smart-budget--workspace {
    max-width: none;
    padding: 2px 2px 0;
}

.pgb-smart-budget--workspace .pgb-smart-budget__readout {
    margin: 0 0 16px;
}

.pgb-smart-budget--workspace .pgb-smart-budget__readout strong {
    font-size: clamp(25px, 2.5vw, 32px);
}

.pgb-smart-budget--workspace .pgb-smart-budget__rail-wrap {
    padding-top: 21px;
}

.pgb-smart-budget--workspace .pgb-smart-budget__steps {
    margin-top: 17px;
}

/* Keep the workspace visually stable while filters refresh. */
.pgb-smart-preview.is-busy .pgb-smart-tray.is-open {
    min-height: 236px;
}

@media (max-width: 780px) {
    .pgb-smart-tray.is-open {
        min-height: 0;
    }
    .pgb-smart-workspace__tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
    }
    .pgb-smart-workspace__tabs::-webkit-scrollbar { display: none; }
    .pgb-smart-workspace__tab { flex: 0 0 auto; }
}


/* v0.4.7 — one visual language across every Smart Finder state */

/*
 * During admin-preview page navigations the legacy Finder markup can be
 * server-rendered before the Smart Finder JS rebuilds it. Hide only that
 * legacy inner shell so the old design cannot flash back between steps.
 * The Smart Preview itself is inserted as a direct child and stays visible.
 */
/*
 * Keep the server-rendered Finder visible until the Smart Finder JavaScript
 * actually replaces it. This prevents a blank/delayed Finder when JavaScript
 * is deferred by LiteSpeed or another optimizer.
 */
body.pgb-smart-finder-preview-active [data-pgb-stepfinder] > .pgb-stepfinder-inner {
    visibility: visible;
}

/* Core palette: keep the same dark/warm contrast used by the guided start. */
.pgb-smart-preview {
    --pgb-smart-panel: #211712;
    --pgb-smart-panel-2: #30231c;
    --pgb-smart-cream: #f4ede5;
    --pgb-smart-paper: #fbf8f4;
    --pgb-smart-line: rgba(80,58,45,.16);
    --pgb-smart-muted: #7b7068;
    --pgb-smart-accent: #b7844d;
}

/*
 * Context, need and refinement tokens now remain in the same dark family
 * instead of switching to cream/white after the first selection.
 */
.pgb-smart-token.is-context,
.pgb-smart-token.is-refinement,
.pgb-smart-token.is-pet-choice {
    background: var(--pgb-smart-panel-2);
    color: #fff;
    border-color: rgba(255,255,255,.16);
}

.pgb-smart-token.is-context:hover,
.pgb-smart-token.is-context:focus-visible,
.pgb-smart-token.is-refinement:hover,
.pgb-smart-token.is-refinement:focus-visible,
.pgb-smart-token.is-pet-choice:hover,
.pgb-smart-token.is-pet-choice:focus-visible {
    background: #3a2b22;
    color: #fff;
    border-color: rgba(255,255,255,.26);
}

/* Selected context is distinguished by a warm, quiet outline — not a new colour scheme. */
.is-context-wrap,
.pgb-smart-token-wrap.is-refinement-wrap {
    border-color: rgba(255,255,255,.15);
    background: transparent;
}

.is-context-wrap {
    box-shadow: inset 0 0 0 1px rgba(183,132,77,.38);
}

.is-context-wrap .pgb-smart-token,
.pgb-smart-token-wrap.is-refinement-wrap .pgb-smart-token {
    background: var(--pgb-smart-panel-2);
    color: #fff;
}

.is-context-wrap .pgb-smart-token-remove,
.pgb-smart-token-wrap.is-refinement-wrap .pgb-smart-token-remove {
    background: var(--pgb-smart-panel-2);
    color: rgba(255,255,255,.40);
}

.is-context-wrap:hover .pgb-smart-token-remove,
.is-context-wrap .pgb-smart-token-remove:focus-visible,
.pgb-smart-token-wrap.is-refinement-wrap:hover .pgb-smart-token-remove,
.pgb-smart-token-wrap.is-refinement-wrap .pgb-smart-token-remove:focus-visible {
    background: #3a2b22;
    color: rgba(255,255,255,.82);
}

/* "Next step" stays within the same family; only the dashed edge communicates state. */
.pgb-smart-token.is-next-step {
    background: rgba(48,35,28,.72);
    color: #f3e8de;
    border-color: rgba(255,255,255,.18);
}

/* The refinement workspace uses one warm paper surface for all filter types. */
.pgb-smart-tray {
    background: var(--pgb-smart-paper);
    border-color: var(--pgb-smart-line);
}

.pgb-smart-workspace__tabs {
    border-bottom-color: #e8ddd4;
}

.pgb-smart-workspace__tab {
    background: #f7f1eb;
    border-color: #dfd3c9;
    color: #645850;
}

.pgb-smart-workspace__tab:hover,
.pgb-smart-workspace__tab:focus-visible {
    background: #f2e9e1;
    border-color: #cdbeb2;
    color: #2c2019;
}

.pgb-smart-workspace__tab.is-active,
.pgb-smart-option.is-selected,
.pgb-smart-budget__step.is-selected,
.pgb-smart-budget__step:hover {
    background: var(--pgb-smart-panel);
    border-color: var(--pgb-smart-panel);
    color: #fff;
}

.pgb-smart-option {
    background: #fffdfa;
    border-color: #e5dad1;
    color: #2a1e17;
}

.pgb-smart-option:hover,
.pgb-smart-option:focus-visible {
    background: #f7f0e9;
    border-color: #d0c0b4;
}

/* Keep removal/reset actions secondary in every state. */
.pgb-smart-token-remove {
    opacity: .56;
}

.pgb-smart-preview__clear {
    color: #81766e;
    opacity: .52;
}

.pgb-smart-preview__clear:hover,
.pgb-smart-preview__clear:focus-visible {
    color: #5d5149;
    opacity: .92;
}

/* v0.4.8 — rectangular tokens + staged refinement apply */

/*
 * Keep one geometric language from the guided start through applied filters.
 * Tokens are deliberately rectangular rather than pill-shaped.
 */
.pgb-smart-token,
.pgb-smart-token.is-context,
.pgb-smart-token.is-refinement,
.pgb-smart-token.is-pet-choice,
.pgb-smart-token.is-next-step {
    border-radius: 2px !important;
}

.pgb-smart-token-wrap,
.is-context-wrap,
.pgb-smart-token-wrap.is-refinement-wrap {
    border-radius: 2px !important;
}

.pgb-smart-token-wrap .pgb-smart-token,
.is-context-wrap .pgb-smart-token,
.pgb-smart-token-wrap.is-refinement-wrap .pgb-smart-token {
    border-radius: 2px 0 0 2px !important;
}

.pgb-smart-token-remove,
.is-context-wrap .pgb-smart-token-remove,
.pgb-smart-token-wrap.is-refinement-wrap .pgb-smart-token-remove {
    border-radius: 0 2px 2px 0 !important;
}

/* Workspace tabs: requested warm/ink contrast. */
.pgb-smart-workspace__tab {
    background: #ffffff;
    border-color: #211712;
    color: #645850;
    border-radius: 2px;
}

.pgb-smart-workspace__tab:hover,
.pgb-smart-workspace__tab:focus-visible {
    background: #f7f1eb;
    border-color: #211712;
    color: #211712;
}

.pgb-smart-workspace__tab.is-active {
    background: #211712;
    border-color: #211712;
    color: #ffffff;
}

.pgb-smart-workspace__tab-count {
    border-radius: 2px;
}

.pgb-smart-workspace__tab:not(.is-active) .pgb-smart-workspace__tab-count {
    background: #c99810;
    color: #f7f7f8;
}

/* Budget stop buttons follow the same rectangular family. */
.pgb-smart-budget__step {
    border-radius: 2px !important;
}

/*
 * Refinements are now staged. Products do not refresh while the user is
 * choosing; one deliberate action applies the complete set.
 */
.pgb-smart-workspace__actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid #e8ddd4;
}

.pgb-smart-workspace__pending {
    color: #8a7e75;
    font-size: 10px;
    line-height: 1.45;
}

.pgb-smart-workspace__apply {
    appearance: none;
    min-height: 38px;
    padding: 10px 18px;
    border: 1px solid #211712;
    border-radius: 2px;
    background: #211712;
    color: #ffffff;
    font: inherit;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .02em;
    cursor: pointer;
    transition: opacity .16s ease, background .16s ease, color .16s ease;
}

.pgb-smart-workspace__apply:hover,
.pgb-smart-workspace__apply:focus-visible {
    background: #30231c;
    border-color: #30231c;
    outline: none;
}

.pgb-smart-workspace__apply:disabled {
    background: #eee8e2;
    border-color: #e1d7ce;
    color: #a2978e;
    cursor: default;
    opacity: .75;
}

@media (max-width: 780px) {
    .pgb-smart-workspace__actions {
        align-items: stretch;
        flex-direction: column;
    }

    .pgb-smart-workspace__apply {
        width: 100%;
    }
}

/* v0.4.9 — one hover language across the Smart Finder preview */

/* Workspace tabs stay borderless in every state. */
.pgb-smart-workspace__tab,
.pgb-smart-workspace__tab.is-active {
    border: 0 !important;
}

/*
 * One hover surface everywhere: #f8f9fa.
 * Hover never introduces a new beige/brown shade; contrast flips to ink.
 */
.pgb-smart-workspace__tab:hover,
.pgb-smart-workspace__tab:focus-visible,
.pgb-smart-workspace__tab.is-active:hover,
.pgb-smart-workspace__tab.is-active:focus-visible,
.pgb-smart-option:hover,
.pgb-smart-option:focus-visible,
.pgb-smart-option.is-selected:hover,
.pgb-smart-option.is-selected:focus-visible,
.pgb-smart-budget__step:hover,
.pgb-smart-budget__step:focus-visible,
.pgb-smart-budget__step.is-selected:hover,
.pgb-smart-budget__step.is-selected:focus-visible,
.pgb-smart-token:hover,
.pgb-smart-token:focus-visible,
.pgb-smart-token.is-context:hover,
.pgb-smart-token.is-context:focus-visible,
.pgb-smart-token.is-refinement:hover,
.pgb-smart-token.is-refinement:focus-visible,
.pgb-smart-token.is-pet-choice:hover,
.pgb-smart-token.is-pet-choice:focus-visible,
.pgb-smart-token.is-next-step:hover,
.pgb-smart-token.is-next-step:focus-visible,
.pgb-smart-preview__plus:hover,
.pgb-smart-preview__plus:focus-visible,
.pgb-smart-token-remove:hover,
.pgb-smart-token-remove:focus-visible,
.pgb-smart-tray__close:hover,
.pgb-smart-tray__close:focus-visible,
.pgb-smart-preview__clear:hover,
.pgb-smart-preview__clear:focus-visible,
.pgb-smart-workspace__apply:hover,
.pgb-smart-workspace__apply:focus-visible {
    background: #f8f9fa !important;
    color: #211712 !important;
    border-color: transparent !important;
    outline: none;
}

/* Keep secondary copy readable when a selected option is hovered. */
.pgb-smart-option.is-selected:hover .pgb-smart-option__note,
.pgb-smart-option.is-selected:focus-visible .pgb-smart-option__note {
    color: #645850 !important;
}

/* Do not rotate the + on hover; the interaction stays visually calm. */
.pgb-smart-preview__plus:hover,
.pgb-smart-preview__plus:focus-visible {
    transform: none !important;
}

/* v0.5.0 — compact final-state grouped refinement summary */
.pgb-smart-token-wrap.is-refinement-wrap.is-grouped .pgb-smart-token.is-grouped {
    font-variant-numeric: tabular-nums;
}


/* v0.5.1 — selected workspace choices expose a subtle direct deselect affordance. */
.pgb-smart-options--workspace .pgb-smart-option {
    position: relative;
    padding-right: 42px;
}

.pgb-smart-option__deselect {
    position: absolute;
    top: 50%;
    right: 14px;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    font-size: 15px;
    line-height: 1;
    font-weight: 400;
    color: currentColor;
    opacity: .46;
    pointer-events: none;
    transition: opacity .16s ease;
}

.pgb-smart-option.is-selected:hover .pgb-smart-option__deselect,
.pgb-smart-option.is-selected:focus-visible .pgb-smart-option__deselect {
    opacity: .78;
}

/* v0.5.3 — selected workspace hover uses border-only feedback.
 * Preserve the exact selected surface/state; only reveal a subtle warm-gold edge.
 */
.pgb-smart-options--workspace .pgb-smart-option.is-selected:hover,
.pgb-smart-options--workspace .pgb-smart-option.is-selected:focus-visible {
    background: var(--pgb-smart-panel) !important;
    color: #ffffff !important;
    border-color: rgba(201, 152, 16, .68) !important;
    box-shadow: none !important;
    transform: none !important;
}

.pgb-smart-options--workspace .pgb-smart-option.is-selected:hover .pgb-smart-option__note,
.pgb-smart-options--workspace .pgb-smart-option.is-selected:focus-visible .pgb-smart-option__note {
    color: #cdbeb2 !important;
}

.pgb-smart-options--workspace .pgb-smart-option.is-selected:hover .pgb-smart-option__deselect,
.pgb-smart-options--workspace .pgb-smart-option.is-selected:focus-visible .pgb-smart-option__deselect {
    color: #ffffff;
    opacity: .86;
}


/* v1.1.0 — mobile-first Smart Finder polish
 * The mobile Finder keeps the exact same state/query model, but adapts the
 * composition for touch: no horizontal Smart Line clipping, compact cards,
 * reachable controls and an inline scroll-safe workspace.
 */
@media (max-width: 780px) {
    .pgb-smart-preview {
        margin-top: 20px;
    }

    .pgb-smart-preview__meta {
        margin-bottom: 8px;
    }

    .pgb-smart-preview__eyebrow {
        font-size: 9px;
        letter-spacing: .18em;
    }

    .pgb-smart-preview__title {
        font-size: clamp(31px, 9.2vw, 38px);
        line-height: 1.04;
        letter-spacing: -.03em;
    }

    .pgb-smart-preview__text {
        margin-top: 9px;
        width: 100%;
        max-width: none;
        font-size: 15.5px;
        line-height: 1.7;
    }

    /* Active Smart Line: prompt on row one, context/actions below it. */
    .pgb-smart-preview__line,
    .pgb-smart-preview__line:not(.is-choice-step) {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 7px;
        min-height: 0;
        margin-top: 20px;
        padding: 14px;
        overflow: visible;
        border-radius: 16px;
        box-shadow: 0 12px 30px rgba(29,18,12,.14);
    }

    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-preview__prompt {
        flex: 0 0 100%;
        margin: 0 0 2px;
        font-size: 10px;
        line-height: 1.2;
        letter-spacing: .035em;
    }

    /* Let staged refinement tokens participate in the same wrapping row. */
    .pgb-smart-preview__line [data-smart-refinement-tokens] {
        display: contents;
    }

    .pgb-smart-preview__line .pgb-smart-token-wrap {
        flex: 0 1 auto;
        min-width: 0;
        max-width: 100%;
    }

    .pgb-smart-preview__line .pgb-smart-token-wrap .pgb-smart-token {
        min-width: 0;
        max-width: calc(100vw - 112px);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .pgb-smart-token {
        min-height: 44px;
        padding: 10px 12px;
        font-size: 13px;
        line-height: 1.15;
    }

    .pgb-smart-token-remove,
    .is-context-wrap .pgb-smart-token-remove,
    .pgb-smart-token-wrap.is-refinement-wrap .pgb-smart-token-remove {
        width: 34px;
        min-width: 34px;
        min-height: 44px;
        padding: 0 3px 1px 0;
        font-size: 15px;
    }

    .pgb-smart-preview__plus {
        flex: 0 0 44px;
        width: 44px;
        height: 44px;
        font-size: 21px;
    }

    .pgb-smart-preview__result {
        display: none;
    }

    /* Guided start: question above three balanced, thumb-friendly choices. */
    .pgb-smart-preview__line.is-choice-step {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: stretch;
        gap: 11px;
        padding: 16px 14px;
    }

    .pgb-smart-preview__line.is-choice-step .pgb-smart-preview__prompt.is-question {
        margin: 0;
        font-size: 12px;
        line-height: 1.25;
    }

    .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices] {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 7px;
        width: 100%;
    }

    .pgb-smart-preview.has-four-contexts .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .pgb-smart-preview__line.is-choice-step .pgb-smart-token.is-pet-choice {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-width: 0;
        min-height: 46px;
        padding: 9px 6px;
        text-align: center;
        white-space: nowrap;
    }

    .pgb-smart-preview__foot {
        margin-top: 11px;
        padding: 0 2px;
    }

    .pgb-smart-preview__foot-actions {
        gap: 14px;
    }

    .pgb-smart-preview__browse-all,
    .pgb-smart-preview__clear {
        min-height: 36px;
        display: inline-flex;
        align-items: center;
        font-size: 11px;
    }

    /* Inline tray/workspace: bounded for short screens, never hidden by nav chrome. */
    .pgb-smart-tray,
    .pgb-smart-tray.is-open {
        max-height: min(66svh, 560px);
        margin-top: 10px;
        padding: 14px;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
        border-radius: 14px;
        scroll-padding-block: 58px 74px;
    }

    .pgb-smart-tray__head {
        position: sticky;
        z-index: 5;
        top: -14px;
        margin: -14px -14px 12px;
        padding: 14px 14px 10px;
        background: rgba(251,248,244,.98);
        backdrop-filter: blur(10px);
    }

    .pgb-smart-tray__title {
        font-size: 14px;
        line-height: 1.25;
    }

    .pgb-smart-tray__close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-height: 40px;
        margin: -8px -4px -8px 0;
        padding: 0 4px;
        font-size: 11px;
    }

    .pgb-smart-options {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .pgb-smart-option,
    .pgb-smart-options--workspace .pgb-smart-option {
        min-height: 60px;
        padding: 11px 12px;
        border-radius: 2px;
        transform: none;
    }

    .pgb-smart-options--workspace .pgb-smart-option {
        min-height: 54px;
        padding-right: 38px;
    }

    .pgb-smart-option__label {
        font-size: 12px;
        line-height: 1.32;
        overflow-wrap: anywhere;
    }

    .pgb-smart-option__note {
        margin-top: 4px;
        font-size: 9.5px;
    }

    .pgb-smart-option__deselect {
        right: 11px;
        width: 20px;
        height: 20px;
        font-size: 15px;
    }

    .pgb-smart-workspace__head {
        margin-bottom: 10px;
    }

    .pgb-smart-workspace__eyebrow {
        margin-bottom: 3px;
        font-size: 8px;
    }

    .pgb-smart-workspace__tabs {
        gap: 6px;
        margin-bottom: 13px;
        padding-bottom: 10px;
        scroll-snap-type: x proximity;
        scroll-padding-inline: 2px;
    }

    .pgb-smart-workspace__tab {
        min-height: 40px;
        padding: 9px 11px;
        font-size: 11px;
        white-space: nowrap;
        scroll-snap-align: start;
    }

    .pgb-smart-workspace__body {
        min-height: 0;
    }

    .pgb-smart-workspace__actions {
        position: sticky;
        z-index: 4;
        bottom: -14px;
        align-items: stretch;
        gap: 8px;
        margin: 15px -14px -14px;
        padding: 11px 14px calc(12px + env(safe-area-inset-bottom));
        border-top-color: #e8ddd4;
        background: rgba(251,248,244,.98);
        box-shadow: 0 -9px 20px rgba(45,31,22,.06);
        backdrop-filter: blur(10px);
    }

    .pgb-smart-workspace__pending {
        font-size: 9px;
        line-height: 1.35;
    }

    .pgb-smart-workspace__apply {
        width: 100%;
        min-height: 46px;
        padding: 11px 16px;
        font-size: 12px;
    }

    .pgb-smart-budget--workspace {
        padding-inline: 2px;
    }

    .pgb-smart-budget--workspace .pgb-smart-budget__readout {
        margin-bottom: 14px;
    }

    .pgb-smart-budget--workspace .pgb-smart-budget__readout strong {
        font-size: 27px;
    }

    .pgb-smart-budget__rail-wrap {
        padding-inline: 8px;
    }

    .pgb-smart-budget__range {
        height: 44px;
    }

    .pgb-smart-budget__steps {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 7px;
        margin-top: 17px;
    }

    .pgb-smart-budget__step {
        min-height: 40px;
        padding: 8px 6px;
        line-height: 1.2;
        text-align: center;
    }
}

/* Ultra-narrow phones: preserve breathing room without hiding labels. */
@media (max-width: 360px) {
    .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices] {
        grid-template-columns: 1fr 1fr;
    }

    .pgb-smart-preview:not(.has-four-contexts) .pgb-smart-preview__line.is-choice-step .pgb-smart-token.is-pet-choice:last-child {
        grid-column: 1 / -1;
    }

    .pgb-smart-preview__line .pgb-smart-token-wrap .pgb-smart-token {
        max-width: calc(100vw - 98px);
    }

    .pgb-smart-options {
        gap: 7px;
    }

    .pgb-smart-option,
    .pgb-smart-options--workspace .pgb-smart-option {
        padding-left: 10px;
        padding-right: 10px;
    }

    .pgb-smart-options--workspace .pgb-smart-option {
        padding-right: 36px;
    }
}

@media (max-width: 780px) and (hover: none) {
    .pgb-smart-option:hover,
    .pgb-smart-option:focus-visible,
    .pgb-smart-token:hover,
    .pgb-smart-token:focus-visible,
    .pgb-smart-preview__plus:hover,
    .pgb-smart-preview__plus:focus-visible {
        transform: none !important;
    }
}

/* v1.1.1 — mobile density + typography lock
 * Second mobile polish pass based on real-device screenshots.
 * Scope: presentation only. Query/state/apply behavior is unchanged.
 */
@media (max-width: 780px) {
    /* Prevent theme heading/button typography from inflating Finder controls. */
    .pgb-smart-preview button,
    .pgb-smart-preview .pgb-smart-token,
    .pgb-smart-preview .pgb-smart-option,
    .pgb-smart-preview .pgb-smart-workspace__tab,
    .pgb-smart-preview .pgb-smart-workspace__apply,
    .pgb-smart-preview .pgb-smart-preview__browse-all,
    .pgb-smart-preview .pgb-smart-preview__clear,
    .pgb-smart-preview .pgb-smart-tray__close {
        font-family: inherit !important;
        letter-spacing: normal;
    }

    /* Slightly tighter archive section so the products return sooner. */
    body.pgb-smart-finder-preview-active .pgb-shop-stepfinder {
        padding-bottom: 22px;
    }

    /* Active Smart Line: compact enough for two useful tokens per row. */
    .pgb-smart-preview__line:not(.is-choice-step) {
        gap: 6px;
        padding: 12px;
        border-radius: 14px;
        box-shadow: 0 10px 24px rgba(29,18,12,.12);
    }

    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-preview__prompt {
        margin-bottom: 1px;
        font-size: 9.5px !important;
        font-weight: 750;
        letter-spacing: .025em;
    }

    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-token-wrap {
        flex: 0 1 auto;
        max-width: 100%;
    }

    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-token-wrap .pgb-smart-token {
        min-height: 42px;
        max-width: min(218px, calc(100vw - 96px));
        padding: 8px 9px;
        font-size: 12px !important;
        line-height: 1.15 !important;
        font-weight: 600 !important;
    }

    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-token-remove,
    .pgb-smart-preview__line:not(.is-choice-step) .is-context-wrap .pgb-smart-token-remove,
    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-token-wrap.is-refinement-wrap .pgb-smart-token-remove {
        width: 28px;
        min-width: 28px;
        min-height: 42px;
        padding: 0 2px 1px 0;
        font-size: 14px !important;
    }

    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-preview__plus {
        flex-basis: 42px;
        width: 42px;
        height: 42px;
        font-size: 20px !important;
    }

    /* Guided start remains spacious, but no longer looks oversized. */
    .pgb-smart-preview__line.is-choice-step {
        gap: 9px;
        padding: 14px 12px;
        border-radius: 14px;
    }

    .pgb-smart-preview__line.is-choice-step .pgb-smart-preview__prompt.is-question {
        font-size: 11.5px !important;
        font-weight: 750;
    }

    .pgb-smart-preview__line.is-choice-step .pgb-smart-token.is-pet-choice {
        min-height: 44px;
        padding: 8px 5px;
        font-size: 12.5px !important;
        font-weight: 500 !important;
    }

    .pgb-smart-preview__browse-all,
    .pgb-smart-preview__clear {
        font-size: 11px !important;
        line-height: 1.2 !important;
    }

    .pgb-smart-preview__browse-all {
        color: #776d65;
        text-underline-offset: 3px;
    }

    .pgb-smart-preview__clear {
        color: #756b63;
        opacity: .74;
        text-decoration: none;
    }

    .pgb-smart-preview__clear::before {
        opacity: .58;
    }

    /* Workspace header: explicit scale wins over theme h3/button rules. */
    .pgb-smart-tray .pgb-smart-tray__title {
        margin: 0 !important;
        font-family: inherit !important;
        font-size: 27px !important;
        line-height: 1.04 !important;
        font-weight: 800 !important;
        letter-spacing: -.025em !important;
    }

    .pgb-smart-workspace__eyebrow {
        margin-bottom: 4px;
        font-size: 8.5px !important;
        line-height: 1.1 !important;
        letter-spacing: .13em !important;
    }

    .pgb-smart-tray__close {
        min-height: 38px;
        padding: 0 2px !important;
        font-size: 12px !important;
        line-height: 1 !important;
        font-weight: 400 !important;
    }

    /* Tabs: keep one row when the common four filters are enabled.
       A fifth filter remains horizontally reachable, but text no longer clips. */
    .pgb-smart-workspace__tabs {
        gap: 5px;
        margin-bottom: 11px;
        padding-bottom: 9px;
        overflow-x: auto;
        flex-wrap: nowrap;
    }

    .pgb-smart-workspace__tab {
        flex: 0 0 auto;
        min-width: 0;
        min-height: 38px;
        padding: 8px 8px;
        font-size: 10.5px !important;
        line-height: 1.1 !important;
        font-weight: 500 !important;
        white-space: nowrap;
    }

    .pgb-smart-workspace__tab-count {
        min-width: 15px;
        height: 15px;
        padding-inline: 3px;
        font-size: 8px !important;
    }

    /* Denser option matrix: same 44px+ touch target, much less dead space. */
    .pgb-smart-options {
        gap: 7px;
    }

    .pgb-smart-option,
    .pgb-smart-options--workspace .pgb-smart-option {
        min-height: 48px;
        padding: 9px 10px;
    }

    .pgb-smart-options--workspace .pgb-smart-option {
        padding-right: 34px;
    }

    .pgb-smart-option__label {
        font-size: 11.5px !important;
        line-height: 1.25 !important;
        font-weight: 650 !important;
    }

    .pgb-smart-option__note {
        margin-top: 3px;
        font-size: 9px !important;
        line-height: 1.25 !important;
    }

    .pgb-smart-option__deselect {
        right: 8px;
        width: 18px;
        height: 18px;
        font-size: 14px !important;
    }

    /* Price: remove the large editorial scale inside a utility workspace. */
    .pgb-smart-budget--workspace .pgb-smart-budget__readout {
        margin-bottom: 10px;
    }

    .pgb-smart-budget--workspace .pgb-smart-budget__readout strong {
        font-size: 23px !important;
        line-height: 1.05 !important;
    }

    .pgb-smart-budget__rail-wrap {
        padding-top: 20px;
    }

    .pgb-smart-budget__bubble {
        top: -14px;
        padding: 5px 8px;
        font-size: 10px !important;
    }

    .pgb-smart-budget__knob {
        width: 23px;
        height: 23px;
        border-width: 6px;
    }

    .pgb-smart-budget__scale {
        margin-top: 11px;
        font-size: 9px !important;
    }

    .pgb-smart-budget__steps {
        gap: 6px;
        margin-top: 13px;
    }

    .pgb-smart-budget__step {
        min-height: 38px;
        padding: 7px 5px;
        font-size: 11px !important;
        line-height: 1.15 !important;
        font-weight: 500 !important;
    }

    /* Sticky action area is useful, but should not dominate the workspace. */
    .pgb-smart-workspace__actions {
        gap: 6px;
        margin-top: 11px;
        padding-top: 9px;
    }

    .pgb-smart-workspace__pending {
        font-size: 8.5px !important;
        line-height: 1.3 !important;
    }

    .pgb-smart-workspace__apply {
        min-height: 43px;
        padding: 9px 14px;
        font-size: 11.5px !important;
        line-height: 1.1 !important;
    }

    .pgb-smart-workspace__apply:disabled {
        background: #eee9e4;
        border-color: #ded5cd;
        color: #8f857d;
        opacity: 1;
    }
}

@media (max-width: 380px) {
    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-token-wrap .pgb-smart-token {
        max-width: min(205px, calc(100vw - 92px));
        padding-inline: 8px;
        font-size: 11.5px !important;
    }

    .pgb-smart-workspace__tab {
        padding-inline: 7px;
        font-size: 10px !important;
    }
}


/* v1.1.2 — mobile readability comfort pass
 * Real-device typography lift: +~1px on interactive/helper text only.
 * Geometry, query/state/apply behavior and desktop presentation are unchanged.
 */
@media (max-width: 780px) {
    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-preview__prompt {
        font-size: 10.5px !important;
    }

    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-token-wrap .pgb-smart-token {
        font-size: 13px !important;
    }

    .pgb-smart-preview__line.is-choice-step .pgb-smart-preview__prompt.is-question {
        font-size: 12.5px !important;
    }

    .pgb-smart-preview__line.is-choice-step .pgb-smart-token.is-pet-choice {
        font-size: 13.5px !important;
    }

    .pgb-smart-preview__browse-all,
    .pgb-smart-preview__clear {
        font-size: 12px !important;
    }

    .pgb-smart-workspace__eyebrow {
        font-size: 9.5px !important;
    }

    .pgb-smart-tray__close {
        font-size: 13px !important;
    }

    .pgb-smart-workspace__tab {
        font-size: 11.5px !important;
    }

    .pgb-smart-workspace__tab-count {
        font-size: 9px !important;
    }

    .pgb-smart-option__label {
        font-size: 12.5px !important;
    }

    .pgb-smart-option__note {
        font-size: 10px !important;
    }

    .pgb-smart-budget__bubble {
        font-size: 11px !important;
    }

    .pgb-smart-budget__scale {
        font-size: 10px !important;
    }

    .pgb-smart-budget__step {
        font-size: 12px !important;
    }

    .pgb-smart-workspace__pending {
        font-size: 9.5px !important;
    }

    .pgb-smart-workspace__apply {
        font-size: 12.5px !important;
    }
}

@media (max-width: 380px) {
    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-token-wrap .pgb-smart-token {
        font-size: 12.5px !important;
    }

    .pgb-smart-workspace__tab {
        font-size: 11px !important;
    }
}

/* v1.2.0 — constraint-aware availability states.
 * Impossible pending combinations remain visible for orientation, but cannot be selected.
 */
.pgb-smart-options--workspace .pgb-smart-option.is-unavailable,
.pgb-smart-options--workspace .pgb-smart-option:disabled,
.pgb-smart-budget__step.is-unavailable,
.pgb-smart-budget__step:disabled {
    background: #f8f9fa !important;
    border-color: rgba(100, 88, 80, .14) !important;
    color: rgba(100, 88, 80, .42) !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
    opacity: 1 !important;
    transform: none !important;
}

.pgb-smart-options--workspace .pgb-smart-option.is-unavailable .pgb-smart-option__label,
.pgb-smart-options--workspace .pgb-smart-option:disabled .pgb-smart-option__label {
    color: rgba(100, 88, 80, .42) !important;
}

.pgb-smart-options--workspace .pgb-smart-option.is-unavailable:hover,
.pgb-smart-options--workspace .pgb-smart-option.is-unavailable:focus-visible,
.pgb-smart-options--workspace .pgb-smart-option:disabled:hover,
.pgb-smart-options--workspace .pgb-smart-option:disabled:focus-visible,
.pgb-smart-budget__step.is-unavailable:hover,
.pgb-smart-budget__step:disabled:hover {
    background: #f8f9fa !important;
    border-color: rgba(100, 88, 80, .14) !important;
    color: rgba(100, 88, 80, .42) !important;
    transform: none !important;
}

/* v1.3.1 — text-first premium color cue: inline micro-swatch, never a visual tile */
.pgb-smart-option--color .pgb-smart-option__label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.pgb-smart-option__swatch {
    display: inline-block;
    width: 12px;
    height: 12px;
    flex: 0 0 12px;
    margin: 0;
    border: 1px solid rgba(55, 43, 35, .16);
    border-radius: 2px;
    box-shadow: none;
    opacity: .78;
}

.pgb-smart-options--workspace .pgb-smart-option.is-selected .pgb-smart-option__swatch {
    border-color: rgba(255,255,255,.34);
    opacity: .9;
}

.pgb-smart-options--workspace .pgb-smart-option.is-unavailable .pgb-smart-option__swatch,
.pgb-smart-options--workspace .pgb-smart-option:disabled .pgb-smart-option__swatch {
    opacity: .28;
    filter: saturate(.55);
}

.pgb-smart-workspace__recovery {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 18px;
    border-top: 1px solid rgba(100,88,80,.12);
    background: #fbfaf8;
    color: #645850;
}

.pgb-smart-workspace__recovery[hidden] {
    display: none !important;
}

.pgb-smart-workspace__recovery-copy {
    font-size: 12px;
    line-height: 1.35;
    color: #8b817a;
}

.pgb-smart-workspace__recovery-action {
    appearance: none;
    border: 0;
    padding: 3px 0;
    background: transparent;
    color: #7c603f;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
    text-align: right;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.pgb-smart-workspace__recovery-action:hover,
.pgb-smart-workspace__recovery-action:focus-visible {
    background: transparent !important;
    color: #24170f;
    outline: none;
}

.pgb-smart-results-summary {
    position: sticky;
    top: var(--pgb-finder-sticky-offset, 104px);
    z-index: 35;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    margin: 0 0 18px;
    padding: 11px 14px;
    border: 1px solid rgba(100,88,80,.14);
    border-radius: 10px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 7px 22px rgba(31,23,18,.06);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.pgb-smart-results-summary__copy {
    min-width: 0;
    overflow: hidden;
    color: #645850;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.35;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.pgb-smart-results-summary__edit {
    appearance: none;
    flex: 0 0 auto;
    min-height: 38px;
    padding: 7px 10px;
    border: 0;
    background: transparent;
    color: #24170f;
    font: inherit;
    font-size: 12px;
    font-weight: 750;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.pgb-smart-results-summary__edit:hover,
.pgb-smart-results-summary__edit:focus-visible {
    background: #f8f9fa;
    outline: none;
}

[data-pgb-stepfinder] {
    scroll-margin-top: 150px;
}

@media (max-width: 767px) {
    .pgb-smart-workspace__recovery {
        align-items: flex-start;
        padding: 10px 14px;
    }

    .pgb-smart-workspace__recovery-copy,
    .pgb-smart-workspace__recovery-action {
        font-size: 11.5px !important;
    }

    .pgb-smart-results-summary {
        top: var(--pgb-finder-sticky-offset-mobile, 142px);
        margin-bottom: 14px;
        padding: 9px 11px;
        border-radius: 8px;
    }

    .pgb-smart-results-summary__copy {
        font-size: 12.5px;
    }

    .pgb-smart-results-summary__edit {
        min-height: 36px;
        padding: 6px 8px;
        font-size: 12px;
    }
}

@media (max-width: 380px) {
    .pgb-smart-workspace__recovery {
        display: block;
    }

    .pgb-smart-workspace__recovery-action {
        display: block;
        margin-top: 4px;
        text-align: left;
    }

    .pgb-smart-option__swatch {
        width: 9px;
        height: 9px;
        flex-basis: 9px;
    }
}


/* v1.3.2 — mobile focus guard + guided-step affordance polish
 * The Finder becomes the only floating interaction while its tray/workspace is open.
 * The Concierge launcher returns immediately when the tray closes.
 */
@media (max-width: 780px) {
    body.pgb-smart-finder-tray-open [data-pgb-concierge-launcher],
    body.pgb-smart-finder-tray-open [data-pgb-ai-concierge-launcher],
    body.pgb-smart-finder-tray-open [data-pgb-launcher="concierge"],
    body.pgb-smart-finder-tray-open #pgb-concierge-launcher,
    body.pgb-smart-finder-tray-open #pgb-ai-concierge-launcher,
    body.pgb-smart-finder-tray-open .pgb-concierge-launcher,
    body.pgb-smart-finder-tray-open .pgb-ai-concierge-launcher,
    body.pgb-smart-finder-tray-open .pgb-concierge__launcher,
    body.pgb-smart-finder-tray-open .pgb-ai-concierge__launcher,
    body.pgb-smart-finder-tray-open .pgb-concierge-toggle,
    body.pgb-smart-finder-tray-open .pgb-ai-concierge-toggle,
    .pgb-smart-finder-hidden-launcher {
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
        transition: opacity .12s ease, visibility .12s ease !important;
    }

    /* The guided need is one clear next-step control. The real + remains a
       separate refinement action only after pet + need context is complete. */
    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-token.is-next-step {
        padding-right: 31px !important;
        background: rgba(244,237,229,.08) !important;
        color: #fff !important;
        border-color: rgba(244,237,229,.22) !important;
        border-style: solid !important;
    }

    .pgb-smart-preview__line:not(.is-choice-step) .pgb-smart-token.is-next-step::after {
        content: '→';
        right: 10px;
        color: #bfa993;
        font-size: 13px;
        font-weight: 500;
    }
}

/* Android/touch browsers can retain :hover after a tap. Do not let the trigger
 * turn into a large white block while the opened tray is visible. */
@media (max-width: 780px) and (hover: none) {
    .pgb-smart-token.is-next-step:hover,
    .pgb-smart-token.is-next-step:focus,
    .pgb-smart-token.is-next-step:focus-visible {
        background: rgba(244,237,229,.08) !important;
        color: #fff !important;
        border-color: rgba(244,237,229,.22) !important;
    }

    .pgb-smart-preview__plus:hover,
    .pgb-smart-preview__plus:focus,
    .pgb-smart-preview__plus:focus-visible {
        background: transparent !important;
        color: #fff !important;
        border-color: rgba(255,255,255,.20) !important;
        transform: none !important;
    }
}

/* =========================================================
   v1.5.3 — Shop Discovery hierarchy refinement
   Presentation only: no query, route, AJAX or facet behavior changes.
========================================================= */
.pgb-smart-preview.is-guided-start .pgb-smart-preview__guided-start {
    margin-top: 22px;
}

.pgb-smart-preview.is-guided-start .pgb-smart-preview__guided-question {
    margin: 0 0 9px;
    color: #756b63;
    font-size: 11px;
    line-height: 1.35;
    font-weight: 700;
    letter-spacing: .015em;
}

.pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step {
    margin-top: 0;
    padding: 10px 11px;
    min-height: 56px;
    border-radius: 15px;
    gap: 8px;
}

.pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    width: 100%;
}

.pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step .pgb-smart-token.is-pet-choice {
    flex: 0 0 auto;
    min-height: 38px;
    padding: 9px 16px;
    border-radius: 10px;
    font-size: 12px !important;
    font-weight: 650 !important;
}

.pgb-smart-preview.is-guided-start .pgb-smart-preview__foot {
    margin-top: 12px;
}

.pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 30px;
    padding: 0 0 3px;
    border-bottom: 1px solid rgba(117,106,98,.34);
    color: #584c44;
    font-size: 11px !important;
    line-height: 1.2 !important;
    font-weight: 700;
    text-decoration: none;
    transition: color .18s ease, border-color .18s ease, gap .18s ease;
}

.pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all i {
    color: var(--pgb-smart-accent);
    font-style: normal;
    font-size: 14px;
    line-height: 1;
}

.pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all:hover,
.pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all:focus-visible {
    color: var(--pgb-smart-ink);
    border-bottom-color: var(--pgb-smart-accent);
    gap: 11px;
    outline: none;
}

@media (max-width: 780px) {
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__guided-start {
        margin-top: 18px;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__guided-question {
        margin-bottom: 8px;
        font-size: 11px;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step {
        display: block;
        padding: 10px;
        min-height: 0;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices],
    .pgb-smart-preview.is-guided-start.has-four-contexts .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices] {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 7px;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step .pgb-smart-token.is-pet-choice {
        width: 100%;
        min-width: 0;
        min-height: 42px;
        padding: 8px 6px;
        justify-content: center;
        text-align: center;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__foot {
        margin-top: 10px;
        padding-inline: 0;
    }
}



/* =========================================================
   v1.5.4 — Discovery rail action refinement
   Keep the guided-start dark rail full width and use the right side for
   the secondary "Browse all products" action. Presentation only.
========================================================= */
@media (min-width: 781px) {
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        max-width: none;
        gap: 24px;
        padding-right: 18px;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices] {
        width: auto;
        max-width: none;
        flex: 0 1 auto;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail {
        flex: 0 0 auto;
        display: inline-flex;
        align-items: center;
        justify-content: flex-end;
        gap: 11px;
        min-height: 38px;
        margin-left: auto;
        padding: 0 4px 0 20px;
        border: 0;
        border-bottom: 1px solid rgba(255,255,255,.22);
        background: transparent;
        color: #f4ece6;
        font-size: 11px !important;
        line-height: 1.2 !important;
        font-weight: 700;
        letter-spacing: .02em;
        text-decoration: none;
        white-space: nowrap;
        cursor: pointer;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail i {
        color: var(--pgb-smart-accent);
        font-size: 15px;
        line-height: 1;
        font-style: normal;
        transition: transform .18s ease;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:hover,
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:focus-visible {
        color: #fff;
        border-bottom-color: var(--pgb-smart-accent);
        outline: none;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:hover i,
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:focus-visible i {
        transform: translateX(4px);
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__foot {
        margin-top: 0;
    }
}

@media (max-width: 780px) {
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail {
        display: inline-flex;
        width: 100%;
        justify-content: flex-end;
        align-items: center;
        gap: 9px;
        min-height: 38px;
        margin-top: 8px;
        padding: 4px 2px 2px;
        border: 0;
        border-top: 1px solid rgba(255,255,255,.12);
        background: transparent;
        color: #f4ece6;
        font-size: 11px !important;
        font-weight: 700;
        text-decoration: none;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail i {
        color: var(--pgb-smart-accent);
        font-style: normal;
    }
}

/* =========================================================
   v1.5.5 — Discovery rail responsive stabilization
   Keep the initial discovery rail balanced at every viewport:
   - desktop/tablet: choices left + Browse all right on ONE row
   - mobile: 2x2 choices + Browse all as an internal rail footer
   Presentation only; no Finder state/query/AJAX changes.
========================================================= */
.pgb-smart-preview.is-guided-start .pgb-smart-preview__result {
    display: none !important;
}

@media (min-width: 781px) {
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto !important;
        align-items: center !important;
        column-gap: 12px !important;
        row-gap: 0 !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 58px !important;
        padding: 10px 16px 10px 11px !important;
        overflow: hidden !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices] {
        display: flex !important;
        flex: 0 1 auto !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 7px !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step .pgb-smart-token.is-pet-choice {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 38px !important;
        padding: 9px 16px !important;
        white-space: nowrap !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail,
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:link,
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:visited {
        appearance: none !important;
        display: inline-flex !important;
        flex: 0 0 auto !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 10px !important;
        width: auto !important;
        min-width: max-content !important;
        max-width: none !important;
        min-height: 38px !important;
        margin: 0 0 0 auto !important;
        padding: 0 3px 0 16px !important;
        border: 0 !important;
        border-bottom: 1px solid rgba(255,255,255,.28) !important;
        border-radius: 0 !important;
        background: transparent !important;
        background-color: transparent !important;
        color: #f7f0ea !important;
        -webkit-text-fill-color: #f7f0ea !important;
        opacity: 1 !important;
        visibility: visible !important;
        font-family: inherit !important;
        font-size: 11px !important;
        line-height: 1.2 !important;
        font-weight: 700 !important;
        letter-spacing: .02em !important;
        text-decoration: none !important;
        text-transform: none !important;
        white-space: nowrap !important;
        box-shadow: none !important;
        text-shadow: none !important;
        cursor: pointer !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail span {
        color: #f7f0ea !important;
        -webkit-text-fill-color: #f7f0ea !important;
        opacity: 1 !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail i {
        flex: 0 0 auto !important;
        color: var(--pgb-smart-accent) !important;
        -webkit-text-fill-color: var(--pgb-smart-accent) !important;
        opacity: 1 !important;
        font-size: 15px !important;
        line-height: 1 !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:hover,
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:focus-visible {
        border-bottom-color: var(--pgb-smart-accent) !important;
        background: transparent !important;
        background-color: transparent !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        opacity: 1 !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:hover span,
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:focus-visible span {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:focus-visible {
        outline: 2px solid var(--pgb-smart-accent) !important;
        outline-offset: 3px !important;
    }
}

/* Laptop / small tablet landscape: preserve the single-line composition
   with slightly denser controls instead of wrapping the CTA. */
@media (min-width: 781px) and (max-width: 1100px) {
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step {
        column-gap: 9px !important;
        padding-right: 13px !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices] {
        gap: 6px !important;
        max-width: 100% !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step .pgb-smart-token.is-pet-choice {
        padding-inline: 12px !important;
        font-size: 11.5px !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail {
        gap: 8px !important;
        padding-left: 10px !important;
        font-size: 10.5px !important;
    }
}

/* Mobile: keep everything inside the dark rail, but intentionally stack the
   Browse-all action below the 2x2 choice grid for reliable touch sizing. */
@media (max-width: 780px) {
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step {
        overflow: visible !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail,
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:link,
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:visited {
        appearance: none !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 9px !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        margin: 2px 0 0 !important;
        padding: 8px 2px 2px !important;
        border: 0 !important;
        border-top: 1px solid rgba(255,255,255,.13) !important;
        border-radius: 0 !important;
        background: transparent !important;
        background-color: transparent !important;
        color: #f7f0ea !important;
        -webkit-text-fill-color: #f7f0ea !important;
        opacity: 1 !important;
        visibility: visible !important;
        font-family: inherit !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
        font-weight: 700 !important;
        letter-spacing: .01em !important;
        text-decoration: none !important;
        text-transform: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail span {
        color: #f7f0ea !important;
        -webkit-text-fill-color: #f7f0ea !important;
        opacity: 1 !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail i {
        flex: 0 0 auto !important;
        color: var(--pgb-smart-accent) !important;
        -webkit-text-fill-color: var(--pgb-smart-accent) !important;
        opacity: 1 !important;
        font-size: 16px !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:hover,
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:focus-visible {
        background: transparent !important;
        background-color: transparent !important;
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
        opacity: 1 !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:hover span,
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:focus-visible span {
        color: #ffffff !important;
        -webkit-text-fill-color: #ffffff !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__browse-all.is-in-rail:focus-visible {
        outline: 2px solid var(--pgb-smart-accent) !important;
        outline-offset: 2px !important;
    }
}

@media (max-width: 420px) {
    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step {
        padding: 11px 10px !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices],
    .pgb-smart-preview.is-guided-start.has-four-contexts .pgb-smart-preview__line.is-choice-step [data-smart-pet-choices] {
        gap: 6px !important;
    }

    .pgb-smart-preview.is-guided-start .pgb-smart-preview__line.is-choice-step .pgb-smart-token.is-pet-choice {
        min-height: 43px !important;
        padding-inline: 5px !important;
        font-size: 12.5px !important;
    }
}


/* Smart Finder v1.5.7 — semantic size grouping inside the live refinement workspace. */
.pgb-smart-size-groups {
    display: grid;
    gap: 24px;
    width: 100%;
}

.pgb-smart-size-group {
    min-width: 0;
}

.pgb-smart-size-group + .pgb-smart-size-group {
    padding-top: 23px;
    border-top: 1px solid #e7ded5;
}

.pgb-smart-size-group__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 20px;
    margin: 0 0 12px;
}

.pgb-smart-size-group__title {
    margin: 0 !important;
    color: #2a1e17 !important;
    font-size: 11px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    letter-spacing: .10em !important;
    text-transform: uppercase !important;
}

.pgb-smart-size-group__note {
    margin: 0 !important;
    color: #8a7e75 !important;
    font-size: 10px !important;
    line-height: 1.35 !important;
    font-weight: 500 !important;
}

.pgb-smart-size-group__options {
    width: 100%;
}

@media (max-width: 780px) {
    .pgb-smart-size-groups { gap: 19px; }
    .pgb-smart-size-group + .pgb-smart-size-group { padding-top: 18px; }
    .pgb-smart-size-group__head {
        display: block;
        margin-bottom: 10px;
    }
    .pgb-smart-size-group__note {
        margin-top: 5px !important;
    }
}


/* Smart Finder v1.5.7 — hide semantic size groups with zero usable choices. */
.pgb-smart-size-group[hidden] {
    display: none !important;
}

.pgb-smart-size-group.is-first-visible {
    padding-top: 0 !important;
    border-top: 0 !important;
}


/* Smart Finder v1.5.9 — hide unavailable Brand/Color choices while preserving selected values. */
.pgb-smart-options--workspace .pgb-smart-option[hidden] {
    display: none !important;
}
