/* ═══════════════════════════════════════════════
   DocMarocSAAS — Responsive Design
═══════════════════════════════════════════════ */
@media (max-width: 1024px) {
    .app-layout { grid-template-columns: 1fr; }
    .sidebar { transform: translateX(-100%); transition: transform 0.3s var(--ease); }
    .sidebar.open { transform: translateX(0); }
    .app-header { margin-left: 0; grid-column: 1; }
    .app-content { margin-left: 0; grid-column: 1; padding: 20px; }
    .dashboard-grid { grid-template-columns: 1fr; }
    .form-grid { grid-template-columns: 1fr; }
    .dossier-grid { grid-template-columns: 1fr; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .quick-actions { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
    html { font-size: 14px; }
    .auth-card { padding: 28px 24px; margin: 16px; }
    .stats-grid { grid-template-columns: 1fr; }
    .page-header { flex-direction: column; align-items: flex-start; gap: 12px; }
    .filters-bar { flex-direction: column; align-items: stretch; }
    .search-box { margin-left: 0; }
    .search-box input { width: 100%; }
    .modal { padding: 24px; width: 95%; }
}