/**
 * Acciones de producto persistentes en home, catálogo, taxonomías y fichas.
 */

:root {
	--nauta-button-ink: #151312;
	--nauta-button-accent: #e6402b;
	--nauta-button-cart: #2f5d50;
	--nauta-catalog-cream: #f2eee4;
	--nauta-product-frame-padding: 14px;
}


/*
 * Alineacion vertical de las acciones por fila.
 * La grilla iguala la altura de cada producto; la tarjeta usa toda esa
 * altura y sus acciones quedan ancladas abajo, guiadas por el titulo mas largo.
 */
@media (min-width: 768px) {
	html body .woocommerce ul.products > li.product,
	html body.woocommerce ul.products > li.product,
	html body.woocommerce-page ul.products > li.product {
		display: flex !important;
		flex-direction: column !important;
	}

	html body .woocommerce ul.products > li.product > .post_item,
	html body.woocommerce ul.products > li.product > .post_item,
	html body.woocommerce-page ul.products > li.product > .post_item {
		display: flex !important;
		flex: 1 1 auto !important;
		flex-direction: column !important;
		width: 100% !important;
	}

	html body .woocommerce ul.products > li.product .post_data,
	html body.woocommerce ul.products > li.product .post_data,
	html body.woocommerce-page ul.products > li.product .post_data,
	html body .woocommerce ul.products > li.product .post_data_inner,
	html body.woocommerce ul.products > li.product .post_data_inner,
	html body.woocommerce-page ul.products > li.product .post_data_inner {
		display: flex !important;
		flex: 1 1 auto !important;
		flex-direction: column !important;
		width: 100% !important;
	}

	html body .woocommerce ul.products > li.product .post_data_inner > .wrap-data-hover,
	html body.woocommerce ul.products > li.product .post_data_inner > .wrap-data-hover,
	html body.woocommerce-page ul.products > li.product .post_data_inner > .wrap-data-hover {
		margin-top: auto !important;
	}
}

/*
 * Fondo comun del catalogo y de todas las grillas de publicaciones.
 * El crema separa visualmente el marco blanco que contiene cada portada.
 */
html body.post-type-archive-product .page_content_wrap,
html body.woocommerce-shop .page_content_wrap,
html body.tax-product_cat .page_content_wrap,
html body.tax-product_tag .page_content_wrap,
html body.woocommerce.search .page_content_wrap,
html body.woocommerce-page.search .page_content_wrap,
html body .sc_extended_products,
html body .elementor-widget-trx_sc_extended_products > .elementor-widget-container,
html body .e-con:has(> .elementor-widget-trx_sc_extended_products),
html body .e-con:has(> .e-con-inner > .elementor-widget-trx_sc_extended_products),
html body .woocommerce .related.products,
html body .woocommerce.related.products,
html body .woocommerce .upsells.products,
html body .woocommerce.upsells.products,
html body .woocommerce .up-sells.products,
html body .woocommerce.up-sells.products,
html body .woocommerce .cross-sells,
html body .woocommerce.cross-sells,
html body .nauta-author-publications,
html body .woocommerce ul.products,
html body.woocommerce ul.products,
html body.woocommerce-page ul.products,
html body ul.products.products {
	background-color: var(--nauta-catalog-cream) !important;
}

/*
 * Home: alinea visualmente las portadas con el resto de la pagina.
 * WooCommerce reserva cerca de 50px internos a cada lado de la grilla;
 * la compensacion conserva esos espacios sin encoger el ancho visible.
 */
html body.home .elementor-element.elementor-element-553c9b3 {
	width: 100% !important;
	max-width: calc(var(--theme-var-page, 1290px) + 100px) !important;
	margin-right: auto !important;
	margin-left: auto !important;
}

/* Las tarjetas se integran al crema; el marco de la portada sigue blanco. */
html body .woocommerce ul.products li.product,
html body .woocommerce ul.products li.product .post_item,
html body .woocommerce ul.products li.product .post_data,
html body.woocommerce ul.products li.product,
html body.woocommerce-page ul.products li.product {
	background-color: transparent !important;
}

