/*
 * BranchDaily Web — AppBottomBar
 * Visual counterpart for Android V6.4 AppBottomBar.kt
 */

:root{
  --bd-nav-bg:rgba(252,253,254,.96);
  --bd-nav-border:#DCE5E9;
  --bd-nav-text:#5B6C74;
  --bd-nav-active:#E94B2B;
  --bd-nav-shadow:0 -8px 28px rgba(27,58,71,.08);
  --bd-nav-font:"Noto Sans Arabic","Segoe UI",Tahoma,Arial,sans-serif;
}

.bd-bottom-bar{
  position:fixed;
  z-index:35;
  left:50%;
  bottom:0;
  transform:translateX(-50%);
  width:min(100%,560px);
  padding-bottom:env(safe-area-inset-bottom);
  font-family:var(--bd-nav-font);
  pointer-events:none;
}

.bd-bottom-bar__inner{
  height:58px;
  padding:2px 14px;
  border:1px solid var(--bd-nav-border);
  border-bottom:0;
  border-radius:20px 20px 0 0;
  background:var(--bd-nav-bg);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:var(--bd-nav-shadow);
  display:flex;
  align-items:stretch;
  justify-content:space-evenly;
  pointer-events:auto;
}

.bd-bottom-item{
  flex:1;
  min-width:0;
  height:100%;
  padding:2px 1px 1px;
  border:0;
  outline:0;
  background:transparent;
  color:var(--bd-nav-text);
  font-family:inherit;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:1px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}

.bd-bottom-item__icon{
  width:31px;
  height:31px;
  border-radius:10px;
  display:grid;
  place-items:center;
  color:currentColor;
  transition:background .16s ease,color .16s ease,transform .16s ease;
}

.bd-bottom-item__icon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.85;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.bd-bottom-item__label{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:10.8px;
  line-height:1.25;
  font-weight:500;
  transition:color .16s ease,font-weight .16s ease;
}

.bd-bottom-item.is-selected{
  color:var(--bd-nav-active);
}

.bd-bottom-item.is-selected .bd-bottom-item__icon{
  background:var(--bd-nav-active);
  color:#fff;
}

.bd-bottom-item.is-selected .bd-bottom-item__label{
  color:var(--bd-nav-active);
  font-weight:700;
}

.bd-bottom-item:active .bd-bottom-item__icon{
  transform:scale(.94);
}

/* نخفي الـ Bottom Bar القديم إذا كان موجوداً من النسخة التجريبية السابقة */
.bottom-nav{
  display:none!important;
}

/*
 * على الكمبيوتر نعتمد شريط التنقل العلوي الخاص بالويب.
 * الـ Bottom Bar يبقى للجوال والتابلت فقط.
 */
@media (min-width:900px){
  .bd-bottom-bar{
    display:none;
  }
}

/* محاكاة مقاسات Android V6.4 على الشاشات الصغيرة */
@media (max-width:899px){
  .bd-bottom-bar{
    width:100%;
  }

  .bd-bottom-bar__inner{
    height:54px;
    border-radius:18px 18px 0 0;
    padding-inline:14px;
  }

  .bd-bottom-item__icon{
    width:30px;
    height:30px;
  }

  .bd-bottom-item__label{
    font-size:10.5px;
  }
}

@media (max-width:390px){
  .bd-bottom-bar__inner{
    padding-inline:8px;
  }

  .bd-bottom-item__label{
    font-size:10px;
  }
}

@media print{
  .bd-bottom-bar{
    display:none!important;
  }
}