/*
	README

	Modify this file as much or as little as needed.

	This file is shared across all CCL widgets in the Slider family. This enables the ability to
	a family of widgets in a single update without touching the structure of the widget and without needing
	to duplicate efforts across several widget-specific CSS files.
*/

.core-v2-hero-image .img-cont::before {
	display: block;
	background: linear-gradient(360deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 50%);
}

.core-v2-hero-image.hide-content .img-cont::before {
	display: none;
}

.core-v2-hero-image .slide-title {
	font-size: var(--text-2xl);
	line-height: var(--leading-tight);
	font-weight: var(--font-weight-extrabold);
}

.core-v2-hero-image .slide-desc {
	font-weight: var(--font-weight-normal);
	font-size: var(--text-base);
	line-height: var(--leading-normal);
}

.core-v2-hero-image .read-more {
	font-weight: var(--font-weight-bold, 700);
	color: var(--sw-collections-text-color-light);
}

/* Hero Image Border Radius */
.core-v2-hero-image .img-cont,
.core-v2-hero-image .slide-img {
	border-radius: var(--rounded-none);
}

@media (hover: hover) {
	.core-v2-hero-image.animation-expand .slide:hover .slide-img {
		scale: 1.02;
	}

	.ccl-v2-widget .slide-footer .read-more:hover {
		color: var(--green);
		background-color: inherit;
	}
}

/* Read More Button */

.core-v2-hero-image .slide-footer .read-more::after {
	font-family: var(--fa-6-family);
	content: "\f105";
	color: var(--green);
	font-size: var(--text-lg);
	font-weight: var(--font-weight-black);
	line-height: var(--leading-none);
	position: relative;
	top: 2px;
	display: inline-block;
	/* Doing animation aproximately as per FIGMA prototype */
	transition: 0.4s cubic-bezier(0.68, -0.6, 0.32, 1.6);
}

.core-v2-hero-image .slide-footer .read-more:hover::after {
	transform: translateX(3px);
}

.ccl-v2-widget .slide-footer .read-more {
	background-color: inherit;
	padding: 2px 0px 0px 0px;
	color: var(--white);
	border: none;
	font-size: var(--text-base);
	line-height: var(--leading-normal);
}