/*
 * Colors are approximated from the site design. Override the variables from
 * the theme / Customizer CSS to fine-tune, e.g.:
 *   .pbgv-fields { --pbgv-accent: #3ecdc4; --pbgv-input-bg: #fdecec; }
 */
.pbgv-fields {
	--pbgv-accent: #3ecdc4;      /* teal helper text */
	--pbgv-input-bg: #fdecec;    /* pale pink input background */
	--pbgv-input-bg-focus: #fbe2e2;
	--pbgv-label-color: #111111;
	--pbgv-input-color: #222222;

	margin: 0 0 1.25em;
}

.pbgv-field {
	display: block;
	margin: 0 0 1em;
}

.pbgv-field label {
	display: block;
	font-weight: 700;
	color: var(--pbgv-label-color);
	margin-bottom: 0.6em;
}

.pbgv-field-amount label {
	font-size: 1.2em;
}

.pbgv-fields input.pbgv-amount-input {
	width: 100%;
	background: var(--pbgv-input-bg);
	color: var(--pbgv-input-color);
	border: 1px solid transparent;
	border-radius: 4px;
	padding: 0.95em 1.1em;
	font-size: 1em;
	line-height: 1.4;
	box-shadow: none;
	outline: none;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

.pbgv-fields input.pbgv-amount-input:focus {
	background: var(--pbgv-input-bg-focus);
	border-color: var(--pbgv-accent);
}

/* Browser validation bubble styling stays native; invalid state gets a hint */
.pbgv-fields input.pbgv-amount-input:invalid {
	border-color: transparent;
}

.pbgv-field textarea,
.pbgv-field input[type="text"],
.pbgv-field input[type="email"] {
	width: 100%;
}

.pbgv-qty-hint {
	color: var(--pbgv-accent);
	margin: 0.9em 0 0.75em;
}

.pbgv-presets {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	margin: 0 0 1em;
}

.pbgv-preset.pbgv-preset-active {
	outline: 2px solid currentColor;
}

.pbgv-order-codes ul {
	list-style: none;
	padding: 0;
}

.pbgv-order-codes code {
	font-size: 1.1em;
	letter-spacing: 1px;
	padding: 0.2em 0.5em;
	background: rgba(0, 0, 0, 0.05);
	border-radius: 4px;
}