/**
 * =========================================================
 * COOLBABA Editorial Slider — Clean Production CSS v1
 * For Anymag Core Elementor widget
 * Final merged version: desktop + mobile + underline + spacing fixes
 * Accent: #00656e
 * =========================================================
 */

:root {
	--cb-slider-accent: #00656e;
	--cb-slider-accent-rgb: 0, 101, 110;
	--cb-slider-surface: #fffdf8;
	--cb-slider-text: #111111;
	--cb-slider-muted: rgba(17, 17, 17, 0.64);
	--cb-slider-radius-pill: 999px;
}

/* =========================================================
   Base cleanup
   ========================================================= */

.elementor-widget-anymag_slider,
.elementor-widget-anymag_slider .elementor-widget-container,
#slider-content.coolbaba-slider-content {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

#slider-content.coolbaba-slider-content {
	margin-top: 0 !important;
	margin-bottom: clamp(26px, 4vw, 48px) !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	overflow: visible !important;
}

.coolbaba-slider-content *,
.coolbaba-slider-content *::before,
.coolbaba-slider-content *::after {
	box-sizing: border-box;
}

.coolbaba-slider-content a {
	text-decoration: none !important;
}

/* Slightly reduce Elementor side spacing on desktop/tablet */
@media (min-width: 768px) {
	.elementor-widget-anymag_slider {
		margin-left: clamp(-18px, -1.4vw, -8px) !important;
		margin-right: clamp(-18px, -1.4vw, -8px) !important;
		width: calc(100% + clamp(16px, 2.8vw, 36px)) !important;
	}
}

/* =========================================================
   Slider canvas
   ========================================================= */

.coolbaba-editorial-slider {
	position: relative !important;
	width: 100% !important;
	container-type: inline-size;
}

.coolbaba-editorial-slider__viewport {
	position: relative !important;
	width: 100% !important;
	min-height: clamp(500px, 54vw, 660px) !important;
	height: auto !important;
	overflow: hidden !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: var(--cb-slider-surface) !important;
	box-shadow: none !important;
	isolation: isolate !important;
}

.coolbaba-editorial-slider__viewport::before {
	display: none !important;
	content: none !important;
}

.coolbaba-editorial-slider__track,
.coolbaba-editorial-slider__slide,
.coolbaba-editorial-slider__inner {
	min-height: clamp(500px, 54vw, 660px) !important;
}

.coolbaba-editorial-slider__track {
	position: relative !important;
	width: 100% !important;
}

.coolbaba-editorial-slider__slide {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
	transform: translateX(16px);
	transition:
		opacity 460ms ease,
		transform 620ms cubic-bezier(0.22, 1, 0.36, 1),
		visibility 460ms ease;
}

.coolbaba-editorial-slider__slide.is-active {
	opacity: 1 !important;
	visibility: visible !important;
	pointer-events: auto !important;
	transform: translateX(0);
	z-index: 2 !important;
}

.coolbaba-editorial-slider__inner {
	position: relative !important;
	display: block !important;
	width: 100% !important;
	background: var(--cb-slider-surface) !important;
}

/* =========================================================
   Full background image + desktop gradient
   ========================================================= */

.coolbaba-editorial-slider__media {
	position: absolute !important;
	inset: 0 !important;
	z-index: 1 !important;
	width: 100% !important;
	height: 100% !important;
	min-height: 0 !important;
	display: block !important;
	overflow: hidden !important;
	background: #f1ede6 !important;
}

.coolbaba-editorial-slider__media-bg {
	display: none !important;
}

.coolbaba-editorial-slider__image-wrap {
	position: absolute !important;
	inset: 0 !important;
	z-index: 1 !important;
	width: 100% !important;
	height: 100% !important;
	display: block !important;
}

.coolbaba-editorial-slider__image {
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	display: block !important;
	object-fit: cover !important;
	object-position: center center !important;
	filter: saturate(0.98) contrast(1.03) !important;
	transform: scale(1) !important;
	transition:
		transform 1200ms cubic-bezier(0.22, 1, 0.36, 1),
		filter 600ms ease;
}

