/* ✅ Dark Mode ondersteuning */
@media (prefers-color-scheme: dark) {
    body {
        background-color: #121212;
        color: #e0e0e0;
    }

    .category-features-container {
        background-color: #1e1e1e;
        border: 1px solid #333;
        color: #fff;
    }

    .feature-box {
        background-color: #222;
        border: 1px solid #444;
    }

    .stars .filled {
        color: #ffcc00;
    }

    .brand-logo img, .tester-logo img {
        filter: brightness(0.8);
    }

    a {
        color: #66c0f4;
    }

    a:hover {
        color: #1a9fff;
    }
}

/* ✅ "Best Performance" Badge */
.best-performance-badge {
    position: absolute;
    top: -10px;
    right: 10px;
    background-color: gold;
    color: black;
    padding: 5px 10px;
    border-radius: 8px;
    font-weight: bold;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

/* ✅ "Meest Geteste Band" Widget */
.most-tested-badge {
    background-color: red;
    color: white;
    padding: 5px 10px;
    border-radius: 8px;
    font-weight: bold;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
    position: absolute;
    top: -10px;
    left: 10px;
}

/* ✅ Performance Grafiek met Chart.js */
.performance-chart-container {
    max-width: 600px;
    margin: 20px auto;
    padding: 20px;
    background: #f8f8f8;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}