@use '@lucca-front/scss/src/commons/config';
@use '@lucca-front/scss/src/components/tag/exports' as tag;
@use '@lucca-front/scss/src/components/formLabel/exports' as formLabel;
@use '@lucca-front/scss/src/components/inlineMessage/exports' as inlineMessage;

@use 'exports' as *;

.form {
	@layer components {
		@include component;
	}

	@layer mods {
		&.mod-maxWidth {
			@include maxWidth;
		}
	}
}

@layer mods {
	.form-fieldset {
		&.mod-inline {
			@include inline;
		}

		&.mod-S {
			@include S;
		}

		&:has(~ .box) {
			.form-field {
				&.mod-withArrow {
					@include withArrow;

					&.mod-S {
						@include withArrowS;
					}
				}
			}
		}

		&:has(.radioField-input[aria-invalid='true']),
		&:has(.checkboxField-input[aria-invalid='true']) {
			@include legendInvalid;
		}
	}

	.form-field {
		&.mod-S {
			@include S;
		}

		&.mod-XS {
			@include XS;
		}

		@each $value in config.$fieldsWidth {
			&.mod-width#{$value} {
				@include width($value);
			}
		}

		&.mod-checkable,
		&:has(.radioField),
		&:has(.checkboxField),
		&:has(.switchField) {
			@include checkable;
		}

		&:not(lu-form-field) {
			&:has(
				.textField-input-value[aria-invalid='true'],
				.timePicker-fieldset-group-textfield-input[aria-invalid='true'],
				.simpleSelect-field-input[aria-invalid='true'],
				.multipleSelect-displayer-search[aria-invalid='true']
			) {
				@include invalid;
			}
		}

		&:has(.radioField-input:disabled),
		&:has(.checkboxField-input:disabled),
		&:has(.switchField-input:disabled) {
			.formLabel {
				@include formLabel.disabled;
			}

			.inlineMessage {
				@include inlineMessage.disabled;
			}

			.formLabel-tag {
				&,
				.tag {
					@include tag.disabled;
				}
			}
		}

		&.mod-withArrow {
			@include withArrow;

			&.mod-S {
				@include withArrowS;
			}
		}

		// no gap for checkboxes in tables in particular
		&:has(.checkboxField-input) {
			&:has(.formLabel.pr-u-mask) {
				&:not(:has(.inlineMessage)) {
					@include hiddenLabel;
				}
			}
		}
	}
}

// deprecated
.form {
	@layer components {
		@include vars;
	}
}

.form-group {
	@layer components {
		@include vars;
		@include componentDeprecated;
	}
}

@layer mods {
	.form-group-line-col {
		&[class*='mod-overlay'] {
			@include overlay;
		}

		&.mod-overlay-top {
			@include overlayTop;
		}

		@each $breakpoint, $value in config.$breakpoints {
			@for $i from 1 through 12 {
				&.mod-#{$i}\@mediaMin#{$breakpoint} {
					@include breakpoint($breakpoint, $i);
				}
			}
		}
	}

	.form-group-label,
	.radiosfield-label,
	.checkboxesfield-label,
	.textfield-label {
		&:is(.is-required, .required) {
			@include required;
		}
	}

	.checkboxesfield.mod-framed,
	.radiosfield.mod-framed,
	.form.mod-framed .fieldsetWrapper {
		@include framed;
	}

	.checkboxesfield.mod-framed,
	.radiosfield.mod-framed {
		margin-block-start: 0;
		padding-block: var(--components-field-framed-side-padding) var(--components-field-framed-bottom-padding);
		padding-inline: var(--components-field-framed-side-padding);
	}

	.form-group-label {
		&.is-required {
			&:not(:empty) {
				&::after {
					@extend %isRequired;
				}
			}
		}
	}

	.radiosfield-label,
	.checkboxesfield-label,
	.textfield-label {
		&.is-required {
			&:not(:empty) {
				&::after {
					@extend %isRequired;
				}
			}
		}
	}
}