/* хлебные крошки */
.breadcrumbs {
  padding: 1rem 0;
}

.breadcrumbs__list {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  overflow-x: auto;
  webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.breadcrumbs__list::-webkit-scrollbar {
  display: none;
}

.breadcrumbs__item {
  display: flex;
  align-items: center;
}

.breadcrumbs__item:has(a) {
  color: #007BC1;
}

.breadcrumbs__item:has(span) {
  color: var(--40);
}

.breadcrumbs__item:first-child::before {
  content: none;
  flex: none;
  display: block;
  width: .375em;
  aspect-ratio: .4;
  background-image: url(../assets/icons/arrow-left.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.breadcrumbs__item:only-child::before {
  content: '';
}

.breadcrumbs__item a,
.breadcrumbs__item span {
  display: inline-block;
  max-width: 200px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@supports (mask-image: url()) or (-webkit-mask-image: url()) {
  .breadcrumbs__item:first-child::before {
    background-image: none;
    background-color: currentColor;
    -webkit-mask-image: url(../assets/icons/arrow-left.svg);
    mask-image: url(../assets/icons/arrow-left.svg);

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;

    -webkit-mask-position: center;
    mask-position: center;

    -webkit-mask-size: contain;
    mask-size: contain;
  }
}

.breadcrumbs__item::before {
  content: "•";
  padding: 0 .625rem;
  /*padding-right: .625rem;*/
}

@media (max-width: 1024px) {
  .breadcrumbs__item:first-child::before {
    content: '';
  }
}

@media (max-width: 900px) {

  .breadcrumbs__item:not(:first-child) {
    display: none;
  }

  .breadcrumbs__item:not(:nth-last-child(2)):not(:only-child) {
    display: none;
  }

  .breadcrumbs__item a,
  .breadcrumbs__item span {
    max-width: 170px;
  }
}

/* \хлебные крошки */