/* ============================================================
   CATEGORY FILTER TABS BAR STYLING (BELOW PRODUCTS HEADER)
   ============================================================ */

.sd-cat-tabs-container {
	width: 100% !important;
	margin-block: 15px !important;
	position: relative !important;
	box-sizing: border-box !important;
	font-family: inherit !important;
}

.sd-cat-tabs-wrapper {
	display: flex !important;
	align-items: center !important;
	gap: 10px !important;
	overflow-x: auto !important;
	scrollbar-width: none !important;
	-ms-overflow-style: none !important;
	cursor: grab !important;
	user-select: none !important;
	-webkit-user-select: none !important;
	padding: 6px 4px 12px 4px !important;
	white-space: nowrap !important;
	scroll-behavior: smooth !important;
}

.sd-cat-tabs-wrapper::-webkit-scrollbar {
	display: none !important;
	width: 0 !important;
	height: 0 !important;
}

.sd-cat-tabs-wrapper.is-dragging {
	cursor: grabbing !important;
	scroll-behavior: auto !important;
}

/* Category Tab Pill Item — Inherits Theme Design */
.sd-cat-tab-item {
	display: inline-flex !important;
	align-items: center !important;
	gap: 6px !important;
	background: var(--ast-global-color-5, #f1f5f9) !important;
	color: var(--wka-theme-text, var(--ast-global-color-3, #334155)) !important;
	font-family: inherit !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	padding: 9px 20px !important;
	border-radius: 30px !important;
	text-decoration: none !important;
	transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
	flex-shrink: 0 !important;
	border: 1px solid var(--ast-global-color-6, #e2e8f0) !important;
	line-height: 1 !important;
}

.sd-cat-tab-item:hover {
	background: var(--ast-global-color-6, #e2e8f0) !important;
	color: var(--wka-theme-heading, var(--ast-global-color-2, #0f172a)) !important;
	transform: translateY(-2px) !important;
}

/* Active Category Tab Pill — Pure Theme Accent */
.sd-cat-tab-item.is-active {
	background: var(--wka-theme-accent, var(--ast-global-color-0, #f59e0b)) !important;
	color: var(--wka-theme-contrast, #ffffff) !important;
	border-color: var(--wka-theme-accent, var(--ast-global-color-0, #f59e0b)) !important;
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18) !important;
}

.sd-cat-tab-item.is-active:hover {
	background: var(--wka-theme-accent-hover, var(--ast-global-color-1, #d97706)) !important;
	border-color: var(--wka-theme-accent-hover, var(--ast-global-color-1, #d97706)) !important;
	color: var(--wka-theme-contrast, #ffffff) !important;
}

.sd-cat-tab-count {
	font-size: 12px !important;
	opacity: 0.85 !important;
	font-weight: 500 !important;
}

@media (max-width: 768px) {
	.sd-cat-tabs-container {
		margin-top: 10px !important;
		margin-bottom: 20px !important;
	}
	.sd-cat-tab-item {
		font-size: 13px !important;
		padding: 8px 16px !important;
	}
}
