.is-act-home {
  .container-main {
    .breadcrumb {
      display: none;
    }
  }
}

.breadcrumb {
  margin-bottom: 0;
  padding: 12px 0;

  li {
    a {
      text-transform: capitalize;
      color: $bcb-breadcrumb-text-color;
    }

    div {
      text-transform: capitalize;
      line-height: 25px;
      color: $bcb-breadcrumb-text-color;
      font-size: 14px;
    }

    &.is-active {
      a {
        color: $bcb-breadcrumb-link-active-color;
        font-weight: 400;
      }
    }
  }

  .breadcrumb-item {
    margin: 6px;

    .breadcrumb-link {
      color: $bcb-breadcrumb-text-color;

      &:hover {
        color: $bcb-breadcrumb-link-color-hover;
      }

      &.is-active {
        color: $bcb-breadcrumb-link-active-color;
      }
    }
  }

  .breadcrumb-placeholder {
    .icon {
      color: $bcb-breadcrumb-divider-color;

      svg {
        top: 9px;
      }
    }
  }
}

.bc-listing-topbanner-is-active {
  .breadcrumb.cms-breadcrumb.container {
    position: relative;
    z-index: 11;
    max-width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    max-height: 100%;
    margin: auto;

    a.breadcrumb-link {
      font-size: 20px;
      font-weight: 400;
      line-height: normal;
      color: $bcb-breadcrumb-banner-text-color;

      span {
        display: block;
        text-align: center;
      }

      span.sub-breadcrumb-head {
        font-size: 20px;
        font-weight: 400;
        line-height: 88px;
        display: block;
      }
    }
  }
}

.bc-custom-breadcrumb {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  z-index: 1;
  

  .bc-custom-breadcrumb-heading {
    font-size: 40px;
    line-height: normal;
    color: $bcb-breadcrumb-banner-text-color;
    font-weight: 400;
  }

  .breadcrumb {
    padding: 0;
    flex-wrap: wrap;
    justify-content: center;

    .breadcrumb-placeholder {
      position: relative;

      span {
        display: none;
      }

      &::after {
        position: absolute;
        right: 0px;
        top: 12px;
        line-height: 69px;
        z-index: 1;
        content: '';
        width: 2px;
        height: 20px;
        background-color: $bcb-breadcrumb-banner-text-color;
        transform: rotate3d(1, 1, 1, 45deg);
      }
    }

    .breadcrumb-item {
      margin: 6px;

      .breadcrumb-link {
        color: $bcb-breadcrumb-text-color;

        &:hover {
          color: $bcb-breadcrumb-link-color-hover;
        }

        &.is-active {
          color: $bcb-breadcrumb-link-active-color;
        }
      }
    }
  }
}


@media (max-width: 1024px) {
  .bc-custom-breadcrumb {
    .bc-custom-breadcrumb-heading {
      font-size: 30px; 
    }
    .breadcrumb { 
      .breadcrumb-placeholder {
        &::after {
          height: 15px;
        }
      }
    }
  }
.bc-listing-topbanner-is-active {
  .breadcrumb.cms-breadcrumb.container {
    a.breadcrumb-link {
      font-size: 16px; 
      span.sub-breadcrumb-head {
        font-size: 20px;
        font-weight: 400;
        line-height: 88px;
        display: block;
      }
    }
  }
}
 
}
@media (max-width: 767.98px) {
  .bc-custom-breadcrumb {
    .bc-custom-breadcrumb-heading {
      font-size: 24px;
      line-height: normal;
      margin-bottom: 0;
      text-align: center;
    }

    .breadcrumb {
      align-items: center;

      .breadcrumb-item {
        .breadcrumb-title,
        .breadcrumb-link {
          font-size: 14px;
          line-height: normal;
        }
      }

      .breadcrumb-placeholder {
        &::after { 
          top: -6px;
        }
      }
    }
  }

  .container-main {
    .sort--box {
      display: none;
    }
  }
}
