/* =========================================
   CONFIGURACIÓN GENERAL
   ========================================= */

.pixel-cart-icon {
	--pixel-cart-svg-color: #1c2647;
	--pixel-cart-badge-background: #db4b3f;
	--pixel-cart-badge-color: #ffffff;
	--pixel-cart-badge-border: #ffffff;

	position: relative;
	display: inline-flex;
	flex: 0 0 auto;
	width: fit-content !important;
	overflow: visible;
}

/* Header con íconos blancos */
.pixel-cart-icon.pixel-cart-white {
	--pixel-cart-svg-color: #ffffff;
}

/* Header con íconos azules */
.pixel-cart-icon.pixel-cart-blue {
	--pixel-cart-svg-color: #1c2647;
}

/* Forzar el color del SVG según el header */
.pixel-cart-icon .elementor-icon-list-icon svg path {
	fill: var(--pixel-cart-svg-color) !important;
	stroke: var(--pixel-cart-svg-color) !important;
}

/* =========================================
   WIDGET SHORTCODE
   ========================================= */

/*
 * Coloca el shortcode encima del ícono.
 * Evita que se comporte como otro elemento del flex.
 */
.pixel-cart-icon > .elementor-widget-shortcode {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 20;

	width: 0 !important;
	min-width: 0 !important;
	height: 0 !important;

	margin: 0 !important;
	padding: 0 !important;

	overflow: visible;
	pointer-events: none;
}

.pixel-cart-icon > .elementor-widget-shortcode > .elementor-shortcode {
	position: relative;
	width: 0;
	height: 0;
	line-height: 0;
	overflow: visible;
}

/* =========================================
   CONTADOR
   ========================================= */

.pixel-cart-icon .pixel-cart-count {
	position: absolute;
	top: -7px;
	right: -8px;
	z-index: 21;
}

.pixel-cart-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	box-sizing: border-box;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;

	border: 2px solid var(--pixel-cart-badge-border);
	border-radius: 999px;

	background-color: var(--pixel-cart-badge-background);
	color: var(--pixel-cart-badge-color);

	font-family: inherit;
	font-size: 10px;
	font-weight: 700;
	line-height: 1;

	pointer-events: none;
}

/* Ocultar cuando el carrito esté vacío */
.pixel-cart-count.is-empty {
	display: none;
}