/* BHS_HOME_CATEGORY_CAROUSEL_V101 */

.builder-home-category-carousel{
  position:relative;
  width:100%;
  max-width:1040px;
  margin:0 auto;
  padding:0 42px;
  box-sizing:border-box;
}

.builder-home-category-carousel-viewport{
  width:100%;
  overflow:hidden;
}

.builder-home-category-carousel-track{
  display:flex!important;
  grid-template-columns:none!important;
  gap:24px!important;
  align-items:flex-start;
  overflow-x:auto;
  scroll-behavior:smooth;
  scrollbar-width:none;
  padding:4px 2px 10px;
  overscroll-behavior-x:contain;
  -webkit-overflow-scrolling:touch;
}

.builder-home-category-carousel-track::-webkit-scrollbar{
  display:none;
}

.builder-home-category-carousel-item{
  display:flex!important;
  flex:0 0 112px!important;
  width:112px!important;
  min-width:112px!important;
  max-width:112px!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:0!important;
  color:#555!important;
  text-decoration:none!important;
  text-align:center!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}

.builder-home-category-carousel-image{
  position:relative;
  display:grid;
  place-items:center;
  width:100px;
  height:100px;
  margin:0 auto 9px;
  border:3px solid var(--store-primary,#db4385);
  border-radius:50%;
  background:#fff;
  box-shadow:0 3px 8px rgba(0,0,0,.16);
  overflow:hidden;
  box-sizing:border-box;
  transition:transform .18s ease,box-shadow .18s ease;
}

.builder-home-category-carousel-image::after{
  content:'';
  position:absolute;
  inset:3px;
  border:1px solid rgba(255,255,255,.92);
  border-radius:50%;
  pointer-events:none;
}

.builder-home-category-carousel-image img{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  object-fit:cover!important;
  display:block!important;
}

.builder-home-category-carousel-label{
  display:block;
  width:100%;
  min-height:32px;
  color:#5e5e5e;
  font-size:12px;
  font-weight:600;
  line-height:1.25;
  text-transform:uppercase;
}

.builder-home-category-carousel-item:hover .builder-home-category-carousel-image{
  transform:translateY(-2px) scale(1.03);
  box-shadow:0 6px 14px rgba(0,0,0,.2);
}

.builder-home-category-carousel-item:hover .builder-home-category-carousel-label{
  color:var(--store-primary,#db4385);
}

.builder-home-category-carousel-arrow{
  position:absolute;
  top:49px;
  z-index:3;
  display:grid;
  place-items:center;
  width:34px;
  height:46px;
  padding:0;
  border:0;
  background:transparent;
  color:var(--store-primary,#db4385);
  cursor:pointer;
  font-size:40px;
  font-weight:300;
  line-height:1;
  transform:translateY(-50%);
}

.builder-home-category-carousel-arrow:disabled{
  opacity:.22;
  cursor:default;
}

.builder-home-category-carousel-arrow.prev{
  left:2px;
}

.builder-home-category-carousel-arrow.next{
  right:2px;
}

@media(max-width:900px){
  .builder-home-category-carousel{
    padding:0 34px;
  }

  .builder-home-category-carousel-track{
    gap:16px!important;
  }

  .builder-home-category-carousel-item{
    flex-basis:96px!important;
    width:96px!important;
    min-width:96px!important;
    max-width:96px!important;
  }

  .builder-home-category-carousel-image{
    width:86px;
    height:86px;
  }
}

@media(max-width:560px){
  .builder-home-category-carousel{
    padding:0 28px;
  }

  .builder-home-category-carousel-track{
    gap:12px!important;
  }

  .builder-home-category-carousel-item{
    flex-basis:80px!important;
    width:80px!important;
    min-width:80px!important;
    max-width:80px!important;
  }

  .builder-home-category-carousel-image{
    width:72px;
    height:72px;
    border-width:2px;
  }

  .builder-home-category-carousel-label{
    font-size:10px;
  }

  .builder-home-category-carousel-arrow{
    width:26px;
    font-size:31px;
  }
}