
/* =========================================================
   LGT SHOP INTRO 1.2.4
   SEO-friendly Shop archive heading + short description.
========================================================= */
.lgt-shop-intro {
    width: 100%;
    margin: 0 0 18px;
    padding: 2px 0 0;
}
.lgt-shop-intro h1 {
    margin: 0 0 7px;
    color: #202936;
    font-size: 25px;
    line-height: 1.25;
    font-weight: 750;
    letter-spacing: -.02em;
}
.lgt-shop-intro p {
    max-width: 980px;
    margin: 0;
    color: #657180;
    font-size: 14px;
    line-height: 1.7;
    font-weight: 400;
}
@media (max-width: 767px) {
    .lgt-shop-intro {
        margin: 0 0 14px;
        padding: 0;
    }
    .lgt-shop-intro h1 {
        margin-bottom: 5px;
        font-size: 20px;
        line-height: 1.3;
    }
    .lgt-shop-intro p {
        font-size: 12.5px;
        line-height: 1.6;
    }
}

/* LGT WooCommerce AJAX Filter 1.1.1 - Clean groups + category pills */
.lgt-product-filter,
.lgt-product-filter * { box-sizing: border-box; }
.lgt-product-filter {
    --lgt-accent: #557C9A;
    --lgt-accent-dark: #426781;
    --lgt-text: #252b33;
    --lgt-muted: #737d89;
    --lgt-line: #e7e9ed;
    --lgt-soft: #f8f9fb;
    position: relative;
    z-index: 2;
    clear: both;
    width: 100%;
    margin: 0 0 22px;
    padding: 15px 18px 13px;
    color: var(--lgt-text);
    background: #fff;
    border: 1px solid var(--lgt-line);
    border-radius: 12px;
    box-shadow: 0 3px 14px rgba(25, 35, 50, .035);
    font-size: 14px;
}
.lgt-filter-mobile-bar { display: none; }
.lgt-filter-panel-head { display: flex; align-items: center; justify-content: space-between; margin: 0 0 11px; }
.lgt-filter-panel-head > div { display: flex; align-items: baseline; gap: 9px; }
.lgt-filter-eyebrow { color: var(--lgt-muted); font-size: 10px; font-weight: 700; letter-spacing: .09em; }
.lgt-filter-panel-head h3 { margin: 0; color: var(--lgt-text); font-size: 15px; line-height: 1.3; font-weight: 700; }
.lgt-filter-close { display: none; }
.lgt-filter-row { display: flex; align-items: center; flex-wrap: wrap; gap: 7px 13px; width: 100%; }
.lgt-filter-row + .lgt-filter-row { margin-top: 12px; padding-top: 0; border-top: 0; }
.lgt-filter-heading { flex: 0 0 125px; color: #505965; font-size: 12px; font-weight: 700; line-height: 1.4; }
.lgt-filter-options { display: flex; align-items: center; flex: 1 1 auto; flex-wrap: wrap; gap: 7px; min-width: 0; }
.lgt-filter-pill,
.lgt-filter-check {
    display: inline-flex; align-items: center; justify-content: center;
    min-height: 34px; padding: 6px 13px;
    border: 1px solid #e1e5ea; border-radius: 999px;
    background: #fff; color: #424b56;
    font-size: 12px; line-height: 1.25; font-weight: 500;
    text-decoration: none; white-space: nowrap; cursor: pointer;
    transition: border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}
.lgt-filter-pill:hover, .lgt-filter-check:hover { border-color: #B8CBD8; color: var(--lgt-accent-dark); background: #F6F9FB; }
.lgt-filter-pill:focus-visible, .lgt-filter-check:focus-within, .lgt-mobile-filter-open:focus-visible { outline: 2px solid rgba(85,124,154,.28); outline-offset: 2px; }
.lgt-filter-pill.is-active, .lgt-filter-check.is-active { border-color: var(--lgt-accent); background: #EEF4F8; color: var(--lgt-accent-dark); box-shadow: 0 0 0 1px rgba(85,124,154,.04) inset; }
.lgt-filter-check { gap: 7px; margin: 0; font-weight: 500; }
.lgt-filter-check input { width: 15px; height: 15px; margin: 0; accent-color: var(--lgt-accent); cursor: pointer; }
.lgt-filter-categories { gap: 7px 13px; }
.lgt-filter-category {
    width: min(100%, 280px); min-height: 36px; padding: 6px 34px 6px 12px;
    border: 1px solid #e1e5ea; border-radius: 8px; background-color: #fff;
    color: #343c46; font-size: 12px; outline: none;
}
.lgt-filter-category:focus { border-color: #9FB8C8; box-shadow: 0 0 0 3px rgba(85,124,154,.08); }
.lgt-filter-footer { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-top: 12px; padding-top: 0; border-top: 0; min-height: 27px; }
.lgt-filter-count { color: var(--lgt-muted); font-size: 11px; }
.lgt-filter-reset { padding: 3px 0; border: 0; background: transparent; color: var(--lgt-accent-dark); font-size: 11px; font-weight: 600; cursor: pointer; }
.lgt-filter-reset:hover { text-decoration: underline; }
.lgt-filter-mobile-actions { display: none; }
.lgt-filter-backdrop { display: none; }

/* Results loading state */
.lgt-filter-results { position: relative; min-height: 80px; transition: opacity .18s ease; }
.lgt-filter-results.is-loading { opacity: .42; pointer-events: none; }
.lgt-filter-results.is-loading:after { content: ''; position: absolute; z-index: 5; top: 36px; left: calc(50% - 16px); width: 32px; height: 32px; border: 3px solid #d9dfe5; border-top-color: #557C9A; border-radius: 50%; animation: lgt-filter-spin .7s linear infinite; }
@keyframes lgt-filter-spin { to { transform: rotate(360deg); } }
.lgt-ajax-pagination { clear: both; width: 100%; }
.lgt-ajax-pagination ul { display: flex; flex-wrap: wrap; gap: 5px; justify-content: center; padding: 0; list-style: none; }
.lgt-ajax-pagination li { margin: 0; }
.lgt-ajax-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; min-height: 34px; padding: 5px 10px; }

@media (max-width: 767px) {
    .lgt-product-filter { margin: 0 0 13px; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
    .lgt-filter-mobile-bar { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 44px; }
    .lgt-mobile-filter-open { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 40px; padding: 8px 14px; border: 1px solid #e5e7eb; border-radius: 9px; background: #fff; color: #303741; font-size: 13px; font-weight: 700; box-shadow: 0 2px 7px rgba(20,30,45,.045); cursor: pointer; }
    .lgt-mobile-filter-icon { display: inline-flex; width: 17px; height: 17px; }
    .lgt-mobile-filter-icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
    .lgt-mobile-filter-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 20px; background: var(--lgt-accent); color: #fff; font-size: 10px; line-height: 1; }
    .lgt-mobile-filter-badge[hidden] { display: none; }
    .lgt-mobile-result-count { color: var(--lgt-muted); font-size: 11px; text-align: right; }

    /* Bottom-sheet overlay */
    .lgt-filter-backdrop { display: block; position: fixed; inset: 0; z-index: 99990; background: rgba(15, 20, 28, .48); opacity: 0; visibility: hidden; transition: opacity .22s ease, visibility .22s ease; }
    .lgt-filter-panel { position: fixed; z-index: 99991; left: 0; right: 0; bottom: 0; max-height: min(84dvh, 720px); overflow-y: auto; overscroll-behavior: contain; padding: 18px 16px calc(16px + env(safe-area-inset-bottom)); border-radius: 19px 19px 0 0; background: #fff; box-shadow: 0 -8px 35px rgba(0,0,0,.16); transform: translateY(105%); visibility: hidden; transition: transform .26s cubic-bezier(.2,.75,.25,1), visibility .26s ease; }
    .lgt-product-filter.is-sheet-open .lgt-filter-backdrop { opacity: 1; visibility: visible; }
    .lgt-product-filter.is-sheet-open .lgt-filter-panel { transform: translateY(0); visibility: visible; }
    .lgt-filter-panel-head { position: sticky; top: -18px; z-index: 2; margin: -18px -16px 14px; padding: 17px 16px 13px; background: #fff; border-bottom: 1px solid #f0f1f3; }
    .lgt-filter-panel-head > div { display: block; }
    .lgt-filter-eyebrow { display: block; margin-bottom: 3px; font-size: 9px; }
    .lgt-filter-panel-head h3 { font-size: 17px; }
    .lgt-filter-close { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: #f2f3f5; color: #414852; font-size: 26px; line-height: 1; cursor: pointer; }
    .lgt-filter-row { display: block; }
    .lgt-filter-row + .lgt-filter-row { margin-top: 18px; padding-top: 0; border-top: 0; }
    .lgt-filter-heading { display: block; width: 100%; margin: 0 0 9px; font-size: 13px; }
    .lgt-filter-options { display: flex; gap: 8px; width: 100%; }
    .lgt-filter-pill, .lgt-filter-check { min-height: 37px; padding: 8px 12px; font-size: 12px; }
    .lgt-filter-categories { display: block; }
    .lgt-category-options { display: flex; flex-wrap: wrap; gap: 8px; }
    .lgt-filter-footer { margin-top: 16px; padding-top: 0; border-top: 0; }
    .lgt-filter-count { font-size: 12px; }
    .lgt-filter-reset { font-size: 12px; }
    .lgt-filter-mobile-actions { display: block; position: sticky; bottom: calc(-16px - env(safe-area-inset-bottom)); margin: 13px -16px calc(-16px - env(safe-area-inset-bottom)); padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid #eceef1; background: rgba(255,255,255,.97); }
    .lgt-filter-view-results { display: block; width: 100%; min-height: 45px; padding: 11px 16px; border: 0; border-radius: 9px; background: var(--lgt-accent); color: #fff; font-size: 14px; font-weight: 700; cursor: pointer; box-shadow: 0 4px 10px rgba(85,124,154,.18); }
    .lgt-filter-view-results:active { background: var(--lgt-accent-dark); }
    body.lgt-filter-no-scroll { overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) {
    .lgt-product-filter *, .lgt-filter-backdrop, .lgt-filter-panel { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* 1.1.1: never expose aggregate product totals in the filter summary. */
.lgt-filter-count, .lgt-mobile-result-count { display: none !important; }


/* 1.1.2: active filter chips shown between the filter controls and shop toolbar. */
.lgt-active-filters[hidden] { display: none !important; }
.lgt-active-filters {
    display: flex; align-items: center; flex-wrap: wrap; gap: 7px;
    width: 100%; margin: 10px 0 15px; padding: 0;
    color: #657180; font-size: 12px; line-height: 1.5;
}
.lgt-active-filters__lead {
    display: inline-flex; align-items: center; gap: 5px;
    margin-right: 1px; color: #657180; font-weight: 500; white-space: nowrap;
}
.lgt-active-filters__lead > span {
    font-size: 17px; line-height: 1; color: #84909d;
}
.lgt-active-filters__chips {
    display: inline-flex; align-items: center; flex-wrap: wrap; gap: 6px;
    min-width: 0;
}
.lgt-active-filter-chip {
    display: inline-flex; align-items: center; gap: 7px;
    min-height: 27px; padding: 4px 9px;
    border: 1px solid #e7eaf0; border-radius: 999px;
    background: #f5f6ff; color: #34405c;
    font: inherit; font-size: 11px; line-height: 1.3;
    cursor: pointer; transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.lgt-active-filter-chip:hover {
    border-color: #B8CBD8; background: #EEF4F8; color: #426781;
}
.lgt-active-filter-chip__remove {
    display: inline-flex; align-items: center; justify-content: center;
    width: 13px; height: 13px; border-radius: 50%;
    color: #7b8492; font-size: 15px; line-height: 1;
}
.lgt-active-filter-chip:hover .lgt-active-filter-chip__remove { color: #426781; }
.lgt-active-filters__clear {
    margin-left: 3px; padding: 3px 2px; border: 0;
    background: transparent; color: #557C9A;
    font: inherit; font-size: 11px; font-weight: 600; cursor: pointer;
}
.lgt-active-filters__clear:hover { text-decoration: underline; }

@media (max-width: 767px) {
    .lgt-active-filters {
        align-items: flex-start; gap: 6px;
        margin: 7px 0 12px; font-size: 11px;
    }
    .lgt-active-filters__lead { padding-top: 4px; }
    .lgt-active-filters__chips { flex: 1 1 calc(100% - 10px); gap: 5px; }
    .lgt-active-filter-chip { min-height: 26px; padding: 4px 8px; font-size: 10px; }
    .lgt-active-filters__clear { margin: 2px 0 0; font-size: 10px; }
}


/* =========================================================
   LGT AJAX PRODUCT FILTER 1.2.0
   Premium muted slate-blue selectable-chip UI — preserves AJAX and Yozi loop
========================================================= */
.lgt-product-filter {
    --lgt-accent: #557C9A;
    --lgt-accent-dark: #426781;
    --lgt-text: #202936;
    --lgt-muted: #748091;
    --lgt-line: #e8ebf0;
    --lgt-soft: #f7f8fa;
    margin-bottom: 20px;
    padding: 17px 19px 15px;
    border: 1px solid #e6eaf0;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 5px 20px rgba(25, 39, 58, .045);
}
.lgt-filter-panel-head {
    gap: 12px;
    margin-bottom: 13px;
}
.lgt-filter-panel-head > div {
    align-items: center;
    gap: 10px;
}
.lgt-filter-eyebrow {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 0 8px;
    border-radius: 6px;
    background: #f5f6f8;
    color: #778293;
    font-size: 9px;
    letter-spacing: .075em;
}
.lgt-filter-panel-head h3 {
    color: #202936;
    font-size: 15px;
    font-weight: 750;
    letter-spacing: -.015em;
}
.lgt-filter-row {
    align-items: flex-start;
    gap: 8px 13px;
}
.lgt-filter-row + .lgt-filter-row {
    margin-top: 11px;
}
.lgt-filter-heading {
    flex: 0 0 125px;
    padding-top: 9px;
    color: #586475;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -.01em;
}
.lgt-filter-options {
    gap: 7px;
}
.lgt-filter-check {
    position: relative;
    min-height: 35px;
    padding: 7px 12px;
    gap: 6px;
    border-color: #e2e7ed;
    border-radius: 10px;
    background: #fff;
    color: #465263;
    font-size: 11.5px;
    font-weight: 550;
    box-shadow: 0 1px 2px rgba(20, 35, 55, .018);
}
.lgt-filter-check input {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    clip-path: inset(50%);
    border: 0;
}
.lgt-filter-check:hover {
    border-color: #B8CBD8;
    background: #F6F9FB;
    color: #426781;
}
.lgt-filter-check.is-active {
    gap: 6px;
    padding-left: 10px;
    border-color: #8EADBF;
    background: #EEF4F8;
    color: #426781;
    box-shadow: 0 0 0 1px rgba(231, 71, 46, .055) inset;
    font-weight: 650;
}
.lgt-filter-check.is-active::before {
    content: "✓";
    display: inline-flex;
    flex: 0 0 15px;
    align-items: center;
    justify-content: center;
    width: 15px;
    height: 15px;
    border-radius: 4px;
    background: var(--lgt-accent);
    color: #fff;
    font-size: 10px;
    font-weight: 800;
    line-height: 1;
}
.lgt-filter-check:focus-within {
    outline: 2px solid rgba(231, 71, 46, .25);
    outline-offset: 2px;
}
.lgt-filter-check:focus-within:not(.is-active) {
    border-color: #9FB8C8;
}
.lgt-active-filters {
    align-items: center;
    gap: 7px;
    margin: 13px 0 0;
    padding: 11px 0 0;
    border-top: 1px solid #f0f2f5;
    color: #667386;
    font-size: 11px;
}
.lgt-active-filters__lead {
    color: #687588;
    font-size: 11px;
    font-weight: 600;
}
.lgt-active-filters__lead > span {
    color: #8995a5;
    font-size: 15px;
}
.lgt-active-filters__chips {
    gap: 6px;
}
.lgt-active-filter-chip {
    min-height: 26px;
    padding: 4px 9px;
    border-color: #e7eaf0;
    border-radius: 8px;
    background: #f5f7fb;
    color: #46546b;
    font-size: 10.5px;
    font-weight: 550;
}
.lgt-active-filter-chip:hover {
    border-color: #B8CBD8;
    background: #EEF4F8;
    color: #426781;
}
.lgt-active-filters__clear {
    margin-left: 3px;
    color: var(--lgt-accent);
    font-size: 10.5px;
    font-weight: 700;
}
.lgt-filter-footer {
    min-height: 0;
    margin: 0;
    padding: 0;
}
.lgt-filter-mobile-actions {
    display: none;
}

/* Mobile trigger stays compact; full controls remain in the bottom sheet. */
@media (max-width: 767px) {
    .lgt-product-filter {
        margin: 0 0 12px;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
    }
    .lgt-mobile-filter-open {
        min-height: 42px;
        padding: 9px 15px;
        border-color: #e4e8ee;
        border-radius: 11px;
        background: #fff;
        color: #263243;
        box-shadow: 0 3px 12px rgba(25, 39, 58, .055);
        font-size: 12px;
        font-weight: 700;
    }
    .lgt-filter-panel {
        padding: 18px 17px calc(16px + env(safe-area-inset-bottom));
        border-radius: 20px 20px 0 0;
        box-shadow: 0 -10px 38px rgba(16, 25, 40, .19);
    }
    .lgt-filter-panel-head {
        margin: -18px -17px 17px;
        padding: 17px 17px 14px;
        border-bottom: 1px solid #eff1f4;
    }
    .lgt-filter-panel-head > div {
        align-items: flex-start;
        gap: 5px;
    }
    .lgt-filter-eyebrow {
        min-height: 21px;
        padding: 0 7px;
        font-size: 8px;
    }
    .lgt-filter-panel-head h3 {
        font-size: 16px;
    }
    .lgt-filter-row + .lgt-filter-row {
        margin-top: 19px;
    }
    .lgt-filter-heading {
        padding: 0;
        margin: 0 0 9px;
        font-size: 12px;
    }
    .lgt-filter-options {
        gap: 7px;
    }
    .lgt-filter-check {
        min-height: 36px;
        padding: 7px 11px;
        border-radius: 10px;
        font-size: 11px;
    }
    .lgt-filter-check.is-active {
        padding-left: 9px;
    }
    .lgt-active-filters {
        align-items: flex-start;
        gap: 7px;
        margin-top: 17px;
        padding-top: 13px;
    }
    .lgt-active-filters__lead {
        padding-top: 4px;
        white-space: nowrap;
        font-size: 10.5px;
    }
    .lgt-active-filters__chips {
        flex: 1 1 calc(100% - 12px);
        gap: 5px;
    }
    .lgt-active-filter-chip {
        min-height: 27px;
        padding: 4px 8px;
        font-size: 10px;
    }
    .lgt-active-filters__clear {
        margin: 3px 0 0;
        font-size: 10px;
    }
    .lgt-filter-mobile-actions {
        display: block;
        margin-top: 16px;
    }
}
@media (min-width: 768px) {
    .lgt-product-filter .lgt-filter-panel {
        display: block;
    }
}


/* 1.2.1: calm slate-blue accent refinements */
.lgt-product-filter {
    --lgt-accent: #557C9A;
    --lgt-accent-dark: #426781;
}
.lgt-filter-check.is-active,
.lgt-filter-pill.is-active {
    background: #EEF4F8;
    border-color: #9FB8C8;
    color: #426781;
}
.lgt-filter-check.is-active::before {
    background: #557C9A;
}
.lgt-active-filter-chip:hover {
    background: #EEF4F8;
    border-color: #9FB8C8;
    color: #426781;
}
.lgt-active-filters__clear {
    color: #557C9A;
}
.lgt-filter-view-results {
    background: #557C9A;
    box-shadow: 0 4px 10px rgba(85,124,154,.16);
}
.lgt-filter-view-results:active {
    background: #426781;
}
.lgt-filter-results.is-loading:after {
    border-top-color: #557C9A;
}
.lgt-mobile-filter-badge {
    background: #557C9A;
}


/* =========================================================
   LGT AJAX PRODUCT FILTER 1.2.2
   Mobile bottom sheet must sit above Yozi fixed bottom navigation.
   No filtering/AJAX logic changes.
========================================================= */
@media (max-width: 767px) {
    .lgt-product-filter.is-sheet-open {
        position: relative;
        z-index: 100000;
    }

    .lgt-product-filter.is-sheet-open .lgt-filter-backdrop {
        z-index: 100000;
    }

    .lgt-product-filter.is-sheet-open .lgt-filter-panel {
        z-index: 100001;
        padding-bottom: calc(24px + env(safe-area-inset-bottom));
    }

    /* Keep the bottom action area clear and fully tappable above the panel content. */
    .lgt-filter-mobile-actions {
        position: sticky;
        bottom: 0;
        z-index: 3;
        margin: 16px -17px calc(-16px - env(safe-area-inset-bottom));
        padding: 12px 17px calc(12px + env(safe-area-inset-bottom));
        background: linear-gradient(
            to bottom,
            rgba(255,255,255,0),
            rgba(255,255,255,.96) 18%,
            #fff 45%
        );
    }
}
