.euw-withdrawal {
	--euw-form-max-width: 560px;
	--euw-radius-input: 3px;
	--euw-radius-button: 3px;
	--euw-btn-primary-border-width: 0px;
	--euw-btn-confirm-border-width: 0px;
	--euw-btn-secondary-border-width: 0px;
	--euw-btn-order-action-border-width: 0px;
	--euw-btn-toggle-border-width: 0px;
	--euw-color-input-border: #ccc;
	--euw-color-input-border-focus: #2271b1;
	--euw-color-input-bg: #fff;
	--euw-color-input-text: inherit;
	--euw-color-label: inherit;
	--euw-color-heading: inherit;
	--euw-color-text: inherit;
	--euw-color-btn-primary-bg: #0f172a;
	--euw-color-btn-primary-text: #fff;
	--euw-color-btn-primary-border: #0f172a;
	--euw-color-btn-confirm-bg: #b32d2e;
	--euw-color-btn-confirm-text: #fff;
	--euw-color-btn-confirm-border: #b32d2e;
	--euw-color-btn-secondary-bg: #f1f5f9;
	--euw-color-btn-secondary-text: #334155;
	--euw-color-btn-secondary-border: #f1f5f9;
	--euw-color-accent: #2271b1;
	--euw-color-summary-bg: #f6f7f7;
	--euw-color-summary-border: #dcdcde;
	--euw-color-success: #16a34a;
	--euw-color-error: #dc3232;
	--euw-color-required: #b32d2e;
	max-width: var(--euw-form-max-width);
	margin: 0 auto;
	padding: 1rem 0;
}

.euw-modal {
	--euw-radius-input: 10px;
	--euw-radius-button: 10px;
	--euw-btn-primary-border-width: 0px;
	--euw-btn-confirm-border-width: 0px;
	--euw-btn-secondary-border-width: 0px;
	--euw-btn-order-action-border-width: 0px;
	--euw-btn-toggle-border-width: 0px;
	--euw-radius-modal: 16px;
	--euw-color-input-border: #e2e8f0;
	--euw-color-input-border-focus: #3b82f6;
	--euw-color-input-bg: #fff;
	--euw-color-input-text: #334155;
	--euw-color-label: #334155;
	--euw-color-heading: #0f172a;
	--euw-color-text: #475569;
	--euw-color-btn-primary-bg: #0f172a;
	--euw-color-btn-primary-text: #fff;
	--euw-color-btn-primary-border: #0f172a;
	--euw-color-btn-confirm-bg: #dc2626;
	--euw-color-btn-confirm-text: #fff;
	--euw-color-btn-confirm-border: #dc2626;
	--euw-color-btn-secondary-bg: #f1f5f9;
	--euw-color-btn-secondary-text: #334155;
	--euw-color-btn-secondary-border: #f1f5f9;
	--euw-color-accent: #3b82f6;
	--euw-color-modal-bg: #fff;
	--euw-color-modal-backdrop: rgba(15, 23, 42, 0.6);
	--euw-color-summary-bg: #f8fafc;
	--euw-color-summary-border: #e2e8f0;
	--euw-color-text-muted: #64748b;
	--euw-color-success: #16a34a;
	--euw-color-error: #dc3232;
	--euw-color-required: #b32d2e;
}

.euw-honeypot {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
}

.euw-withdrawal h2,
.euw-modal .euw-modal__title {
	margin-bottom: 0.5rem;
	color: var(--euw-color-heading, inherit);
}

.euw-withdrawal p,
.euw-modal .euw-withdrawal p {
	color: var(--euw-color-text, inherit);
}

.euw-form .form-row {
	margin-bottom: 1rem;
}

.euw-form-row--reason-other[hidden] {
	display: none;
}

.euw-withdrawal label,
.euw-modal .euw-withdrawal label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.35rem;
	color: var(--euw-color-label, inherit);
}

