.breadcrumbs {
  --breadcrumbs-link-color: #e60076;
  --breadcrumbs-link-hover-color: #be185d;
  --breadcrumbs-current-color: #374151;
  --breadcrumbs-muted-color: #9ca3af;
  --breadcrumbs-focus-color: rgba(230, 0, 118, 0.24);

  display: block;
  width: var(--breadcrumbs-width, 100%);
  max-width: var(--breadcrumbs-max-width, 100%);
  margin: var(--breadcrumbs-margin, 0);
  padding: var(--breadcrumbs-padding, 0);
  min-width: 0;
}

.breadcrumbs__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 4px;
  row-gap: 0;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.breadcrumbs__item {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  color: var(--breadcrumbs-muted-color);
}

.breadcrumbs__item:not(:last-child)::after {
  content: "/";
  margin: 0 4px 0 8px;
  color: var(--breadcrumbs-muted-color);
}

.breadcrumbs__item:last-child {
  flex: 1 1 auto;
}

.breadcrumbs__link,
.breadcrumbs__label,
.breadcrumbs__current {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  line-height: 16px;
}

.breadcrumbs__link {
  color: var(--breadcrumbs-link-color);
  font-weight: 500;
  text-decoration: none;
}

.breadcrumbs__label {
  color: var(--breadcrumbs-current-color);
  font-weight: 500;
}

.breadcrumbs__link:hover,
.breadcrumbs__link:focus,
.breadcrumbs__link:active {
  color: var(--breadcrumbs-link-hover-color);
  text-decoration: none;
}

.breadcrumbs__link:focus-visible {
  outline: 2px solid var(--breadcrumbs-focus-color);
  outline-offset: 3px;
  border-radius: 4px;
}

.breadcrumbs__current {
  color: var(--breadcrumbs-current-color);
  font-weight: 600;
}

.page-section > .breadcrumbs,
.page-frame > .breadcrumbs {
  margin-bottom: var(--breadcrumbs-section-gap, 0);
}

.course-page__back-row .breadcrumbs,
.lesson-page__back-row .breadcrumbs,
.certificate-page__back .breadcrumbs,
.notice-panel > .breadcrumbs,
.checkout-card > .breadcrumbs,
.docs-page > .breadcrumbs {
  width: 100%;
}

.gami .breadcrumbs {
  grid-column: 2;
  width: var(--main-column-width);
  margin: 0 auto;
  padding: 8px 0 0;
  --breadcrumbs-link-color: var(--pink);
  --breadcrumbs-link-hover-color: #be185d;
  --breadcrumbs-current-color: var(--text-2);
}

.breadcrumbs-page-header {
  display: flex;
  flex-direction: column;
  gap: var(--breadcrumbs-after-gap, 0);
  min-width: 0;
}

.breadcrumbs-page-header > .breadcrumbs {
  width: 100%;
}

.breadcrumbs-page-header > .section-heading {
  margin-top: 0;
}

.gami .breadcrumbs + .page {
  padding-top: 5px;
}

@media (max-width: 640px) {
  .breadcrumbs__link,
  .breadcrumbs__label,
  .breadcrumbs__current {
    line-height: 16px;
  }
}