/* CSS Variables */
:root {
	--coupon-border-color: #ccc;
	--coupon-background-color: #fff;
	--coupon-text-color: #333;
	--coupon-title-color: #000;
	--coupon-subtitle-color: #666;
	--coupon-expiration-color: #999;
	--coupon-padding: 15px;
	--coupon-border-radius: 5px;
	--coupon-image-aspect-ratio: 4/3;
	--coupon-image-height: 150px;
	--coupon-carousel-padding: 10px;
	--coupon-button-padding: 10px 20px;
}

/* General Styles */
.coupon-card {
	border: 2px dashed var(--coupon-border-color);
	background-color: var(--coupon-background-color);
	color: var(--coupon-text-color);
	margin-bottom: 20px;
	padding: var(--coupon-padding);
	display: flex;
	flex-direction: column;
	border-radius: var(--coupon-border-radius);
}

.coupon-card-image {
	width: 100%;
	max-height: var(--coupon-image-height);
	object-fit: contain;
	object-position: center;
	border-radius: var(--coupon-border-radius);
	margin-bottom: 10px;
}

.coupon-card-content {
	flex-grow: 1;
	text-align: center;
}

.coupon-card-title {
	color: var(--coupon-title-color);
	font-size: 1.6em;
	font-weight: bold;
	margin-bottom: 8px;
	/* Increased spacing after title */
	word-wrap: break-word;
}

.coupon-card-subtitle {
	color: var(--coupon-subtitle-color);
	font-size: 1.1em;
	font-weight: 600;
	margin-bottom: 12px;
	/* Increased spacing after subtitle */
	word-wrap: break-word;
}

.coupon-card-details {
	margin-bottom: 12px;
	word-wrap: break-word;
}

.coupon-card-disclaimer {
	font-size: .8em;
	margin-bottom: 8px;
	font-style: italic;
}

.coupon-card-expiration {
	color: var(--coupon-expiration-color);
	font-size: .9em;
	font-weight: bold;
	margin-bottom: 10px;
}

.coupon-button {
	display: inline-block;
	padding: var(--coupon-button-padding);
	background-color: var(--coupon-title-color);
	color: var(--coupon-background-color);
	text-decoration: none;
	border-radius: var(--coupon-border-radius);
	margin-top: 10px;
	/* Reduced margin to align better */
	font-weight: bold;
	transition: opacity .3s ease;
	opacity: 1;
}

.coupon-button:hover {
	opacity: .8 !important;
}

/* Grid Layout */
.coupon-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 20px;
	width: 100%;
}

/* Carousel Layout */
.coupon-carousel {
	padding-bottom: 20px;
}

.coupon-carousel .coupon-carousel-item {
	padding-left: var(--coupon-carousel-padding);
	padding-right: var(--coupon-carousel-padding);
}

.tns-inner {
	display: flex;
	justify-content: center;
}

.coupon-carousel .coupon-card {
	margin-left: 0px;
	margin-right: 0px;
}

.tns-controls button {
	-webkit-appearance: none;
	background: transparent;
	border: none;
}

.tns-controls {
	/* text-align: center; */
	margin-top: 10px;
}

.tns-controls button {
	content: " ";
	margin-left: 8px;
	display: inline-block;
	width: 32px;
	aspect-ratio: 1/1.5;
	background-color: var(--coupon-title-color);
	-webkit-mask: url("https://cdn-ilddlaf.nitrocdn.com/UUZcpNvIGSSsDutOljbvLHqHrECTSNdW/assets/images/optimized/rev-f57e8a8/airshieldhvac.com/wp-content/plugins/coupon-manager/assets/img/arrow.svg") center right no-repeat;
	mask: url("https://cdn-ilddlaf.nitrocdn.com/UUZcpNvIGSSsDutOljbvLHqHrECTSNdW/assets/images/optimized/rev-f57e8a8/airshieldhvac.com/wp-content/plugins/coupon-manager/assets/img/arrow.svg") center right no-repeat;
	vertical-align: top;
	opacity: 1;
	transition: all .3s ease;
}

.tns-controls button:hover {
	opacity: .6 !important;
}

.tns-controls button[data-controls="prev"] {
	transform: rotate(180deg);
}