/* Responsieve CSS voor verschillende schermformaten */
/* assets/css/responsive.css */

/* Extra kleine apparaten (telefoons, 576px en kleiner) */
@media (max-width: 576px) {
    .card-title {
        font-size: 1.1rem;
    }
    
    h1.h2 {
        font-size: 1.5rem;
    }
    
    .table {
        font-size: 0.85rem;
    }
    
    .btn-sm {
        padding: 0.25rem 0.4rem;
        font-size: 0.75rem;
    }
    
    .sidebar {
        padding-top: 56px;
    }
}

/* Kleine apparaten (tablets, 768px en kleiner) */
@media (max-width: 768px) {
    .sidebar {
        position: static;
        height: auto;
        padding-top: 0;
    }
    
    main {
        margin-top: 1rem;
    }
    
    .stat-card .stat-value {
        font-size: 2rem;
    }
}

/* Middelgrote apparaten (desktops, 992px en kleiner) */
@media (max-width: 992px) {
    .sidebar {
        width: 100%;
        margin-bottom: 1rem;
    }
}