.lc-wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: start;
	gap: 8px
}

.lc-viewport {
	overflow-x: auto;
	overflow-y: hidden;
	padding: 8px 0;
	flex: 1;
	-webkit-overflow-scrolling: touch;
	scroll-snap-type: x proximity;
	padding-inline-end: 48px;
	overscroll-behavior-x: contain;
	-webkit-overscroll-behavior-x: contain
}

/* Improved horizontal scrollbar */
.lc-viewport { scrollbar-width: thin; scrollbar-color: rgba(0,0,0,.34) transparent }
.lc-viewport:hover { scrollbar-color: rgba(0,0,0,.5) transparent }
.lc-viewport::-webkit-scrollbar { height: 6px }
.lc-viewport::-webkit-scrollbar-track { background: transparent }
.lc-viewport::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.22); border-radius: 999px }
.lc-viewport:hover::-webkit-scrollbar-thumb { background-color: rgba(0,0,0,.34) }
.lc-viewport::-webkit-scrollbar-thumb:active { background-color: #f44336 }

.lc-track {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0 0 8px 8px;
	gap: 16px;
	scroll-behavior: smooth;
	transition-timing-function: cubic-bezier(.22,.61,.36,1)
}

.lc-viewport { cursor: grab }
.lc-viewport.lc-dragging { cursor: grabbing; user-select: none }

/* Parent category chips */
.egw-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 8px 0
}
.egw-chips.rtl { direction: rtl }
.egw-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 28px;
	padding: 0 10px;
	border-radius: 999px;
	background: #fff;
	border: 1px solid #e6e6e6;
	color: #333;
	text-decoration: none;
	box-shadow: 0 1px 2px rgba(0,0,0,.04);
	transition: background .2s ease, color .2s ease, border-color .2s ease, box-shadow .2s ease
}
.egw-chip:hover { background: #f7f7f7 }
.egw-chip.is-active {
	background: #f44336;
	border-color: #f44336;
	color: #fff;
	box-shadow: 0 2px 6px rgba(244,67,54,.25)
}
.egw-chip__icon { width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center }
.egw-chip__icon svg { width: 18px; height: 18px; display: block; fill: currentColor }
.egw-chip__icon img { width: 18px; height: 18px; display: block; object-fit: contain }
.egw-chip__icon i { font-size: 18px; line-height: 1 }
.egw-chip__label { font-size: 13px; font-weight: 500 }

.lc-card {
	min-width: 180px;
	width: 180px;
	flex: 0 0 180px
}

.lc-card.is-active .lc-category-box {
	outline: 2px solid #f44336 !important;
	outline-offset: 2px !important
}

.lc-card-link {
	display: block;
	text-decoration: none;
	color: inherit
}

.lc-card-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 8px;
	font-weight: 600
}

.lc-card-count {
	background: #e74c3c;
	color: #fff;
	border-radius: 999px;
	padding: 0 8px;
	font-size: 12px;
	margin-inline-start: 8px
}

.lc-category-box {
	position: relative;
	display: block;
	height: 110px;
	border-radius: 16px;
	overflow: hidden;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
	will-change: transform;
	transition: transform .26s cubic-bezier(.2, .8, .2, 1), box-shadow .26s cubic-bezier(.2, .8, .2, 1)
}

.lc-category-box-background {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transition: transform .5s cubic-bezier(.19, 1, .22, 1)
}

.lc-category-box:before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 63%, rgba(0, 0, 0, .85) 88%, rgba(0, 0, 0, 1) 100%);
	z-index: 1
}

.lc-category-box:hover .lc-category-box-background {
	transform: scale(1.04)
}

.lc-category-box:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, .14)
}

.lc-category-box-content {
	position: absolute;
	inset: 0;
	z-index: 2;
	padding: 0px 0px;
	height: 100%;
	width: 100%;
}

.lc-meta {
	display: flex;
	align-items: end;
	justify-content: flex-start;
	gap: 8px;
	height: 100%;
	width: 100%;
	padding:  6px;
}

.lc-title {
	color: #fff;
	background: none;
	text-align: start;
	font-size: 15px;
	margin: 0;
	font-weight: 400;
	letter-spacing: .2px
}

.lc-count {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 8px;
	border-radius: 999px;
	background: #f44336;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	line-height: 1
}

/* hide legacy arrows (structure removed, keep defensive rules) */
.lc-nav { display: none }

/* dots removed */
.lc-dots, .lc-dot { display: none }

@media (max-width:768px) {
	.lc-viewport { scroll-snap-type: x mandatory }

	.lc-track {
		gap: 8px
	}

	.lc-card {
		min-width: calc((100% - 16px) / 3);
		width: calc((100% - 16px) / 3);
		flex: 0 0 calc((100% - 16px) / 3);
		scroll-snap-align: start
	}

	.lc-category-box {
		height: 110px
	}

	.lc-title {
		font-size: 13px
	}

	.lc-count {
		min-width: 18px;
		height: 18px;
		font-size: 11px
	}

    .lc-dots { margin-top: 4px }
}