.coolbaba-editorial-slider__media::before {
	content: "" !important;
	position: absolute !important;
	inset: 0 !important;
	z-index: 3 !important;
	pointer-events: none !important;
	background:
		linear-gradient(
			90deg,
			rgba(255, 253, 248, 0.99) 0%,
			rgba(255, 253, 248, 0.97) 31%,
			rgba(255, 253, 248, 0.76) 50%,
			rgba(255, 253, 248, 0.24) 70%,
			rgba(255, 253, 248, 0.02) 100%
		),
		linear-gradient(
			180deg,
			rgba(255, 253, 248, 0.10) 0%,
			rgba(255, 253, 248, 0.28) 100%
		) !important;
}

/* =========================================================
   Content
   ========================================================= */

.coolbaba-editorial-slider__content {
	position: relative !important;
	z-index: 5 !important;
	width: min(48%, 540px) !important;
	min-height: clamp(500px, 54vw, 660px) !important;
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
	align-items: flex-start !important;
	gap: clamp(9px, 0.9vw, 13px) !important;
	padding: clamp(34px, 4.2vw, 62px) clamp(26px, 4.2vw, 58px) !important;
	background: transparent !important;
	color: var(--cb-slider-text) !important;
}

.coolbaba-editorial-slider__content::before {
	content: "Редакційний пульс" !important;
	display: inline-flex !important;
	align-items: center !important;
	width: fit-content !important;
	margin: 0 0 2px !important;
	color: rgba(17, 17, 17, 0.48) !important;
	font-size: 10px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
}

.coolbaba-editorial-slider__category {
	display: inline-flex !important;
	align-items: center !important;
	width: fit-content !important;
	max-width: 100% !important;
	min-height: 28px !important;
	margin: 0 0 4px !important;
	padding: 8px 14px !important;
	border: 1px solid rgba(var(--cb-slider-accent-rgb), 0.26) !important;
	border-radius: var(--cb-slider-radius-pill) !important;
	background: rgba(var(--cb-slider-accent-rgb), 0.08) !important;
	color: var(--cb-slider-accent) !important;
	font-size: 10px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
	white-space: nowrap !important;
	transition:
		background-color 220ms ease,
		color 220ms ease,
		border-color 220ms ease;
}

.coolbaba-editorial-slider__category:hover {
	background: var(--cb-slider-accent) !important;
	border-color: var(--cb-slider-accent) !important;
	color: #ffffff !important;
}

.coolbaba-editorial-slider__title {
	width: 100% !important;
	max-width: 500px !important;
	margin: 0 !important;
	padding: 0 !important;
	color: var(--cb-slider-text) !important;
	font-size: clamp(26px, 2.45vw, 42px) !important;
	font-weight: 500 !important;
	line-height: 1.06 !important;
	letter-spacing: -0.038em !important;
	text-wrap: balance !important;

	display: -webkit-box !important;
	-webkit-line-clamp: 5 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
}

.coolbaba-editorial-slider__title a {
	color: inherit !important;
	text-decoration: none !important;
	background-image: none !important;
	background-size: 0 !important;
	background-position: unset !important;
	background-repeat: no-repeat !important;
	border-bottom: 0 !important;
	box-shadow: none !important;
	outline: none;
	transition: opacity 220ms ease, color 220ms ease !important;
}

.coolbaba-editorial-slider__title a:hover {
	opacity: 0.86 !important;
	color: inherit !important;
	text-decoration: none !important;
	background-image: none !important;
	box-shadow: none !important;
	border-bottom: 0 !important;
}

.coolbaba-editorial-slider__title a::before,
.coolbaba-editorial-slider__title a::after,
.coolbaba-editorial-slider .underline a::before,
.coolbaba-editorial-slider .underline a::after,
.coolbaba-editorial-slider .slide-title a::before,
.coolbaba-editorial-slider .slide-title a::after {
	display: none !important;
	content: none !important;
	width: 0 !important;
	height: 0 !important;
	background: transparent !important;
}

.coolbaba-editorial-slider__excerpt {
	width: 100% !important;
	max-width: 470px !important;
	margin: 0 !important;
	color: var(--cb-slider-muted) !important;
	font-size: clamp(13px, 0.86vw, 15px) !important;
	line-height: 1.48 !important;

	display: -webkit-box !important;
	-webkit-line-clamp: 4 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
}

