@use 'exports' as *;
@use '@lucca-front/scss/src/commons/utils/media';
@use '@lucca-front/scss/src/components/button/exports' as button;

.dialog {
	@layer components {
		@include vars;
		@include component;
	}

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

		&.mod-S {
			@include S;
		}

		&.mod-fitContent {
			@include fitContent;
		}

		&.mod-maxContent {
			@include maxContent;
		}

		&.mod-L {
			@include L;
		}

		&.mod-XL {
			@include XL;
		}

		&.mod-XXL {
			@include XXL;
		}

		&.mod-neutralBackground {
			@include neutralBackground;
		}

		&:where(.mod-drawer) {
			@include drawer;

			&:where(.mod-fromBottom) {
				@include fromBottom;
			}

			@include media.max('S') {
				@include fromBottom;
				@include maxContent;
			}
		}

		&.mod-fullScreen {
			@include fullScreen;
		}

		&:has(.dialog-inside-header-actionOptional:not(:empty)) {
			@include withAction;
		}

		&.mod-fancy {
			@include fancy;

			@include media.max('XS') {
				@include fancySmall;
			}

			@include media.max('XXS') {
				@include fancyNarrow;
			}
		}
	}

	@layer mods {
		.dialog-inside-header-button.button {
			@include withCloseButton;
		}
	}
}