/**
 * Gia — Pixfort cart sidebar restyle.
 *
 * The sidebar is Pixfort's `.pix-sidebar` shell wrapping STANDARD WooCommerce
 * mini-cart markup (.woocommerce-mini-cart, .mini_cart_item, __total, __buttons).
 * We keep Pixfort's engine (trigger, badge, fragment refresh, open/close) and
 * only restyle: full-height white panel, Gia type, 4:5 thumbnails, squared
 * corners, black checkout button, "Ver carrito" hidden.
 *
 * Quantity is static text (1 × price) because the mini-cart has no stepper —
 * editable quantity would require custom AJAX, out of scope here.
 */

/* ---- Panel shell: full height, right-attached, pure white, no radius.
   Pixfort's own CSS sets `.pix-sidebar{position:fixed;width:360px;padding:10px}`
   and `.sidebar-inner{height:100%;display:inline-block;border-radius:6px}`.
   The inline-block child collapses because the fixed parent has no explicit
   height, and the 10px padding makes it float off the edge. We fix the PARENT:
   kill padding, pin full height, widen, and make the inner a flex column. ---- */
.pix-sidebar {
	width: 504px !important;
	max-width: 94vw !important;
	padding: 0 !important;
	height: 100% !important;
	top: 0 !important;
	bottom: 0 !important;
	transform: translateX(524px);
	z-index: 99999999999 !important;
}

.pix-sidebar.opened {
	transform: none !important;
}

.pix-sidebar .sidebar-inner {
	background: #fff !important;
	border-radius: 0 !important;
	height: 100% !important;
	width: 100% !important;
	display: flex !important;
	flex-direction: column !important;
	box-shadow: -20px 0 60px rgba(35, 33, 30, 0.18) !important;
	overflow: hidden !important;
	position: relative !important;
	z-index: 100000000000 !important;
}

.pix-sidebar .sidebar-content {
	display: flex !important;
	flex-direction: column !important;
	height: 100% !important;
	min-height: 0 !important;
	font-family: 'Jost', sans-serif !important;
}

/* ---- Header: EB Garamond title, hairline divider ---- */
.pix-sidebar .search-title,
.pix-sidebar .pix-sidebar-widget .widgettitle {
	font-family: 'EB Garamond', serif !important;
	font-weight: 400 !important;
	font-size: 24px !important;
	letter-spacing: 0.01em !important;
	color: #23211e !important;
	text-transform: none !important;
}

.pix-sidebar .pix-p-20 {
	padding: 26px 28px 20px !important;
}

/* WooCommerce widget's own h2 "Carrito" title is redundant with Pixfort's
   "Carrito de compra" header — hide it. */
.pix-sidebar .widget_shopping_cart > .widgettitle {
	display: none !important;
}

.pix-sidebar .pix-line-divider {
	background: #e6e6e6 !important;
	opacity: 1 !important;
}

/* ---- Widget wrapper fills remaining height so the item list scrolls and
   the total/buttons sit at the bottom ---- */
.pix-sidebar .pix-sidebar-widget,
.pix-sidebar .widget_shopping_cart,
.pix-sidebar .widget_shopping_cart_content {
	display: flex !important;
	flex-direction: column !important;
	flex: 1 1 auto !important;
	min-height: 0 !important;
}

/* ---- Item list ---- */
.pix-sidebar ul.woocommerce-mini-cart {
	flex: 1 1 auto !important;
	overflow-y: auto !important;
	margin: 0 !important;
	padding: 0 28px !important;
	list-style: none !important;
}

.pix-sidebar li.woocommerce-mini-cart-item {
	display: block !important;
	padding: 22px 34px 22px 108px !important;
	margin: 0 !important;
	border-bottom: 1px solid #f0f0f0 !important;
	position: relative !important;
	min-height: 128px !important;
}

/* Beat Pixfort's own high-specificity image rule (it forces 80x80 + radius 5px).
   We match its selector chain and scope to .pix-sidebar to win, then set the
   4:5 crop and square corners. */
.pix-sidebar .widget.woocommerce.widget_shopping_cart .woocommerce-mini-cart.cart_list.product_list_widget .woocommerce-mini-cart-item.mini_cart_item .attachment-woocommerce_thumbnail,
.pix-sidebar .widget.woocommerce.widget_shopping_cart .woocommerce-mini-cart.cart_list.product_list_widget .woocommerce-mini-cart-item.mini_cart_item img {
	position: absolute !important;
	left: 0 !important;
	top: 22px !important;
	width: 84px !important;
	height: 105px !important;
	aspect-ratio: 4 / 5 !important;
	object-fit: cover !important;
	display: block !important;
	margin: 0 !important;
	border-radius: 0 !important;
	max-width: none !important;
	float: none !important;
	overflow: hidden !important;
}

