/* Name Field Styles - Structural CSS Only */

/* All visual styles (colors, fonts, borders) inherit from form's Customize settings */

/* Stacked layout (default) */
.name-field-group {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.name-subfield {
	display: flex;
	flex-direction: column;
}

.name-subfield label {
	font-weight: 600;
	margin-bottom: 5px;
	font-size: 14px;
}

/* Side by side layout */
.name-field-group.name-field-side-by-side {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 15px;
}

/* On mobile, side-by-side falls back to stacked */
@media (max-width: 480px) {
	.name-field-group.name-field-side-by-side {
		grid-template-columns: 1fr;
	}
}