/* ════════════════════════════════════════════════════════════════
   MDS Responsive Breakpoint'ler
   3 kademeli: 1024 -> 768 -> 480
   Version: 1.0.0
   DALGA 7.7.9 — DEV 1
   ════════════════════════════════════════════════════════════════ */

/* ── TABLET (<=1024px) ── */
@media (max-width: 1024px) {
    .mds-kpi-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    .mds-filter-bar {
        flex-direction: column;
        align-items: stretch;
    }
    .mds-filter-search { min-width: 100%; }
}

/* ── MOBIL (<=768px) ── */
@media (max-width: 768px) {
    .mds-page-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .mds-page-actions { width: 100%; }

    .mds-kpi-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: var(--mds-space-md);
    }
    .mds-kpi-card { padding: var(--mds-space-lg); }
    .mds-kpi-value { font-size: var(--mds-fs-lg); }

    /* Tablo yatay scroll */
    .mds-table-wrap { overflow-x: auto; }
    .mds-table { min-width: 600px; }

    .mds-pagination {
        flex-direction: column;
        gap: var(--mds-space-md);
        align-items: center;
    }

    /* Modal tam ekran */
    .mds-modal { width: 95%; max-height: 90vh; }

    /* Tab yatay scroll */
    .mds-tabs { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .mds-tab { padding: var(--mds-space-sm) var(--mds-space-lg); }

    /* Timeline dikey */
    .mds-timeline { flex-direction: column; }
    .mds-timeline-step { flex-direction: row; min-width: auto; gap: var(--mds-space-md); }
    .mds-timeline-step:not(:last-child)::after {
        top: auto; left: 16px; right: auto;
        width: 2px; height: calc(100% + 16px);
    }

    /* Platform secici */
    .mds-platform-selector { overflow-x: auto; flex-wrap: nowrap; }

    /* Pipeline bar */
    .mds-pipeline-bar { height: auto; flex-direction: column; }
    .mds-pipeline-stage { min-width: auto; flex-direction: row; gap: var(--mds-space-sm); }
}

/* ── KUCUK MOBIL (<=480px) ── */
@media (max-width: 480px) {
    .mds-kpi-grid {
        grid-template-columns: 1fr;
    }
    .mds-kpi-card {
        padding: var(--mds-space-md);
    }
    .mds-icon-3d { width: 40px; height: 40px; font-size: 18px; }
    .mds-kpi-value { font-size: var(--mds-fs-md); }

    .mds-btn { padding: 8px 12px; font-size: var(--mds-fs-xs); }
    .mds-btn.lg { padding: 8px 16px; font-size: var(--mds-fs-sm); }

    .mds-page-title h1 { font-size: var(--mds-fs-lg); }

    .mds-toast-container { left: 8px; right: 8px; }
    .mds-toast { min-width: auto; width: 100%; }
}
