/**
 * Estilos para el carrito de Café Maurice
 * Soluciona problemas de posicionamiento de mensajes de error
 */

/* Ocultar header de página en el carrito */
body.woocommerce-cart #page-header {
	display: none !important;
}

/* Contenedor de notificaciones de WooCommerce en el carrito */
body.woocommerce-cart .woocommerce-notices-wrapper {
	position: relative !important;
	width: 100% !important;
	margin-bottom: 5px !important;
	z-index: 1 !important;
	clear: both !important;
	overflow: visible !important;
}
body.woocommerce-cart .maurice-cart-heading{
	margin-bottom: 0px !important;
}
/* Mensajes de error, éxito e info en el carrito - mismo formato que checkout */
body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-error,
body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-message,
body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-info,
body.woocommerce-cart .wc-empty-cart-message .woocommerce-info {
	position: relative !important;
	width: 100% !important;
	margin-bottom: 24px !important;
	box-sizing: border-box !important;
	clear: both !important;
	overflow: visible !important;
	background-color: #f9f8f7 !important;
	border-radius: 28px !important;
	padding: 50px 80px !important;
	border: 0 !important;
	font-family: 'Outfit', sans-serif !important;
	font-size: 20px !important;
	font-weight: 400 !important;
	color: #1a1a1a !important;
	list-style: none !important;
}

/* Mensajes de error específicos */
body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-error {
	color: #ff3100 !important;
}

/* Mensajes de éxito */
body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-message {
	color: #009245 !important;
}

/* Enlaces dentro de los mensajes */
body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-message a,
body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-info a,
body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-error a {
	color: #fc805a !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-message a:hover,
body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-info a:hover,
body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-error a:hover {
	color: #ff6b35 !important;
	text-decoration: underline !important;
}

/* Evitar que los mensajes se sobrepongan con otros elementos */
body.woocommerce-cart .woocommerce-notices-wrapper + * {
	clear: both !important;
	margin-top: 0 !important;
}

/* Asegurar que el contenedor del carrito tenga espacio para los mensajes */
body.woocommerce-cart .woocommerce {
	position: relative !important;
	overflow: visible !important;
}

body.woocommerce-cart .woocommerce-cart-form {
	margin-top: 0 !important;
}

/* Contenedor del carrito vacío */
body.woocommerce-cart .wc-empty-cart-message {
	position: relative !important;
	z-index: 1 !important;
	clear: both !important;
	margin-bottom: 24px !important;
}

/* Botón "Volver a la tienda" - estilo naranja de la app */
body.woocommerce-cart .return-to-shop {
	margin-top: 32px !important;
	text-align: center !important;
	position: relative !important;
	z-index: 2 !important;
	clear: both !important;
	display: block !important;
}

/* Botón "Volver a la tienda" - estado normal */
/* Usando ID añadido por JavaScript para máxima especificidad y evitar conflictos con el tema */
#maurice-return-button {
	background-color: #fc805a !important;
	color: #ffffff !important;
	border: 3px solid #fc805a !important;
	border-radius: 50px !important;
	padding: 12px 40px !important;
	font-family: 'Outfit', sans-serif !important;
	font-size: 20px !important;
	font-weight: 600 !important;
	text-decoration: none !important;
	display: inline-block !important;
	transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease !important;
	cursor: pointer !important;
	box-shadow: none !important;
}

/* Botón "Volver a la tienda" - estado hover (naranja más oscuro, texto blanco) */
/* Usando ID añadido por JavaScript para máxima especificidad y evitar conflictos con el tema */
#maurice-return-button:hover,
#maurice-return-button:focus,
#maurice-return-button:active {
	background-color: #ff6b35 !important;
	border-color: #ff6b35 !important;
	color: #ffffff !important;
	text-decoration: none !important;
	box-shadow: none !important;
	outline: none !important;
}

/* Mensajes de cupones en el contenedor de substripe */
/* Asegurar que el contenedor no ocupe espacio cuando está vacío */
body.woocommerce-cart .maurice-coupon-visual[data-context="cart"],
body.woocommerce-cart .maurice-checkout-coupon-section[data-context="cart"] {
	min-height: 0 !important;
}

/* Mensajes de cupones - tanto éxito como error - mismos estilos base */
body.woocommerce-cart .maurice-coupon-visual[data-context="cart"] .maurice-coupon-inline-message,
body.woocommerce-cart .maurice-checkout-coupon-section[data-context="cart"] .maurice-coupon-inline-message {
	display: block !important;
	margin-top: 12px !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	font-family: 'Outfit', sans-serif !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
}

