:host {
  position: relative;
  box-sizing: border-box;
  font-feature-settings: "cv03", "cv04", "cv11";
}
:host *, :host *:before, :host *:after {
  box-sizing: inherit;
}

:host {
  display: inline-flex;
}

.breadcrumb-item {
  display: inline-flex;
  align-items: center;
  font-family: var(--sl-font-sans);
  font-size: var(--sl-font-size-small);
  font-weight: var(--sl-font-weight-semibold);
  color: var(--sl-color-gray-600);
  line-height: var(--sl-line-height-normal);
  white-space: nowrap;
}

.breadcrumb-item__label {
  display: inline-block;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  text-decoration: none;
  color: inherit;
  background: none;
  border: none;
  border-radius: var(--sl-border-radius-medium);
  padding: 0;
  margin: 0;
  cursor: pointer;
  transition: var(--sl-transition-fast) --color;
}

:not(.breadcrumb-item--leaf) .breadcrumb-item__label {
  color: var(--sl-color-blue-600);
}

:not(.breadcrumb-item--leaf) .breadcrumb-item__label:hover {
  color: var(--sl-color-blue-500);
}

:not(.breadcrumb-item--leaf) .breadcrumb-item__label:active {
  color: var(--sl-color-blue-600);
}

.breadcrumb-item__label:focus {
  outline: none;
}

.breadcrumb-item__label:focus-visible {
  outline: var(--sl-focus-ring);
  outline-offset: var(--sl-focus-ring-offset);
}

.breadcrumb-item__prefix,
.breadcrumb-item__suffix {
  display: none;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
}

.breadcrumb-item--has-prefix .breadcrumb-item__prefix {
  display: inline-flex;
  margin-inline-end: var(--sl-spacing-x-small);
}

.breadcrumb-item--has-suffix .breadcrumb-item__suffix {
  display: inline-flex;
  margin-inline-start: var(--sl-spacing-x-small);
}

:host(:last-of-type) .breadcrumb-item__separator {
  display: none;
}

.breadcrumb-item__separator {
  display: inline-flex;
  align-items: center;
  margin: 0 var(--sl-spacing-x-small);
  user-select: none;
  -webkit-user-select: none;
}