.coolbaba-editorial-slider__meta {
	position: relative !important;
	z-index: 7 !important;
	display: flex !important;
	align-items: center !important;
	flex-wrap: wrap !important;
	gap: 14px 18px !important;
	margin-top: clamp(8px, 1vw, 14px) !important;
	flex-shrink: 0 !important;
}

.coolbaba-editorial-slider__date {
	display: none !important;
}

.coolbaba-editorial-slider__button {
	position: relative !important;
	z-index: 8 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	min-height: 42px !important;
	padding: 12px 18px !important;
	border: 1px solid var(--cb-slider-accent) !important;
	border-radius: var(--cb-slider-radius-pill) !important;
	background: var(--cb-slider-accent) !important;
	color: #ffffff !important;
	text-decoration: none !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
	visibility: visible !important;
	opacity: 1 !important;
	box-shadow: 0 14px 30px rgba(var(--cb-slider-accent-rgb), 0.22) !important;
	transition:
		transform 220ms ease,
		background-color 220ms ease,
		border-color 220ms ease,
		box-shadow 220ms ease;
}

.coolbaba-editorial-slider__button::after {
	content: "→";
	font-size: 15px;
	line-height: 1;
}

.coolbaba-editorial-slider__button:hover {
	background: #004f56 !important;
	border-color: #004f56 !important;
	color: #ffffff !important;
	transform: translateY(-2px);
	box-shadow: 0 18px 36px rgba(var(--cb-slider-accent-rgb), 0.28) !important;
}

/* =========================================================
   Navigation — top arrows only
   ========================================================= */

.coolbaba-editorial-slider__dots {
	display: none !important;
}

.coolbaba-editorial-slider__nav {
	position: absolute !important;
	top: clamp(18px, 2.2vw, 30px) !important;
	right: clamp(18px, 2.2vw, 30px) !important;
	z-index: 20 !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	padding: 6px !important;
	border: 1px solid rgba(17, 17, 17, 0.08) !important;
	border-radius: var(--cb-slider-radius-pill) !important;
	background: rgba(255, 253, 248, 0.82) !important;
	backdrop-filter: blur(16px) !important;
	box-shadow: 0 14px 34px rgba(0, 0, 0, 0.08) !important;
}

.coolbaba-editorial-slider__arrow {
	width: 34px !important;
	height: 34px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	padding: 0 !important;
	border: 1px solid transparent !important;
	border-radius: 50% !important;
	background: transparent !important;
	color: var(--cb-slider-text) !important;
	font-size: 19px !important;
	line-height: 1 !important;
	cursor: pointer !important;
	transition:
		background-color 220ms ease,
		color 220ms ease,
		border-color 220ms ease,
		transform 220ms ease;
}

.coolbaba-editorial-slider__arrow:hover {
	background: var(--cb-slider-accent) !important;
	border-color: var(--cb-slider-accent) !important;
	color: #ffffff !important;
	transform: translateY(-1px);
}

.coolbaba-editorial-slider__count {
	min-width: 58px !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 6px !important;
	color: rgba(17, 17, 17, 0.58) !important;
	font-size: 10px !important;
	font-weight: 800 !important;
	line-height: 1 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
}

.coolbaba-editorial-slider__count [data-coolbaba-current] {
	color: var(--cb-slider-accent) !important;
}

/* =========================================================
   Narrow split column / tablet
   ========================================================= */

@container (max-width: 820px) {
	.coolbaba-editorial-slider__viewport,
	.coolbaba-editorial-slider__track,
	.coolbaba-editorial-slider__slide,
	.coolbaba-editorial-slider__inner,
	.coolbaba-editorial-slider__content {
		min-height: clamp(470px, 60vw, 610px) !important;
	}

	.coolbaba-editorial-slider__content {
		width: min(52%, 480px) !important;
		padding: clamp(28px, 3.6vw, 50px) clamp(24px, 3.4vw, 46px) !important;
	}

	.coolbaba-editorial-slider__title {
		max-width: 440px !important;
		font-size: clamp(24px, 3.4vw, 36px) !important;
		line-height: 1.07 !important;
		-webkit-line-clamp: 5 !important;
	}

	.coolbaba-editorial-slider__excerpt {
		max-width: 400px !important;
		font-size: 13px !important;
		line-height: 1.45 !important;
		-webkit-line-clamp: 4 !important;
	}
}