html body .woocommerce ul.products li.product .post_featured,
html body.woocommerce ul.products li.product .post_featured,
html body.woocommerce-page ul.products li.product .post_featured {
	padding: 0 !important;
	background-color: #fff !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

html body .woocommerce ul.products li.product .post_featured > a,
html body.woocommerce ul.products li.product .post_featured > a,
html body.woocommerce-page ul.products li.product .post_featured > a {
	display: block !important;
	width: 100% !important;
	padding: var(--nauta-product-frame-padding) !important;
	background-color: #fff !important;
	box-sizing: border-box !important;
	overflow: hidden !important;
}

html body .woocommerce ul.products li.product .post_featured > a > img,
html body.woocommerce ul.products li.product .post_featured > a > img,
html body.woocommerce-page ul.products li.product .post_featured > a > img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	margin: 0 !important;
	filter: drop-shadow(0 5px 6px rgba(21, 19, 18, .14)) !important;
	transition: filter .22s ease, transform .22s ease !important;
}

/* La sombra pertenece a la publicacion, no al marco blanco. */
@media (hover: hover) and (pointer: fine) {
	html body .woocommerce ul.products li.product:hover .post_featured > a > img,
	html body.woocommerce ul.products li.product:hover .post_featured > a > img,
	html body.woocommerce-page ul.products li.product:hover .post_featured > a > img {
		filter: drop-shadow(0 7px 9px rgba(21, 19, 18, .22)) !important;
	}
}

html body .woocommerce ul.products li.product .post_featured > a:focus-visible > img,
html body.woocommerce ul.products li.product .post_featured > a:focus-visible > img,
html body.woocommerce-page ul.products li.product .post_featured > a:focus-visible > img {
	filter: drop-shadow(0 7px 9px rgba(21, 19, 18, .22)) !important;
}

/*
 * Los títulos de producto conservan el negro editorial en reposo y usan el
 * naranja Nauta al interactuar. Se evita así el celeste heredado del tema.
 */
html body .woocommerce ul.products li.product .woocommerce-loop-product__title a,
html body.woocommerce ul.products li.product .woocommerce-loop-product__title a,
html body.woocommerce-page ul.products li.product .woocommerce-loop-product__title a {
	color: var(--nauta-button-ink) !important;
}

html body .woocommerce ul.products li.product .woocommerce-loop-product__title a:hover,
html body .woocommerce ul.products li.product .woocommerce-loop-product__title a:focus-visible,
html body.woocommerce ul.products li.product .woocommerce-loop-product__title a:hover,
html body.woocommerce ul.products li.product .woocommerce-loop-product__title a:focus-visible,
html body.woocommerce-page ul.products li.product .woocommerce-loop-product__title a:hover,
html body.woocommerce-page ul.products li.product .woocommerce-loop-product__title a:focus-visible {
	color: var(--nauta-button-accent) !important;
	outline: none;
}

/*
 * Cinta diagonal para publicaciones agotadas.
 *
 * El tema inserta el mismo .outofstock_label sobre la portada en el home,
 * catalogo, taxonomias, resultados de busqueda y productos relacionados.
 * Mantener la regla global evita que cada grilla termine con una variante.
 */
html body .woocommerce ul.products li.product .outofstock_label,
html body.woocommerce ul.products li.product .outofstock_label,
html body.woocommerce-page ul.products li.product .outofstock_label {
	position: absolute !important;
	z-index: 20 !important;
	top: 24px !important;
	left: -48px !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 192px !important;
	min-width: 192px !important;
	height: 32px !important;
	min-height: 32px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-sizing: border-box !important;
	background: var(--nauta-button-ink) !important;
	box-shadow: none !important;
	color: #fff !important;
	font-family: Oswald, sans-serif !important;
	font-size: 11px !important;
	font-style: normal !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	letter-spacing: .16em !important;
	text-align: center !important;
	text-transform: uppercase !important;
	white-space: nowrap !important;
	pointer-events: none !important;
	transform: rotate(-45deg) !important;
	transform-origin: center !important;
}

