/* =========================================================
   CNLS SIDE CART
   VERSION 2.0.0
   ========================================================= */


/* =========================================================
   VARIABLES
   ========================================================= */

:root {

	--cnls-cart-bg:
		#060C1B;

	--cnls-cart-title:
		#F4E9C7;

	--cnls-cart-gold:
		#E0A91F;

	--cnls-cart-divider:
		rgba(
			44,
			89,
			145,
			0.22
		);

	--cnls-cart-overlay:
		rgba(
			3,
			7,
			18,
			0.72
		);

}


/* =========================================================
   OVERLAY
   ========================================================= */

.cnls-side-cart-overlay {

	position:
		fixed;

	inset:
		0;

	z-index:
		999998;

	background:
		var(--cnls-cart-overlay);

	opacity:
		0;

	visibility:
		hidden;

	pointer-events:
		none;

	transition:
		opacity 260ms ease,
		visibility 260ms ease;

}


/*
 * Backdrop solamente en navegadores que lo soportan.
 *
 * Evitamos forzarlo como requisito del efecto.
 */

@supports (
	backdrop-filter: blur(2px)
) {

	.cnls-side-cart-overlay {

		backdrop-filter:
			blur(2px);

	}

}


body.cnls-side-cart-open
.cnls-side-cart-overlay {

	opacity:
		1;

	visibility:
		visible;

	pointer-events:
		auto;

}


/* =========================================================
   PANEL
   ========================================================= */

.cnls-side-cart {

	position:
		fixed;

	top:
		0;

	right:
		0;

	z-index:
		999999;

	width:
		min(
			420px,
			35vw
		);

	height:
		100dvh;

	display:
		flex;

	flex-direction:
		column;

	background:
		var(--cnls-cart-bg);

	color:
		var(--cnls-cart-title);

	border-left:
		1px
		solid
		var(--cnls-cart-divider);

	box-shadow:
		-20px
		0
		60px
		rgba(
			0,
			0,
			0,
			0.23
		);

	transform:
		translate3d(
			100%,
			0,
			0
		);

	visibility:
		hidden;

	transition:
		transform 380ms
		cubic-bezier(
			0.77,
			0,
			0.175,
			1
		),
		visibility 380ms ease;

	overflow:
		hidden;

}


body.cnls-side-cart-open
.cnls-side-cart {

	transform:
		translate3d(
			0,
			0,
			0
		);

	visibility:
		visible;

}


/* =========================================================
   HEADER
   ========================================================= */

.cnls-side-cart-header {

	display:
		flex;

	align-items:
		center;

	justify-content:
		space-between;

	flex:
		0 0 auto;

	padding:
		34px
		34px
		28px;

	border-bottom:
		1px
		solid
		var(--cnls-cart-divider);

}


/* =========================================================
   KICKER
   ========================================================= */

.cnls-side-cart-kicker {

	display:
		block;

	margin-bottom:
		9px;

	font-family:
		"IBM Plex Mono",
		monospace;

	font-size:
		12px;

	font-weight:
		500;

	line-height:
		1;

	letter-spacing:
		0.12em;

	color:
		var(--cnls-cart-gold);

	text-transform:
		uppercase;

}


/* =========================================================
   TÍTULO
   ========================================================= */

.cnls-side-cart-title {

	margin:
		0 !important;

	padding:
		0 !important;

	font-family:
		"Cormorant Garamond",
		Georgia,
		serif !important;

	font-size:
		40px !important;

	font-weight:
		500 !important;

	line-height:
		1 !important;

	letter-spacing:
		0.01em;

	color:
		var(--cnls-cart-title) !important;

}


/* =========================================================
   CERRAR
   ========================================================= */

.cnls-side-cart-close {

	position:
		relative;

	display:
		flex;

	align-items:
		center;

	justify-content:
		center;

	width:
		38px;

	height:
		38px;

	margin:
		0;

	padding:
		0;

	border:
		1px
		solid
		var(--cnls-cart-gold) !important;

	border-radius:
		0 !important;

	background:
		transparent !important;

	color:
		var(--cnls-cart-gold) !important;

	cursor:
		pointer;

	box-shadow:
		none !important;

	transition:
		border-color
		180ms
		ease,
		color
		180ms
		ease;

}


