/* ============================================================
   远智海豚门店管理系统 - 全局响应式补充样式
   适配：手机 / 平板 / 电脑 / 小程序 web-view
   原则：只补充移动端适配，不改变桌面端现有布局
   ============================================================ */

/* ---------- 全局触屏优化（所有设备生效） ---------- */
button, .btn, input[type="submit"], input[type="button"], a.btn {
    touch-action: manipulation; /* 消除移动端点击300ms延迟 */
}
/* 防止 iOS 聚焦输入框时自动放大页面 */
input, select, textarea { font-size: 16px; }
input[type="checkbox"], input[type="radio"] { font-size: inherit; }

/* ---------- 平板（≤992px） ---------- */
@media (max-width: 992px) {
    /* 统计卡片网格降为2列 */
    .stats-grid, .stats, .stat-grid, .cards-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    /* POS 主界面左右布局改为上下（购物车在上方便收银） */
    .main {
        display: flex !important;
        flex-direction: column !important;
    }
    .cart-section { order: -1; max-height: 45vh; }
    .products-section { flex: 1; }
}

/* ---------- 手机（≤768px） ---------- */
@media (max-width: 768px) {
    body { -webkit-text-size-adjust: 100%; }

    /* 顶部导航自动换行，不溢出 */
    .nav-menu, .header-nav, nav {
        flex-wrap: wrap !important;
    }
    .nav-menu a, .nav-menu .nav-item { padding: 8px 10px !important; }
    .user-info { flex-wrap: wrap; gap: 8px !important; }
    .header h1, .header .logo { font-size: 16px !important; }

    /* 数据表格横向滑动查看（不压缩列） */
    table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        max-width: 100%;
        white-space: nowrap;
    }

    /* 统计卡片两列 */
    .stats-grid, .stats, .stat-grid, .cards-grid,
    .summary-cards, .dashboard-cards {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
    }

    /* 设置页标签菜单横向滑动 */
    .tab-menu, .tabs, .settings-tabs, .category-tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap !important;
    }

    /* 标题/容器收窄 */
    h1 { font-size: 20px; }
    h2 { font-size: 17px; }
    .content, .container, .main-content {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /* 表单控件全宽，按钮触达面积≥40px */
    .form-row, .form-inline { flex-direction: column !important; align-items: stretch !important; }
    button, .btn, input[type="submit"] { min-height: 40px; }

    /* 弹窗适配小屏 */
    .modal-content, .dialog, .modal-box {
        width: 94% !important;
        max-width: 94% !important;
        max-height: 88vh;
        overflow-y: auto;
    }

    /* 登录/注册框 */
    .login-form, .login-box, .register-box {
        width: 92% !important;
        max-width: 400px !important;
        margin: 0 auto;
    }

    /* POS 商品网格 2 列 */
    .product-grid, .products-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    /* POS 挂账/促销等面板单列 */
    .panel-grid, .two-col, .grid-2 {
        grid-template-columns: 1fr !important;
    }
}

/* ---------- 小屏手机（≤480px） ---------- */
@media (max-width: 480px) {
    .stats-grid, .stats, .stat-grid, .cards-grid,
    .summary-cards, .dashboard-cards {
        grid-template-columns: 1fr !important;
    }
    .product-grid, .products-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
    .nav-menu a span.nav-text, .nav-text { font-size: 12px; }
}
