/* created custom class to use more fexible */
.fs-7 { font-size: 11px !important; }

/* Topbar look & feel (screenshot-style) */
.topbar{
  background:#0d0d0d;           /* কালো ব্যাকগ্রাউন্ড */
  color:#ddd;                   /* হালকা টেক্সট */
  border-bottom:1px solid #222; /* পাতলা বর্ডার */
}
.topbar i{ font-size:1rem; opacity:.9; }
.tb-right > span{ gap:.25rem; }

/* ছোট স্ক্রিনে টেক্সট ছোট ও কম দেখাও */
@media (max-width:576px){
  .topbar{ font-size:11px; }
}



@media (max-width: 768px) {
  /* header */
  header {
    padding: 10px 0 !important;
  }
  header img {
    width: 28px !important;
  }
  header .h4 {
    font-size: 18px;
  }
  header .form-control-sm {
    font-size: 13px;
    padding: 6px;
  }
  header .btn-sm {
    padding: 6px 10px;
  }
  header .bi-person,
  header .bi-bag {
    font-size: 1.1rem !important;
  }


  /* search Bar */
  .searchbar{
    max-width: 300px;
  }
}



/* Make carousel height responsive */
.slider-img {
  height: 60vh; /* desktop height = 60% of viewport */
  object-fit: cover;
}

/* ছোট ডিভাইসে height auto রাখো */
@media (max-width: 768px) {
  .slider-img {
    height: auto;
  }
}
.carousel-indicators [data-bs-target] {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #6c757d;
  opacity: 0.5;
  transition: all 0.3s ease;
}
.carousel-indicators .active {
  opacity: 1;
  background-color: #0d6efd; /* Bootstrap primary color */
  transform: scale(1.3);
}