.cnls-side-cart-close:hover {

	border-color:
		var(--cnls-cart-title) !important;

	color:
		var(--cnls-cart-title) !important;

	background:
		transparent !important;

}


.cnls-side-cart-close span {

	position:
		absolute;

	width:
		15px;

	height:
		1px;

	background:
		currentColor;

}


.cnls-side-cart-close
span:first-child {

	transform:
		rotate(45deg);

}


.cnls-side-cart-close
span:last-child {

	transform:
		rotate(-45deg);

}


/* =========================================================
   CONTENIDO
   ========================================================= */

.cnls-side-cart-content {

	position:
		relative;

	flex:
		1 1 auto;

	min-height:
		0;

	overflow:
		auto;

	overscroll-behavior:
		contain;

	padding:
		0
		34px;

	scrollbar-width:
		thin;

	scrollbar-color:
		var(--cnls-cart-gold)
		transparent;

	-webkit-overflow-scrolling:
		touch;

}


/* =========================================================
   LOADING
   ========================================================= */

.cnls-side-cart-loading {

	position:
		absolute;

	inset:
		0;

	z-index:
		5;

	display:
		flex;

	align-items:
		flex-start;

	justify-content:
		center;

	padding-top:
		80px;

	background:
		var(--cnls-cart-bg);

	opacity:
		0;

	visibility:
		hidden;

	pointer-events:
		none;

	transition:
		opacity
		160ms
		ease,
		visibility
		160ms
		ease;

}


.cnls-side-cart-loading.is-visible {

	opacity:
		1;

	visibility:
		visible;

}


.cnls-side-cart-loader {

	width:
		23px;

	height:
		23px;

	border:
		1px
		solid
		var(--cnls-cart-divider);

	border-top-color:
		var(--cnls-cart-gold);

	border-radius:
		50%;

	animation:
		cnlsSideCartSpin
		700ms
		linear
		infinite;

}


@keyframes cnlsSideCartSpin {

	to {

		transform:
			rotate(360deg);

	}

}


/* =========================================================
   PRODUCTOS
   ========================================================= */

.cnls-side-cart-products {

	display:
		flex;

	flex-direction:
		column;

}


/* =========================================================
   ITEM
   ========================================================= */

.cnls-side-cart-item {

	display:
		grid;

	grid-template-columns:
		76px
		minmax(
			0,
			1fr
		);

	column-gap:
		20px;

	padding:
		28px
		0;

	border-bottom:
		1px
		solid
		var(--cnls-cart-divider);

}


/* =========================================================
   IMAGEN
   ========================================================= */

.cnls-side-cart-item-image-wrap {

	display:
		flex;

	align-items:
		center;

	justify-content:
		center;

	width:
		76px;

	height:
		100px;

	overflow:
		hidden;

}


.cnls-side-cart-item-image {

	display:
		block !important;

	width:
		100% !important;

	height:
		100% !important;

	object-fit:
		contain;

}


/* =========================================================
   INFO
   ========================================================= */

.cnls-side-cart-item-info {

	min-width:
		0;

	display:
		flex;

	flex-direction:
		column;

	align-items:
		flex-start;

}


/* =========================================================
   NOMBRE
   ========================================================= */

.cnls-side-cart-item-name {

	display:
		block;

	margin:
		0;

	padding:
		0;

	font-family:
		"Manrope",
		sans-serif;

	font-size:
		16px;

	font-weight:
		500;

	line-height:
		1.3;

	color:
		var(--cnls-cart-title);

	text-decoration:
		none;

}


.cnls-side-cart-item-name:hover {

	color:
		var(--cnls-cart-title);

}


/* =========================================================
   VARIACIÓN
   ========================================================= */

.cnls-side-cart-item-variation {

	margin-top:
		7px;

	font-family:
		"Manrope",
		sans-serif;

	font-size:
		12px;

	line-height:
		1.4;

	color:
		rgba(
			244,
			233,
			199,
			0.58
		);

}


/* =========================================================
   META
   ========================================================= */

