/* ==========================================================================
   ADMIN — mobil/planshet responsivligi. admin.css'dagi asosiy media
   query'lar VA avvalgi admin-mobile-fix.css (to'liq, keyinroq
   qo'shilgan tuzatishlar qatlami) shu yerga jamlangan.
   ========================================================================== */

/* ---------- admin.css dan asosiy responsive qoidalar ---------- */
@media (max-width: 980px) {
    .admin-stat-grid { grid-template-columns: repeat(2, 1fr); }
    .admin-sidebar { position: fixed; left: -260px; z-index: 100; transition: left .2s ease; box-shadow: var(--shadow); }
    .admin-sidebar.state--open { left: 0; }
    .admin-shell.state--visible { display: block; }
    .admin-main { width: 100%; }
}
@media (max-width: 560px) {
    .admin-stat-grid { grid-template-columns: 1fr; }
    .admin-filters input { min-width: 0; flex: 1; }
    .admin-page { padding: 14px; }
}

/* Tarjimon: mobil/planshet - ustun-ustun (chap manba, o'ng natija emas, tepa-past) */
@media (max-width: 900px) {
  .admin-translator__panes { grid-template-columns: 1fr; }
  .admin-translator__textarea { min-height: 180px; }
  .admin-translator__bar { flex-wrap: wrap; }
  .admin-translator__lang-select { min-width: 0; flex-basis: 100%; }
}

/* ==========================================================================
   MUHIM, TO'LIQ QAYTA ISHLAB CHIQILGAN MOBIL/PLANSHET RESPONSIVLIK.

   Avvalgi holatda: hamburger tugmasi HTML'da "display:none" deb
   QATTIQ YOZILGAN edi, va HECH QANDAY CSS qoidasi buni mobil ekranda
   qaytadan ko'rsatmasdi — natijada foydalanuvchi sidebar (asosiy
   navigatsiya menyusi)ni UMUMAN OCHA OLMAS edi, qidiruv maydoni va
   profil blok esa ekrandan CHIQIB KETAR edi. Bu fayl BUTUN muammoni
   tubdan hal qiladi va o'zgarishlar FAQAT 980px va undan tor
   ekranlarga (telefon, planshet) tegishli — desktop ko'rinishi
   butunlay o'zgarishsiz qoladi.
   ========================================================================== */

/* ---------- Qidiruv qutisi — endi inline style emas, klass orqali ---------- */
.admin-search-wrap { position: relative; }
.admin-search-input {
    padding: 8px 14px;
    border-radius: 9px;
    border: 1px solid var(--line);
    background: var(--panel-2);
    color: var(--fg);
    font-size: 13px;
    width: 260px;
}
.admin-search-results {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    width: 340px;
    max-height: 400px;
    overflow-y: auto;
    background: var(--panel);
    border: 1px solid var(--line);
    border-radius: 12px;
    box-shadow: var(--shadow);
    z-index: 200;
}
.admin-search-result:hover { background: var(--panel-2) !important; }

/* ---------- Hamburger tugma va sidebar yopish tugmasi — standart
   holatda (desktop) ko'rinmaydi ---------- */
.admin-topbar__menu-btn {
    display: none;
    border: 0;
    background: transparent;
    color: var(--fg);
    font-size: 22px;
    padding: 4px 8px;
    cursor: pointer;
    flex: none;
}
.admin-sidebar__close {
    display: none;
    position: absolute;
    top: 14px;
    right: 14px;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 8px;
    background: rgba(255, 255, 255, .08);
    color: var(--fg);
    font-size: 20px;
    cursor: pointer;
}
.admin-sidebar-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .55);
    z-index: 99;
}
.admin-sidebar-backdrop.state--open { display: block; }

/* ============================================================
   PLANSHET VA TELEFON — 980px va undan tor ekranlar
   ============================================================ */
