@use 'exports' as *;
@use '@lucca-front/scss/src/components/avatar/exports' as avatar;
@use '@lucca-front/scss/src/components/readMore/exports' as readMore;
@use '@lucca-front/scss/src/components/button/exports' as button;

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

	@layer mods {
		.readMore {
			@include readMore.linkReset;
			@include readMore.sunken;
		}
	}
}

@layer mods {
	.activityFeed-content > .button:only-child {
		@include button.outlined;
	}

	.activityFeed-step-avatar {
		@include avatar.S;
	}

	.activityFeed-step-state.mod-success {
		@include success;
	}

	.activityFeed-step-state.mod-critical {
		@include critical;
	}

	.activityFeed-content-update {
		&:has(.activityFeed-content-update-before:empty, .activityFeed-content-update-after:empty) {
			@include single;
		}

		&:has(.activityFeed-content-update-before:empty) {
			&:has(.activityFeed-content-update-after:empty) {
				@include empty;
			}
		}
	}

	.activityFeed-step {
		&.mod-pending {
			@include pending;
		}

		&:has(.activityFeed-content > .button:only-child) {
			@include withButton;
		}
	}
}