.cnls-side-cart-item-meta {

	display:
		flex;

	align-items:
		center;

	gap:
		8px;

	margin-top:
		12px;

	font-family:
		"Manrope",
		sans-serif;

	font-size:
		15px;

	font-weight:
		500;

	line-height:
		1.3;

	color:
		var(--cnls-cart-gold);

}


.cnls-side-cart-item-quantity,
.cnls-side-cart-item-price {

	color:
		var(--cnls-cart-gold);

}


/* =========================================================
   ELIMINAR
   ========================================================= */

.cnls-side-cart-remove {

	align-self:
		flex-start;

	display:
		inline-flex;

	align-items:
		center;

	justify-content:
		center;

	min-width:
		0;

	height:
		40px;

	margin-top:
		24px;

	padding:
		0
		12px;

	border:
		1px
		solid
		var(--cnls-cart-gold) !important;

	border-radius:
		0 !important;

	background:
		transparent !important;

	color:
		var(--cnls-cart-gold) !important;

	font-family:
		"Manrope",
		sans-serif !important;

	font-size:
		13px !important;

	font-weight:
		600 !important;

	line-height:
		1;

	letter-spacing:
		0.8px;

	text-transform:
		uppercase;

	white-space:
		nowrap;

	cursor:
		pointer;

	box-shadow:
		none !important;

	transition:
		color
		180ms
		ease,
		border-color
		180ms
		ease,
		opacity
		150ms
		ease;

}


.cnls-side-cart-remove:hover {

	border-color:
		var(--cnls-cart-title) !important;

	color:
		var(--cnls-cart-title) !important;

	background:
		transparent !important;

}


.cnls-side-cart-remove:disabled {

	opacity:
		0.5;

	cursor:
		default;

}


.cnls-side-cart-item.is-removing {

	opacity:
		0.45;

	pointer-events:
		none;

}


/* =========================================================
   EMPTY
   ========================================================= */

.cnls-side-cart-empty {

	min-height:
		100%;

	display:
		flex;

	align-items:
		center;

	justify-content:
		center;

	flex-direction:
		column;

	padding:
		50px
		0;

	text-align:
		center;

}


.cnls-side-cart-empty[hidden] {

	display:
		none !important;

}


.cnls-side-cart-empty h3 {

	max-width:
		320px;

	margin:
		0
		0
		16px !important;

	padding:
		0 !important;

	font-family:
		"Cormorant Garamond",
		Georgia,
		serif !important;

	font-size:
		36px !important;

	font-weight:
		500 !important;

	line-height:
		1.05 !important;

	color:
		var(--cnls-cart-title) !important;

}


.cnls-side-cart-empty p {

	max-width:
		300px;

	margin:
		0
		0
		32px;

	font-family:
		"Manrope",
		sans-serif;

	font-size:
		15px;

	line-height:
		1.65;

	color:
		rgba(
			244,
			233,
			199,
			0.62
		);

}


/* =========================================================
   CONTINUAR MIRANDO
   ========================================================= */

.cnls-side-cart-continue {

	display:
		inline-flex;

	align-items:
		center;

	justify-content:
		center;

	min-height:
		52px;

	padding:
		0
		24px;

	border:
		1px
		solid
		var(--cnls-cart-gold) !important;

	border-radius:
		0 !important;

	background:
		transparent !important;

	color:
		var(--cnls-cart-gold) !important;

	font-family:
		"Manrope",
		sans-serif !important;

	font-size:
		13px !important;

	font-weight:
		600 !important;

	letter-spacing:
		0.8px;

	text-transform:
		uppercase;

	cursor:
		pointer;

}


/* =========================================================
   FOOTER
   ========================================================= */

.cnls-side-cart-footer {

	flex:
		0 0 auto;

	padding:
		24px
		34px
		32px;

	border-top:
		1px
		solid
		var(--cnls-cart-divider);

	background:
		var(--cnls-cart-bg);

}


.cnls-side-cart-footer[hidden] {

	display:
		none !important;

}


/* =========================================================
   SUBTOTAL
   ========================================================= */

