/*
 * Saham Mobile Responsive - Shared CSS
 * Include di semua halaman saham: <link href="/assets/saham-mobile.css" rel="stylesheet">
 */

/* ===== BREAKPOINT: TABLET & BELOW (768px) ===== */
@media (max-width: 767.98px) {
    /* Summary cards */
    #summary-cards .col-6 { padding: 0 4px; }
    .summary-card { padding: 8px 6px; border-radius: 6px; }
    .summary-card .summary-value { font-size: 1.2rem; }
    .summary-card .summary-label { font-size: 0.65rem; }
    .summary-card .summary-icon { font-size: 1.1rem; }

    /* DevExtreme grid: horizontal scroll */
    .dx-card-grid { overflow-x: auto; -webkit-overflow-scrolling: touch; position: relative; }
    .dx-card-grid::after {
        content: '← scroll →';
        display: block;
        text-align: center;
        font-size: 0.65rem;
        color: #aaa;
        padding: 2px 0;
    }
    .dx-card-grid .dx-datagrid { min-width: 500px; }
    .dx-datagrid-rowsview .dx-row td { font-size: 0.75rem; padding: 3px 5px; }
    .dx-datagrid .dx-header-row td { font-size: 0.75rem; padding: 5px; }

    /* Login modal */
    .modal-dialog { margin: 10px; }
    .form-control { font-size: 16px; /* prevent iOS zoom */ }
    .btn-login { width: 100%; margin-bottom: 10px; }

    /* Breadcrumb */
    .page-titles .breadcrumb { font-size: 0.75rem; padding: 4px 8px; }

    /* Sidebar */
    .left-sidebar { width: 240px; }

    /* Watchlist */
    .wl-add input { width: 80px; }
    #watchlistGrid .dx-datagrid { min-width: 300px; }

    /* Touch targets */
    .btn { min-height: 44px; }
    .nav-link { min-height: 44px; display: flex; align-items: center; }

    /* Card tables (portfolio, dividend, etc.) */
    .table-responsive { font-size: 0.82rem; }
    .table-responsive .btn { min-height: 38px; font-size: 0.8rem; }

    /* Heatmap */
    .heatmap-container { overflow-x: auto; -webkit-overflow-scrolling: touch; }

    /* Flow page */
    .flow-table { font-size: 0.8rem; }

    /* Filter page */
    .filter-panel .form-control { font-size: 16px; }
    .filter-panel label { font-size: 0.85rem; }

    /* Cards general */
    .card-body { padding: 10px; }
    .card-title { font-size: 1rem; }
    .card-subtitle { font-size: 0.8rem; }
}

/* ===== BREAKPOINT: PHONE (480px) ===== */
@media (max-width: 575.98px) {
    .summary-card .summary-value { font-size: 1rem; }
    .summary-card .summary-label { font-size: 0.6rem; }
    .summary-card .summary-icon { display: none; }
    .dx-card-grid .dx-datagrid { min-width: 420px; }
}