/* ============================================================
   VAJ MENU — mobil moslik tuzatishlari
   ============================================================
   Muammo: admin panelning chap tomonidagi navigatsiya (aside)
   ekranga qarab kichiklashmasdan doim 240px (w-60) kenglikda
   turgan — telefon ekranida (masalan 375px) bu deyarli butun
   ekranni band qilib, asosiy kontent va 11 ta navigatsiya
   tugmasining ko'pi ko'rinmay/bosilmay qolgan.

   Yechim: 768px dan tor ekranlarda "aside" pastki, gorizontal
   scroll qilinadigan navigatsiya panyeliga aylantiriladi — barcha
   tugmalar joylashadi va bittasi ham yo'qolmaydi.
   ============================================================ */

@media (max-width: 767px){

  /* ---- admin panel: chap sidebar -> pastki navigatsiya ---- */
  aside{
    position: fixed !important;
    left: 0 !important; right: 0 !important; bottom: 0 !important; top: auto !important;
    width: 100% !important;
    height: 64px !important;
    flex-direction: row !important;
    border-right: none !important;
    border-top: 1px solid rgba(255,255,255,0.1) !important;
    z-index: 50;
    box-shadow: 0 -8px 24px rgba(0,0,0,0.35);
  }
  /* restoran nomi/logo header qismini yashiramiz - joy tejash uchun */
  aside > div:first-child{ display:none !important; }
  /* "Oshxona ekrani" va "Chiqish" pastki blokini ham yashiramiz,
     ular Sozlamalar sahifasidan ham yetib borish mumkin bo'lgani
     uchun asosiy 11 ta bo'limga joy ochamiz */
  aside > div:last-child{ display:none !important; }

  aside nav{
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    padding: 6px 6px !important;
    gap: 2px !important;
    margin: 0 !important;
  }
  aside nav a{
    flex-direction: column !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    padding: 6px 11px !important;
    gap: 3px !important;
    min-width: 60px;
    border-radius: 10px !important;
  }
  aside nav a span{
    font-size: 9.5px !important;
    line-height: 1.1;
    white-space: nowrap;
  }
  aside nav a svg{
    width: 18px !important;
    height: 18px !important;
  }

  /* asosiy kontent pastki navigatsiya ostida qolib ketmasligi uchun */
  aside + main{
    padding-bottom: 78px !important;
  }

  /* ---- sahifa sarlavha panellari: qirqilish o'rniga yangi qatorga tushsin ---- */
  header{
    flex-wrap: wrap !important;
    height: auto !important;
    min-height: 64px;
    padding: 12px 16px !important;
    row-gap: 10px;
  }

  /* umumiy xavfsizlik: kenglik sig'may qolgan jadval/kontentlar
     gorizontal skrol bilan ko'rinsin, shunchaki qirqilib yo'qolmasin */
  table{ display:block; overflow-x:auto; white-space:nowrap; }
}

/* juda kichik ekranlar (masalan iPhone SE, 375px dan tor) uchun
   navigatsiya matnini yanada ixchamlashtiramiz */
@media (max-width: 380px){
  aside nav a{ min-width: 54px; padding: 6px 8px !important; }
  aside nav a span{ font-size: 9px !important; }
}