/**
 * CAMARADA MOBILE — V1.5.0
 */

:root {
	--cm-orange: #ef6547;
	--cm-black: #171311;
	--cm-cream: #f7f0df;
	--cm-border: #241914;
}

@media (max-width: 1024px) {

	/* =====================================================
	   CARRITO
	   ===================================================== */

	.camarada-mobile-cart-header {
		position: fixed !important;

		/* JS define top/left usando logo + Mi Cuenta */
		right: auto !important;

		z-index:
			2147483000 !important;

		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;

		width: 34px !important;
		height: 34px !important;
		min-width: 34px !important;

		margin: 0 !important;
		padding: 0 !important;

		background:
			rgba(23,19,17,.94) !important;

		border:
			1px solid rgba(255,255,255,.68) !important;

		border-radius:
			50% !important;

		box-shadow:
			0 4px 12px rgba(0,0,0,.22) !important;

		color: #fff !important;
		text-decoration: none !important;

		-webkit-tap-highlight-color:
			transparent !important;
	}

	.camarada-mobile-cart-header__icon {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;

		width: 24px !important;
		height: 24px !important;

		font-size: 16px !important;
		line-height: 1 !important;
	}

	.camarada-mobile-cart-header__count {
		position: absolute !important;

		top: -5px !important;
		right: -5px !important;

		display: none;
		align-items: center !important;
		justify-content: center !important;

		min-width: 18px !important;
		height: 18px !important;

		padding: 0 4px !important;

		background:
			var(--cm-orange) !important;

		border:
			2px solid #111 !important;

		border-radius:
			999px !important;

		color: #fff !important;

		font-family:
			Arial,
			Helvetica,
			sans-serif !important;

		font-size: 8px !important;
		font-weight: 900 !important;
		line-height: 1 !important;
	}

	/*
	 * Solo ocultamos el trigger original mientras nuestro
	 * carrito está activo. JS quita esta clase en checkout
	 * o cuando no puede construir el carrito.
	 */
	.cm-original-cart-hidden {
		visibility: hidden !important;
		pointer-events: none !important;
	}

	/* =====================================================
	   PRECIOS
	   ===================================================== */

	.camarada-mobile-original-prices {
		display: none !important;
	}

	.camarada-mobile-prices-clone {
		position: relative !important;

		inset: auto !important;
		transform: none !important;
		float: none !important;

		display: block !important;

		width:
			calc(100% - 28px) !important;

		max-width: 680px !important;
		min-width: 0 !important;

		margin:
			14px auto 18px !important;

		padding: 14px !important;

		box-sizing:
			border-box !important;

		z-index: 2 !important;

		background:
			rgba(247,240,223,.98) !important;

		border:
			2px solid var(--cm-border) !important;

		border-radius:
			16px !important;

		box-shadow:
			4px 5px 0 rgba(23,19,17,.90),
			0 10px 22px rgba(0,0,0,.12) !important;
	}

	.camarada-mobile-prices-clone * {
		max-width: 100% !important;
		box-sizing:
			border-box !important;
	}

	/* =====================================================
	   MAPA
	   ===================================================== */

	.camarada-mobile-map-card {
		position: relative !important;

		width:
			calc(100% - 16px) !important;

		max-width:
			calc(100% - 16px) !important;

		margin-left: 8px !important;
		margin-right: 8px !important;

		box-sizing:
			border-box !important;

		overflow: visible !important;
	}

	.camarada-mobile-seat-viewport {
		position: relative !important;

		display: block !important;

		width: 100% !important;
		max-width: 100% !important;

		overflow-x: auto !important;
		overflow-y: hidden !important;

		-webkit-overflow-scrolling:
			touch !important;

		touch-action:
			pan-x pan-y !important;

		overscroll-behavior-x:
			none !important;

		padding:
			4px 0 12px !important;

		box-sizing:
			border-box !important;

		scrollbar-width:
			thin !important;
	}

	.camarada-mobile-seat-canvas {
		display: block !important;

		transform: none !important;
		transform-origin:
			top left !important;

		zoom: 1 !important;

		overflow: visible !important;

		margin: 0 !important;
		padding-right: 0 !important;
	}

	.camarada-mobile-seat {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;

		width: 46px !important;
		min-width: 46px !important;
		max-width: 46px !important;

		height: 46px !important;
		min-height: 46px !important;

		font-size: 12px !important;
		line-height: 1 !important;

		box-sizing:
			border-box !important;
	}

	.camarada-mobile-seat-viewport::-webkit-scrollbar {
		height: 5px !important;
	}

	.camarada-mobile-seat-viewport::-webkit-scrollbar-track {
		background:
			transparent !important;
	}

	.camarada-mobile-seat-viewport::-webkit-scrollbar-thumb {
		background:
			rgba(23,19,17,.30) !important;

		border-radius:
			999px !important;
	}

	.camarada-mobile-swipe-hint {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 7px !important;

		width:
			calc(100% - 28px) !important;

		margin:
			8px auto 12px !important;

		padding:
			9px 12px !important;

		box-sizing:
			border-box !important;

		border:
			1px dashed rgba(23,19,17,.45) !important;

		border-radius:
			999px !important;

		background:
			rgba(255,255,255,.50) !important;

		color:
			var(--cm-black) !important;

		font-family:
			Arial,
			Helvetica,
			sans-serif !important;

		font-size: 9px !important;
		font-weight: 900 !important;

		letter-spacing:
			.35px !important;

		text-transform:
			uppercase !important;
	}

	/* =====================================================
	   MINI CART
	   ===================================================== */

	.elementor-menu-cart__main,
	.xoo-wsc-container {
		width:
			min(94vw,430px) !important;

		max-width:
			min(94vw,430px) !important;
	}

	.elementor-menu-cart__product,
	.woocommerce-mini-cart-item,
	.xoo-wsc-product {
		display: grid !important;

		grid-template-columns:
			64px minmax(0,1fr) auto !important;

		gap: 10px !important;

		align-items:
			start !important;

		width: 100% !important;
		max-width: 100% !important;

		padding: 12px !important;

		box-sizing:
			border-box !important;
	}

	.elementor-menu-cart__product-image img,
	.woocommerce-mini-cart-item img,
	.xoo-wsc-img-col img {
		width: 64px !important;
		height: 64px !important;

		object-fit:
			cover !important;

		border-radius:
			9px !important;
	}

	.elementor-menu-cart__product-name,
	.woocommerce-mini-cart-item
	a:not(.remove),
	.xoo-wsc-product
	.xoo-wsc-pname {
		min-width: 0 !important;

		font-size: 12px !important;
		line-height: 1.15 !important;
		font-weight: 800 !important;

		white-space:
			normal !important;

		overflow-wrap:
			anywhere !important;
	}

	/* =====================================================
	   LANDSCAPE
	   ===================================================== */

	@media (orientation: landscape) {

		.camarada-mobile-prices-clone {
			position: relative !important;

			inset: auto !important;
			transform: none !important;

			width:
				calc(100% - 32px) !important;

			max-width:
				760px !important;

			margin:
				10px auto 14px !important;
		}

		.camarada-mobile-map-card {
			clear: both !important;

			width:
				calc(100% - 20px) !important;

			max-width:
				calc(100% - 20px) !important;

			margin:
				0 10px !important;
		}

		.camarada-mobile-seat-viewport {
			width: 100% !important;
			max-width: 100% !important;
		}
	}
}