.rooster-admin-fields {
	@apply flex flex-col;
}

.rooster-admin-field {
	@apply grid scroll-mt-[150px] grid-cols-[minmax(10rem,var(--ra-label-w))_minmax(0,1fr)_auto] items-start gap-x-4 gap-y-1 border-t border-border py-3 first:border-t-0;
	grid-template-areas: "label control pin";
}

.rooster-admin-field__label {
	@apply pt-1.5 text-sm leading-[1.4] font-semibold;
	grid-area: label;
}

.rooster-admin-field__control {
	@apply min-w-0;
	grid-area: control;
}

.rooster-admin-field__pin {
	@apply pt-[3px];
	grid-area: pin;
}

.rooster-admin-field__help {
	@apply m-0 ps-[calc(var(--ra-label-w)+16px)] text-xs leading-normal text-secondary-foreground;
	/* The error and the help each take a full row of their own under the control, in their order (0.54.1: they
	   shared one named area and overlapped when a row had both). */
	grid-column: 1 / -1;
}