/* --- CARD (Modernizált) --- */
    .card {
        /* Keret: Alkalmazkodó szürke */
        border: 1px solid var(--bs-border-color);
        border-radius: 10px;

        /* Háttér: Világosban marad a te #fafafa színed, sötétben a bootstrap kártya háttere */
        background-color: var(--bs-body-bg);
        /* VAGY ha ragaszkodsz a #fafafa-hoz világosban: */
        /* background-color: #fafafa; */
    }

    /* Ha a fenti #fafafa-t használod, sötét módban felül kell írni: */
    [data-bs-theme="dark"] .card {
        background-color: var(--bs-card-bg);
    }

    /* --- CARD HEADER --- */
    .card-header {
        /* Alapértelmezett (Light mode): A te kék színed */
        background-color: #e8f0fe;

        /* Keret és szöveg: Alkalmazkodó változók */
        border-bottom: 1px solid var(--bs-border-color);
        color: var(--bs-body-color); /* #333 helyett */

        font-weight: 500;
        font-size: 1.05rem;
    }

    /* --- CARD HEADER (Dark Mode Override) --- */
    /* Ez a rész csak sötét módban aktiválódik */
    [data-bs-theme="dark"] .card-header {
        /* A #e8f0fe helyett egy sötétkék/szürke áttetsző hátteret adunk */
        background-color: rgba(13, 110, 253, 0.15);
        /* Vagy használhatsz sima szürkét: background-color: var(--bs-tertiary-bg); */

        color: var(--bs-body-color); /* Fehér szöveg */
    }

    .card-body {
        font-size: 0.9rem;
        /* A szöveg színe automatikusan jó lesz a body beállítás miatt */
    }

    /* --- GOMBOK --- */
    /* A zöld gomb maradhat fix színű, ha a kontraszt jó (fehér szöveggel) */
    .btn-success {
        background-color: #2a8d60;
        border: none;
        color: #ffffff; /* Fontos: fix fehér szöveg, hogy sötétben is látszódjon a gombon */
    }

    .btn-success:hover {
        background-color: #237650;
        color: #ffffff;
    }