/* ========================================================================== 
   WooCommerce notices — single site-wide source of truth

   These defaults mirror WooCommerce 11.0.1. Edit the shared variables for
   uniform changes, or the tone variables for success/error/warning/info.
   The Notification Style Lab renders the same classes and inherits this file.
   ========================================================================== */

:root {
	/* Shared notice styling */
	--mr-wcn-background: #171717;
	--mr-wcn-text: #f5f5f5;
	--mr-wcn-border-top-width: 3px;
	--mr-wcn-border-top-style: solid;
	--mr-wcn-radius: 0;
	--mr-wcn-font-family: inherit;
	--mr-wcn-font-size: inherit;
	--mr-wcn-font-weight: 400;
	--mr-wcn-line-height: inherit;
	--mr-wcn-padding: 1em 2em 1em 3.5em;
	--mr-wcn-margin: 0 0 2em;
	--mr-wcn-shadow: none;
	--mr-wcn-icon-font-family: "WooCommerce";
	--mr-wcn-icon-top: 1em;
	--mr-wcn-icon-inline-start: 1.5em;
	--mr-wcn-animation-duration: 0ms;
	--mr-wcn-animation-easing: ease;

	/* Success override */
	--mr-wcn-success-background: #171717;
	--mr-wcn-success-text: #f5f5f5;
	--mr-wcn-success-accent: var(--mr-color-accent, #b2600f);
	--mr-wcn-success-icon: "\e015";

	/* Error override */
	--mr-wcn-error-background: #171717;
	--mr-wcn-error-text: #f5f5f5;
	--mr-wcn-error-accent: #b81c23;
	--mr-wcn-error-icon: "\e016";

	/* Warning override; WooCommerce core has no warning notice template */
	--mr-wcn-warning-background: #171717;
	--mr-wcn-warning-text: #f5f5f5;
	--mr-wcn-warning-accent: var(--mr-color-accent, #b2600f);
	--mr-wcn-warning-icon: "\e016";

	/* Info override */
	--mr-wcn-info-background: #171717;
	--mr-wcn-info-text: #f5f5f5;
	--mr-wcn-info-accent: var(--mr-color-accent, #b2600f);
	--mr-wcn-info-icon: "\e028";
}

:is(.woocommerce-message, .woocommerce-error, .woocommerce-info, .woocommerce-warning) {
	position: relative;
	display: block;
	width: auto;
	margin: var(--mr-wcn-margin);
	padding: var(--mr-wcn-padding);
	border: 0;
	border-block-start: var(--mr-wcn-border-top-width) var(--mr-wcn-border-top-style) currentColor;
	border-radius: var(--mr-wcn-radius);
	background: var(--mr-wcn-background);
	box-shadow: var(--mr-wcn-shadow);
	color: var(--mr-wcn-text);
	font-family: var(--mr-wcn-font-family);
	font-size: var(--mr-wcn-font-size);
	font-weight: var(--mr-wcn-font-weight);
	line-height: var(--mr-wcn-line-height);
	list-style: none outside;
	word-wrap: break-word;
	animation: mr-wcn-enter var(--mr-wcn-animation-duration) var(--mr-wcn-animation-easing) both;
}

:is(.woocommerce-message, .woocommerce-error, .woocommerce-info, .woocommerce-warning)::before {
	position: absolute;
	inset-block-start: var(--mr-wcn-icon-top);
	inset-inline-start: var(--mr-wcn-icon-inline-start);
	display: inline-block;
	border: 0;
	font-family: var(--mr-wcn-icon-font-family);
	font-style: normal;
	font-weight: 400;
	line-height: 1;
}

.woocommerce-message {
	border-block-start-color: var(--mr-wcn-success-accent);
	background: var(--mr-wcn-success-background);
	color: var(--mr-wcn-success-text);
}

.woocommerce-message::before {
	content: var(--mr-wcn-success-icon) / "";
	color: var(--mr-wcn-success-accent);
}

.woocommerce-error {
	border-block-start-color: var(--mr-wcn-error-accent);
	background: var(--mr-wcn-error-background);
	color: var(--mr-wcn-error-text);
}

.woocommerce-error::before {
	content: var(--mr-wcn-error-icon) / "";
	color: var(--mr-wcn-error-accent);
}

.woocommerce-warning {
	border-block-start-color: var(--mr-wcn-warning-accent);
	background: var(--mr-wcn-warning-background);
	color: var(--mr-wcn-warning-text);
}

.woocommerce-warning::before {
	content: var(--mr-wcn-warning-icon) / "";
	color: var(--mr-wcn-warning-accent);
}

.woocommerce-info {
	border-block-start-color: var(--mr-wcn-info-accent);
	background: var(--mr-wcn-info-background);
	color: var(--mr-wcn-info-text);
}

.woocommerce-info::before {
	content: var(--mr-wcn-info-icon) / "";
	color: var(--mr-wcn-info-accent);
}

.woocommerce-error li {
	margin-inline-start: 0 !important;
	padding-inline-start: 0 !important;
	list-style: none outside !important;
}

:is(.woocommerce-message, .woocommerce-error, .woocommerce-info, .woocommerce-warning) .button {
	float: right;
}

@keyframes mr-wcn-enter {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	:is(.woocommerce-message, .woocommerce-error, .woocommerce-info, .woocommerce-warning) {
		animation-duration: 1ms;
	}
}