.wpo-form {
	margin: 1em 0;
	padding: 1.25em 1.35em;
	background: #fff;
	border-radius: 10px;
	border: 1px solid #e8e8e8;
	box-sizing: border-box;
}

.wpo-field {
	margin-bottom: 1.15em;
}

.wpo-field:last-child {
	margin-bottom: 0;
}

.wpo-field > label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.45em;
	font-size: 0.95em;
}

.wpo-required {
	color: #c00;
}

/* —— Select & text inputs —— */
.wpo-field select,
.wpo-field input[type="text"] {
	max-width: 100%;
	width: 100%;
	box-sizing: border-box;
	padding: 0.65em 0.9em;
	font-size: 0.95em;
	line-height: 1.4;
	color: #1d2327;
	background: #fff;
	border: 1px solid #d0d5dd;
	border-radius: 10px;
	appearance: none;
	-webkit-appearance: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wpo-field select {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23666' d='M1.4 0L6 4.6 10.6 0 12 1.4 6 7.4 0 1.4z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: left 0.9em center;
	padding-left: 2.4em;
	cursor: pointer;
}

/* RTL: arrow on the right */
.rtl .wpo-field select {
	background-position: right 0.9em center;
	padding-left: 0.9em;
	padding-right: 2.4em;
}

.wpo-field select:hover,
.wpo-field input[type="text"]:hover {
	border-color: #a0a8b4;
}

.wpo-field select:focus,
.wpo-field input[type="text"]:focus {
	outline: none;
	border-color: #2271b1;
	box-shadow: 0 0 0 3px rgba(34, 113, 177, 0.15);
}

/* —— Radio group —— */
.wpo-radio-group {
	display: flex;
	flex-direction: column;
	gap: 0.5em;
}

.wpo-radio-option {
	font-weight: 400 !important;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 0.55em 0.65em;
	cursor: pointer;
	padding: 0.7em 0.9em;
	background: #fafafa;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
	margin: 0 !important;
	transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.wpo-radio-option:hover {
	border-color: #c5cad3;
	background: #fff;
}

.wpo-radio-option:has(input:checked) {
	border-color: #2271b1;
	background: #f0f7fc;
	box-shadow: 0 0 0 1px #2271b1;
}

.wpo-radio-option input[type="radio"] {
	margin: 0.15em 0 0;
	flex-shrink: 0;
	width: 1.1em;
	height: 1.1em;
	accent-color: #2271b1;
	cursor: pointer;
}

.wpo-radio-option > span:not(.wpo-option-help) {
	flex: 1;
	min-width: 0;
	line-height: 1.4;
	padding-top: 0.05em;
}

/* Help text always visible under the option */
.wpo-option-help {
	flex: 1 1 100%;
	margin: 0;
	padding: 0.35em 0 0 1.75em;
	font-size: 0.85em;
	line-height: 1.45;
	color: #5c6370;
	font-weight: 400;
}

.rtl .wpo-option-help {
	padding: 0.35em 1.75em 0 0;
}

/* Legacy "?" help (kept for any residual markup) */
.wpo-help {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.2em;
	height: 1.2em;
	border-radius: 50%;
	border: 1px solid currentColor;
	font-size: 0.75em;
	cursor: pointer;
	opacity: 0.7;
	flex-shrink: 0;
}

.wpo-help-bubble {
	display: block;
	margin-top: 0.35em;
	padding: 0.55em 0.8em;
	background: #f0f4f8;
	border-radius: 8px;
	font-size: 0.88em;
	line-height: 1.45;
	color: #3c434a;
	max-width: 32em;
}

/* Help under select (selected option) */
.wpo-select-help {
	display: none;
	margin-top: 0.45em;
	padding: 0.55em 0.85em;
	background: #f0f4f8;
	border-radius: 8px;
	font-size: 0.88em;
	line-height: 1.45;
	color: #3c434a;
}

.wpo-select-help.is-visible {
	display: block;
}

/* —— Size guide link —— */
.wpo-field-size_guide {
	margin-bottom: 0.85em;
}

.wpo-size-guide-link {
	display: inline-flex;
	align-items: center;
	gap: 0.4em;
	font-weight: 500;
	text-decoration: none;
	color: inherit;
	border-bottom: 1px dashed currentColor;
	padding-bottom: 1px;
	transition: opacity 0.15s ease;
}

.wpo-size-guide-link:hover {
	opacity: 0.75;
}

.wpo-size-guide-link.wpo-size-guide-disabled {
	border-bottom: none;
	opacity: 0.6;
	cursor: default;
}

.wpo-size-guide-icon {
	flex-shrink: 0;
	vertical-align: middle;
}

.wpo-size-guide-text {
	line-height: 1.3;
}

/* —— Separator —— */
.wpo-field-separator {
	margin: 0.5em 0 1em;
}
.wpo-separator {
	display: flex;
	align-items: center;
	gap: 0.75em;
	width: 100%;
}
.wpo-separator::before,
.wpo-separator::after {
	content: '';
	flex: 1;
	height: 1px;
	background: #e0e0e0;
}
.wpo-separator-title {
	flex-shrink: 0;
	font-size: 0.85em;
	font-weight: 600;
	color: #6b7280;
	letter-spacing: 0.02em;
}
/* Plain line when there is no title */
.wpo-separator:not(:has(.wpo-separator-title))::after {
	display: none;
}

/* —— Discounted option prices —— */
.wpo-price-was {
	text-decoration: line-through;
	opacity: 0.55;
	margin-inline-start: 0.25em;
}
.wpo-price-now {
	color: #b32d2e;
	font-weight: 600;
	margin-inline-start: 0.15em;
}