/* Mensaje de error de cupón - color rojo */
body.woocommerce-cart .maurice-coupon-visual[data-context="cart"] .maurice-coupon-inline-message.coupon-error-notice,
body.woocommerce-cart .maurice-checkout-coupon-section[data-context="cart"] .maurice-coupon-inline-message.coupon-error-notice {
	color: #ff3100 !important;
}

/* Mensaje de éxito de cupón - color verde */
body.woocommerce-cart .maurice-coupon-visual[data-context="cart"] .maurice-coupon-inline-message.maurice-coupon-message,
body.woocommerce-cart .maurice-checkout-coupon-section[data-context="cart"] .maurice-coupon-inline-message.maurice-coupon-message {
	color: #009245 !important;
}

/* Responsive */
@media (max-width: 1024px) {
	body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-error,
	body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-message,
	body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-info,
	body.woocommerce-cart .wc-empty-cart-message .woocommerce-info {
		padding: 32px 40px !important;
	}
}

@media (max-width: 768px) {
	body.woocommerce-cart .woocommerce-notices-wrapper {
		margin-bottom: 16px !important;
	}
	
	body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-error,
	body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-message,
	body.woocommerce-cart .woocommerce-notices-wrapper .woocommerce-info,
	body.woocommerce-cart .wc-empty-cart-message .woocommerce-info {
		margin-bottom: 16px !important;
		padding: 24px 16px !important;
		border-radius: 22px !important;
		font-size: 16px !important;
	}
	
	#maurice-return-button {
		font-size: 18px !important;
		padding: 10px 32px !important;
	}
}

/* ========================================
   Botón de Aplicar Cupón - Sin translate
======================================== */

/* Estilos base del botón con mayor especificidad para sobrescribir substripe-cart.css */
body.substripe-maurice-cart .cart_totals .maurice-coupon-apply-btn,
body.substripe-maurice-cart .cart_totals .maurice-cart-coupon button,
body.substripe-maurice-cart .maurice-coupon-input-wrapper .maurice-coupon-apply-btn {
	border-radius: 104px !important;
	padding: 20px 26px !important;
	background-color: transparent !important;
	color: #000000 !important;
	font-weight: 600 !important;
	border: 2px solid #000000 !important;
	transition: box-shadow 0.15s ease, background 0.15s ease !important;
	cursor: pointer;
	display: inline-block;
	width: 35%;
	flex: 1 1 35%;
}

/* Hover - sin translate, solo cambio de color */
body.substripe-maurice-cart .cart_totals .maurice-coupon-apply-btn:hover,
body.substripe-maurice-cart .cart_totals .maurice-cart-coupon button:hover,
body.substripe-maurice-cart .maurice-coupon-input-wrapper .maurice-coupon-apply-btn:hover {
	transform: none !important;
	background-color: #000000 !important;
	color: #ffffff !important;
}

/* Responsive */
@media (max-width: 700px) {
	body.substripe-maurice-cart .cart_totals .maurice-coupon-apply-btn,
	body.substripe-maurice-cart .cart_totals .maurice-cart-coupon button,
	body.substripe-maurice-cart .maurice-coupon-input-wrapper .maurice-coupon-apply-btn {
		width: 100% !important;
		flex: 1 1 100% !important;
	}
}

/* Cambiar icono de papelera por X en el carrito */
.maurice-cart-remove-icon.material-icons-outlined,
.maurice-cart-remove .material-icons-outlined {
	font-size: 0 !important; /* Ocultar el texto "delete" */
	position: relative !important;
	display: inline-block !important;
	width: 20px !important;
	height: 20px !important;
	line-height: 1 !important;
	vertical-align: middle !important;
}

/* Mostrar X usando :after */
.maurice-cart-remove-icon.material-icons-outlined:after,
.maurice-cart-remove .material-icons-outlined:after {
	content: "×" !important; /* Símbolo X */
	font-size: 24px !important;
	font-weight: 300 !important;
	line-height: 1 !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
	font-family: Arial, sans-serif !important;
	color: inherit !important;
}

/* Si el icono está dentro del enlace remove */
.maurice-cart-remove .remove .material-icons-outlined {
	font-size: 0 !important;
	position: relative !important;
	display: inline-block !important;
	width: 20px !important;
	height: 20px !important;
}

.maurice-cart-remove .remove .material-icons-outlined:after {
	content: "×" !important;
	font-size: 24px !important;
	font-weight: 300 !important;
	line-height: 1 !important;
	position: absolute !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
	font-family: Arial, sans-serif !important;
	color: inherit !important;
}