/**
 * Moneysworth Toolkit — WooCommerce notice styling
 *
 * The child theme paints .woocommerce-error, .woocommerce-info and
 * .woocommerce-message the same teal (#17a292), so a validation failure looks
 * identical to a success message, and Divi's light-blue <strong> on that teal
 * falls well below the WCAG AA contrast minimum — the field names in a
 * "required field" error are effectively unreadable.
 *
 * This restores the three states to distinct, legible treatments. Colours only:
 * no layout, spacing or markup assumptions beyond WooCommerce's own classes.
 *
 * Rollback: remove the 'mt-notices' enqueue in core-init.php.
 */

.woocommerce .woocommerce-error,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-message,
.woocommerce-page .woocommerce-error,
.woocommerce-page .woocommerce-info,
.woocommerce-page .woocommerce-message {
	border-radius: 4px;
	border: 1px solid transparent;
	border-left-width: 4px;
	padding: 1em 1.25em;
	margin: 0 0 1.5em;
	list-style: none;
	line-height: 1.55;
	font-size: 1rem;
	box-shadow: none;
}

/* WooCommerce renders errors as a <ul>; kill the stray bullet indent. */
.woocommerce .woocommerce-error li,
.woocommerce-page .woocommerce-error li {
	list-style: none;
	margin: 0 0 .4em;
	padding: 0;
}

.woocommerce .woocommerce-error li:last-child,
.woocommerce-page .woocommerce-error li:last-child {
	margin-bottom: 0;
}

/* -------------------------------------------------------------------------
 * Error — red. Must never be mistaken for a success message.
 * ---------------------------------------------------------------------- */
.woocommerce .woocommerce-error,
.woocommerce-page .woocommerce-error {
	background: #fdecea !important;
	border-color: #c0392b !important;
	color: #7d1a10 !important;
}

.woocommerce .woocommerce-error strong,
.woocommerce-page .woocommerce-error strong {
	color: #5f1209 !important;
	font-weight: 700;
}

.woocommerce .woocommerce-error a,
.woocommerce-page .woocommerce-error a {
	color: #7d1a10 !important;
	text-decoration: underline;
}

/* -------------------------------------------------------------------------
 * Info — blue
 * ---------------------------------------------------------------------- */
.woocommerce .woocommerce-info,
.woocommerce-page .woocommerce-info {
	background: #eaf2fb !important;
	border-color: #2b6cb0 !important;
	color: #1a4971 !important;
}

.woocommerce .woocommerce-info strong,
.woocommerce-page .woocommerce-info strong {
	color: #143a5c !important;
}

.woocommerce .woocommerce-info a,
.woocommerce-page .woocommerce-info a {
	color: #1a4971 !important;
	text-decoration: underline;
}

/* -------------------------------------------------------------------------
 * Success — green
 * ---------------------------------------------------------------------- */
.woocommerce .woocommerce-message,
.woocommerce-page .woocommerce-message {
	background: #eaf6ee !important;
	border-color: #2e7d4f !important;
	color: #1c5636 !important;
}

.woocommerce .woocommerce-message strong,
.woocommerce-page .woocommerce-message strong {
	color: #144227 !important;
}

.woocommerce .woocommerce-message a,
.woocommerce-page .woocommerce-message a {
	color: #1c5636 !important;
	text-decoration: underline;
}

/* -------------------------------------------------------------------------
 * Buttons inside notices ("View cart", "Update") need to stay readable
 * against the new backgrounds.
 * ---------------------------------------------------------------------- */
.woocommerce .woocommerce-message .button,
.woocommerce .woocommerce-info .button,
.woocommerce .woocommerce-error .button,
.woocommerce-page .woocommerce-message .button,
.woocommerce-page .woocommerce-info .button,
.woocommerce-page .woocommerce-error .button {
	background: #15467b !important;
	color: #fff !important;
	text-decoration: none !important;
}

/* -------------------------------------------------------------------------
 * The checkout notice group sits above the form; give it room and make sure
 * it is the first thing a shopper sees after a failed submit.
 * ---------------------------------------------------------------------- */
