/* =========================================================
   FIX: mobile menu without full-screen blur + compact admin tabs
   ========================================================= */

/* 1) Убираем блюр/затемнение всего экрана при открытии меню */
@media (max-width: 920px) {
    body.ob-mobile-menu-open::before {
        display: none !important;
        content: none !important;
        background: transparent !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        pointer-events: none !important;
    }

    body.ob-mobile-menu-open {
        overflow: auto !important;
    }

    .ob-mobile-nav-panel {
        top: 68px !important;
        left: 10px !important;
        right: 10px !important;
        max-height: calc(100vh - 86px) !important;
        background: rgba(25, 29, 27, .98) !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        box-shadow: 0 18px 45px rgba(0,0,0,.32) !important;
    }

    .ob-mobile-nav-panel.is-open {
        pointer-events: auto !important;
    }
}

/* 2) Админка: запрещаем любым блокам вылезать за экран */
@media (max-width: 920px) {
    html,
    body {
        max-width: 100vw !important;
        overflow-x: hidden !important;
    }

    body.ob-admin-mobile,
    body.ob-admin-mobile * {
        box-sizing: border-box !important;
    }

    body.ob-admin-mobile {
        width: 100% !important;
        max-width: 100vw !important;
    }

    body.ob-admin-mobile main,
    body.ob-admin-mobile .main,
    body.ob-admin-mobile .content,
    body.ob-admin-mobile .admin-content,
    body.ob-admin-mobile .dashboard-content,
    body.ob-admin-mobile .page-content,
    body.ob-admin-mobile .admin-main,
    body.ob-admin-mobile .container,
    body.ob-admin-mobile .wrapper {
        width: 100% !important;
        max-width: 100vw !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    body.ob-admin-mobile .card,
    body.ob-admin-mobile .panel,
    body.ob-admin-mobile .admin-card,
    body.ob-admin-mobile .box,
    body.ob-admin-mobile .form-card,
    body.ob-admin-mobile .settings-card,
    body.ob-admin-mobile section,
    body.ob-admin-mobile article {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    body.ob-admin-mobile input,
    body.ob-admin-mobile textarea,
    body.ob-admin-mobile select {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.ob-admin-mobile img,
    body.ob-admin-mobile video,
    body.ob-admin-mobile canvas {
        max-width: 100% !important;
        height: auto;
    }

    body.ob-admin-mobile pre,
    body.ob-admin-mobile code {
        white-space: pre-wrap !important;
        word-break: break-word !important;
    }
}

/* 3) Вкладки/табы в админке: делаем горизонтальную прокрутку */
@media (max-width: 920px) {
    body.ob-admin-mobile .tabs,
    body.ob-admin-mobile .admin-tabs,
    body.ob-admin-mobile .tab-list,
    body.ob-admin-mobile .nav-tabs,
    body.ob-admin-mobile [role="tablist"],
    body.ob-admin-mobile .tabs-nav,
    body.ob-admin-mobile .settings-tabs {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 8px !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        padding: 0 0 10px !important;
        margin-bottom: 12px !important;
        scrollbar-width: thin;
    }

    body.ob-admin-mobile .tabs a,
    body.ob-admin-mobile .admin-tabs a,
    body.ob-admin-mobile .tab-list a,
    body.ob-admin-mobile .nav-tabs a,
    body.ob-admin-mobile [role="tab"],
    body.ob-admin-mobile .tabs-nav a,
    body.ob-admin-mobile .settings-tabs a,
    body.ob-admin-mobile .tabs button,
    body.ob-admin-mobile .admin-tabs button,
    body.ob-admin-mobile .tab-list button,
    body.ob-admin-mobile .nav-tabs button,
    body.ob-admin-mobile .tabs-nav button,
    body.ob-admin-mobile .settings-tabs button {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: max-content !important;
        white-space: nowrap !important;
        min-height: 42px !important;
        padding: 10px 13px !important;
        border-radius: 999px !important;
    }

    body.ob-admin-mobile .tab-content,
    body.ob-admin-mobile .tabs-content,
    body.ob-admin-mobile .tab-pane,
    body.ob-admin-mobile .settings-content,
    body.ob-admin-mobile [role="tabpanel"] {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: hidden !important;
    }
}

/* 4) Формы внутри вкладок: один столбец и нормальные чекбоксы */
@media (max-width: 920px) {
    body.ob-admin-mobile .form-grid,
    body.ob-admin-mobile .grid,
    body.ob-admin-mobile .row,
    body.ob-admin-mobile .columns,
    body.ob-admin-mobile .admin-grid,
    body.ob-admin-mobile .settings-grid {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        gap: 12px !important;
    }

    body.ob-admin-mobile label {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    body.ob-admin-mobile label:has(input[type="checkbox"]),
    body.ob-admin-mobile .ob-service-check {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        width: 100% !important;
        min-height: 46px !important;
    }

    body.ob-admin-mobile input[type="checkbox"],
    body.ob-admin-mobile input[type="radio"] {
        width: 18px !important;
        min-width: 18px !important;
        max-width: 18px !important;
        height: 18px !important;
        margin: 0 !important;
        flex: 0 0 18px !important;
    }
}

/* 5) Таблицы и широкие блоки: доступ через горизонтальную прокрутку, а не вылет за экран */
@media (max-width: 920px) {
    body.ob-admin-mobile table {
        display: table !important;
        min-width: 720px !important;
        width: max-content !important;
        max-width: none !important;
    }

    body.ob-admin-mobile .table-wrapper,
    body.ob-admin-mobile .table-responsive,
    body.ob-admin-mobile .admin-table,
    body.ob-admin-mobile .table-card,
    body.ob-admin-mobile .data-table,
    body.ob-admin-mobile .overflow-x-auto {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
    }

    body.ob-admin-mobile .table-card table,
    body.ob-admin-mobile .admin-table table {
        min-width: 720px !important;
    }
}

/* 6) Кнопки в админке: не растягиваем ВСЕ кнопки насильно, только большие actions */
@media (max-width: 920px) {
    body.ob-admin-mobile button,
    body.ob-admin-mobile .btn,
    body.ob-admin-mobile .admin-btn,
    body.ob-admin-mobile .button {
        max-width: 100% !important;
    }

    body.ob-admin-mobile .form-actions button,
    body.ob-admin-mobile .admin-actions button,
    body.ob-admin-mobile .page-actions button,
    body.ob-admin-mobile button[type="submit"] {
        width: auto !important;
        min-width: 44px !important;
    }

    body.ob-admin-mobile .form-actions,
    body.ob-admin-mobile .admin-actions,
    body.ob-admin-mobile .page-actions {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 10px !important;
        width: 100% !important;
    }
}