body {
    display: flex;
    flex-direction: column;

}

#main-container {
    flex: 1; /* Dynamicznie wypełnia przestrzeń między nagłówkiem a stopką */
}

#main-content {
    flex: 1; /* Wypełnia dostępną przestrzeń między headerem a stopką */
}

.row {
    overflow-x: hidden;
}

.container {
    max-width: 100%;
}

body.dark-mode {
    background-color: #121212;
    color: #ffffff;
}

body.dark-mode .navbar {
    background-color: #333333 !important;
}

body.dark-mode .navbar .nav-link,
body.dark-mode .navbar .navbar-brand,
body.dark-mode .navbar .dropdown-item {
    color: #ffffff !important;
}

body.dark-mode .dropdown-menu {
    background-color: #444444 !important;
}

body.dark-mode .dropdown-item:hover {
    background-color: #555555 !important;
}

body.dark-mode .container {
    background-color: #1e1e1e;
    /* Ustaw ciemne tło kontenera */
    color: #ffffff;
    /* Zmiana koloru tekstu na biały w trybie ciemnym */
}

body.dark-mode .card {
    background-color: #2c2c2c;
    /* Ciemniejsze tło dla kart */
    color: #ffffff;
}

body.dark-mode .table {
    --bs-table-bg: #2c2c2c !important;
    /* Darker background for the table */
    background-color: var(--bs-table-bg) !important;
    /* Ensure it uses the dark mode value */
    color: #ffffff !important;
    /* White text for table cells */
}

body.dark-mode .table thead {
    background-color: #444444 !important;
    /* Darker background for the table header */
    color: #ffffff !important;
    /* White text for header cells */
}

body.dark-mode .table tbody {
    background-color: #333333 !important;
    /* Darker background for the table body */
}

body.dark-mode .table tbody tr {
    background-color: #333333 !important;
    /* Darker background for each row */
}

body.dark-mode .table tbody tr:hover {
    background-color: #555555 !important;
    /* Darker hover effect for rows */
}

body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: #444444 !important;
    /* Darker background for odd rows */
}

body.dark-mode .table th,
body.dark-mode .table td {
    color: #ffffff !important;
    /* White text for table cells */
}

body.dark-mode .table-bordered {
    border-color: #444444 !important;
    /* Darker borders for the table */
}

body.dark-mode .table tbody td,
body.dark-mode .table tbody th {
    border-color: #444444 !important;
    /* Darker borders for table cells */
}

body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: #444444 !important; /* Ciemniejsze tło dla nieparzystych wierszy */
}

body.dark-mode .table-striped tbody tr:nth-of-type(even) {
    background-color: #333333 !important; /* Ciemniejsze tło dla parzystych wierszy */
}

.list-group-item.odd {
    background-color: #f0f0f0; /* Kolor dla nieparzystych wierszy */
    border-radius: 0;
}

.list-group-item.even {
    background-color: #ffffff; /* Kolor dla parzystych wierszy */
    border-radius: 0;
}

/* Dostosowanie do ciemnego motywu */
.dark-mode .list-group-item.odd {
    background-color: #4a4a4a; /* Kolor dla nieparzystych wierszy w ciemnym trybie */
    color: #ffffff !important;
    border-color: #444444 !important;
    border-radius: 0;
}

.dark-mode .list-group-item.even {
    background-color: #3c3c3c; /* Kolor dla parzystych wierszy w ciemnym trybie */
    color: #ffffff !important;
    border-color: #444444 !important;
    border-radius: 0;
}

/* Styl stopki w trybie ciemnym */
#footer.dark-mode-footer {
    background-color: rgb(51 51 51);
    color: #ffffff;
}

/* Styl stopki w trybie jasnym */
#footer.light-mode-footer {
    background-color: rgb(248 249 250);
    color: #000000;
}
/* Kolory linków w zależności od motywu */
#footer a {
    text-decoration: none; /* Usunięcie podkreślenia */
}

/* Ciemny motyw: linki białe */
#footer.dark-mode a {
    color: #ffffff; /* Linki w ciemnym motywie - białe */
}

/* Jasny motyw: linki ciemne */
#footer.light-mode a {
    color: #007bff; /* Linki w jasnym motywie - niebieskie */
}

/* Dodatkowy efekt przy najechaniu */
#footer a:hover {
    color: #ff9900; /* Kolor linku przy najechaniu */
}

#logsChart+.chartjs-legend {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

/* Styl dla ciemnego tła */
.dark-mode .modal-content {
    background-color: #333; /* Ciemne tło */
    color: #fff; /* Jasny tekst */
    border: 1px solid #444; /* Delikatny kontrast */
}

/* Opcjonalne style dla nagłówka modala */
.dark-mode .modal-header {
    background-color: #444; /* Ciemniejszy nagłówek */
    color: #fff; /* Jasny tekst */
    border-bottom: 1px solid #555;
}

/* Opcjonalne style dla przycisków */
.dark-mode .btn-close {
    filter: invert(1); /* Zmiana koloru ikony zamknięcia */
}



body.dark-mode #upload-icon {
    color: #fff; /* Jasny kolor w ciemnym trybie */
}
/* Jasny tryb */
.ff_fileupload_dropzone_wrap {
    border: 2px dashed #000; /* Ciemna ramka */
    background-color: #d6d6d6; /* Jasne tło */
    color: #000; /* Ciemna ikona */
    transition: all 0.3s ease; /* Łagodna zmiana */
}

.ff_fileupload_dropzone::before {
    
    font-weight: 900;
    font-size: 2rem;
    color: #000; /* Ciemna ikona */
    display: block;
    margin: auto;
}

/* Ciemny tryb */
body.dark-mode .ff_fileupload_dropzone_wrap {
    border: 2px dashed #fff; /* Jasna ramka */
    background-color: #333; /* Ciemne tło */
    color: #fff; /* Jasna ikona */
}

body.dark-mode .ff_fileupload_dropzone::before {
    color: #fff; /* Jasna ikona */
}