#ll-products > [hidden], .ll-applied-row[hidden], #ll-no-products[hidden] { display: none !important; }
.ll-filter-toolbar { padding: 0; margin-bottom: 24px; gap: 16px; }
.ll-filter-toolbar .tf-btn-filter { background: transparent; }
.ll-filter-toolbar #ll-product-count { color: var(--text-secondary, #626262); }
.ll-applied-row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-bottom: 28px; }
#ll-applied-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.ll-filter-chip { display: inline-flex; align-items: center; gap: 10px; padding: 6px 12px; border: 1px solid var(--line); border-radius: 24px; background: transparent; }
#filterShop { width: min(420px, 100vw); }
#filterShop .canvas-wrapper { min-height: 0; }
#filterShop .canvas-body { flex: 1; overflow-y: auto; }
#filterShop .canvas-header button { background: transparent; border: 0; padding: 8px; }
#filterShop legend { float: none; font-size: 18px; width: auto; }
.ll-colour-option { position: relative; display: inline-flex; align-items: center; gap: 8px; cursor: pointer; border: 1px solid var(--line); border-radius: 1000px; padding: 8px 12px; }
.ll-colour-option input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.ll-colour-option:has(input:checked) { border-color: var(--main); background: #f5f3ef; }
.ll-colour-option:has(input:focus-visible) { outline: 2px solid var(--main); outline-offset: 3px; }
.ll-swatch { width: 20px; height: 20px; border-radius: 50%; background: var(--swatch); display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ll-colour-option:has(input:checked) .ll-swatch::after { content: '✓'; font-size: 14px; color: #272727; }
.ll-colour-total { font-size: 12px; color: #626262; }
.ll-filter-hint { margin-top: 20px; color: #626262; font-size: 14px; }
.ll-filter-bottom { display: flex; flex-direction: column; gap: 12px; }
#filterShop .ll-reset { background: transparent; text-decoration: underline; padding: 8px; }
#ll-no-products { padding: 32px 0; }
@media (max-width: 575px) { .ll-filter-toolbar { flex-direction: row; justify-content: space-between; } }

/* Product views, matching the controls in product-style-01.html. */
.ll-filter-toolbar { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.ll-filter-toolbar #ll-product-count { justify-self: end; text-align: right; }
.ll-layout-switcher { display: flex; align-items: center; gap: 8px; }
.ll-view-switch { display: flex; align-items: center; justify-content: center; min-width: 40px; min-height: 44px; background: transparent; border: 0; border-radius: 4px; padding: 7px; }
.ll-view-switch svg { flex-shrink: 0; }
.ll-view-switch svg circle, .ll-view-switch svg rect { fill: none; stroke: var(--main, #181818); }
.ll-view-switch[aria-pressed="true"] svg circle, .ll-view-switch[aria-pressed="true"] svg rect { fill: var(--main, #181818); }
.ll-view-switch:focus-visible { outline: 2px solid var(--main, #181818); outline-offset: 2px; }
.ll-view-switch:hover { background: #f5f3ef; }
#ll-products[data-view="list"] { grid-template-columns: minmax(0, 1fr); }
#ll-products[data-view="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
#ll-products[data-view="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#ll-products[data-view="4"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
#ll-products > .blog-article-item { min-width: 0; }
#ll-products[data-view="list"] > .blog-article-item { display: grid; grid-template-columns: minmax(160px, 28%) minmax(0, 1fr); align-items: center; gap: 32px; padding-bottom: 28px; border-bottom: 1px solid var(--line); }
#ll-products[data-view="list"] .article-thumb { margin-bottom: 0; }
#ll-products[data-view="list"] .article-content { padding: 0; }
@media (max-width: 991px) {
    .ll-view-switch[data-product-view="4"] { display: none; }
    #ll-products[data-view="4"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
    .ll-filter-toolbar { grid-template-columns: 1fr auto; row-gap: 12px; }
    .ll-filter-toolbar #ll-product-count { grid-column: 1 / -1; justify-self: start; text-align: left; }
    .ll-view-switch[data-product-view="3"] { display: none; }
    #ll-products[data-view="3"], #ll-products[data-view="4"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #ll-products[data-view="list"] > .blog-article-item { grid-template-columns: minmax(100px, 36%) minmax(0, 1fr); gap: 16px; }
    #ll-products[data-view="list"] .article-title { font-size: 18px; line-height: 1.35; }
}

#filterShop .ll-age-facet, #filterShop .ll-character-facet { margin-top: 32px; }
.ll-age-options { display: flex; flex-wrap: wrap; gap: 12px; }
.ll-age-option { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 24px; cursor: pointer; }
.ll-age-option:has(input:checked) { border-color: var(--main); background: #f5f3ef; }
.ll-age-option:has(input:focus-visible) { outline: 2px solid var(--main); outline-offset: 3px; }
.ll-age-option .tf-check { margin: 0; flex-shrink: 0; }