/**
 * D LUNAFAM — site-wide pieces that belong to no single page.
 * ------------------------------------------------------------------
 * Loaded on every page after OceanWP's WooCommerce stylesheet
 * (inc/enqueue.php).
 *
 * WooCommerce notices outside Cart / Checkout / My Account (those style
 * their own, commerce.css §5): "… has been added to your cart",
 * "… removed", errors — on the Shop, product pages, search results,
 * wishlist. Same quiet panel as the Cart's: white, hairline border, a
 * coloured left edge and line icon; the action ("View cart") is an
 * outlined espresso button instead of OceanWP's bright blue (#13aff0)
 * theme-colour button.
 */

/* Keyboard focus: one visible ring (the design system's gold focus colour)
   on every link and control that doesn't draw its own. OceanWP and several
   plugins remove the browser outline, and the header / bottom-nav links
   only changed colour on focus. `:focus-visible` keeps it off for mouse and
   touch; any component rule with a class selector still wins. */
html body a:focus-visible,
html body button:focus-visible,
html body [role="button"]:focus-visible,
html body summary:focus-visible,
html body select:focus-visible {
	outline: 2px solid var(--mmsc-color-accent);
	outline-offset: 3px;
	border-radius: 2px;
}

body:not(.mmsc-commerce) .woocommerce-notices-wrapper:empty {
	display: none;
}

body:not(.mmsc-commerce) .woocommerce-message,
body:not(.mmsc-commerce) .woocommerce-info,
body:not(.mmsc-commerce) .woocommerce-error {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 16px;
	margin: 0 0 16px;
	padding: 14px 18px 14px 46px;
	border: 1px solid var(--mmsc-color-border);
	border-left: 3px solid var(--mmsc-color-primary);
	border-radius: var(--mmsc-radius-sm);
	background: var(--mmsc-color-surface);
	box-shadow: none;
	color: var(--mmsc-color-text);
	font-family: var(--mmsc-font-body);
	font-size: var(--mmsc-text-sm);
	font-weight: 400;
	line-height: 1.5;
	letter-spacing: 0;
	text-transform: none;
	list-style: none;
	outline: none;
}

body:not(.mmsc-commerce) .woocommerce-message {
	border-left-color: var(--mmsc-color-success);
}

body:not(.mmsc-commerce) .woocommerce-error {
	border-left-color: var(--mmsc-color-error);
	background: #fffbfa;
}

body:not(.mmsc-commerce) ul.woocommerce-error {
	display: block;
}

body:not(.mmsc-commerce) ul.woocommerce-error li {
	margin: 0;
}

body:not(.mmsc-commerce) .woocommerce-message::before,
body:not(.mmsc-commerce) .woocommerce-info::before,
body:not(.mmsc-commerce) .woocommerce-error::before {
	content: "";
	position: absolute;
	top: 15px;
	left: 16px;
	width: 18px;
	height: 18px;
	margin: 0;
	background-color: var(--mmsc-color-primary);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5M12 7.8v.2'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5M12 7.8v.2'/%3E%3C/svg%3E") center / contain no-repeat;
	font-size: 0;
}

body:not(.mmsc-commerce) .woocommerce-message::before {
	background-color: var(--mmsc-color-success);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8 12.3 2.7 2.7L16 9.6'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8 12.3 2.7 2.7L16 9.6'/%3E%3C/svg%3E");
}

body:not(.mmsc-commerce) .woocommerce-error::before {
	background-color: var(--mmsc-color-error);
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5V13M12 16.3v.2'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5V13M12 16.3v.2'/%3E%3C/svg%3E");
}

/* The notice's action ("View cart", "Undo?"): WooCommerce prints it first,
   floated right by OceanWP; here it is the last item, pushed right. */
body:not(.mmsc-commerce) .woocommerce-message a.button,
body:not(.mmsc-commerce) .woocommerce-info a.button,
body:not(.mmsc-commerce) .woocommerce-error a.button {
	order: 2;
	float: none;
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	margin: 0 0 0 auto;
	padding: 0 16px;
	border: 1px solid var(--mmsc-color-dark);
	border-radius: var(--mmsc-radius-sm);
	background: transparent;
	color: var(--mmsc-color-dark);
	font-family: var(--mmsc-font-body);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.05em;
	line-height: 1;
	text-transform: uppercase;
	transition: background-color var(--mmsc-transition-fast), color var(--mmsc-transition-fast);
}

body:not(.mmsc-commerce) .woocommerce-message a.button:hover,
body:not(.mmsc-commerce) .woocommerce-message a.button:focus-visible,
body:not(.mmsc-commerce) .woocommerce-info a.button:hover,
body:not(.mmsc-commerce) .woocommerce-info a.button:focus-visible,
body:not(.mmsc-commerce) .woocommerce-error a.button:hover,
body:not(.mmsc-commerce) .woocommerce-error a.button:focus-visible {
	background: var(--mmsc-color-dark);
	color: var(--mmsc-color-surface);
}

body:not(.mmsc-commerce) .woocommerce-message a:not(.button),
body:not(.mmsc-commerce) .woocommerce-info a:not(.button),
body:not(.mmsc-commerce) .woocommerce-error a:not(.button) {
	color: var(--mmsc-color-text);
	text-decoration: underline;
	text-decoration-color: var(--mmsc-color-primary);
	text-underline-offset: 3px;
}

@media (max-width: 479px) {
	body:not(.mmsc-commerce) .woocommerce-message a.button,
	body:not(.mmsc-commerce) .woocommerce-info a.button,
	body:not(.mmsc-commerce) .woocommerce-error a.button {
		margin-left: 0;
	}
}
