// CLI Version 1.0.2
// Component Version 1.0.0
.breadcrumbs {
  display: flex;
  align-items: center;
  list-style: none;
  font-size: 14px;
  &__item {
    margin-right: 10px;

    &:not(:last-child)::after {
      content: '/';
      margin-left: 10px;
    }
  }

  &__link {
    text-decoration: none;
    color: #007bff; // Example color
    &:hover {
      text-decoration: underline;
    }
  }
}
// ========================================
// Media Queries
// ========================================
// Adjusting desktop screens
@media (min-width: 1024px) {
}
// Adjusting  for tablet screens (between small tablets and desktops)
@media (max-width: 1023px) {
}
// Adjusting for smaller screens (small tablets and mobiles)
@media (max-width: 768px) {
  .breadcrumbs {
    font-size: 16px;
    padding-left: 16px;
    &__item {
      margin-right: 4px;
    }
  }
}
// Adjusting  for smaller screens (mobiles)
@media (max-width: 480px) {
  .breadcrumbs {
    font-size: 16px;
    padding-left: 16px;
    &__item {
      margin-right: 4px;
    }
  }
}