.woocommerce-NoticeGroup-checkout,
.woocommerce-NoticeGroup-updateOrderReview {
	display: block;
	margin-bottom: 1.5em;
}

/* Inline per-field validation from WooCommerce's own checkout JS. */
.woocommerce form .form-row.woocommerce-invalid input.input-text,
.woocommerce form .form-row.woocommerce-invalid select,
.woocommerce-page form .form-row.woocommerce-invalid input.input-text,
.woocommerce-page form .form-row.woocommerce-invalid select {
	border-color: #c0392b !important;
	box-shadow: 0 0 0 1px rgba(192, 57, 43, .25);
}

.woocommerce form .form-row.woocommerce-validated input.input-text,
.woocommerce-page form .form-row.woocommerce-validated input.input-text {
	border-color: #2e7d4f !important;
}

/* The custom messages slot used by the rental-date logic. */
#custom_messages .woocommerce-error {
	margin-bottom: 1em;
}

/* -------------------------------------------------------------------------
 * Help line under the Place Order button.
 *
 * Quiet enough not to compete with the CTA, present enough to be found by
 * someone who is stuck. Separated by a hairline rule rather than a box, so it
 * reads as a footnote to the button rather than another warning.
 * ---------------------------------------------------------------------- */
.mt-checkout-help {
	margin: 1.1em 0 0;
	padding-top: .9em;
	border-top: 1px solid #e2e6ec;
	font-size: 14px;
	line-height: 1.55;
	color: #5d6875;
	text-align: center;
}

.mt-checkout-help__label {
	font-weight: 600;
	color: #2f3945;
}

.mt-checkout-help__sub {
	display: inline;
}

.mt-checkout-help__numbers {
	display: block;
	margin-top: .35em;
}

.mt-checkout-help__tel {
	display: inline-block;
	color: #15467b !important;
	font-weight: 600;
	text-decoration: none !important;
	white-space: nowrap;
	padding: .15em 0;
}

.mt-checkout-help__tel:hover,
.mt-checkout-help__tel:focus {
	text-decoration: underline !important;
}

.mt-checkout-help__area {
	font-weight: 400;
	color: #5d6875;
}

.mt-checkout-help__sep {
	margin: 0 .55em;
	color: #b7bfc9;
}

/* On phones the numbers are the actionable part — stack them and give each a
   proper tap target instead of a cramped single line. */
@media (max-width: 600px) {
	.mt-checkout-help__sub {
		display: block;
	}
	.mt-checkout-help__tel {
		display: block;
		padding: .5em 0;
		font-size: 15px;
	}
	.mt-checkout-help__sep {
		display: none;
	}
}

/* -------------------------------------------------------------------------
 * Clickable validation errors (checkout-ux.js)
 *
 * Each error that resolves to a real field becomes a target you can click to
 * jump straight to it, across wizard steps.
 * ---------------------------------------------------------------------- */
.woocommerce-error li.mt-error-linked {
	cursor: pointer;
	border-radius: 3px;
	padding: .15em .3em !important;
	margin-left: -.3em !important;
	transition: background-color .12s ease;
}

.woocommerce-error li.mt-error-linked:hover,
.woocommerce-error li.mt-error-linked:focus-visible {
	background: rgba(192, 57, 43, .1);
	outline: none;
}

.woocommerce-error li.mt-error-linked:focus-visible {
	box-shadow: 0 0 0 2px #c0392b;
}

.woocommerce-error li.mt-error-linked strong {
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Momentary highlight on the field we jumped to, so the eye lands on it. */
.form-row.mt-field-target input.input-text,
.form-row.mt-field-target select,
.form-row.mt-field-target textarea {
	border-color: #c0392b !important;
	box-shadow: 0 0 0 3px rgba(192, 57, 43, .22) !important;
	transition: box-shadow .2s ease;
}

@media (prefers-reduced-motion: reduce) {
	.woocommerce-error li.mt-error-linked,
	.form-row.mt-field-target input.input-text {
		transition: none;
	}
}
