/*
 * Attendee Uniqueness Guard - Frontend styles
 *
 * Color note:
 * We use a yellow accent that stays readable on dark cosmic backgrounds.
 * If the theme defines an accent variable (Elementor / theme), we prefer it.
 */

:root {
	--uav-accent: var(--e-global-color-accent, var(--color-accent, #ffdd6e));
	--uav-accent-soft: rgba(255, 221, 110, 0.14);
	--uav-text: var(--uav-accent);
	--uav-warning: var(--uav-accent);
}

.uav-attendee-notice {
	margin: 12px 0;
	padding: 12px;
	border: 1px solid var(--uav-accent);
	background: var(--uav-accent-soft);
	color: var(--uav-text);
	border-radius: 10px;
	font-size: 14px;
	line-height: 1.35;
}


.uav-attendee-notice__title {
	font-weight: 700;
	font-size: 16px; /* ~ +2px compared to base */
	line-height: 1.25;
	margin-bottom: 4px;
}

/* ---------------------------------------------------------------------
 * Global notice (informational) shown after a server-side lock block.
 * This is NOT a browser popup; it's an inline banner near the tickets.
 * -------------------------------------------------------------------*/
.uav-global-notice {
	position: relative;
	z-index: 2147483647;
	margin: 12px 0 16px 0;
	padding: 12px 12px 12px 12px;
	border: 1px solid var(--uav-accent);
	background: var(--uav-accent-soft);
	color: var(--uav-text);
	border-radius: 12px;
	font-size: 14px;
	line-height: 1.35;
}

.uav-global-notice__title {
	font-weight: 800;
	font-size: 16px;
	line-height: 1.25;
	margin: 0 34px 6px 0;
}

.uav-global-notice__message {
	font-size: 13px;
	line-height: 1.35;
}

.uav-global-notice__close {
	position: absolute;
	top: 8px;
	right: 8px;
	width: 28px;
	height: 28px;
	border: 1px solid var(--uav-accent);
	border-radius: 999px;
	background: transparent;
	color: var(--uav-accent);
	cursor: pointer;
	font-size: 18px;
	line-height: 26px;
	padding: 0;
}

.uav-global-notice__close:hover {
	background: var(--uav-accent-soft);
}

/* Outline for invalid fields */
.uav-field-error {
	outline: 2px solid var(--uav-accent);
	outline-offset: 2px;
	border-radius: 6px;
}

.uav-field-error-msg {
	margin-top: 6px;
	font-size: 12px;
	line-height: 1.3;
	color: var(--uav-text);
}

.uav-field-error-msg strong {
	font-weight: 700;
}

/*
 * Event Tickets core unique-field messages (Name/Email) sometimes render their
 * own English error line. We remove them via JS, but if they appear briefly,
 * keep them readable by matching our yellow accent.
 */
.tribe-tickets__form-field--unique .tribe-tickets__form-field-error-message,
.tribe-tickets__form-field--unique .tribe-tickets__form-field-error {
	color: var(--uav-text) !important;
}



/* ---------------------------------------------------------------------
 * WooCommerce notices (checkout / order-pay)
 * Some themes render notice text in black; on dark cosmic UIs that makes
 * the message effectively invisible. Force readable contrast.
 *
 * Text: gold accent (#FFDD6E)
 * Icon/border: keep the theme default or reinforce as red.
 * -------------------------------------------------------------------*/
.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info {
	color: var(--uav-accent) !important;
	border-radius: 14px !important;
}

.woocommerce-notices-wrapper .woocommerce-error li,
.woocommerce-notices-wrapper .woocommerce-message li,
.woocommerce-notices-wrapper .woocommerce-info li,
.woocommerce-notices-wrapper .woocommerce-error a,
.woocommerce-notices-wrapper .woocommerce-message a,
.woocommerce-notices-wrapper .woocommerce-info a,
.woocommerce-notices-wrapper .woocommerce-error strong,
.woocommerce-notices-wrapper .woocommerce-message strong,
.woocommerce-notices-wrapper .woocommerce-info strong {
	color: var(--uav-accent) !important;
}

/* Ensure the notice has a dark translucent background for contrast */
.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info {
	background: rgba(15, 15, 20, 0.78) !important;
}

/* Reinforce error border/icon visibility on dark backgrounds */
.woocommerce-notices-wrapper .woocommerce-error {
	border-color: rgba(255, 70, 70, 0.7) !important;
}

/* Woo core icon is usually a ::before pseudo-element */
.woocommerce-notices-wrapper .woocommerce-error::before,
.woocommerce-notices-wrapper .woocommerce-message::before,
.woocommerce-notices-wrapper .woocommerce-info::before {
	filter: none !important;
}


/* Ensure the Woo notice icon never overlaps the first characters */
.woocommerce-notices-wrapper ul.woocommerce-error,
.woocommerce-notices-wrapper ul.woocommerce-message,
.woocommerce-notices-wrapper ul.woocommerce-info {
	padding-left: 52px !important;
}

/* Reduce chances of "empty looking" notice due to theme list styles */
.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info {
	padding: 14px 18px !important;
	line-height: 1.35 !important;
}

.woocommerce-notices-wrapper .woocommerce-error {
	list-style: none !important;
}


/* ---------------------------------------------------------------------
 * WooCommerce Blocks / Checkout NoticeGroup wrappers
 *
 * When using the WC Blocks checkout (or some themes), notices are rendered
 * inside `.woocommerce-NoticeGroup` instead of `.woocommerce-notices-wrapper`.
 * This ensures the message remains readable on dark cosmic UIs.
 * -------------------------------------------------------------------*/
body .woocommerce-NoticeGroup ul.woocommerce-error,
body .woocommerce-NoticeGroup ul.woocommerce-message,
body .woocommerce-NoticeGroup ul.woocommerce-info,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-error,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-message,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-info {
	color: var(--uav-accent) !important;
	background: rgba(15, 15, 20, 0.78) !important;
	border-radius: 14px !important;
	/* Extra left padding so the text never sits under the alert icon */
	padding: 14px 18px 14px 52px !important;
	line-height: 1.35 !important;
}

body .woocommerce-NoticeGroup ul.woocommerce-error li,
body .woocommerce-NoticeGroup ul.woocommerce-message li,
body .woocommerce-NoticeGroup ul.woocommerce-info li,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-error li,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-message li,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-info li,
body .woocommerce-NoticeGroup ul.woocommerce-error a,
body .woocommerce-NoticeGroup ul.woocommerce-message a,
body .woocommerce-NoticeGroup ul.woocommerce-info a,
body .woocommerce-NoticeGroup ul.woocommerce-error strong,
body .woocommerce-NoticeGroup ul.woocommerce-message strong,
body .woocommerce-NoticeGroup ul.woocommerce-info strong,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-error a,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-message a,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-info a,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-error strong,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-message strong,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-info strong {
	color: var(--uav-accent) !important;
}

/* Force readable text on themes that override notice colors with higher specificity in checkout/order-pay. */
body.woocommerce-checkout .woocommerce-NoticeGroup.woocommerce-NoticeGroup-checkout ul.woocommerce-error,
body.woocommerce-checkout .woocommerce-NoticeGroup.woocommerce-NoticeGroup-checkout ul.woocommerce-error li,
body.woocommerce-checkout .woocommerce-NoticeGroup.woocommerce-NoticeGroup-checkout ul.woocommerce-error li *,
body.woocommerce-checkout .woocommerce-NoticeGroup.woocommerce-NoticeGroup-checkout div[role="alert"],
body.woocommerce-checkout .woocommerce-NoticeGroup.woocommerce-NoticeGroup-checkout div[role="alert"] * {
	color: var(--uav-warning) !important;
}

body .woocommerce-NoticeGroup ul.woocommerce-error,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-error {
	border-color: rgba(255, 70, 70, 0.7) !important;
	list-style: none !important;
}

body .woocommerce-NoticeGroup ul.woocommerce-error::before,
body .woocommerce-NoticeGroup ul.woocommerce-message::before,
body .woocommerce-NoticeGroup ul.woocommerce-info::before,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-error::before,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-message::before,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-info::before {
	filter: none !important;
}

body .woocommerce-NoticeGroup ul.woocommerce-error::before,
body .woocommerce-NoticeGroup-checkout ul.woocommerce-error::before {
	left: 18px !important;
}