/* Product-name anchor: EB Garamond, sits in the padded area beside the image. */
.pix-sidebar li.woocommerce-mini-cart-item > a:not(.remove) {
	display: block !important;
	font-family: 'EB Garamond', serif !important;
	font-size: 17px !important;
	line-height: 1.25 !important;
	color: #23211e !important;
	text-decoration: none !important;
}

/* Quantity line (1 × ₲ price) sits below the name */
.pix-sidebar .woocommerce-mini-cart-item .quantity {
	display: block !important;
	font-family: 'Jost', sans-serif !important;
	font-size: 13px !important;
	letter-spacing: 0.02em !important;
	color: #4a463f !important;
	margin-top: 10px !important;
}

/* Remove × — small, top-right, muted → red on hover */
.pix-sidebar a.remove_from_cart_button,
.pix-sidebar li.woocommerce-mini-cart-item a.remove {
	position: absolute !important;
	top: 22px !important;
	right: 0 !important;
	width: 22px !important;
	height: 22px !important;
	font-size: 18px !important;
	line-height: 20px !important;
	text-align: center !important;
	color: #a8a29a !important;
	border-radius: 0 !important;
	background: none !important;
	left: auto !important;
}

.pix-sidebar a.remove_from_cart_button:hover,
.pix-sidebar li.woocommerce-mini-cart-item a.remove:hover {
	color: #a03030 !important;
	background: none !important;
}

/* ---- Subtotal ---- */
.pix-sidebar .woocommerce-mini-cart__total {
	display: flex !important;
	justify-content: space-between !important;
	align-items: baseline !important;
	padding: 20px 28px !important;
	margin: 0 !important;
	border-top: 1px solid #e6e6e6 !important;
	background: #fff !important;
}

.pix-sidebar .woocommerce-mini-cart__total strong {
	font-family: 'EB Garamond', serif !important;
	font-weight: 400 !important;
	font-size: 20px !important;
	color: #23211e !important;
}

.pix-sidebar .woocommerce-mini-cart__total .woocommerce-Price-amount {
	font-family: 'EB Garamond', serif !important;
	font-size: 22px !important;
	color: #23211e !important;
}

/* ---- Buttons: hide "Ver carrito", black square "Finalizar compra" ---- */
.pix-sidebar .woocommerce-mini-cart__buttons {
	display: block !important;
	padding: 0 28px 28px !important;
	margin: 0 !important;
}

.pix-sidebar .woocommerce-mini-cart__buttons .button.wc-forward:not(.checkout) {
	display: none !important;
}

.pix-sidebar .woocommerce-mini-cart__buttons .button.checkout {
	display: block !important;
	width: 100% !important;
	font-family: 'Jost', sans-serif !important;
	font-weight: 400 !important;
	font-size: 12px !important;
	letter-spacing: 0.16em !important;
	text-transform: uppercase !important;
	color: #fff !important;
	background: #23211e !important;
	border: none !important;
	border-radius: 0 !important;
	padding: 17px !important;
	text-align: center !important;
	transition: opacity 0.15s ease !important;
}

.pix-sidebar .woocommerce-mini-cart__buttons .button.checkout:hover {
	opacity: 0.86 !important;
	background: #23211e !important;
	color: #fff !important;
}

/* ---- Empty cart state ---- */
.pix-sidebar .woocommerce-mini-cart__empty-message {
	font-family: 'EB Garamond', serif !important;
	font-size: 18px !important;
	color: #8c8475 !important;
    padding: 40px 28px !important;
	text-align: center !important;
}

/* ---- Close icon ---- */
.pix-sidebar .pix-close-sidebar {
	color: #8c8475 !important;
}
.pix-sidebar .pix-close-sidebar:hover {
	color: #23211e !important;
}

@media (max-width: 600px) {
	/* Full-screen cart on mobile: the PARENT .pix-sidebar caps width, so it must
	   go 100vw (widening only .sidebar-inner isn't enough). Full height too, so
	   it reads as a page the user closes with the × rather than a side panel. */
	.pix-sidebar {
		width: 100vw !important;
		max-width: 100vw !important;
		height: 100% !important;
		height: 100dvh !important;
		top: 0 !important;
		bottom: 0 !important;
		left: 0 !important;
		right: 0 !important;
		transform: translateX(100vw);
	}
	.pix-sidebar.opened {
		transform: none !important;
	}
	.pix-sidebar .sidebar-inner {
		width: 100vw !important;
		max-width: 100vw !important;
		height: 100% !important;
		height: 100dvh !important;
		box-shadow: none !important;
	}
	.pix-sidebar ul.woocommerce-mini-cart,
	.pix-sidebar .pix-p-20,
	.pix-sidebar .woocommerce-mini-cart__total,
	.pix-sidebar .woocommerce-mini-cart__buttons {
		padding-left: 18px !important;
		padding-right: 18px !important;
	}
}
