.item_row_container{
     display: flex;
     justify-content: space-evenly;
     padding:1rem;
     flex-wrap: wrap;

}
.container_row_item{
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-content: center;
     align-items: center;
     width: min-content;
     flex-grow: 1;

}



.inner_row_container_content{
     flex-shrink: 0;
  flex-grow: 1;
  width: 15rem;
}


/* top scroller */

.topScroller{
     height: 100%;
     margin-bottom: 5rem;
}
.bannercontainer{
     /* position: absolute; */

}


.banner-wrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
  /* max-height: 25rem; */

}

.bannercontainer {
  overflow: hidden;
  width: 100%;
  height:40rem;
}

.banner-track {
  display: flex;
  transition: transform 0.6s ease-in-out;
  width: 100%;
}

.banner {
  width: 100%;
  flex-shrink: 0;
  object-fit: cover;
  max-height: auto;
  border-radius: 10px;
}

/* Slide buttons */
.slide-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0,0,0,0.5);
  border: none;
  color: white;
  padding: 1rem;
  font-size: 2rem;
  cursor: pointer;
  z-index: 10;
  border-radius: 50%;
  transition: background 0.3s ease;
}

.slide-btn:hover {
  background: rgba(0,0,0,0.8);
}

.slide-btn.left {
  left: 10px;
}
.slide-btn.right {
  right: 10px;
}

/* 



 */

 .bannercontainer .banner{
     width:100%;
}

 .topScroller_cat_container{
     position: relative;
     padding:1rem;
     margin-top: -10rem;
     display: flex;
     gap:1rem;
     flex-wrap: wrap;
     justify-content: space-between;
}


.topScroller_cat_item{
     display: flex;
     flex-direction: column;
     padding:1rem;
     border-radius: 1rem;
     background-color: var(   --container-bg);
     max-width: 30%;
     height:auto;
     box-shadow: var( --container-shadow);

     gap:1rem;

     flex-grow: 1;
  flex-shrink: 1;
  flex-basis: auto;
  justify-content: space-between;
}
.brand_name_brand_cat{
     position: relative;
     margin-bottom: 10rem;
     margin-left: 2rem;
}
.brand_name_brand_cat h3{
     color: var(--container-bg);

}

.cat_brand_container{
     position: relative;
  padding: 2rem;
  overflow: hidden;
  border-radius: 12px;
  margin: 2rem 0;
}
.cat_brand_container .brand_bg_img {
     position: absolute;
     inset: 0;
     z-index: 0;
     overflow: hidden;
}
.cat_brand_container .brand_bg_img img{
     width: 100%;
     height: 100%;
     object-fit: cover;
     opacity: 1; /* dim the background if needed */
}



.brand_bottom_cat{
     display: flex;
     flex-wrap: wrap;
     gap: 1rem;
     justify-content: flex-start;
     margin-top: 15rem;
}
.cat_brand_container{
     flex-grow: 3;
     width: fit-content;
          width: fit-content;
     min-width:min-content;
     max-width: 60%;
}
.category_list{

     display: grid;
     grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
     gap: 1rem;
     justify-content: center;
     align-items: center;
     width: 100%;
     max-width: 38%;
}
.shop_by_category_container{
     justify-content: center;
     display: flex;
     flex-wrap: wrap;
     gap:1rem;
     justify-content: space-between;
}








@media (max-width: 600px) {
     .topScroller_cat_container{
          margin-top: 1rem;
          padding: 0rem;
     }
     
}