.cnls-side-cart-subtotal {

	display:
		flex;

	align-items:
		center;

	justify-content:
		space-between;

	margin-bottom:
		25px;

	font-family:
		"Manrope",
		sans-serif;

	font-size:
		13px;

	font-weight:
		500;

	letter-spacing:
		0.04em;

	color:
		var(--cnls-cart-gold);

}


.cnls-side-cart-subtotal-value {

	font-size:
		20px;

	font-weight:
		500;

	color:
		var(--cnls-cart-title);

}


/* =========================================================
   ACTIONS
   ========================================================= */

.cnls-side-cart-actions {

	display:
		grid;

	grid-template-columns:
		1fr
		1fr;

	gap:
		12px;

}


.cnls-side-cart-button {

	display:
		inline-flex;

	align-items:
		center;

	justify-content:
		center;

	min-height:
		52px;

	padding:
		0
		16px;

	border:
		1px
		solid
		var(--cnls-cart-gold) !important;

	border-radius:
		0 !important;

	background:
		transparent !important;

	color:
		var(--cnls-cart-gold) !important;

	font-family:
		"Manrope",
		sans-serif !important;

	font-size:
		13px !important;

	font-weight:
		600 !important;

	line-height:
		1.25;

	letter-spacing:
		0.8px;

	text-align:
		center;

	text-decoration:
		none !important;

	text-transform:
		uppercase;

	box-shadow:
		none !important;

	transition:
		color
		180ms
		ease,
		border-color
		180ms
		ease;

}


.cnls-side-cart-button:hover {

	border-color:
		var(--cnls-cart-title) !important;

	color:
		var(--cnls-cart-title) !important;

	background:
		transparent !important;

	transform:
		none !important;

}


/* =========================================================
   BODY LOCK
   ========================================================= */

body.cnls-side-cart-open {

	overflow:
		hidden;

}


/* =========================================================
   BLOCKSY
   ========================================================= */

body.cnls-side-cart-open
.ct-cart-dropdown,
body.cnls-side-cart-open
.ct-cart-item-dropdown {

	display:
		none !important;

}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (
	max-width: 900px
) {

	.cnls-side-cart {

		width:
			min(
				460px,
				82vw
			);

	}

}


@media (
	max-width: 650px
) {

	.cnls-side-cart {

		width:
			100%;

	}


	.cnls-side-cart-header {

		padding:
			25px
			22px
			22px;

	}


	.cnls-side-cart-content {

		padding:
			0
			22px;

	}


	.cnls-side-cart-footer {

		padding:
			20px
			22px
			25px;

	}


	.cnls-side-cart-title {

		font-size:
			34px !important;

	}


	.cnls-side-cart-item {

		grid-template-columns:
			65px
			minmax(
				0,
				1fr
			);

		column-gap:
			16px;

	}


	.cnls-side-cart-item-image-wrap {

		width:
			65px;

		height:
			82px;

	}


	.cnls-side-cart-item-name {

		font-size:
			15px;

	}


	.cnls-side-cart-remove {

		height:
			38px;

		margin-top:
			22px;

		padding:
			0
			10px;

		font-size:
			13px !important;

	}


	.cnls-side-cart-subtotal-value {

		font-size:
			18px;

	}

}


@media (
	max-width: 400px
) {

	.cnls-side-cart-actions {

		grid-template-columns:
			1fr;

	}

}


/* =========================================================
   REDUCED MOTION
   ========================================================= */

@media (
	prefers-reduced-motion: reduce
) {

	.cnls-side-cart,
	.cnls-side-cart-overlay,
	.cnls-side-cart-loading,
	.cnls-side-cart-remove {

		transition:
			none !important;

	}

	.cnls-side-cart-loader {

		animation:
			none !important;

	}

}
/* =========================================================
   CONTADOR DEL ÍCONO DEL CARRITO
   ========================================================= */

.ct-header-cart .ct-cart-count,
.ct-header-cart .ct-cart-item-count,
.ct-header-cart [data-count],
.ct-cart-item .ct-cart-count,
.ct-cart-item [data-count] {

	background-color:
		#ff0000 !important;

	color:
		#ffffff !important;

	border-color:
		#ff0000 !important;

}