/* =========================================================
   Mobile glossy card
   ========================================================= */

@media (max-width: 767px) {
	.elementor-widget-anymag_slider,
	.elementor-widget-anymag_slider .elementor-widget-container,
	#slider-content.coolbaba-slider-content {
		width: 100% !important;
		max-width: none !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	#slider-content.coolbaba-slider-content {
		margin-bottom: 26px !important;
		overflow: visible !important;
	}

	.coolbaba-editorial-slider {
		display: block !important;
		width: calc(100vw - 24px) !important;
		max-width: calc(100vw - 24px) !important;
		min-height: 1px !important;
		margin-left: calc(50% - 50vw + 12px) !important;
		margin-right: calc(50% - 50vw + 12px) !important;
	}

	.coolbaba-editorial-slider__viewport {
		position: relative !important;
		width: 100% !important;
		min-height: 500px !important;
		height: auto !important;
		aspect-ratio: 4 / 4.65 !important;
		max-height: 560px !important;
		overflow: hidden !important;
		border: 0 !important;
		border-radius: 18px !important;
		background: #0f0f0f !important;
		box-shadow: 0 18px 46px rgba(0, 0, 0, 0.12) !important;
	}

	.coolbaba-editorial-slider__track,
	.coolbaba-editorial-slider__slide,
	.coolbaba-editorial-slider__slide.is-active,
	.coolbaba-editorial-slider__inner,
	.coolbaba-editorial-slider__media {
		position: absolute !important;
		inset: 0 !important;
		width: 100% !important;
		height: 100% !important;
		min-height: 100% !important;
		display: block !important;
	}

	.coolbaba-editorial-slider__slide {
		opacity: 0 !important;
		visibility: hidden !important;
		pointer-events: none !important;
	}

	.coolbaba-editorial-slider__slide.is-active {
		opacity: 1 !important;
		visibility: visible !important;
		pointer-events: auto !important;
	}

	.coolbaba-editorial-slider__media {
		z-index: 1 !important;
		background: #0f0f0f !important;
		overflow: hidden !important;
	}

	.coolbaba-editorial-slider__media-bg {
		display: none !important;
	}

	.coolbaba-editorial-slider__image-wrap {
		position: absolute !important;
		inset: 0 !important;
		z-index: 1 !important;
		width: 100% !important;
		height: 100% !important;
		display: block !important;
	}

	.coolbaba-editorial-slider__image {
		width: 100% !important;
		height: 100% !important;
		object-fit: cover !important;
		object-position: center center !important;
		filter: saturate(0.96) contrast(1.03) !important;
	}

	.coolbaba-editorial-slider__media::before {
		content: "" !important;
		position: absolute !important;
		inset: 0 !important;
		z-index: 3 !important;
		pointer-events: none !important;
		background:
			linear-gradient(
				0deg,
				rgba(0, 0, 0, 0.92) 0%,
				rgba(0, 0, 0, 0.76) 24%,
				rgba(0, 0, 0, 0.42) 54%,
				rgba(0, 0, 0, 0.08) 100%
			),
			radial-gradient(
				circle at 18% 82%,
				rgba(var(--cb-slider-accent-rgb), 0.26),
				transparent 42%
			) !important;
	}

	.coolbaba-editorial-slider__content {
		position: absolute !important;
		left: 0 !important;
		right: 0 !important;
		bottom: 0 !important;
		z-index: 5 !important;
		width: 100% !important;
		height: 100% !important;
		min-height: 0 !important;
		display: flex !important;
		flex-direction: column !important;
		justify-content: flex-end !important;
		align-items: flex-start !important;
		gap: 7px !important;
		padding: 70px 18px 22px !important;
		background: transparent !important;
		color: #ffffff !important;
	}

	.coolbaba-editorial-slider__content::before {
		content: "Редакційний пульс" !important;
		margin: 0 !important;
		color: rgba(255, 255, 255, 0.72) !important;
		font-size: 8px !important;
		font-weight: 800 !important;
		line-height: 1 !important;
		letter-spacing: 0.16em !important;
		text-transform: uppercase !important;
	}

	.coolbaba-editorial-slider__category {
		margin: 0 !important;
		padding: 6px 10px !important;
		background: rgba(var(--cb-slider-accent-rgb), 0.92) !important;
		border: 1px solid rgba(255, 255, 255, 0.22) !important;
		color: #ffffff !important;
		font-size: 8px !important;
		font-weight: 800 !important;
		line-height: 1 !important;
		letter-spacing: 0.09em !important;
		border-radius: var(--cb-slider-radius-pill) !important;
		box-shadow: 0 10px 26px rgba(0, 0, 0, 0.22) !important;
	}

	.coolbaba-editorial-slider__title {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		color: #ffffff !important;
		font-size: clamp(23px, 7.1vw, 32px) !important;
		font-weight: 500 !important;
		line-height: 1.02 !important;
		letter-spacing: -0.045em !important;
		text-shadow: 0 14px 34px rgba(0, 0, 0, 0.42) !important;

		display: -webkit-box !important;
		-webkit-line-clamp: 3 !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}

	.coolbaba-editorial-slider__title a {
		color: #ffffff !important;
		text-decoration: none !important;
		background-image: none !important;
		box-shadow: none !important;
		border-bottom: 0 !important;
	}

	.coolbaba-editorial-slider__excerpt {
		width: 94% !important;
		max-width: 94% !important;
		margin: 0 !important;
		color: rgba(255, 255, 255, 0.84) !important;
		font-size: 12px !important;
		line-height: 1.38 !important;
		text-shadow: 0 10px 24px rgba(0, 0, 0, 0.30) !important;

		display: -webkit-box !important;
		-webkit-line-clamp: 2 !important;
		-webkit-box-orient: vertical !important;
		overflow: hidden !important;
	}

	.coolbaba-editorial-slider__meta {
		margin-top: 6px !important;
	}

	.coolbaba-editorial-slider__button {
		min-height: 36px !important;
		padding: 9px 13px !important;
		background: var(--cb-slider-accent) !important;
		border-color: var(--cb-slider-accent) !important;
		color: #ffffff !important;
		font-size: 9px !important;
		letter-spacing: 0.10em !important;
		box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28) !important;
	}

	.coolbaba-editorial-slider__nav {
		top: 12px !important;
		right: 12px !important;
		bottom: auto !important;
		z-index: 10 !important;
		padding: 5px !important;
		background: rgba(0, 0, 0, 0.34) !important;
		border: 1px solid rgba(255, 255, 255, 0.18) !important;
		backdrop-filter: blur(16px) !important;
		box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18) !important;
	}

	.coolbaba-editorial-slider__arrow {
		width: 30px !important;
		height: 30px !important;
		color: #ffffff !important;
		font-size: 17px !important;
	}

	.coolbaba-editorial-slider__count {
		min-width: 48px !important;
		color: rgba(255, 255, 255, 0.74) !important;
		font-size: 9px !important;
	}

	.coolbaba-editorial-slider__count [data-coolbaba-current] {
		color: #ffffff !important;
	}

	.coolbaba-editorial-slider__dots {
		display: none !important;
	}
}

@media (max-width: 420px) {
	.coolbaba-editorial-slider {
		width: calc(100vw - 20px) !important;
		max-width: calc(100vw - 20px) !important;
		margin-left: calc(50% - 50vw + 10px) !important;
		margin-right: calc(50% - 50vw + 10px) !important;
	}

	.coolbaba-editorial-slider__viewport {
		aspect-ratio: 4 / 4.55 !important;
		min-height: 470px !important;
		max-height: 530px !important;
	}

	.coolbaba-editorial-slider__content {
		padding: 66px 16px 20px !important;
	}

	.coolbaba-editorial-slider__title {
		font-size: clamp(22px, 6.8vw, 30px) !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.coolbaba-editorial-slider__slide,
	.coolbaba-editorial-slider__image,
	.coolbaba-editorial-slider__arrow,
	.coolbaba-editorial-slider__button,
	.coolbaba-editorial-slider__title a {
		transition: none !important;
	}
}