/* =================================================================
   File:    inc/elementor/widgets/category-slider/style.css
   Purpose: Scoped CSS for the Category Slider widget.
   ================================================================= */

.liqui-cats { position: relative; padding-block: var(--space-3); }
.liqui-cats__slide { height: auto; display: flex; }
.liqui-cats__slide > .liqui-cat { width: 100%; }

.liqui-cat {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	padding: 0;
	border-radius: var(--radius-lg);
	text-decoration: none;
	color: var(--c-ink);
	transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.liqui-cat:hover { transform: translateY(-4px); box-shadow: var(--glass-shadow-lg); }
.liqui-cat__media {
	background: var(--c-surface-1);
	padding: var(--space-4);
	display: flex; align-items: center; justify-content: center;
}
.liqui-cat__img { width: 100%; height: 100%; object-fit: contain; }
.liqui-cat__placeholder { color: var(--c-ink-soft); display: flex; align-items: center; justify-content: center; height: 100%; }
.liqui-cat__body { padding: var(--space-4); display: flex; flex-direction: column; gap: 2px; }
.liqui-cat__title { font-size: var(--fs-md); font-weight: var(--fw-semi); margin: 0; line-height: 1.25; }
.liqui-cat__count { margin: 0; }

/* Arrows */
.liqui-cats__arrow {
	width: 40px; height: 40px; border-radius: 50%;
	background: var(--glass-bg-strong);
	border: 1px solid var(--c-line);
	color: var(--c-ink);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter:         blur(10px);
}
.liqui-cats__arrow.swiper-button-disabled { opacity: 0.4; pointer-events: none; }
.liqui-cats__arrow::after { font-size: 16px; font-weight: 700; }

/* Static grid responsive */
.liqui-grid { display: grid; gap: var(--space-4); grid-template-columns: repeat(var(--cols-d, 4), minmax(0, 1fr)); }
@media (max-width: 1024px) { .liqui-grid { grid-template-columns: repeat(var(--cols-t, 3), minmax(0, 1fr)); } }
@media (max-width: 600px)  { .liqui-grid { grid-template-columns: repeat(var(--cols-m, 2), minmax(0, 1fr)); } }
