@use '@talend/design-tokens/lib/tokens' as tokens;

$module: key-value-tooltip;

.#{$module} {
	list-style-type: none;
	white-space: nowrap;
	pointer-events: none;
	margin-bottom: 0; // override dl margin

	&__entry {
		display: flex;
		align-items: center;
	}

	&__key {
		margin-top: 0; // override dt margin
		font: tokens.$coral-paragraph-m;
		color: tokens.$coral-color-neutral-background;

		&::after {
			content: ':';
		}
	}

	&__value {
		margin-left: tokens.$coral-spacing-xxs;
		color: tokens.$coral-color-accent-text-weak-active;
	}

	&--pattern {
		.#{$module}__value {
			color: tokens.$coral-color-danger-text-weak;
		}
	}
}
