/**
 * ILNATURAL — WooCommerce notices as top-right toasts (relocated by woocommerce-toasts.js).
 */

/* Before JS runs, keep classic wrappers out of the page flow at the toast corner. */
.woocommerce-notices-wrapper:not([data-ilnatural-toast-relocated]) {
	position: fixed !important;
	top: max(1rem, env(safe-area-inset-top, 0px));
	right: max(1rem, env(safe-area-inset-right, 0px));
	left: auto !important;
	bottom: auto !important;
	z-index: 999949;
	max-width: min(22rem, calc(100vw - 2rem));
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	pointer-events: none;
}

.woocommerce-notices-wrapper:not([data-ilnatural-toast-relocated]) > * {
	pointer-events: auto;
}

.wc-block-components-notices:not([data-ilnatural-toast-relocated]) {
	position: fixed !important;
	top: max(1rem, env(safe-area-inset-top, 0px));
	right: max(1rem, env(safe-area-inset-right, 0px));
	left: auto !important;
	z-index: 999949;
	max-width: min(22rem, calc(100vw - 2rem));
	pointer-events: none;
}

.wc-block-components-notices:not([data-ilnatural-toast-relocated]) > * {
	pointer-events: auto;
}

#ilnatural-wc-toast-stack,
.ilnatural-wc-toast-stack {
	position: fixed !important;
	top: max(1rem, env(safe-area-inset-top, 0px));
	right: max(1rem, env(safe-area-inset-right, 0px));
	left: auto !important;
	bottom: auto !important;
	z-index: 999950;
	max-width: min(22rem, calc(100vw - 2rem));
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	pointer-events: none;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.75rem;
}

#ilnatural-wc-toast-stack > *,
.ilnatural-wc-toast-stack > * {
	pointer-events: auto;
	width: 100%;
}

/* Inside the stack, notices are normal flow (not nested fixed). */
#ilnatural-wc-toast-stack .woocommerce-notices-wrapper,
.ilnatural-wc-toast-stack .woocommerce-notices-wrapper {
	position: relative !important;
	top: auto !important;
	right: auto !important;
	left: auto !important;
	bottom: auto !important;
	max-width: 100% !important;
}

.woocommerce-notices-wrapper > *,
.wc-block-components-notices > * {
	pointer-events: auto;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
ul.woocommerce-message,
ul.woocommerce-info,
ul.woocommerce-error {
	list-style: none !important;
	margin: 0 0 0.75rem 0 !important;
	padding: 0.75rem 1rem !important;
	border-radius: 12px !important;
	border: none !important;
	box-shadow: 0 10px 36px rgba(27, 67, 50, 0.18) !important;
	font-size: 0.875rem !important;
	line-height: 1.45 !important;
	animation: ilnatural-toast-slide-in 0.4s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

#ilnatural-wc-toast-stack .woocommerce-notices-wrapper > :last-child .woocommerce-message,
#ilnatural-wc-toast-stack .woocommerce-notices-wrapper > :last-child ul.woocommerce-message,
#ilnatural-wc-toast-stack .woocommerce-notices-wrapper > :last-child .woocommerce-error,
#ilnatural-wc-toast-stack .woocommerce-notices-wrapper > :last-child ul.woocommerce-error,
#ilnatural-wc-toast-stack .woocommerce-notices-wrapper > :last-child .woocommerce-info,
#ilnatural-wc-toast-stack .woocommerce-notices-wrapper > :last-child ul.woocommerce-info {
	margin-bottom: 0 !important;
}

ul.woocommerce-message li,
ul.woocommerce-info li,
ul.woocommerce-error li {
	margin: 0 !important;
	padding: 0 !important;
}

/* Success — forest green, white text */
.woocommerce-message,
ul.woocommerce-message {
	background: #2c3e2d !important;
	color: #ffffff !important;
	border-left: 4px solid #d4a017 !important;
}

.woocommerce-message a,
ul.woocommerce-message a {
	color: #fdfcf8 !important;
	text-decoration: underline;
}

/* Info — readable on light toast */
.woocommerce-info,
ul.woocommerce-info {
	background: #edf3ee !important;
	color: #1a1c1a !important;
	border-left: 4px solid #3d5c3e !important;
}

.woocommerce-info a,
ul.woocommerce-info a {
	color: #2c3e2d !important;
}

/* Error — deep red, white text */
.woocommerce-error,
ul.woocommerce-error {
	background: #7f1d1d !important;
	color: #ffffff !important;
	border-left: 4px solid #4a0f0f !important;
}

.woocommerce-error a,
ul.woocommerce-error a {
	color: #fdfcf8 !important;
	text-decoration: underline;
}

.wc-block-components-notice-banner {
	position: relative !important;
	margin-bottom: 0.75rem !important;
	border-radius: 12px !important;
	box-shadow: 0 10px 36px rgba(27, 67, 50, 0.14) !important;
	animation: ilnatural-toast-slide-in 0.4s cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.wc-block-components-notice-banner.is-success {
	background: #2c3e2d !important;
	color: #ffffff !important;
}

.wc-block-components-notice-banner.is-error {
	background: #7f1d1d !important;
	color: #ffffff !important;
}

@keyframes ilnatural-toast-slide-in {
	from {
		opacity: 0;
		transform: translateX(100%);
	}

	to {
		opacity: 1;
		transform: translateX(0);
	}
}
