@use 'exports' as *;

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

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

.sortableList-item {
	@layer mods {
		&.mod-clickable {
			@include clickable;
		}

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

// drag and drop preview
:not(.sortableList) {
	> .sortableList-item {
		@layer components {
			@include vars;
		}
	}
}