/* ============================================================
   bottom-nav.css — Bottom Navigation এর সব CSS
   রঙ, সাইজ বদলাতে এই ফাইল খুলুন
   ============================================================ */

/* ══ BOTTOM NAV — ALWAYS FIXED ON SCREEN ══ */
html,body{
  width:100%!important;
  max-width:100%!important;
  overflow-x:hidden!important;
}
body{
  padding-bottom:calc(76px + env(safe-area-inset-bottom))!important;
}
.bottom-nav{
  position:fixed!important;
  left:0!important;
  right:0!important;
  bottom:0!important;
  top:auto!important;
  width:100vw!important;
  max-width:100vw!important;
  min-height:64px!important;
  z-index:999!important;
  display:grid!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
  align-items:center!important;
  background:#F9F6EF!important;
  border-top:1px solid rgba(199,167,77,0.25)!important;
  padding:6px 0 calc(10px + env(safe-area-inset-bottom))!important;
  margin:0!important;
  box-shadow:0 -4px 18px rgba(0,0,0,.24)!important;
  transform:none!important;
  translate:none!important;
  inset:auto 0 0 0!important;
  will-change:auto!important;
  backface-visibility:hidden!important;
  contain:layout paint!important;
}
.bnav-item{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  color:rgba(255,255,255,0.55);
  font-size:0.58rem;
  font-weight:500;
  padding:4px 0;
  cursor:pointer;
  transition:color .15s;
  background:transparent;
  min-width:0;
  border:0;
}
.bnav-item.active,.bnav-item:hover{color:var(--gold)}
.bnav-ico{font-size:1.2rem;line-height:1}
.bnav-badge{position:absolute;top:-2px;right:-4px;background:var(--red);color:var(--white);font-size:0.5rem;min-width:14px;height:14px;border-radius:7px;display:flex;align-items:center;justify-content:center;padding:0 2px}
.bnav-rel{position:relative;display:inline-block}
@media(min-width:768px){
  body{padding-bottom:0!important}
  .bottom-nav{display:none!important}
}
@media(max-width:767px){
  .bottom-nav{
    position:fixed!important;
    bottom:0!important;
  }
}

/* লেবেল (নামের লেখা) */
.ks-bnav-label,
.bnav-label {
  display: block !important;
  font-size: .58rem !important;
  line-height: 1.1 !important;
  color: inherit !important;
  margin-top: 2px !important;
}

/* Active ও hover — গোল্ড রঙ */
.ks-bnav-item.active,
.ks-bnav-item:hover,
.bnav-item.active,
.bnav-item:hover {
  color: #C7A74D !important;
}

/* Modal খোলা থাকলে লুকাবে */
body.ks-modal-open .ks-bottom-nav,
body.ks-modal-open .bottom-nav {
  display: none !important;
}