/* Si un agotado tambien esta rebajado, la oferta conserva su propia esquina. */
html body .woocommerce ul.products li.product .outofstock_label + .onsale,
html body.woocommerce ul.products li.product .outofstock_label + .onsale,
html body.woocommerce-page ul.products li.product .outofstock_label + .onsale {
	top: 16px !important;
	right: 16px !important;
	left: auto !important;
}

/*
 * Home: la imagen ya tiene las mismas acciones debajo de la ficha.
 * Se ocultan la mascara blanca y sus iconos duplicados, pero se conserva
 * el enlace de la portada para entrar a la publicacion.
 */
html body .woocommerce ul.products li.product .post_item .post_featured.hover_shop .mask,
html body .woocommerce ul.products li.product .post_item .post_featured.hover_shop .icons,
html body .woocommerce ul.products li.product.product .post_featured.hover_shop .bottom-info {
	display: none !important;
	visibility: hidden !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

/*
 * Catalogo (estilo Plain): el tema oculta las acciones en un panel absoluto
 * y dibuja una placa gris al pasar el cursor. Las acciones pasan a formar
 * parte normal de la tarjeta, igual que en el home.
 */
html body ul.products.products li.product.product_style_plain.product_style_plain .post_item::before {
	display: none !important;
	content: none !important;
}

html body ul.products.products li.product.product_style_plain.product_style_plain .wrap-data-hover.wrap-data-hover,
html body ul.products.products li.product.product_style_plain.product_style_plain .post_item:hover .wrap-data-hover.wrap-data-hover {
	position: static !important;
	z-index: auto !important;
	display: inline-flex !important;
	visibility: visible !important;
	opacity: 1 !important;
	width: auto !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	transform: none !important;
}

html body ul.products.products li.product.product_style_plain.product_style_plain .wrap-data-hover.wrap-data-hover .add_to_cart_wrap {
	margin: 0 !important;
}

/* El boton del catalogo usa el mismo rotulo limpio del home, sin icono. */
html body ul.products.products li.product.product_style_plain .post_data .button.add_to_cart_button:not(.loading)::before {
	display: none !important;
	content: none !important;
}

body.woocommerce ul.products li.product .post_data,
body .woocommerce ul.products li.product .post_data,
body.woocommerce-page ul.products li.product .post_data {
	overflow: visible;
}

body.woocommerce ul.products li.product .post_data .post_data_inner > .wrap-data-hover,
body.woocommerce-page ul.products li.product .post_data .post_data_inner > .wrap-data-hover,
body .woocommerce ul.products li.product .post_data .post_data_inner > .wrap-data-hover,
body.woocommerce ul.products li.product .post_data .wrap-data-hover .add_to_cart_wrap,
body.woocommerce-page ul.products li.product .post_data .wrap-data-hover .add_to_cart_wrap,
body .woocommerce ul.products li.product .post_data .wrap-data-hover .add_to_cart_wrap {
	display: inline-flex !important;
	width: auto !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	vertical-align: top;
}

body.woocommerce ul.products li.product .post_data .button.add_to_cart_button,
body.woocommerce ul.products li.product .post_data .yith-wcqv-button,
body .woocommerce ul.products li.product .post_data .button.add_to_cart_button,
body .woocommerce ul.products li.product .post_data .yith-wcqv-button,
body.woocommerce-page ul.products li.product .post_data .button.add_to_cart_button,
body.woocommerce-page ul.products li.product .post_data .yith-wcqv-button {
	position: relative !important;
	display: inline-flex !important;
	visibility: visible !important;
	opacity: 1 !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	height: 38px !important;
	min-height: 38px !important;
	margin: 8px 5px 0 0 !important;
	padding: 0 12px !important;
	border: 1px solid var(--nauta-button-ink) !important;
	border-radius: 0 !important;
	box-sizing: border-box !important;
	box-shadow: 2px 2px 0 rgba(21, 19, 18, .28) !important;
	font-family: Roboto, sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	line-height: 1.1 !important;
	letter-spacing: .04em !important;
	text-decoration: none !important;
	text-transform: uppercase !important;
	transform: none;
	transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}

/* El tema convierte este enlace en un bloque de ancho completo en el catálogo. */
html body.woocommerce ul.products li.product .post_data .post_data_inner a.shop_cart.button.product_in_stock,
html body.woocommerce-page ul.products li.product .post_data .post_data_inner a.shop_cart.button.product_in_stock,
html body .woocommerce ul.products li.product .post_data .post_data_inner a.shop_cart.button.product_in_stock {
	display: inline-flex !important;
	width: max-content !important;
	max-width: 100% !important;
	float: none !important;
}

/* Los productos agotados conservan únicamente la acción Vista rápida. */
html body.woocommerce ul.products li.product .post_data .post_data_inner a.shop_cart.button.product_out_stock,
html body.woocommerce-page ul.products li.product .post_data .post_data_inner a.shop_cart.button.product_out_stock,
html body .woocommerce ul.products li.product .post_data .post_data_inner a.shop_cart.button.product_out_stock {
	display: none !important;
}

body.woocommerce ul.products li.product .post_data .button.add_to_cart_button,
body .woocommerce ul.products li.product .post_data .button.add_to_cart_button,
body.woocommerce-page ul.products li.product .post_data .button.add_to_cart_button {
	background: var(--nauta-button-accent) !important;
	color: #fff !important;
}

/*
 * WooCommerce agrega "Ver carrito" como un enlace nuevo tras la compra.
 * En el home ese enlace sustituye visualmente a "Anadir" dentro del mismo
 * espacio y usa un verde oscuro para comunicar que el producto ya se agrego.
 */
html body.woocommerce ul.products li.product .post_data .button.add_to_cart_button.added,
html body.woocommerce-page ul.products li.product .post_data .button.add_to_cart_button.added,
html body ul.products.products li.product.product.product_style_plain .post_data .button.add_to_cart_button.added,
html body ul.products.products li.product.product.product_style_plain .post_data .add_to_cart_wrap:has(.added_to_cart) .button.add_to_cart_button,
html body .woocommerce ul.products li.product .post_data .button.add_to_cart_button.added {
	display: none !important;
}

body .woocommerce ul.products li.product .post_data .add_to_cart_wrap .added_to_cart {
	position: relative !important;
	display: inline-flex !important;
	visibility: visible !important;
	opacity: 1 !important;
	align-items: center !important;
	justify-content: center !important;
	width: auto !important;
	height: 38px !important;
	min-height: 38px !important;
	margin: 8px 5px 0 0 !important;
	padding: 0 12px !important;
	border: 1px solid var(--nauta-button-ink) !important;
	border-radius: 0 !important;
	box-sizing: border-box !important;
	box-shadow: 2px 2px 0 rgba(21, 19, 18, .28) !important;
	background: var(--nauta-button-cart) !important;
	color: #fff !important;
	font-family: Roboto, sans-serif !important;
	font-size: 11px !important;
	font-weight: 800 !important;
	line-height: 1.1 !important;
	letter-spacing: .04em !important;
	text-decoration: none !important;
	text-transform: uppercase !important;
	transform: none;
	transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}

body .woocommerce ul.products li.product .post_data .add_to_cart_wrap .added_to_cart::before {
	content: "\2713" !important;
	margin-right: 6px;
	font-family: Arial, sans-serif !important;
	font-size: 12px;
	font-style: normal !important;
}

body .woocommerce ul.products li.product .post_data .add_to_cart_wrap .added_to_cart::after {
	display: none !important;
	content: none !important;
}

body .woocommerce ul.products li.product .post_data .add_to_cart_wrap .added_to_cart:hover,
body .woocommerce ul.products li.product .post_data .add_to_cart_wrap .added_to_cart:focus-visible {
	background: #24483e !important;
	box-shadow: 4px 4px 0 rgba(21, 19, 18, .28) !important;
	transform: translate(-1px, -1px);
	outline: none;
}

body.woocommerce ul.products li.product .post_data .yith-wcqv-button,
body .woocommerce ul.products li.product .post_data .yith-wcqv-button,
body.woocommerce-page ul.products li.product .post_data .yith-wcqv-button {
	background: transparent !important;
	color: var(--nauta-button-ink) !important;
}

body.woocommerce ul.products li.product .post_data .button.add_to_cart_button:hover,
body.woocommerce ul.products li.product .post_data .button.add_to_cart_button:focus-visible,
body.woocommerce ul.products li.product .post_data .yith-wcqv-button:hover,
body.woocommerce ul.products li.product .post_data .yith-wcqv-button:focus-visible,
body .woocommerce ul.products li.product .post_data .button.add_to_cart_button:hover,
body .woocommerce ul.products li.product .post_data .button.add_to_cart_button:focus-visible,
body .woocommerce ul.products li.product .post_data .yith-wcqv-button:hover,
body .woocommerce ul.products li.product .post_data .yith-wcqv-button:focus-visible {
	box-shadow: 4px 4px 0 rgba(21, 19, 18, .28) !important;
	transform: translate(-1px, -1px);
	outline: none;
}

@media (prefers-reduced-motion: reduce) {
	body .woocommerce ul.products li.product .post_data .button.add_to_cart_button,
	body .woocommerce ul.products li.product .post_data .yith-wcqv-button,
	body .woocommerce ul.products li.product .post_featured > a > img {
		transition: none;
	}
}

/* Encabezados editoriales coherentes en obras relacionadas y publicaciones. */
.single-product div.product .related.products > h2,
.single-product div.product .upsells.products > h2,
.single-product div.product .up-sells.products > h2,
.woocommerce .cross-sells > h2,
.nauta-author-publications__title {
	font-family: "Bebas Neue", cursive !important;
	font-weight: 400 !important;
	letter-spacing: 0 !important;
}


/* Fondo blanco definitivo para las grillas y vistas de WooCommerce. */
:root {
    --nauta-catalog-cream: #ffffff;
}

/* Carrito y pago también usan el fondo blanco global. */
html body.woocommerce-cart .page_content_wrap,
html body.woocommerce-checkout .page_content_wrap {
    background-color: #ffffff !important;
}/* Prioridad final para mantener las acciones alineadas por fila. */
@media (min-width: 768px) {
    html body .woocommerce ul.products.products > li.product.product_style_plain .post_data .post_data_inner > .wrap-data-hover.wrap-data-hover,
    html body.woocommerce ul.products.products > li.product.product_style_plain .post_data .post_data_inner > .wrap-data-hover.wrap-data-hover,
    html body.woocommerce-page ul.products.products > li.product.product_style_plain .post_data .post_data_inner > .wrap-data-hover.wrap-data-hover {
        margin-top: auto !important;
    }
}



/* Home: conserva la composicion compacta de las acciones del widget creativo. */
@media (min-width: 768px) {
    html body.home .woocommerce ul.products.products_style_creative > li.product .post_data_inner {
        display: block !important;
        flex: none !important;
    }
}


/* Home: ambos botones caben en una sola linea incluso en la tarjeta mas estrecha. */
@media (min-width: 768px) {
    html body.home .woocommerce ul.products.products_style_creative > li.product .post_data_inner > a.add_to_cart_button {
        margin-right: 4px !important;
    }
    html body.home .woocommerce ul.products.products_style_creative > li.product .post_data_inner > a.yith-wcqv-button {
        margin-right: 0 !important;
    }
}


/* El espacio natural entre enlaces aporta la separacion visual en el home. */
@media (min-width: 768px) {
    html body.home .woocommerce ul.products.products_style_creative > li.product .post_data_inner > a.add_to_cart_button {
        margin-right: 0 !important;
    }
}