html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    overflow-x: hidden;
}

button,
input,
select,
textarea,
a {
    -webkit-tap-highlight-color: transparent;
}

button,
.btn,
input[type="submit"],
input[type="button"] {
    touch-action: manipulation;
}

img,
svg,
video,
canvas {
    max-width: 100%;
}

.table-responsive,
.table-wrap,
.data-table-wrap,
.responsive-table {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 980px) {
    body {
        padding-bottom: env(safe-area-inset-bottom);
    }

    .app-shell,
    .admin-shell,
    .dashboard-shell,
    .dashboard-layout,
    .main-shell,
    .page-shell {
        width: 100% !important;
        grid-template-columns: 1fr !important;
    }

    .sidebar,
    .app-sidebar,
    .admin-sidebar,
    .dashboard-sidebar {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        border-radius: 0 0 24px 24px !important;
    }

    .content,
    .app-content,
    .admin-content,
    .dashboard-content,
    .main-content,
    .page-content {
        width: 100% !important;
        margin: 0 !important;
        padding: 16px !important;
    }

    .topbar,
    .app-topbar,
    .admin-topbar,
    .dashboard-topbar {
        flex-wrap: wrap !important;
        gap: 10px !important;
    }

    .card,
    .panel,
    .box,
    .section-card,
    .dashboard-card {
        border-radius: 22px !important;
    }

    .grid,
    .cards-grid,
    .stats-grid,
    .dashboard-grid,
    .form-grid,
    .template-grid,
    .quick-grid,
    .report-grid {
        grid-template-columns: 1fr !important;
    }

    form,
    fieldset {
        max-width: 100% !important;
    }

    input,
    select,
    textarea {
        max-width: 100% !important;
        font-size: 16px !important;
    }

    table {
        min-width: 720px;
    }

    .table-responsive table,
    .table-wrap table,
    .data-table-wrap table,
    .responsive-table table {
        min-width: 720px;
    }
}

@media (max-width: 720px) {
    h1 {
        font-size: 1.65rem !important;
        line-height: 1.1 !important;
    }

    h2 {
        font-size: 1.35rem !important;
    }

    .page-header,
    .section-header,
    .dashboard-header {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 12px !important;
    }

    .page-header .btn,
    .section-header .btn,
    .dashboard-header .btn,
    .actions .btn,
    .action-buttons .btn {
        width: 100%;
        justify-content: center;
    }

    .btn,
    button,
    input[type="submit"],
    input[type="button"] {
        min-height: 46px;
    }

    .modal,
    .modal-dialog,
    .dialog,
    .popup {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        margin: 12px auto !important;
    }

    .pwa-install-button {
        bottom: calc(14px + env(safe-area-inset-bottom));
    }

    .pwa-install-tip {
        bottom: calc(74px + env(safe-area-inset-bottom));
    }
}

@media (display-mode: standalone) {
    body {
        padding-top: env(safe-area-inset-top);
        padding-bottom: env(safe-area-inset-bottom);
    }

    .pwa-install-button,
    .pwa-install-tip {
        display: none !important;
    }
}
