/**
 * Goodlight WooCommerce Notice Styles
 *
 * Unified styling for WC notices (messages, info, errors) across every
 * front-end context they can appear — shop archives, product pages,
 * cart, checkout, my account, and endpoint pages. Matches Goodlight's
 * site palette and typography:
 *   - HelveticaNeueRoman body text
 *   - Inter buttons
 *   - Warm cream (#f6f4ef) + beige accent (#c3b5a1)
 *   - Muted red (#c06464) for errors
 *   - 10px corner radius matching primary buttons
 *
 * Targets classic WC notice classes only:
 *   .woocommerce-message  -> success (item added, coupon applied)
 *   .woocommerce-info     -> info (have a coupon?, shipping, empty cart)
 *   .woocommerce-error    -> error (validation, failed coupon)
 *
 * Icons are inline SVG data-URIs so no WooCommerce icon-font dependency.
 */

/* ============================================
   Notice wrapper
   ============================================ */
.woocommerce-notices-wrapper {
	margin-bottom: 20px;
}

.woocommerce-notices-wrapper:empty {
	display: none;
}

/* ============================================
   Base notice
   ============================================ */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
ul.woocommerce-error {
	position: relative;
	margin: 0 0 20px;
	padding: 14px 20px 14px 52px;
	list-style: none;
	border: none;
	border-left: 3px solid transparent;
	border-radius: 10px;
	background: #faf9f6;
	color: #222;
	font-family: 'HelveticaNeueRoman', Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 1.5;
}

/* WC's default icon pseudo uses the WooCommerce icon font glyphs; we
   override with our own SVG icons below. This rule neutralizes the font
   glyph and sets up the container for the SVG background. */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
	position: absolute;
	left: 20px;
	top: 18px;
	width: 20px;
	height: 20px;
	content: "";
	background-size: 20px 20px;
	background-repeat: no-repeat;
	background-position: center;
	font-family: inherit !important;
	color: transparent !important;
	text-shadow: none !important;
}

/* ============================================
   Success — "product added", "coupon applied"
   ============================================ */
.woocommerce-message {
	background: #f6f4ef;
	border-left-color: #c3b5a1;
}

.woocommerce-message::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M4.5 10.5L8.5 14.5L15.5 7' stroke='%23a8967b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

/* ============================================
   Info — "have a coupon?", "empty cart", shipping notices
   ============================================ */
.woocommerce-info {
	background: #f6f4ef;
	border-left-color: #686666;
}

.woocommerce-info::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Ccircle cx='10' cy='10' r='8' stroke='%23686666' stroke-width='1.5'/%3E%3Cpath d='M10 9V14' stroke='%23686666' stroke-width='1.5' stroke-linecap='round'/%3E%3Ccircle cx='10' cy='6.25' r='0.9' fill='%23686666'/%3E%3C/svg%3E");
}

/* ============================================
   Error — validation, failed coupon, etc.
   ============================================ */
.woocommerce-error,
ul.woocommerce-error {
	background: #f8edec;
	border-left-color: #c06464;
}

.woocommerce-error::before,
ul.woocommerce-error::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M10 3L18.5 17H1.5L10 3Z' stroke='%23c06464' stroke-width='1.5' stroke-linejoin='round'/%3E%3Cpath d='M10 8.5V12.5' stroke='%23c06464' stroke-width='1.5' stroke-linecap='round'/%3E%3Ccircle cx='10' cy='14.75' r='0.85' fill='%23c06464'/%3E%3C/svg%3E");
}

/* Errors often render as <ul> with <li> per validation failure. */
ul.woocommerce-error li {
	margin: 2px 0;
	padding: 0;
	list-style: none;
}

ul.woocommerce-error li + li {
	margin-top: 4px;
}

/* ============================================
   Links inside notices
   ============================================ */
.woocommerce-message a:not(.button),
.woocommerce-info a:not(.button),
.woocommerce-error a:not(.button) {
	color: #222;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
	border: none;
}

.woocommerce-message a:not(.button):hover,
.woocommerce-info a:not(.button):hover,
.woocommerce-error a:not(.button):hover {
	color: #444;
}

/* ============================================
   Buttons inside notices
   (e.g. "Return to shop" in empty cart, "Continue shopping" after add)
   ============================================ */
.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
	float: none;
	display: inline-block;
	margin-left: 12px;
	padding: 8px 16px !important;
	background: transparent !important;
	color: #222 !important;
	border: 1px solid #222 !important;
	border-radius: 10px !important;
	font-family: 'Inter', sans-serif !important;
	font-weight: 500 !important;
	font-size: 13px !important;
	letter-spacing: 0.04em !important;
	text-transform: none !important;
	text-decoration: none !important;
	text-shadow: none !important;
	box-shadow: none !important;
	line-height: 1.4 !important;
	vertical-align: baseline;
	transition: background 0.18s ease, color 0.18s ease;
}

.woocommerce-message .button:hover,
.woocommerce-info .button:hover,
.woocommerce-error .button:hover {
	background: #222 !important;
	color: #fff !important;
}

/* ============================================
   Field-level inline validation
   ============================================ */
.woocommerce form .form-row.woocommerce-invalid label,
.woocommerce form .form-row.woocommerce-invalid-required-field label {
	color: #c06464;
}

.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select,
.woocommerce form .form-row.woocommerce-invalid textarea,
.woocommerce form .form-row.woocommerce-invalid-required-field input.input-text,
.woocommerce form .form-row.woocommerce-invalid-required-field select,
.woocommerce form .form-row.woocommerce-invalid-required-field textarea {
	border-color: #c06464 !important;
	box-shadow: 0 0 0 3px rgba(192, 100, 100, 0.1) !important;
}

.woocommerce form .form-row.woocommerce-validated input.input-text,
.woocommerce form .form-row.woocommerce-validated select,
.woocommerce form .form-row.woocommerce-validated textarea {
	border-color: #c3b5a1 !important;
}

/* ============================================
   Mobile tweaks
   ============================================ */
@media (max-width: 600px) {
	.woocommerce-message,
	.woocommerce-info,
	.woocommerce-error,
	ul.woocommerce-error {
		padding: 12px 16px 12px 44px;
		font-size: 13px;
	}

	.woocommerce-message::before,
	.woocommerce-info::before,
	.woocommerce-error::before {
		left: 16px;
		top: 14px;
		width: 18px;
		height: 18px;
		background-size: 18px 18px;
	}

	.woocommerce-message .button,
	.woocommerce-info .button,
	.woocommerce-error .button {
		display: block;
		width: fit-content;
		margin: 10px 0 0;
	}
}