.breadcrumbs-wrapper {
  padding: 14px 0;
  border-top: 1px solid var(--c-gray-200);
  .container {
    > span {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      align-items: center;
      font-size: var(--fs-sm);
      span {
        display: flex;
        align-items: center;
        color: var(--c-gray-500);
        &.breadcrumb_last {
          font-weight: 700;
          &:after {
            display: none;
          }
        }
        a {
          margin-right: 10px;
          color: var(--primary-200);
          transition: color 0.3s ease-in-out;
          &:hover {
            color: var(--c-primary-200);
          }
        }
        &:after {
          display: block;
          content: '';
          width: 1px;
          height: 16px;
          background-color: var(--c-gray-500);
        }
      }
    }
  }
}
