@use '_variables.scss' as *;

.adpresso-modal-content .adpresso-field-control > *:not(:first-child) {
	margin-left: 1em;
}

.adpresso-field-control {
	display: flex;
	flex-direction: column;
	gap: 1em;

	/* Label Styling */
	.adpresso-field-label {
		display: flex;
		font-size: $font-size;
		gap: 0.5em;
	}

	.adpresso-field-inner {
		width: 100%;
	}

	.adpresso-field-help {
		margin: 0;
		color: $color-icon;
		display: inline-flex;
		gap: 0.5em;
	}

	.adpresso-field-error {
		font-size: 12px;
		color: $color-accent2;
		margin: 0;
		font-weight: 500;
		display: flex;
		align-items: center;

		&::before {
			content: "!";
			display: inline-block;
			margin-right: 4px;
			background: $color-accent2;
			color: white;
			width: 14px;
			height: 14px;
			border-radius: 50%;
			text-align: center;
			line-height: 14px;
			font-size: 10px;
		}
	}

	&.is-premium {
		color: #2bafd8;
	}

	&__child {
		margin-left: 1em;
	}
}

.adpresso-field-control.is-premium * {
	cursor: not-allowed;
}