.pmn-stock-alert { margin-top: 15px; }
.pmn-stock-alert__dialog { width: 100%; max-width: min(460px, calc(100vw - 32px)); padding: 24px; border: 0; }
.pmn-stock-alert__dialog::backdrop { background: rgb(0 0 0 / 0.45); }
.pmn-stock-alert__dialog h2 { margin: 0 0 12px; font-size: 20px; }
.pmn-stock-alert__form input[type="text"],
.pmn-stock-alert__form input[type="email"] { box-sizing: border-box; width: 100%; }
.pmn-stock-alert__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.pmn-stock-alert__note { font-size: 13px; }
.pmn-stock-alert__message:empty { display: none; }
.pmn-stock-alert__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.pmn-stock-alert [hidden] { display: none !important; }

/* Estilo Rosario (Bases PAIMUN 2026): AVISAR CUANDO HAYA STOCK / Avisarme = COMPRAR;
   Cerrar = AGREGAR AL CARRITO. Valores medidos en producción, botón.wd-buy-now-btn
   (COMPRAR) y .single_add_to_cart_button (AGREGAR AL CARRITO), 2026-09-28.
   Selectores encadenados con .button/.alt (las clases que ya trae el markup) para ganarle
   a .button.alt / .wd-buy-now-btn.button.alt de Woodmart por especificidad, sin !important.
   Breakpoint mobile y mecánica de "reemplazo de COMPRAR" tomados del stylesheet real del
   tema (xts-theme_settings_default-*.css, bloque propio T16 "Espacio para botones debajo
   del grid", GET directo 2026-09-28): @media (max-width:576px) — NO 767 —
   .product-image-summary-inner{padding-bottom:110px!important} y
   form.cart{position:absolute!important;width:100%!important;left:0;bottom:0}, botones al
   100%. Las ARR .single-product-page de abajo son de Woodmart y no matchean en el stack
   local (Storefront no trae esa body class), así que no alteran el E2E local. */
.pmn-stock-alert .pmn-stock-alert__open.button.alt,
.pmn-stock-alert .pmn-stock-alert__submit.button.alt {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 196px;
	min-height: 42px;
	padding: 5px 20px;
	background-color: #ff003a;
	color: #fff;
	border: 0;
	border-radius: 0;
	text-transform: uppercase;
}
.pmn-stock-alert .pmn-stock-alert__open.button.alt:hover,
.pmn-stock-alert .pmn-stock-alert__open.button.alt:focus,
.pmn-stock-alert .pmn-stock-alert__submit.button.alt:hover,
.pmn-stock-alert .pmn-stock-alert__submit.button.alt:focus {
	background-color: #ff003a;
	color: #fff;
}
.pmn-stock-alert .pmn-stock-alert__open.button.alt:focus-visible,
.pmn-stock-alert .pmn-stock-alert__submit.button.alt:focus-visible {
	outline: 2px solid #ff003a;
	outline-offset: 2px;
}

.pmn-stock-alert .pmn-stock-alert__close.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 5px 20px;
	background-color: #fff;
	color: #ff003a;
	border: 1px solid #ff003a;
	border-radius: 0;
	text-transform: uppercase;
}
.pmn-stock-alert .pmn-stock-alert__close.button:hover {
	background-color: #e4003a;
	color: #fff;
}
.pmn-stock-alert .pmn-stock-alert__close.button:focus-visible {
	outline: 2px solid #ff003a;
	outline-offset: 2px;
}

@media (max-width: 576px) {
	.pmn-stock-alert .pmn-stock-alert__open.button.alt,
	.pmn-stock-alert .pmn-stock-alert__submit.button.alt {
		width: 100%;
	}

	/* Fichas agotadas no tienen form.cart, así que el hueco de 110px que T16 reserva bajo
	   la imagen para dos botones queda vacío: el CTA lo ocupa igual que lo haría COMPRAR,
	   mismo lugar, ancho completo. 61px = 42px del botón + ~19px de separación, contra los
	   110px que se reservan para el par COMPRAR + AGREGAR AL CARRITO. */
	.single-product-page .product-image-summary-inner:has(.pmn-stock-alert) {
		padding-bottom: 61px !important;
	}
	.single-product-page .pmn-stock-alert {
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		margin: 0;
	}
}
