/* Left shop sidebar (search / product categories / price filter) + the
   sort-preset pill row above the product grid — shop/category/tag archives
   only. Storefront's native `storefront_layout` theme mod (set to "left")
   already moves #secondary before #primary visually; this file only
   restyles what's inside it to match our navy/orange palette instead of
   Storefront's stock look (plain list + pink price slider). */


#secondary.widget-area {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

#secondary.widget-area .widget {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 18px 20px;
	margin: 0;
}

#secondary.widget-area .widget-title,
#secondary.widget-area .widget > h2 {
	font-size: 0.95rem;
	font-weight: 700;
	color: var(--ink);
	margin: 0 0 12px;
	padding: 0 0 10px;
	border-bottom: 1px solid var(--line);
}

/* Search widget */
#secondary.widget-area .wp-block-search__inside-wrapper {
	border: 1px solid var(--line);
	border-radius: 8px;
	overflow: hidden;
}
#secondary.widget-area .wp-block-search__input {
	border: none;
	padding: 10px 12px;
	font-size: 0.9rem;
	flex: 1;
}
#secondary.widget-area .wp-block-search__button {
	background: var(--accent);
	color: var(--ink);
	border: none;
	padding: 0 16px;
	font-weight: 700;
	border-radius: 0;
}
#secondary.widget-area .wp-block-search__button:hover {
	background: var(--accent-strong);
}

/* Product categories widget */
#secondary.widget-area .widget_product_categories ul.product-categories,
#secondary.widget-area .widget_product_categories ul.children {
	list-style: none;
	margin: 0;
	padding: 0;
}
#secondary.widget-area .widget_product_categories ul.children {
	padding-left: 14px;
	margin-top: 2px;
}
#secondary.widget-area .widget_product_categories li {
	border-bottom: 1px solid var(--line);
}
#secondary.widget-area .widget_product_categories li:last-child {
	border-bottom: none;
}
#secondary.widget-area .widget_product_categories a {
	display: block;
	padding: 7px 2px;
	text-decoration: none;
	color: var(--ink);
	font-size: 0.88rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.01em;
}
#secondary.widget-area .widget_product_categories ul li::before {
	content: none;
}
#secondary.widget-area .widget_product_categories a::before {
	content: "\00bb";
	margin-right: 6px;
	color: var(--accent);
	font-weight: 700;
	font-family: inherit;
}
#secondary.widget-area .widget_product_categories a:hover {
	color: var(--accent-strong);
}
#secondary.widget-area .widget_product_categories li.current-cat > a {
	color: var(--accent-strong);
	font-weight: 700;
}
#secondary.widget-area .widget_product_categories li {
	border-bottom: none;
}
#secondary.widget-area .widget-title,
#secondary.widget-area .widget > h2 {
	text-transform: uppercase;
}

/* Price filter widget — override Storefront/WooCommerce's default pink slider */
#secondary.widget-area .widget_price_filter .price_slider_amount .button {
	background: var(--accent);
	border-radius: 8px;
	color: var(--ink);
	font-weight: 700;
}
#secondary.widget-area .widget_price_filter .price_slider_amount .button:hover {
	background: var(--accent-strong);
}
#secondary.widget-area .widget_price_filter .ui-slider {
	background: var(--surface-2);
}
#secondary.widget-area .widget_price_filter .ui-slider .ui-slider-range {
	background: var(--accent);
}
#secondary.widget-area .widget_price_filter .ui-slider .ui-slider-handle {
	background: var(--accent-strong);
	border-color: var(--accent-strong);
}
#secondary.widget-area .widget_price_filter input#min_price,
#secondary.widget-area .widget_price_filter input#max_price {
	border: 1px solid var(--line);
	border-radius: 6px;
	padding: 6px 8px;
	font-size: 0.85rem;
}

/* --- Sort-preset pill row (theme/inc/shop-sort.php), sits inside
   Storefront's .storefront-sorting wrapper alongside the sort dropdown --- */
.pcseal-sort-pills {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 14px;
}
.pcseal-sort-pill {
	display: inline-block;
	padding: 7px 16px;
	border-radius: 999px;
	border: 1px solid var(--line);
	background: var(--surface);
	color: var(--ink);
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.pcseal-sort-pill:hover {
	border-color: var(--accent);
	color: var(--accent-strong);
}
.pcseal-sort-pill.is-active {
	background: var(--accent);
	border-color: var(--accent);
	color: var(--ink);
}
.pcseal-sort-pill.is-active:hover {
	background: var(--accent-strong);
	border-color: var(--accent-strong);
	color: var(--ink);
}

/* --- Filter-pill panel (theme/inc/shop-filter.php), rendered directly
   below the sort pills above the product grid --- */
.pcseal-filter-panel {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0 0 14px;
	background: var(--glass-bg);
	border: 1px solid var(--glass-border);
}
.pcseal-filter-group {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}
.pcseal-filter-group__label {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--ink);
	margin-right: 2px;
}
.pcseal-filter-pill {
	display: inline-block;
	padding: 7px 16px;
	border-radius: 999px;
	border: 1px solid var(--line);
	background: var(--surface);
	color: var(--ink);
	font-size: 0.85rem;
	font-weight: 600;
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.pcseal-filter-pill:hover {
	border-color: var(--accent);
	color: var(--accent-strong);
}
.pcseal-filter-pill.is-active {
	background: var(--accent);
	border-color: var(--accent);
	color: var(--ink);
}
.pcseal-filter-pill.is-active:hover {
	background: var(--accent-strong);
	border-color: var(--accent-strong);
	color: var(--ink);
}