/*
 * Мобил интерфейс (админ панел ва мижоз кабинети учун умумий).
 * Фақат экран 768px дан тор бўлганда ишлайди — компьютердаги кўриниш ўзгармайди.
 * Жадваллар телефонда карточкага айланади (mobile.js ҳар бир катакка устун номини қўяди).
 */
@media (max-width: 768px) {
    body { -webkit-text-size-adjust: 100%; }
    img, video { max-width: 100%; height: auto; }
    h1 { font-size: 22px !important; line-height: 1.25; }
    h2 { font-size: 19px; }

    /* ---------- Админ: асосий майдон (чап меню mobile'да устма-уст очилади) ---------- */
    .content { padding: 68px 14px 28px !important; margin-left: 0 !important; max-width: 100% !important; }
    .content h1:first-child, .content > h1 { margin-top: 0; }

    /* ---------- Жадвал → карточкалар ---------- */
    table.m-cards, table.m-cards tbody { display: block; width: 100%; background: transparent !important; box-shadow: none !important; border-radius: 0 !important; }
    table.m-cards thead { display: none; }
    table.m-cards tr { display: block; background: #fff; border-radius: 10px; box-shadow: 0 1px 4px rgba(0, 0, 0, .08); margin-bottom: 12px; padding: 6px 0; }
    table.m-cards tr:hover { background: #fff; }
    table.m-cards td {
        display: block; border: none !important; padding: 7px 14px !important;
        width: auto !important; max-width: none !important; text-align: left !important; white-space: normal !important;
        overflow-wrap: anywhere;
    }
    table.m-cards td[data-label]::before {
        content: attr(data-label); display: block; font-size: 11px; font-weight: 600;
        color: #8a94a6; text-transform: uppercase; letter-spacing: .02em; margin-bottom: 2px;
    }
    table.m-cards td:empty { display: none; }
    table.m-cards td .btn, table.m-cards td a.btn { display: inline-block; margin-top: 2px; }

    /* ---------- Формалар, қидирув, фильтрлар ---------- */
    .search-bar, .filters, .filter-bar { flex-wrap: wrap; }
    .search-bar input[type="text"], .filters input[type="text"], .filters select, .filter-bar select { width: 100% !important; max-width: 100% !important; box-sizing: border-box; }
    .search-bar button, .filters .btn { width: 100%; }
    input, select, textarea { max-width: 100%; box-sizing: border-box; }
    .card { padding: 14px !important; }

    /* ---------- 1С:ИТС Портал ---------- */
    .stats { display: grid !important; grid-template-columns: 1fr 1fr; gap: 10px !important; }
    .stats .stat { min-width: 0 !important; padding: 10px 12px !important; }
    .stats .stat .num { font-size: 22px; }
    .stats-action { grid-column: 1 / -1; margin-left: 0 !important; align-items: stretch !important; }
    .stats-action .btn, .stats-action .hint { width: 100%; text-align: center !important; }
    .sync-row { flex-direction: column; align-items: stretch !important; }
    .sync-row form, .sync-row .btn { width: 100%; }
    .pager { flex-direction: column; align-items: flex-start !important; }
    .modal-bg { padding: 0 !important; align-items: flex-end !important; }
    .modal { max-width: 100% !important; max-height: 92vh !important; border-radius: 14px 14px 0 0 !important; }
    .modal-foot { flex-direction: column; align-items: stretch !important; }
    .modal-foot > div { justify-content: stretch; }
    .modal-foot .btn { flex: 1; }
    .limit-form input { width: 64px !important; }

    /* ---------- Мурожаат чати (админ ва мижоз) ---------- */
    .text-input input[type="text"] { min-width: 0; }
    .text-input button { padding: 0 16px !important; flex-shrink: 0; }
    .chat-footer { padding: 12px !important; }
    .meta-bar select, .meta-bar input[type="text"] { flex: 1 1 100%; width: 100% !important; }
    .meta-bar button { width: 100%; padding: 9px 16px !important; }

    /* ---------- Мижоз кабинети: сарлавҳа ---------- */
    .cx-header { flex-direction: column !important; gap: 14px; margin-bottom: 20px !important; }
    .cx-actions { width: 100%; flex-wrap: wrap; justify-content: space-between; gap: 12px !important; }
    .cx-actions .client-profile { text-align: left; flex: 1 1 auto; }
    .cx-actions .new-btn { width: 100%; justify-content: center; padding: 12px 20px; }
    .container { padding: 20px 14px !important; box-sizing: border-box; }
    .modal-overlay { align-items: flex-end !important; }
    .modal-overlay .modal { max-width: 100% !important; border-radius: 14px 14px 0 0 !important; padding: 20px !important; box-sizing: border-box; }
}