/**
 * Curel newsletter — the Noptin single-line form restyled to the staging design:
 * a borderless, transparent underlined row with a red "Subscrever" + arrow, and a
 * muted, centred policy note. Replaces the old Nuvem-form newsletter styling.
 *
 * Scoped to Noptin's single-line form (.noptin-form-single-line) so nothing else is
 * touched. !important guards the win over Noptin's own stylesheet, its inline CSS
 * variables and the theme button classes on the submit input.
 */

/* Strip Noptin's white card: transparent wrappers, no border/padding/max cap. */
.noptin-optin-form-wrapper:has( .noptin-form-single-line ),
.noptin-optin-main-wrapper:has( .noptin-form-single-line ) {
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	padding: 0 !important;
	min-height: 0 !important;
	max-width: none !important;
}

/* The email + submit row is the underlined line. */
.noptin-form-single-line .noptin-form-fields {
	display: flex;
	align-items: stretch;
	gap: 0;
	width: min( 520px, calc( 100vw - 48px ) );
	max-width: 100%;
	margin: 0 auto;
	position: relative;
	border-bottom: 1px solid #0A0A0A;
}

/* Email field: borderless + transparent, the row border is the only line. */
.noptin-form-single-line .noptin-form-field-email {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	padding: 0;
}
.noptin-form-single-line .noptin-field-email {
	margin: 0;
	padding: 0;
}
.noptin-form-single-line .noptin-text {
	width: 100%;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	padding: 14px 0 !important;
	min-height: 0 !important;
	font-size: 15px !important;
	line-height: 1.4 !important;
	color: #0A0A0A !important;
}
.noptin-form-single-line .noptin-text::placeholder {
	color: rgba( 10, 10, 10, 0.55 );
	opacity: 1;
}
.noptin-form-single-line .noptin-text:hover,
.noptin-form-single-line .noptin-text:focus {
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: 0 !important;
}

/* Submit: red "Subscrever" + arrow, no button chrome. The submit is an <input>, which
   cannot carry ::after, so the arrow lives on the wrapper and the gap between label
   and arrow animates on hover. */
.noptin-form-single-line .noptin-form-field-submit {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	flex: 0 0 auto;
	margin: 0;
	padding: 0;
	transition: gap .2s cubic-bezier( 0.25, 1, 0.5, 1 );
}
.noptin-form-single-line .noptin-form-field-submit::after {
	content: "";
	flex: none;
	width: 18px;
	height: 10px;
	background: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 10' fill='none' stroke='%23DF1E26' stroke-width='1.5'%3E%3Cpath d='M0 5h17M12 1l5 4-5 4'/%3E%3C/svg%3E" ) no-repeat center / contain;
	pointer-events: none;
}
.noptin-form-single-line .noptin-form-field-submit:hover {
	gap: 14px;
}
.noptin-form-single-line .noptin-form-submit {
	width: auto !important;
	background: transparent !important;
	color: #DF1E26 !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	padding: 14px 0 !important;
	min-height: 0 !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	letter-spacing: 0 !important;
	line-height: 1.4 !important;
	text-transform: none !important;
	cursor: pointer;
}
.noptin-form-single-line .noptin-form-submit:hover,
.noptin-form-single-line .noptin-form-submit:focus {
	background: transparent !important;
	color: #DF1E26 !important;
	box-shadow: none !important;
	outline: 0 !important;
}

/* Policy note: match the muted oxy-text reference (12px, rgba(10,10,10,.55), centred).
   Link underlined at rest, darker with no underline on hover. */
.noptin-form-single-line .noptin-form-note {
	margin-top: 12px;
	padding: 0;
	font-size: 12px !important;
	line-height: 16px !important;
	color: rgba( 10, 10, 10, 0.55 ) !important;
	text-align: center;
}
.noptin-form-single-line .noptin-form-note a {
	color: rgba( 10, 10, 10, 0.55 );
	text-decoration: underline;
	text-underline-offset: 2px;
	transition: color .15s ease;
}
.noptin-form-single-line .noptin-form-note a:hover {
	color: #0A0A0A;
	text-decoration: none;
}

/* AJAX response (success / error) below the row. */
.noptin-form-single-line .noptin-form-notice {
	margin-top: 10px;
	font-size: 13px;
	text-align: center;
}
.noptin-form-single-line .noptin-form-notice:empty {
	margin: 0;
}