@media (max-width: 980px) {
    .admin-topbar__menu-btn { display: inline-flex; align-items: center; justify-content: center; }
    .admin-sidebar__close { display: flex; align-items: center; justify-content: center; }

    /* Sidebar — ekrandan tashqarida boshlanadi, "state--open"
       qo'shilganda chapdan suzib kiradi (mobil ilovalar uslubida). */
    .admin-sidebar {
        position: fixed;
        top: 0;
        left: 0;
        height: 100vh;
        width: min(280px, 84vw);
        transform: translateX(-100%);
        transition: transform .25s ease;
        z-index: 100;
        box-shadow: var(--shadow-lg, 0 20px 60px rgba(0,0,0,.5));
    }
    .admin-sidebar.state--open { transform: translateX(0); }

    .admin-shell.state--visible { display: flex; }
    .admin-main { width: 100%; min-width: 0; }

    /* MUHIM, YANGI TALAB: mobilda jadvallar gorizontal scroll bilan
       ishlaydi, LEKIN oldin bu haqda HECH QANDAY vizual ishora yo'q
       edi — foydalanuvchi "Holat"/"Amal" kabi ustunlar borligini
       bilmasdan, jadval to'liq ko'ringan deb o'ylashi mumkin edi.
       Endi jadval o'ng chetida xira "soya" (fade) ko'rinadi va
       ustida aniq matn bilan ko'rsatma chiqadi — bu "noqulay"
       tuyulishning oldini oladi. */
    .admin-table-wrap {
        position: relative;
        -webkit-overflow-scrolling: touch;
    }
    .admin-table-wrap::after {
        content: "";
        position: sticky;
        top: 0;
        right: 0;
        float: right;
        width: 18px;
        height: 100%;
        margin-left: -18px;
        background: linear-gradient(to right, transparent, rgba(0, 0, 0, .35));
        pointer-events: none;
    }
    .admin-table-wrap::before {
        content: "← suring →";
        position: sticky;
        left: 0;
        display: inline-block;
        margin-bottom: 6px;
        padding: 2px 8px;
        border-radius: 6px;
        background: rgba(0, 0, 0, .35);
        font-size: 10px;
        color: var(--muted);
    }

    /* Topbar — qidiruv va profil endi TO'LIQ EKRANGA MOS,
       ustma-ust tushib ketmaydi. */
    .admin-topbar { padding: 0 12px; gap: 8px; }
    .admin-topbar__title { font-size: 15px; }
    .admin-search-wrap { position: static; }
    .admin-search-input {
        width: 100%;
        max-width: 140px;
        font-size: 12px;
        padding: 7px 10px;
    }
    .admin-search-results {
        position: fixed;
        left: 8px;
        right: 8px;
        top: 58px;
        width: auto;
        max-height: 60vh;
    }
    /* Profil blokida ism/rol matni mobilda o'chiriladi — faqat
       avatar (doira) qoladi, joy tejash uchun. */
    .admin-profile-btn #profileName,
    .admin-profile-btn .admin-role-badge {
        display: none;
    }
    .admin-profile-btn { padding: 4px; gap: 0; }

    .admin-stat-grid { grid-template-columns: repeat(2, 1fr); }
    .admin-page { padding: 14px; }

    /* Modal oynalar — mobilda deyarli to'liq ekranni egallaydi,
       ustidan pastga suriladigan (bottom-sheet) uslubda. */
    .admin-modal-overlay { align-items: flex-end; padding: 0; }
    .admin-modal {
        width: 100%;
        max-width: 100%;
        max-height: 92vh;
        border-radius: 20px 20px 0 0;
    }
}

/* ============================================================
   FAQAT TELEFON — 560px va undan tor
   ============================================================ */
@media (max-width: 560px) {
    .admin-stat-grid { grid-template-columns: 1fr; }
    .admin-filters { flex-direction: column; align-items: stretch; }
    .admin-filters input, .admin-filters select { min-width: 0; width: 100%; }
    .admin-table th, .admin-table td { padding: 8px 10px; font-size: 12px; }
    .admin-search-input { max-width: 110px; }
    .admin-topbar__title { display: none; }
}