/* ============================================================
   Comboware AI — Provider 管理平台 手機版響應式 CSS
   設計目標：手機快速管理、大按鈕、表格易讀
   ============================================================ */

@media (max-width: 767.98px) {
    html {
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    body {
        overflow-x: hidden;
    }

    /* 防止 iOS 輸入縮放 */
    input, select, textarea {
        font-size: 16px !important;
    }

    * { -webkit-tap-highlight-color: transparent; }

    /* 大觸控目標 */
    .btn, button, .btn-action, .btn-refresh, .md3-tab, .view-tab {
        min-height: 44px;
    }

    .btn:hover, .btn-action:hover, .btn-refresh:hover {
        transform: none !important;
    }

    /* 內容區域：減少留白，充分利用手機螢幕 */
    .content {
        padding: 10px !important;
    }

    .harvester-wrap, .pvm-wrap {
        padding: 0.5rem 0.35rem 1rem !important;
    }

    /* ---------- 儀表板統計卡：2 欄 ---------- */
    .overview-cards, .stats-row {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.6rem !important;
    }

    .overview-card, .stat-card {
        padding: 0.85rem 0.9rem !important;
        border-radius: 12px !important;
    }

    .overview-card .value, .stat-card .value {
        font-size: 1.1rem !important;
    }

    /* ---------- 頁首 ---------- */
    .harvester-header h1, .pvm-header h1 {
        font-size: 1.3rem !important;
    }

    .harvester-header .sub, .pvm-header .sub {
        font-size: 0.82rem !important;
    }

    /* ---------- 工具列：垂直堆疊 ---------- */
    .panel-toolbar, .pvm-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0.6rem !important;
    }

    .panel-toolbar h2 {
        font-size: 1rem !important;
    }

    .pvm-toolbar .search-box {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    .pvm-toolbar input[type="text"] {
        min-width: 100% !important;
        min-height: 46px;
    }

    .panel-toolbar .btn, .pvm-toolbar .btn-refresh, .pvm-toolbar .btn-action {
        min-height: 46px;
    }

    /* ---------- Tab 列：橫向捲動 ---------- */
    .md3-tabs, .view-tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .md3-tabs::-webkit-scrollbar, .view-tabs::-webkit-scrollbar {
        display: none;
    }

    .md3-tab, .view-tab {
        font-size: 0.85rem !important;
        padding: 0.8rem 0.9rem !important;
    }

    /* ---------- 表格手機卡片化 ---------- */
    /* 桌面表格維持原樣，手機改為卡片列表，方便拇指閱讀 */
    @media (max-width: 767.98px) {
        .table-responsive {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
        }
    }

    /* ---------- Modal 全螢幕 ---------- */
    .modal-dialog, .pvm-dialog, .pvm-overlay .pvm-dialog {
        margin: 0 !important;
        width: 100% !important;
        max-width: 100vw !important;
        min-height: 100dvh;
        border-radius: 0 !important;
    }

    .pvm-overlay {
        padding: 0 !important;
        align-items: stretch;
    }

    .modal-content, .pvm-dialog {
        border-radius: 0 !important;
        min-height: 100dvh;
    }

    .modal-header, .pvm-dialog-header {
        padding: 0.85rem 1rem !important;
        position: sticky;
        top: 0;
        z-index: 10;
    }

    .modal-body, .pvm-dialog-body {
        padding: 1rem !important;
        max-height: none !important;
    }

    .modal-footer, .pvm-dialog-footer {
        padding: 0.85rem 1rem !important;
        padding-bottom: calc(0.85rem + env(safe-area-inset-bottom)) !important;
        position: sticky;
        bottom: 0;
        z-index: 10;
        box-shadow: 0 -4px 12px rgba(0,0,0,0.06);
    }

    .modal-footer .btn, .pvm-dialog-footer .btn-action {
        flex: 1;
        min-height: 50px;
        font-size: 0.95rem;
    }

    /* ---------- 我的 VM 卡片 ---------- */
    .my-vm-body {
        grid-template-columns: 1fr 1fr !important;
        gap: 0.7rem !important;
        padding: 0.9rem 1rem !important;
    }

    .my-vm-head {
        padding: 0.85rem 1rem !important;
    }

    .my-vm-actions .btn-action {
        flex: 1;
        min-height: 44px;
    }

    /* ---------- 手動新增成功橫幅 ---------- */
    .pvm-created-banner {
        padding: 0.9rem 1rem !important;
    }

    .pvm-created-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 0.4rem 0.75rem !important;
    }

    .pvm-created-title {
        font-size: 1rem !important;
    }

    /* ---------- Pilot / 用量 ---------- */
    .pilot-usage-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 0.6rem !important;
    }

    .pilot-meter {
        padding: 0.6rem 0.75rem !important;
    }

    .pilot-meter .pm-value {
        font-size: 1rem !important;
    }

    .pilot-term-frame {
        height: 60vh !important;
    }

    /* ---------- 表單 ---------- */
    .pvm-form-row select, .pvm-form-row input, .pvm-form-row textarea {
        min-height: 46px;
    }

    #manual-overlay .pvm-dialog-body > div[style*="grid-template-columns:1fr 1fr"] {
        grid-template-columns: 1fr !important;
    }

    /* ---------- 修復嵌在行內樣式的 grid ---------- */
    #manual-overlay .pvm-dialog-body > div[style*="display:grid"] {
        grid-template-columns: 1fr !important;
    }
}

/* ---------- 平板（768–1024px）微調 ---------- */
@media (min-width: 768px) and (max-width: 1024px) {
    .overview-cards, .stats-row {
        grid-template-columns: repeat(3, 1fr) !important;
    }

    .content {
        padding: 16px !important;
    }
}