@media screen and (max-width: 767px) {
    /* 1. KONTÉNEREK ÉS DATA TABLES SZERKEZETI TISZTÍTÁSA */
    .dataTables_scrollHead,
    .dataTables_scrollFoot {
        display: none !important;
    }

    .dataTables_wrapper,
    .dataTables_scroll,
    .dataTables_scrollBody {
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .dataTables_scrollBody {
        overflow: visible !important;
        border: 0 !important;
    }

    .dataTables_scrollBody table {
        width: 100% !important;
        margin: 0 !important;
    }

    /* 2. ALAP TÁBLÁZAT ÉS KÁRTYA ELRENDEZÉS */
    #adat-tabla,
    #adat-tabla.table {
        display: block;
        width: 100% !important;
        border-collapse: collapse;
        border: 0 !important;
        outline: none !important;
    }

    #adat-tabla thead {
        display: none;
    }

    #adat-tabla tbody {
        display: block;
        width: 100%;
    }

    /* KÁRTYA STÍLUS */
    #adat-tabla tr {
        display: block !important;
        width: 100% !important;
        background-color: #ffffff !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: .4rem !important;
        margin-bottom: 1.25rem !important;
        padding: 0.75rem 1rem !important;
        box-shadow: 0 2px 5px rgba(0,0,0,0.03) !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    /* Csíkozás kiiktatása */
    #adat-tabla.table-striped tbody tr:nth-of-type(odd),
    #adat-tabla.table-striped tbody tr:nth-of-type(even) {
        background-color: #ffffff !important;
    }

    /* 3. CELLÁK ÁLTALÁNOS FORMÁZÁSA */
    #adat-tabla td,
    #adat-tabla tbody tr td,
    #adat-tabla.table-striped tbody tr td {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        padding: 0.6rem 0 !important;
        border-bottom: 1px solid #f1f5f9 !important;
        box-sizing: border-box !important;
        background-color: transparent !important;
        background: transparent !important;
    }

    #adat-tabla td:last-child {
        border-bottom: 0 !important;
    }

    /* Cellák belső elemei (Címke balra, érték jobbra) */
    #adat-tabla td::before {
        content: attr(data-label);
        font-weight: 600;
        color: #6c757d;
        text-transform: none !important;
        text-align: left !important;
        float: none !important;
        display: inline-block !important;
        padding-right: 10px;
    }

    #adat-tabla td > * {
        text-align: right !important;
        justify-content: flex-end !important;
    }

    #adat-tabla td.text-center {
        text-align: right !important;
    }

    /* 4. UTILS: GOMBOK ELRENDEZÉSE (EXPORT + HOZZÁADÁS) */
    #button-container {
        display: flex !important;
        width: 100% !important;
        gap: 8px !important;
        margin-bottom: 0.75rem !important;
    }

    #button-container .dt-buttons {
        flex: 1 !important;
        display: block !important;
    }

    #button-container .btn,
    #button-container button,
    #button-container #btn-add-schedule {
        width: 100% !important;
        display: block !important;
        text-align: center !important;
        padding: 0.55rem 0.75rem !important;
        font-size: 0.875rem !important;
        box-sizing: border-box !important;
        margin: 0 !important;
    }

    /* 5. KERESŐMEZŐ ERŐSZAKOLT TELJES SZÉLESSÉGE */
    .dataTables_wrapper .row:first-child > div:last-child,
    div.dataTables_filter,
    .dataTables_filter {
        width: 100% !important;
        max-width: 100% !important;
        display: block !important;
        float: none !important;
        text-align: left !important;
        margin: 0 !important;
    }

    .dataTables_filter label {
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        margin: 0 !important;
    }

    .dataTables_filter input,
    .dataTables_filter label input {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 100% !important;
        display: block !important;
        flex: 1 !important;
        margin: 0 !important;
        padding: 0.55rem 0.75rem !important;
        background-color: #ffffff !important;
        border: 1px solid #ced4da !important;
        border-radius: 0.25rem !important;
        box-sizing: border-box !important;
    }

    /* 6. EGYEDI OSZLOP: NAPOK BALRA IGAZÍTÁSA ÉS TÖRDELÉSE */
    #adat-tabla td[data-label="Napok"] {
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        gap: 6px !important;
    }

    #adat-tabla td[data-label="Napok"] > * {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: flex-start !important;
        text-align: left !important;
        max-width: 100% !important;
    }

    #adat-tabla td[data-label="Napok"] .btn,
    #adat-tabla td[data-label="Napok"] button {
        margin: 0 !important;
    }

    .table > :not(:first-child) {
        border: none !important;
    }

    /* --- 1. A KÁRTYA LEGTETEJE (Kezdő sor) --- */
    #adat-tabla tr.mobile-card-start {
        border-top: 1px solid #e2e8f0 !important;
        border-top-left-radius: .4rem !important;
        border-top-right-radius: .4rem !important;
        margin-top: 0.5rem !important;
    }

    /* --- 2. A KÁRTYA LEGALJA (Záró sor) --- */
    #adat-tabla tr.mobile-card-end {
        border-bottom: 1px solid #e2e8f0 !important;
        border-bottom-left-radius: .4rem !important;
        border-bottom-right-radius: .4rem !important;
        margin-bottom: 1.5rem !important; /* Itt adjuk meg az események közötti szép nagy távolságot! */
        box-shadow: 0 3px 6px rgba(0,0,0,0.02) !important;
    }

    /* Ha egy esemény csak egyetlen egy sorból áll, az egyszerre start és end is */
    #adat-tabla tr.mobile-card-start.mobile-card-end {
        border: 1px solid #e2e8f0 !important;
        border-radius: .4rem !important;
    }

    /* --- DINAMIKUS MOBIL FEJLÉC STÍLUSA --- */
    .mobile-card-header {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        background-color: #f8f9fa !important;
        padding: 0.75rem 1rem !important;
        border-bottom: 1px solid #f1f5f9 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .mobile-card-header .title { font-weight: 600 !important; color: #495057 !important; font-size: 0.8rem !important; }
    .mobile-card-header .value { font-family: monospace !important; color: #6c757d !important; font-size: 0.8rem !important; }

    /* --- DINAMIKUS STÁTUSZ SÁV STÍLUSA --- */
    .mobile-card-status {
        display: block !important;
        text-align: center !important;
        padding: 0.55rem 1rem !important;
        margin: 0.75rem 1rem 0.25rem 1rem !important;
        border-radius: 0.25rem !important;
        font-weight: 600 !important;
        font-size: 0.85rem !important;
        box-sizing: border-box !important;
    }

    .mobile-card-status.bg-warning { background-color: #ffc107 !important; color: #212529 !important; }
    .mobile-card-status.bg-success { background-color: #1cbb8c !important; color: #fff !important; }
    .mobile-card-status.bg-primary { background-color: #3b7ddd !important; color: #fff !important; }

    /* Biztosítjuk, hogy a Bootstrap row-k ne engedjék a belső elemeket letörni */
    .id-filter-muvelet-box,
    .id-filter-date-box {
        display: flex !important;
        flex-direction: row !important; /* Kényszerített egy sor */
        width: 100% !important;
        max-width: 100% !important;
        height: 40px !important; /* Fix, egységes magasság */
        box-sizing: border-box !important;
    }

    /* A Dátumnavigáció doboz belső gombjai és inputja */
    .id-filter-date-box button {
        width: 50px !important; /* A nyilaknak fix, kompakt szélesség */
        min-width: 50px !important;
        max-width: 50px !important;
        height: 40px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-shrink: 0 !important; /* Tilos összenyomni a gombot */
        margin: 0 !important;
    }

    /* A dátum input mező középen (rugalmasan kitölti a maradék helyet) */
    .id-filter-date-box input {
        flex: 1 !important; /* Elfoglalja az összes szabad helyet a két nyíl között */
        width: auto !important;
        min-width: 0 !important;
        height: 40px !important;
        text-align: center !important;
        margin: 0 !important;
        border-radius: 0 !important; /* Eltüntetjük a belső kerekítéseket a csatlakozásnál */
        border-left: 0 !important;
        border-right: 0 !important;
    }

    /* A Művelet doboz select mezőjének nyújtása */
    .id-filter-muvelet-box select {
        flex: 1 !important;
        width: auto !important;
        height: 40px !important;
    }

    .id-filter-muvelet-box .input-group-text {
        height: 40px !important;
    }

    #adat-tabla tr:has(.dataTables_empty),
    #adat-tabla tr td.dataTables_empty {
        display: block !important;
        background-color: transparent !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        text-align: center !important;
        justify-content: center !important;
        color: #94a3b8 !important;
        font-weight: normal !important;
        font-size: 0.9rem !important;
    }
}