/**
 * MLC Toolkit — Favoritos
 * ---------------------------------------------------------------------------
 * El corazón de la card vive en `feed.css` (es parte de la card). Aquí solo
 * está lo propio del módulo: el botón de la ficha de producto y la página de
 * listado.
 */

.mlc-wishlist {
	width: 100% !important;
	max-width: var(--mlc-container) !important;
	margin-inline: auto !important;
	font-family: var(--mlc-font-family) !important;
}

/* Botón de favorito en la ficha de producto. */
.mlc-fav--single {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	width: auto !important;
	height: auto !important;
	margin: var(--mlc-space-md) 0 0 !important;
	padding: 10px 16px !important;
	border: 1px solid var(--mlc-color-border) !important;
	background: none !important;
	font-family: var(--mlc-font-family) !important;
	font-weight: var(--mlc-fw-bold) !important;
	font-size: var(--mlc-fs-small) !important;
	color: var(--mlc-color-text) !important;
	cursor: pointer !important;
	transition: border-color var(--mlc-transition), color var(--mlc-transition) !important;
}

.mlc-fav--single:hover {
	transform: none !important;
	border-color: var(--mlc-color-sale) !important;
	color: var(--mlc-color-sale) !important;
}

.mlc-fav--single.is-active {
	border-color: var(--mlc-color-sale) !important;
	color: var(--mlc-color-sale) !important;
}

.mlc-fav--single .mlc-fav__off,
.mlc-fav--single .mlc-fav__on {
	display: none !important;
}

.mlc-fav--single .mlc-fav__off {
	display: inline-flex !important;
}

.mlc-fav--single.is-active .mlc-fav__off {
	display: none !important;
}

.mlc-fav--single.is-active .mlc-fav__on {
	display: inline-flex !important;
}

/* Enlace de favoritos del header (variante sin acción de carrito). */
.mlc-fav-link {
	text-decoration: none !important;
}

/* Barra de acciones de la página de favoritos. */
.mlc-wishlist__toolbar {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: flex-end !important;
	gap: var(--mlc-space-sm) !important;
	margin: 0 0 var(--mlc-space-lg) !important;
}

.mlc-wishlist__toolbar .mlc-btn {
	width: auto !important;
}

/* La rejilla, la barra y el estado vacío se alternan con `hidden`: hace
   falta ganar al `display` que les ponen sus propias reglas. */
.mlc-wishlist__toolbar[hidden],
.mlc-wishlist .mlc-grid[hidden],
.mlc-wishlist .mlc-empty[hidden] {
	display: none !important;
}

/* Acciones dentro de la card en la página de favoritos. */
.mlc-wishlist .mlc-card__actions .mlc-btn {
	font-size: var(--mlc-fs-tag) !important;
	padding: 10px 14px !important;
}