@use '../variables' as *;

.#{$prefix}breadcrumb {
	padding-block: var(--#{$prefix}breadcrumb-padding-y, 0.5rem);
	font-size: var(--#{$prefix}breadcrumb-font-size, 0.875rem);
	display: flex;
	align-items: center;
	gap: 0;

	&-item {
		padding-block: var(--#{$prefix}breadcrumb-item-padding-y, 0.25rem);
		padding-inline: var(--#{$prefix}breadcrumb-item-padding-x, 0.5rem);
		white-space: nowrap;
		display: flex;
		align-items: center;

		&:not(&--is-menu) {
			line-height: var(--#{$prefix}breadcrumb-item-line-height, 2rem);
		}
	}
}