/* ==========================================================================
   TTG Shop — landing + browse (SHOP-1/2/3)
   Loaded by inc/shop.php on shop, category, tag and product-search contexts.
   Scoped to .ttg-shop-landing / .ttg-shop-browse (+ .woocommerce) so nothing leaks to other pages.
   Tokens come from theme.css :root (--ttg-*) and theme.json presets.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Shared section scaffolding (landing)
   -------------------------------------------------------------------------- */
.ttg-shop-landing .ttg-shop-depts,
.ttg-shop-landing .ttg-shop-best,
.ttg-shop-landing .ttg-shop-recent { padding-block: clamp(40px, 5vw, 68px); }

.ttg-shop-sec__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 24px; margin: 0 0 clamp(20px, 2.6vw, 30px); }
.ttg-shop-sec__head h2 { font: 600 clamp(24px, 2.6vw, 34px)/1.15 var(--ttg-heading); color: var(--ttg-ink); margin: 0; }
.ttg-shop-sec__sub { color: var(--ttg-gray); font-size: 15.5px; margin: 0; max-width: 60ch; }
.ttg-shop-sec__link { display: inline-flex; align-items: center; gap: 6px; color: var(--ttg-red-dark, #b80000); font-weight: 600; font-size: 14.5px; text-decoration: none; white-space: nowrap; }
.ttg-shop-sec__link:hover { color: #000; }
.ttg-shop-sec__link .ttg-icon,
.ttg-shop-sec__head .ttg-icon { width: .85em; height: .85em; }

/* --------------------------------------------------------------------------
   1. Hero + prominent search (SHOP-1.1)
   -------------------------------------------------------------------------- */
.ttg-shop-hero { position: relative; background: #0b0b0b radial-gradient(ellipse at 88% -10%, rgba(255, 0, 0, .28), transparent 58%); color: #fff; padding: clamp(60px, 8vw, 104px) 0 clamp(52px, 6vw, 84px); overflow: hidden; }
.ttg-shop-hero::after { content: ""; position: absolute; inset: auto 0 0 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255, 0, 0, .55), transparent); }
.ttg-shop-hero .ttg-eyebrow { color: #ff4a4a; margin: 0 0 10px; }
.ttg-shop-hero h1 { color: #fff; font: 700 clamp(32px, 4.4vw, 52px)/1.08 var(--ttg-heading); margin: 0 0 12px; max-width: 16ch; text-wrap: balance; }
.ttg-shop-hero__lead { color: rgba(255, 255, 255, .8); font-size: clamp(16px, 1.4vw, 19px); line-height: 1.55; margin: 0 0 clamp(24px, 3vw, 34px); max-width: 52ch; }

.ttg-shop-search { display: flex; align-items: center; gap: 8px; }
.ttg-shop-search--hero { max-width: 720px; background: #fff; border-radius: 12px; padding: 7px 7px 7px 18px; box-shadow: 0 24px 60px rgba(0, 0, 0, .35); }
.ttg-shop-search--hero > .ttg-icon { color: #888; font-size: 20px; flex: none; }
.ttg-shop-search--hero .ttg-shop-search__input { flex: 1; min-width: 0; border: 0; background: transparent; font: 500 17px var(--ttg-body); color: #111; padding: 13px 6px; }
.ttg-shop-search--hero .ttg-shop-search__input:focus { outline: none; }
.ttg-shop-search--hero .ttg-shop-search__btn { flex: none; padding: 14px 26px; font-size: 15px; }

.ttg-shop-hero__all { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; color: #fff; font-weight: 500; font-size: 15px; text-decoration: none; opacity: .9; }
.ttg-shop-hero__all:hover { opacity: 1; color: #fff; gap: 11px; }
.ttg-shop-hero__all .ttg-icon { width: .9em; height: .9em; color: #ff4a4a; }

/* --------------------------------------------------------------------------
   2. Departments (SHOP-1.2)
   -------------------------------------------------------------------------- */
.ttg-shop-depts__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
@media (max-width: 900px) { .ttg-shop-depts__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .ttg-shop-depts__grid { grid-template-columns: 1fr; } }

.ttg-shop-dept { position: relative; height: 100%; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto 1fr auto; gap: 2px 18px; padding: 26px 24px; border: 1px solid #e6e8eb; border-radius: 14px; background: #fff; color: #111; text-decoration: none; overflow: hidden; transition: box-shadow .2s, transform .2s, border-color .2s; }
.ttg-shop-dept::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--ttg-red); transform: scaleX(0); transform-origin: left; transition: transform .25s ease; }
.ttg-shop-dept:hover { box-shadow: 0 18px 44px rgba(0, 0, 0, .1); transform: translateY(-3px); border-color: #dadce0; }
.ttg-shop-dept:hover::before { transform: scaleX(1); }
.ttg-shop-dept .ttg-ibox-icon { grid-row: 1 / span 4; align-self: start; width: 54px; height: 54px; border-radius: 13px; font-size: 24px; }
.ttg-shop-dept strong { grid-column: 2; font: 600 18px/1.3 var(--ttg-heading); color: var(--ttg-ink); }
.ttg-shop-dept__desc { grid-column: 2; color: var(--ttg-gray); font-size: 14px; line-height: 1.5; margin-top: 4px; }
.ttg-shop-dept__count { grid-column: 2; align-self: end; display: inline-flex; align-items: center; gap: 6px; margin-top: 16px; font: 600 13px var(--ttg-body); color: var(--ttg-red-dark, #b80000); }
.ttg-shop-dept__count .ttg-icon { width: .9em; height: .9em; transition: transform .2s; }
.ttg-shop-dept:hover .ttg-shop-dept__count .ttg-icon { transform: translateX(3px); }

/* --------------------------------------------------------------------------
   3. Best sellers — compact cards (SHOP-1.3)  |  4. Recently added (SHOP-1.4)
   -------------------------------------------------------------------------- */
.ttg-shop-best { background: var(--ttg-light, #f3f3f3); }
.ttg-shop-best.ttg-container,
.ttg-shop-recent.ttg-container { max-width: calc(var(--ttg-container) + var(--ttg-gutter) * 2); }
/* The grey best-sellers band spans full width while its content stays in the container. */
.ttg-shop-landing .ttg-shop-best { max-width: none; width: 100%; padding-inline: 0; background: var(--ttg-light, #f3f3f3); }
.ttg-shop-landing .ttg-shop-best > * { max-width: var(--ttg-container); margin-inline: auto; padding-inline: var(--ttg-gutter); }

/* Recently-added uses the standard 4-up product grid (12 items = 3/4/6 even rows). */
.ttg-shop-recent ul.products { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1024px) { .ttg-shop-recent ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .ttg-shop-recent ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Compact best-seller cards: ~6-up, smaller imagery and type than default. */
.ttg-shop-grid--compact ul.products { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 18px 16px; margin-bottom: 0; }
@media (max-width: 1100px) { .ttg-shop-grid--compact ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) { .ttg-shop-grid--compact ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.ttg-shop-grid--compact ul.products li.product { padding: 10px 10px 14px; border-radius: 10px; }
.ttg-shop-grid--compact ul.products li.product a img { margin-bottom: 9px; border-radius: 6px; }
.ttg-shop-grid--compact ul.products li.product .woocommerce-loop-product__title { font-size: 13px; line-height: 1.3; margin-bottom: 4px; }
.ttg-shop-grid--compact ul.products li.product .price { font-size: 13.5px; margin-bottom: 0; }
.ttg-shop-grid--compact ul.products li.product .price del { font-size: 12px; }
.ttg-shop-grid--compact ul.products li.product .button { margin-top: 10px; padding: 7px 12px; font-size: 12.5px; }
.ttg-shop-grid--compact ul.products li.product .star-rating { display: none; }

/* --------------------------------------------------------------------------
   Trust strip
   -------------------------------------------------------------------------- */
.ttg-shop-value { background: #0b0b0b; color: #fff; }
.ttg-shop-value ul { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px 40px; padding-block: clamp(30px, 4vw, 44px); margin-block: 0; }
@media (max-width: 781px) { .ttg-shop-value ul { grid-template-columns: 1fr; } }
.ttg-shop-value li { display: flex; gap: 14px; align-items: flex-start; }
.ttg-shop-value .ttg-icon { color: #ff4a4a; font-size: 20px; margin-top: 2px; flex: none; }
.ttg-shop-value span { display: grid; gap: 3px; font-size: 14.5px; color: rgba(255, 255, 255, .72); line-height: 1.5; }
.ttg-shop-value strong { color: #fff; font: 600 16px var(--ttg-heading); }
.ttg-shop-value a { color: #ff6a6a; font-weight: 600; text-decoration: none; }
.ttg-shop-value a:hover { color: #fff; }

/* ==========================================================================
   Browse: left sidebar + product grid (SHOP-2) & alignment (SHOP-3)
   ========================================================================== */
.ttg-shop-browse { display: grid; grid-template-columns: 264px minmax(0, 1fr); gap: clamp(40px, 4vw, 64px); align-items: start; padding-block: clamp(26px, 3.4vw, 44px) clamp(44px, 6vw, 80px); }
@media (max-width: 900px) { .ttg-shop-browse { grid-template-columns: 1fr; gap: 24px; } }

/* --- Sidebar --- */
/* Inset the sidebar content from the right so the search box, category rows and count badges
   (and the current-item highlight) sit comfortably inside the column with a clear gutter to the grid. */
.ttg-shop-sidebar { position: sticky; top: calc(var(--ttg-header-h) + 18px); display: grid; gap: 26px; padding-right: 14px; }
@media (max-width: 900px) { .ttg-shop-sidebar { padding-right: 0; } }
.admin-bar .ttg-shop-sidebar { top: calc(var(--ttg-header-h) + 50px); }
@media (max-width: 900px) { .ttg-shop-sidebar { position: static; } }
.ttg-shop-sidebar__title { font: 600 12px/1 var(--ttg-body); letter-spacing: .14em; text-transform: uppercase; color: var(--ttg-gray); margin: 0 0 14px; }

.ttg-shop-search--sidebar { background: #fff; border: 1px solid #d7dbe0; border-radius: 10px; padding: 4px 4px 4px 12px; }
.ttg-shop-search--sidebar > .ttg-icon { color: #999; font-size: 16px; flex: none; }
.ttg-shop-search--sidebar .ttg-shop-search__input { flex: 1; min-width: 0; border: 0; background: transparent; font: 400 14.5px var(--ttg-body); color: #111; padding: 9px 4px; }
.ttg-shop-search--sidebar .ttg-shop-search__input:focus { outline: none; }
.ttg-shop-search--sidebar .ttg-shop-search__btn { flex: none; padding: 9px 14px; font-size: 13px; }

/* Category nav */
.ttg-shop-catnav__list { list-style: none; margin: 0; padding: 0; }
.ttg-shop-catnav__list a { display: flex; align-items: center; justify-content: space-between; gap: 10px; text-decoration: none; color: #2a2f36; font-size: 14.5px; line-height: 1.35; padding: 8px 12px; border-radius: 7px; transition: background-color .15s, color .15s; }
/* Let a long label wrap/shrink inside the row so the count badge never pushes past the sidebar. */
.ttg-shop-catnav__list a > span:first-child { min-width: 0; }
.ttg-shop-catnav__list a:hover { background: #f3f4f6; color: #000; }
.ttg-shop-catnav__all a { font-weight: 600; }
.ttg-shop-catnav__all.is-current > a,
.ttg-shop-catnav__link.is-current { background: rgba(255, 0, 0, .08); color: var(--ttg-red-dark, #b80000); font-weight: 600; }
.ttg-shop-catnav__dept > .ttg-shop-catnav__link { font-weight: 500; }
.ttg-shop-catnav__count { flex: none; font-size: 12px; font-weight: 600; color: #9aa0a6; }
.ttg-shop-catnav__link.is-current .ttg-shop-catnav__count,
.ttg-shop-catnav__sub a.is-current .ttg-shop-catnav__count { color: inherit; }
.ttg-shop-catnav__sub { list-style: none; margin: 2px 0 6px; padding: 0 0 0 10px; border-left: 1px solid #ebedf0; }
.ttg-shop-catnav__sub a { font-size: 13.5px; color: #596069; padding: 6px 10px; }
.ttg-shop-catnav__sub a.is-current { background: rgba(255, 0, 0, .08); color: var(--ttg-red-dark, #b80000); font-weight: 600; }

/* Filter Everything Pro slot */
.ttg-shop-filters__placeholder { margin: 0; padding: 14px; border: 1px dashed #c9ced4; border-radius: 8px; background: #fafbfc; color: var(--ttg-gray); font-size: 12.5px; line-height: 1.5; }
.ttg-shop-widget + .ttg-shop-widget { margin-top: 18px; }
.ttg-shop-widget__title { font: 600 13px var(--ttg-heading); color: var(--ttg-ink); margin: 0 0 10px; }

/* --- Main column --- */
.ttg-shop-breadcrumb { color: var(--ttg-gray); font-size: 13px; margin: 0 0 14px; }
.ttg-shop-breadcrumb a { color: var(--ttg-gray); text-decoration: none; }
.ttg-shop-breadcrumb a:hover { color: var(--ttg-red-dark, #b80000); }

.ttg-shop-main__head { margin: 0 0 22px; padding: 0 0 18px; border-bottom: 1px solid #ececec; }
.ttg-shop-browse .woocommerce-products-header__title { font: 700 clamp(26px, 3vw, 38px)/1.12 var(--ttg-heading); color: var(--ttg-ink); margin: 0; }
.ttg-shop-browse .term-description { color: var(--ttg-gray); font-size: 15px; line-height: 1.6; max-width: 72ch; margin: 12px 0 0; }

/* Toolbar: result count (left) + ordering (right), above the grid */
.ttg-shop-browse .woocommerce-result-count { display: inline-block; float: left; margin: 0 0 18px; color: var(--ttg-gray); font-size: 13.5px; line-height: 40px; }
.ttg-shop-browse .woocommerce-ordering { display: inline-block; float: right; margin: 0 0 18px; }
.ttg-shop-browse ul.products { clear: both; }

/* Browse grid: 3-up inside the sidebar layout, never flush to the edge */
.ttg-shop-browse .ttg-shop-main ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px 22px; }
@media (max-width: 1200px) { .ttg-shop-browse .ttg-shop-main ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .ttg-shop-browse .ttg-shop-main ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 680px) { .ttg-shop-browse .ttg-shop-main ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 14px; } }

/* Subcategory tiles (when a category shows its children as cards) */
.ttg-shop-browse ul.products li.product-category a { display: grid; gap: 6px; text-decoration: none; color: #111; }
.ttg-shop-browse ul.products li.product-category img { aspect-ratio: 16 / 10; object-fit: cover; border-radius: 8px; }

/* Pagination stays left-aligned under the grid */
.ttg-shop-browse nav.woocommerce-pagination { margin-top: 8px; text-align: left; }

/* "No products" message */
.ttg-shop-main .woocommerce-info { margin-top: 8px; }

/* ==========================================================================
   Filter Everything Pro — restyled to MIRROR the Categories widget (SHOP-4)
   The plugin's default widget output is re-skinned with the exact section-header,
   row, count, active-tint, hover and sub-list language of .ttg-shop-catnav above
   it, so the whole left column reads as one cohesive sidebar. Scoped to the
   .ttg-shop-filters slot so no other Filter Everything instance is affected.
   ========================================================================== */

/* Strip the plugin's own widget chrome (frames, paddings, shadows, spinner). */
.ttg-shop-filters .widget.widget_wpc_filters_widget,
.ttg-shop-filters .wpc-filters-main-wrap,
.ttg-shop-filters .wpc-filters-widget-content,
.ttg-shop-filters .wpc-filters-widget-containers-wrapper,
.ttg-shop-filters .wpc-filters-widget-top-container,
.ttg-shop-filters .wpc-filters-widget-middle-container,
.ttg-shop-filters .wpc-filters-widget-bottom-container,
.ttg-shop-filters .wpc-widget-top-inside,
.ttg-shop-filters .wpc-filter-content { margin: 0; padding: 0; border: 0; background: none; box-shadow: none; }

/* Chrome that only belongs to the mobile popup / loading states. */
.ttg-shop-filters .wpc-spinner { display: none; }
/* On desktop the filters are inline, so hide the plugin's mobile-popup trigger + its popup header/close.
   Below 901px FEP switches to its popup (same markup, re-skinned by the rules above), so leave them visible there. */
@media (min-width: 901px) {
	.ttg-shop-filters .wpc-filters-open-button-container,
	.ttg-shop-filters .wpc-widget-close-container { display: none; }
}
/* Mobile popup chrome, on-brand. */
.ttg-shop-filters .wpc-filters-open-widget { display: inline-flex; align-items: center; gap: 8px; border: 1px solid #d7dbe0; border-radius: 10px; padding: 10px 16px; font: 600 14px var(--ttg-body); color: var(--ttg-ink); background: #fff; text-decoration: none; }
.ttg-shop-filters .wpc-widget-popup-title { justify-content: center; font: 600 16px var(--ttg-heading); color: var(--ttg-ink); }
.ttg-shop-filters .wpc-filters-close-button { display: inline-flex; align-items: center; justify-content: center; border: 1px solid #d7dbe0; border-radius: var(--ttg-radius, 8px); background: #fff; color: var(--ttg-ink); font: 600 14px var(--ttg-body); padding: 11px 18px; text-decoration: none; cursor: pointer; }
.ttg-shop-filters .wpc-filters-close-button:hover { border-color: var(--ttg-slate); }

/* Each facet is a sidebar block with the same rhythm as a catnav section. */
.ttg-shop-filters .wpc-filters-section { margin: 0 0 24px; }
.ttg-shop-filters .wpc-filters-section:last-child { margin-bottom: 0; }

/* Facet title ("Product categories", "Price", "Product tags") == .ttg-shop-sidebar__title. */
.ttg-shop-filters .wpc-filter-header { margin: 0 0 10px; padding: 0; border: 0; background: none; }
.ttg-shop-filters .wpc-filter-title,
.ttg-shop-filters .widget-title.wpc-filter-title { font: 600 12px/1 var(--ttg-body); letter-spacing: .14em; text-transform: uppercase; color: var(--ttg-gray); margin: 0; }

/* Term list — mirror .ttg-shop-catnav__list; cap long lists with a tidy scroll. */
.ttg-shop-filters .wpc-filters-ul-list { list-style: none; margin: 0; padding: 0; }
.ttg-shop-filters .wpc-filter-product_cat .wpc-filters-ul-list,
.ttg-shop-filters .wpc-filter-product_tag .wpc-filters-ul-list { max-height: 326px; overflow-y: auto; padding-right: 4px; }
.ttg-shop-filters .wpc-filters-ul-list::-webkit-scrollbar { width: 8px; }
.ttg-shop-filters .wpc-filters-ul-list::-webkit-scrollbar-thumb { background: #dce0e5; border-radius: 8px; }
.ttg-shop-filters .wpc-filters-ul-list { scrollbar-width: thin; scrollbar-color: #dce0e5 transparent; }
.ttg-shop-filters .wpc-term-item { margin: 0; padding: 0; }

/* Row == .ttg-shop-catnav__list a: padded, rounded, hover tint. */
.ttg-shop-filters .wpc-term-item-content-wrapper { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-radius: 7px; transition: background-color .15s, color .15s; }
.ttg-shop-filters .wpc-term-item-content-wrapper:hover { background: #f3f4f6; }
.ttg-shop-filters .wpc-term-item label { flex: 1; min-width: 0; margin: 0; cursor: pointer; }
.ttg-shop-filters .wpc-term-item label a,
.ttg-shop-filters .wpc-term-item label > span:first-child { display: flex; flex: 1; min-width: 0; align-items: center; justify-content: space-between; gap: 10px; text-decoration: none; color: #2a2f36; font-size: 14.5px; line-height: 1.35; }
.ttg-shop-filters .wpc-term-item-content-wrapper:hover label a { color: #000; }

/* Count == .ttg-shop-catnav__count (muted, right-aligned). */
.ttg-shop-filters .wpc-term-count { flex: none; font-size: 12px; font-weight: 600; color: #9aa0a6; }

/* Checked row == .is-current: soft red tint + red text, red count. */
.ttg-shop-filters .wpc-term-item:has(input:checked) > .wpc-term-item-content-wrapper { background: rgba(255, 0, 0, .08); }
.ttg-shop-filters .wpc-term-item:has(input:checked) > .wpc-term-item-content-wrapper label a { color: var(--ttg-red-dark, #b80000); font-weight: 600; }
.ttg-shop-filters .wpc-term-item:has(input:checked) > .wpc-term-item-content-wrapper .wpc-term-count { color: inherit; }

/* Custom checkbox, on-brand. */
.ttg-shop-filters .wpc-term-item input[type="checkbox"] { appearance: none; -webkit-appearance: none; flex: none; width: 18px !important; height: 18px !important; margin: 0; border: 1.5px solid #c7ccd3 !important; border-radius: 5px; background: #fff !important; cursor: pointer; position: relative; transition: background-color .15s, border-color .15s; }
.ttg-shop-filters .wpc-term-item input[type="checkbox"]:hover { border-color: var(--ttg-red-dark, #b80000) !important; }
.ttg-shop-filters .wpc-term-item input[type="checkbox"]:checked { background: var(--ttg-red-dark, #b80000) !important; border-color: var(--ttg-red-dark, #b80000) !important; }
.ttg-shop-filters .wpc-term-item input[type="checkbox"]:checked::after { content: ""; position: absolute; left: 5px; top: 1.5px; width: 5px; height: 9px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.ttg-shop-filters .wpc-term-item input[type="checkbox"]:focus-visible { outline: 2px solid var(--ttg-slate); outline-offset: 2px; }

/* Nested sub-terms == .ttg-shop-catnav__sub (indent + left rule, smaller muted rows). */
.ttg-shop-filters .wpc-filters-sub-fields { list-style: none; margin: 2px 0 6px; padding: 0 0 0 10px; border-left: 1px solid #ebedf0; }
.ttg-shop-filters .wpc-filters-sub-fields .wpc-term-item label a,
.ttg-shop-filters .wpc-filters-sub-fields .wpc-term-item label > span:first-child { font-size: 13.5px; color: #596069; }

/* "See more / less" term toggles. */
.ttg-shop-filters .wpc-term-toggle-button,
.ttg-shop-filters [class*="show-more"],
.ttg-shop-filters [class*="show-less"] { display: inline-block; margin: 6px 0 0 12px; font: 600 12.5px var(--ttg-body); color: var(--ttg-red-dark, #b80000); text-decoration: none; cursor: pointer; background: none; border: 0; padding: 0; }
.ttg-shop-filters .wpc-term-toggle-button:hover { text-decoration: underline; }

/* Within-facet term search box == the sidebar search field. */
.ttg-shop-filters .wpc-search-field-wrapper { margin: 0 0 10px; }
.ttg-shop-filters .wpc-search-field { width: 100%; box-sizing: border-box; border: 1px solid #d7dbe0; border-radius: 10px; padding: 9px 12px; font: 400 14px var(--ttg-body); color: #111; background: #fff; }
.ttg-shop-filters .wpc-search-field:focus { outline: none; border-color: var(--ttg-slate); }

/* ---- Price facet: min/max inputs + jQuery-UI slider, branded ---- */
.ttg-shop-filters .wpc-filters-range-wrapper { display: flex; align-items: center; gap: 10px; }
.ttg-shop-filters .wpc-filters-range-column { flex: 1; min-width: 0; position: relative; }
.ttg-shop-filters .wpc-filters-range-min,
.ttg-shop-filters .wpc-filters-range-max { width: 100%; box-sizing: border-box; border: 1px solid #d7dbe0; border-radius: 10px; padding: 9px 12px; font: 500 14px var(--ttg-body); color: #111; background: #fff; }
.ttg-shop-filters .wpc-filters-range-min:focus,
.ttg-shop-filters .wpc-filters-range-max:focus { outline: none; border-color: var(--ttg-slate); }
.ttg-shop-filters .wpc-filters-range-column::before { content: "$"; position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: #9aa0a6; font: 500 14px var(--ttg-body); pointer-events: none; }
.ttg-shop-filters .wpc-filters-range-min,
.ttg-shop-filters .wpc-filters-range-max { padding-left: 22px; }
.ttg-shop-filters .wpc-range-clear { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); border: 0; background: none; color: #9aa0a6; cursor: pointer; font-size: 16px; line-height: 1; }

/* The plugin skins the jQuery-UI slider blue from a later-loaded stylesheet at equal specificity, so brand it with !important. */
.ttg-shop-filters .wpc-filters-range-slider-wrapper { padding: 14px 8px 4px; }
.ttg-shop-filters .wpc-filters-range-slider-control.ui-slider { position: relative; height: 5px; background: #e5e8ec !important; border: 0 !important; border-radius: 999px; }
.ttg-shop-filters .wpc-filters-range-slider-control .ui-slider-range { position: absolute; top: 0; height: 100%; background: var(--ttg-red-dark, #b80000) !important; border: 0 !important; border-radius: 999px; }
.ttg-shop-filters .wpc-filters-range-slider-control .ui-slider-handle { position: absolute; top: 50%; width: 16px; height: 16px; margin-left: -8px; transform: translateY(-50%); background: #fff !important; border: 3px solid var(--ttg-red-dark, #b80000) !important; border-radius: 50%; box-shadow: 0 1px 4px rgba(0, 0, 0, .2); cursor: grab; outline: none; }
.ttg-shop-filters .wpc-filters-range-slider-control .ui-slider-handle:focus-visible { box-shadow: 0 0 0 3px rgba(184, 0, 0, .25); }
.ttg-shop-filters .wpc-filters-range-slider-control .ui-slider-handle:active { cursor: grabbing; }

/* Active-filter chips == small red-tint pills. */
.ttg-shop-filters .wpc-filter-chips-list { list-style: none; display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; padding: 0; }
.ttg-shop-filters .wpc-filter-chips-list.wpc-empty-chips-container { margin: 0; }
.ttg-shop-filters .wpc-filter-chips-list .wpc-chip-item,
.ttg-shop-filters .wpc-filter-chips-list > li { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; background: rgba(255, 0, 0, .08); color: var(--ttg-red-dark, #b80000); font: 600 12.5px var(--ttg-body); }
.ttg-shop-filters .wpc-filter-chips-list a,
.ttg-shop-filters .wpc-filter-chips-list .wpc-chip-remove { color: inherit; text-decoration: none; cursor: pointer; }

/* Apply / reset controls. */
.ttg-shop-filters .wpc-filters-widget-controls { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
/* Apply/"Show" button — plugin paints it blue from a later sheet, so brand it with !important. */
.ttg-shop-filters .wpc-filters-apply-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex: 1; min-width: 140px; background: var(--ttg-red-dark, #b80000) !important; color: #fff !important; border: 0 !important; border-radius: var(--ttg-radius, 8px); font: 600 14px var(--ttg-body); padding: 11px 18px; text-decoration: none; cursor: pointer; transition: background-color .2s; }
.ttg-shop-filters .wpc-filters-apply-button:hover { background: #000 !important; color: #fff !important; }
.ttg-shop-filters .wpc-reset-button,
.ttg-shop-filters .wpc-filters-reset-button { display: inline-flex; align-items: center; color: var(--ttg-gray); font: 600 13px var(--ttg-body); text-decoration: none; cursor: pointer; }
.ttg-shop-filters .wpc-reset-button:hover,
.ttg-shop-filters .wpc-filters-reset-button:hover { color: var(--ttg-red-dark, #b80000); }