/* ===== RESPONSIVE ===== */
@media (max-width: 1100px) {
    /* Hamburger einblenden */
    .navbar-toggle { display: flex; align-items: center; }

    /* Rechte Seite nach links schieben (nimmt den Platz der versteckten Nav ein) */
    .navbar-right { margin-left: auto; }

    /* Nav-Links: standardmäßig versteckt, klappt als Dropdown auf */
    .navbar-nav {
        display: none;
        position: absolute;
        top: 3.85rem;
        left: 0;
        right: 0;
        flex-direction: column;
        flex: none;
        margin-left: 0;
        background: var(--color-surface);
        border-bottom: 1px solid var(--color-border);
        box-shadow: 0 6px 16px rgba(0,0,0,0.12);
        padding: 0.5rem 1rem 0.75rem;
        gap: 0.125rem;
        z-index: 99;
    }
    .navbar-nav.open { display: flex; }
    .navbar-nav li   { width: 100%; }
    .navbar-nav a    { padding: 0.69rem 0.83rem; font-size: 0.99rem; }

    .kpi-grid  { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
    /* Benutzername ausblenden — nur Icons bleiben sichtbar */
    .user-info { display: none; }
}
@media (max-width: 600px) {
    .kpi-grid     { grid-template-columns: 1fr; }
    .form-row     { grid-template-columns: 1fr; }
    .search-bar   { flex-direction: column; align-items: stretch; }
    .search-bar .form-control,
    .search-bar select.form-control { max-width: 100%; }
}

/* TODO-Styles wurden nach app.todos.css ausgelagert. */

/* =====================================================
   _responsive.css
   Zweck:          Core-CSS-Modul (Layout)
   Verwendet von:  Core-Basis auf allen Seiten (main.php/auth.php)
   Abhaengigkeiten: Reihenfolge base -> layout -> components
   Verantwortlich: Core-Styles
   ===================================================== */