/* ═══════════════════════════════════════════════════════════════════
   mobile.css — پنل مدیریت (shop.venhub.ir) — تجربهٔ موبایل اپ‌مانند
   • نوار ناوبری پایین در موبایل (≤768px) + همبرگر سر جایش
   • دسکتاپ: فقط پولیش ظریف، چیدمان دست‌نخورده
   ═══════════════════════════════════════════════════════════════════ */

/* ── 1) نوار ناوبری پایین (فقط موبایل) ─────────────────────────── */
.vh-bnav {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 160;
  background: var(--sidebar-bg, #1d2327);
  -webkit-backdrop-filter: blur(18px) saturate(1.35);
  backdrop-filter: blur(18px) saturate(1.35);
  border-top: 1px solid rgba(255, 255, 255, .09);
  box-shadow: 0 -8px 32px rgba(0, 0, 0, .3);
  padding: .35rem .25rem calc(.35rem + env(safe-area-inset-bottom, 0px));
  justify-content: space-around;
  align-items: stretch;
}

.vh-bnav-item {
  flex: 1;
  max-width: 92px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .22rem;
  padding: .45rem .15rem .3rem;
  border-radius: 12px;
  color: rgba(255, 255, 255, .55);
  text-decoration: none;
  font-size: .64rem;
  font-weight: 600;
  position: relative;
  transition: color .18s, transform .18s;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  cursor: pointer;
  min-height: 54px;
}

.vh-bnav-item svg {
  width: 22px;
  height: 22px;
  opacity: .8;
  transition: opacity .18s, transform .18s;
}

.vh-bnav-item:active { transform: scale(.92); }

.vh-bnav-item.active {
  color: var(--primary, #3858e9);
}

.vh-bnav-item.active svg {
  opacity: 1;
  transform: translateY(-1px);
}

.vh-bnav-item.active::before {
  content: '';
  position: absolute;
  top: 0;
  width: 26px;
  height: 3px;
  border-radius: 0 0 4px 4px;
  background: var(--primary, #3858e9);
}

.vh-bnav-badge {
  position: absolute;
  top: .2rem;
  left: calc(50% + 8px);
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 99px;
  background: #ef4444;
  color: #fff;
  font-size: .58rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 6px rgba(239, 68, 68, .45);
}
.vh-bnav-badge.hidden { display: none; }

/* ── 2) پولیش عمومی (دسکتاپ + موبایل) ──────────────────────────── */
#adminmenuwrap a,
.vh-bnav-item,
button,
.btn { -webkit-tap-highlight-color: transparent; }

.btn:focus-visible,
.vh-bnav-item:focus-visible,
a:focus-visible {
  outline: 2px solid var(--primary, #3858e9);
  outline-offset: 2px;
}

/* ── 3) چیدمان موبایل ──────────────────────────────────────────── */
@media (max-width: 768px) {

  .vh-bnav { display: flex; }

  /* فضا برای نوار پایین (+ نوار ایمن آیفون) */
  body { padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px)); }

  /* دکمهٔ همبرگر: تضمین نمایش و لمس‌پذیری (۴۴px، همیشه اول ردیف) */
  .sidebar-toggle-btn {
    display: flex !important;
    order: -1;
    flex-shrink: 0;
    position: relative;
    z-index: 5;
    width: 44px;
    height: 44px;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .07);
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 10px;
    color: #e2e8f0;
    visibility: visible !important;
    opacity: 1 !important;
  }
  .sidebar-toggle-btn svg { width: 22px; height: 22px; }
  .ab-brand { flex-shrink: 1; min-width: 0; overflow: hidden; }

  /* هدر جمع‌وجورتر */
  #wpadminbar .ab-user span { display: none; }

  /* لمس‌پسند */
  .btn { min-height: 40px; }
  .btn-sm { min-height: 36px; }
  select, .form-control { min-height: 42px; }

  /* جدول‌ها: اسکرول افقی نرم */
  .table-wrap { -webkit-overflow-scrolling: touch; }

  /* نوار پایین زیر اورلی سایدبار نرود */
  #sidebar-overlay { z-index: 150; }
  #adminmenuwrap.open { z-index: 200; }
}

@media (max-width: 480px) {
  .vh-bnav-item { font-size: .58rem; }
  .vh-bnav-item svg { width: 20px; height: 20px; }
}
