/* WC EU Withdrawal Compliance — frontend form styles. Scoped to .wceuwc-* */

.wceuwc-wrap {
	max-width: 640px;
	margin: 0 auto;
	font-size: 16px;
	line-height: 1.55;
	color: inherit;
}

.wceuwc-title {
	font-size: 1.4em;
	margin: 0 0 .5em;
	line-height: 1.2;
}

.wceuwc-intro {
	margin: 0 0 1.25em;
	opacity: .9;
}

.wceuwc-field {
	margin: 0 0 1em;
}

.wceuwc-field label {
	display: block;
	font-weight: 600;
	margin-bottom: .35em;
}

.wceuwc-req {
	color: #c8202f;
}

.wceuwc-field input[type="text"],
.wceuwc-field input[type="email"],
.wceuwc-field input[type="tel"],
.wceuwc-field select,
.wceuwc-field textarea {
	width: 100%;
	box-sizing: border-box;
	padding: .7em .85em;
	border: 1px solid #cbd2d9;
	border-radius: 8px;
	font-size: 1em;
	font-family: inherit;
	background: #fff;
	color: #1f2933;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.wceuwc-field input:focus,
.wceuwc-field select:focus,
.wceuwc-field textarea:focus {
	outline: none;
	border-color: #2563eb;
	box-shadow: 0 0 0 3px rgba( 37, 99, 235, .15 );
}

.wceuwc-hint {
	display: block;
	margin-top: .35em;
	font-size: .85em;
	opacity: .7;
}

.wceuwc-btn {
	display: inline-block;
	padding: .8em 1.4em;
	border: 0;
	border-radius: 8px;
	font-size: 1em;
	font-weight: 600;
	cursor: pointer;
	font-family: inherit;
	transition: background .15s ease, opacity .15s ease;
}

.wceuwc-btn[disabled] {
	opacity: .6;
	cursor: default;
}

.wceuwc-btn--primary {
	background: #111827;
	color: #fff;
}

.wceuwc-btn--primary:hover:not([disabled]) {
	background: #2563eb;
}

.wceuwc-btn--secondary {
	background: #e5e7eb;
	color: #1f2933;
}

.wceuwc-btn--secondary:hover:not([disabled]) {
	background: #d1d5db;
}

.wceuwc-actions {
	display: flex;
	gap: .75em;
	flex-wrap: wrap;
	margin-top: 1.25em;
}

.wceuwc-error {
	background: #fef2f2;
	border: 1px solid #fecaca;
	color: #b91c1c;
	padding: .75em 1em;
	border-radius: 8px;
	margin: 0 0 1em;
	font-size: .95em;
}

.wceuwc-fieldset {
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 1em 1.1em;
	margin: 0 0 1em;
}

.wceuwc-fieldset legend {
	font-weight: 600;
	padding: 0 .4em;
}

.wceuwc-radio,
.wceuwc-checkbox {
	display: flex;
	align-items: flex-start;
	gap: .6em;
	margin: .5em 0;
	cursor: pointer;
}

.wceuwc-radio input,
.wceuwc-checkbox input {
	margin-top: .25em;
	flex: 0 0 auto;
}

.wceuwc-checkbox {
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: .85em 1em;
	margin: 1em 0;
}

.wceuwc-items {
	margin: 0 0 1em;
}

.wceuwc-items-help {
	font-weight: 600;
	margin: 0 0 .6em;
}

.wceuwc-item-row {
	display: flex;
	align-items: center;
	gap: .6em;
	padding: .55em 0;
	border-bottom: 1px solid #eef1f4;
	flex-wrap: wrap;
}

.wceuwc-item-row label {
	flex: 1 1 auto;
	min-width: 50%;
}

.wceuwc-item-qty {
	display: inline-flex;
	align-items: center;
	gap: .4em;
	font-size: .9em;
}

.wceuwc-item-qty-input {
	width: 4.5em;
	padding: .35em .5em;
	border: 1px solid #cbd2d9;
	border-radius: 6px;
}

.wceuwc-declaration {
	margin: 1em 0;
}

.wceuwc-declaration blockquote {
	margin: .5em 0 0;
	padding: .85em 1em;
	background: #f3f4f6;
	border-left: 4px solid #111827;
	border-radius: 0 8px 8px 0;
	font-style: italic;
}

.wceuwc-success {
	background: #f0fdf4;
	border: 1px solid #bbf7d0;
	border-radius: 12px;
	padding: 1.5em;
	text-align: center;
}

.wceuwc-reference {
	font-size: 1.1em;
}

.wceuwc-reference strong {
	font-size: 1.15em;
	letter-spacing: .03em;
}

.wceuwc-note {
	font-size: .9em;
	opacity: .8;
	margin-top: 1em;
}

/* Footer link injected site-wide (mirrors the inline style enqueued by WCEUWC_Integrations). */
.wceuwc-footer-link {
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 18px 16px;
	text-align: center;
	line-height: 1.4;
}

.wceuwc-footer-link a {
	display: inline-block;
	font-size: 13px;
	font-weight: 500;
	color: inherit;
	opacity: .75;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.wceuwc-footer-link a:hover,
.wceuwc-footer-link a:focus {
	opacity: 1;
}

@media ( max-width: 480px ) {
	.wceuwc-actions {
		flex-direction: column;
	}
	.wceuwc-btn {
		width: 100%;
		text-align: center;
	}
}