.euw-withdrawal input[type="text"],
.euw-withdrawal input[type="email"],
.euw-withdrawal select,
.euw-withdrawal textarea,
.euw-modal .euw-withdrawal input[type="text"],
.euw-modal .euw-withdrawal input[type="email"],
.euw-modal .euw-withdrawal select,
.euw-modal .euw-withdrawal textarea {
	width: 100%;
	padding: 0.6rem 0.75rem;
	border: 1px solid var(--euw-color-input-border);
	border-radius: var(--euw-radius-input);
	background-color: var(--euw-color-input-bg);
	color: var(--euw-color-input-text, inherit);
	font-size: 0.9375rem;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.euw-withdrawal textarea,
.euw-modal .euw-withdrawal textarea {
	min-height: 6rem;
	resize: vertical;
}

.euw-withdrawal label .optional,
.euw-modal .euw-withdrawal label .optional {
	font-weight: 400;
	color: var(--euw-color-text-muted, #646970);
}

.euw-withdrawal input[type="text"]:focus,
.euw-withdrawal input[type="email"]:focus,
.euw-withdrawal select:focus,
.euw-withdrawal textarea:focus,
.euw-modal .euw-withdrawal input[type="text"]:focus,
.euw-modal .euw-withdrawal input[type="email"]:focus,
.euw-modal .euw-withdrawal select:focus,
.euw-modal .euw-withdrawal textarea:focus {
	border-color: var(--euw-color-input-border-focus);
	outline: none;
}

.euw-withdrawal input.euw-field-invalid,
.euw-modal .euw-withdrawal input.euw-field-invalid {
	border-color: var(--euw-color-error, #dc3232) !important;
}

.euw-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-top: 1.25rem;
}

.form-row-order .euw-notice {
	margin: 0.35rem 0 0;
	padding: 0.4rem 0.6rem;
	font-size: 0.85rem;
	line-height: 1.35;
	border-radius: var(--euw-radius-input);
}

.euw-notice {
	padding: 0.75rem 1rem;
	margin: 1rem 0;
	border-radius: var(--euw-radius-input);
}

.euw-notice--success {
	background: #edfaef;
	border: 1px solid #46b450;
}

.euw-notice--warning {
	background: #fff8e5;
	border: 1px solid #ffb900;
}

.euw-notice--error {
	background: #fef1f1;
	border: 1px solid var(--euw-color-error, #dc3232);
}

.euw-notice--info {
	background: #f0f6fc;
	border: 1px solid #72aee6;
}

.euw-summary dt {
	font-weight: 600;
	margin-top: 0.75rem;
}

.euw-summary dd {
	margin: 0.25rem 0 0;
}

.euw-withdrawal .button.euw-continue,
.euw-withdrawal .button.euw-confirm,
.euw-modal .button.euw-continue,
.euw-modal .button.euw-confirm {
	border: var(--euw-btn-confirm-border-width) solid var(--euw-color-btn-confirm-border);
	border-radius: var(--euw-radius-button);
	background: var(--euw-color-btn-confirm-bg) !important;
	color: var(--euw-color-btn-confirm-text) !important;
	font-weight: 600;
}

.euw-withdrawal .button.euw-continue,
.euw-modal .button.euw-continue {
	border-width: var(--euw-btn-primary-border-width);
	border-color: var(--euw-color-btn-primary-border);
	background: var(--euw-color-btn-primary-bg) !important;
	color: var(--euw-color-btn-primary-text) !important;
}

.euw-withdrawal .button.euw-back,
.euw-modal .button.euw-back {
	border: var(--euw-btn-secondary-border-width) solid var(--euw-color-btn-secondary-border);
	border-radius: var(--euw-radius-button);
	background: var(--euw-color-btn-secondary-bg) !important;
	color: var(--euw-color-btn-secondary-text) !important;
	font-weight: 600;
}

.euw-continue:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

.euw-legal-notice {
	padding: 0.875rem 1rem;
	margin: 1.25rem 0;
	background: var(--euw-color-summary-bg);
	border: 1px solid var(--euw-color-summary-border);
	border-left: 4px solid var(--euw-color-accent);
	border-radius: var(--euw-radius-input);
	font-size: 0.95rem;
	line-height: 1.5;
	color: var(--euw-color-text, inherit);
}

.euw-back {
	margin-right: 0.25rem;
}

.euw-summary {
	background: var(--euw-color-summary-bg);
	border: 1px solid var(--euw-color-summary-border);
	border-radius: var(--euw-radius-input);
	padding: 0.875rem 1rem;
}

.euw-confirmed {
	padding: 1rem;
	background: #edfaef;
	border: 1px solid #46b450;
	border-radius: var(--euw-radius-input);
}

.required {
	color: var(--euw-color-required);
}

.euw-footer-link {
	text-align: center;
	margin: 1rem 0;
}

.euw-footer-link a {
	text-decoration: underline;
}

.euw-open-withdrawal,
.euw-open-withdrawal a {
	cursor: pointer;
}

body.euw-modal-open {
	overflow: hidden;
}

.euw-modal[hidden] {
	display: none !important;
}

.euw-modal {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.25rem;
}

.euw-modal__backdrop {
	position: absolute;
	inset: 0;
	background: var(--euw-color-modal-backdrop);
	backdrop-filter: blur(4px);
}

.euw-modal__dialog {
	position: relative;
	width: 100%;
	max-width: 520px;
	max-height: min(90vh, 720px);
	background: var(--euw-color-modal-bg);
	border-radius: var(--euw-radius-modal);
	box-shadow: 0 24px 48px rgba(15, 23, 42, 0.18), 0 0 0 1px rgba(15, 23, 42, 0.06);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	animation: euw-modal-in 0.22s ease-out;
}

@keyframes euw-modal-in {
	from {
		opacity: 0;
		transform: translateY(12px) scale(0.98);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

.euw-modal__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 1.25rem 1.5rem 0;
	flex-shrink: 0;
}

.euw-modal__title {
	margin: 0;
	font-size: 1.125rem;
	font-weight: 700;
	line-height: 1.3;
}

.euw-modal button.euw-modal__close {
	flex: 0 0 auto;
	width: 2.25rem;
	height: 2.25rem;
	min-width: 2.25rem;
	min-height: 2.25rem;
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 999px;
	background-color: #e2e8f0 !important;
	color: #334155 !important;
	cursor: pointer;
	display: grid;
	place-items: center;
	gap: 0 !important;
	appearance: none;
	-webkit-appearance: none;
	text-transform: none;
	font-size: inherit;
	line-height: 0;
	font-weight: 400;
	box-shadow: none;
	transition: background-color 0.15s ease;
	--btn-color: #334155;
	--btn-color-hover: #0f172a;
	--btn-bgcolor: #e2e8f0;
	--btn-bgcolor-hover: #cbd5e1;
	--btn-transform: none;
	--btn-height: auto;
	--btn-padding: 0;
	--btn-font-size: inherit;
	--btn-font-weight: 400;
	--btn-brd-width: 0;
}

.euw-modal button.euw-modal__close svg {
	display: block;
	width: 20px;
	height: 20px;
	flex-shrink: 0;
	fill: none;
}

.euw-modal button.euw-modal__close:hover,
.euw-modal button.euw-modal__close:focus {
	background-color: #cbd5e1 !important;
}

.euw-modal button.euw-modal__close:hover svg path,
.euw-modal button.euw-modal__close:focus svg path {
	stroke: #0f172a;
}

.euw-modal__body {
	overflow-y: auto;
	padding: 1rem 1.5rem 1.5rem;
}

.euw-modal .euw-withdrawal {
	max-width: none;
	margin: 0;
	padding: 0;
}

.euw-modal #euw-panel-details > h2,
.euw-modal #euw-panel-review > h2,
.euw-modal #euw-panel-confirmed > h2 {
	display: none;
}

.euw-modal .button,
.euw-modal .euw-continue,
.euw-modal .euw-confirm,
.euw-modal .euw-back {
	padding: 0.65rem 1.125rem;
	font-size: 0.9375rem;
	width: auto;
	min-width: 0;
}

.euw-modal .euw-summary dt:first-child {
	margin-top: 0;
}

.euw-confirmed-panel {
	text-align: center;
	padding: 1rem 0 0.5rem;
}

.euw-confirmed-icon {
	color: var(--euw-color-success);
	margin-bottom: 0.75rem;
}

.euw-confirmed-panel h2 {
	margin: 0 0 0.5rem;
	font-size: 1.25rem;
	color: var(--euw-color-heading, #0f172a);
}

.euw-confirmed-message {
	margin: 0 0 1rem;
	color: var(--euw-color-text, #475569);
	line-height: 1.5;
}

.euw-confirmed-ref {
	margin: 0;
	font-size: 0.875rem;
	color: var(--euw-color-text, #64748b);
}

.euw-modal--confirmed .euw-modal__title {
	color: var(--euw-color-success);
}

.euw-my-account-action {
	margin: 0 0 1.5rem;
}

.euw-my-account-action__link {
	font-weight: 600;
	text-decoration: none;
}

.euw-my-account-action__link:hover {
	text-decoration: underline;
}

.euw-my-account-endpoint {
	margin-bottom: 1.5rem;
}

/*
 * My Account single-order action button – match the sibling WC order actions
 * (e.g. invoice). No border is declared on purpose: the button must inherit the
 * active theme's own .button styling. An explicit border is only emitted inline
 * when the appearance setting asks for one (EUW_My_Account::get_order_action_button_css).
 *
 * Keep in sync with EUW_My_Account::get_order_action_button_css(), which prints the
 * same layout rules inline on the view-order screen (this stylesheet is only loaded
 * when the modal is in play).
 */
a.button.eu-withdrawal.order-actions-button,
.button.eu-withdrawal.order-actions-button {
	box-sizing: border-box;
	/* Narrow action cells (mobile) must not be overflowed by a long label. */
	max-width: 100%;
	white-space: normal;
	overflow-wrap: break-word;
	vertical-align: middle;
	/* Vertical breathing room so wrapped actions never touch the action below. */
	margin-block: 0.2em;
	/* No trailing margin: the actions cell is usually end-aligned, so a trailing
	   margin would push this button out of line with the sibling actions once they
	   wrap onto separate rows. The gap between actions is added on the leading edge
	   of the following action instead, where it cannot affect that alignment. */
	margin-inline-end: 0;
}

/*
 * Spacing for the whole action group (order again, withdrawal, invoice, tracking…).
 * Themes tend to space these per button (e.g. .button:first-child { margin-right }),
 * which produces uneven gaps as soon as another plugin appends an action. Reset the
 * inline margins for the group and re-apply a single gap on the leading edge of each
 * following action: even spacing in a row, and no offset once the actions stack.
 */
:has(> .button.eu-withdrawal.order-actions-button) > .button {
	margin-block: 0.2em;
	margin-inline: 0;
}

:has(> .button.eu-withdrawal.order-actions-button) > .button + .button,
.button.eu-withdrawal.order-actions-button + .button,
.button + .button.eu-withdrawal.order-actions-button {
	margin-inline-start: 0.4em;
}

