/* ─────────────────────────────────────────────
   GoHimara · Carousel  (Swiper-based)
   Uses design-system tokens from :root
   ───────────────────────────────────────────── */

/* Wrapper ─────────────────────────────────── */
.webdeva-carousel-wrap {
	position: relative;
}

/* Nav buttons ─────────────────────────────── */
.webdeva-carousel-prev,
.webdeva-carousel-next {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;

	width: 48px;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;

	background: var(--surface, #fff);
	border: 1px solid var(--line, #E2DFD6);
	border-radius: var(--r-pill, 999px);
	cursor: pointer;

	box-shadow: var(--shadow-2, 0 8px 24px -8px rgba(20,28,23,.10));
	transition:
		background 200ms var(--ease, ease),
		border-color 200ms var(--ease, ease),
		box-shadow 200ms var(--ease, ease),
		opacity 200ms ease;
}

.webdeva-carousel-prev { left: -24px; }
.webdeva-carousel-next { right: -24px; }

/* Arrow icons inside buttons */
.webdeva-carousel-prev svg,
.webdeva-carousel-next svg {
	width: 16px;
	height: 16px;
	stroke: var(--ink, #141C17);
	fill: none;
	stroke-width: 1.75;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: stroke 200ms var(--ease, ease);
}

/* Hover */
.webdeva-carousel-prev:hover,
.webdeva-carousel-next:hover {
	background: var(--green, #1E3A2C);
	border-color: var(--green, #1E3A2C);
	box-shadow: var(--shadow-2, 0 8px 24px -8px rgba(20,28,23,.16));
}

.webdeva-carousel-prev:hover svg,
.webdeva-carousel-next:hover svg {
	stroke: #fff;
}

/* Disabled state */
.webdeva-carousel-prev.swiper-button-disabled,
.webdeva-carousel-next.swiper-button-disabled {
	opacity: .35;
	cursor: default;
	pointer-events: none;
}

/* Slides ──────────────────────────────────── */
.webdeva-carousel-wrap .swiper-slide {
	height: auto;
}

/* Listing card fills full slide height */
.webdeva-carousel-wrap .swiper-slide .lst {
	height: 100%;
}

/* Card meta row ───────────────────────────── */
.webdeva-carousel-wrap .lst-meta span {
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

/* Icon inside meta */
.webdeva-carousel-wrap .webdeva-card-icon {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	display: block;
	color: currentColor;
	opacity: .75;
}

/* CTA link ────────────────────────────────── */
.webdeva-carousel-wrap .lst-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;

	font-family: var(--sans, system-ui, sans-serif);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 2.5px;
	text-transform: uppercase;
	line-height: 1;
	text-decoration: none;

	color: var(--green, #1E3A2C);
	border-bottom: 1px solid var(--green, #1E3A2C);
	padding-bottom: 4px;

	transition:
		color 200ms var(--ease, ease),
		border-color 200ms var(--ease, ease);
}

/* Arrow inside CTA */
.webdeva-carousel-wrap .lst-cta .arrow {
	display: inline-block;
	transition: transform 300ms var(--ease, ease);
}

/* Hover — inherited from parent .lst:hover */
.webdeva-carousel-wrap .lst:hover .lst-cta {
	color: var(--green-2, #2F5440);
	border-color: var(--green-2, #2F5440);
}

.webdeva-carousel-wrap .lst:hover .lst-cta .arrow {
	transform: translateX(4px);
}

/* Responsive ──────────────────────────────── */
@media (max-width: 991px) {
	.webdeva-carousel-prev,
	.webdeva-carousel-next {
		display: none;
	}
}