/* Light mode (default) */
body {
    background-color: #f2feff; /* Background color for light mode */
    color: #000000; /* Text color for light mode */
}

.table {
    background-color: #f2feff; /* Table background color */
    color: #000;
}

.img-dark, .img-light{
    width: 30px;
}

body .img-dark {
    display: none;
}

body.dark-mode .img-dark.active {
    display: none;
}

body.dark-mode .img-light {
    display: none;
}

body .img-light.active {
    display: none;
}

.btn {
    background-color: #007bff;
    color: #f2feff;
    transition: 0.5s ease-in-out;
}

.btn:hover {
    background-color: #026ddf;
    color: #f2feff;
}

/* Dark mode */
body.dark-mode {
    background-color: #212529; /* Background color for dark mode */
    color: #f8f9fa; /* Text color for dark mode */
}

body.dark-mode .table {
    background-color: #343a40; /* Table background color in dark mode */
    color: #f8f9fa; /* Text color for the table in dark mode */
}

body.dark-mode .btn {
    background-color: #6c7c8a; /* Button color in dark mode */
    color: #f2feff; /* Button text color in dark mode */
}

body.dark-mode .form-control {
    background-color: #343a40; /* Form control background in dark mode */
    color: #f8f9fa; /* Text color in form control in dark mode */
}

/* Styles for small text in light mode */
.form-text {
    color: #6c757d !important; /* Light mode text color */
}

/* Styles for small text in dark mode */
body.dark-mode .form-text {
    color: #f8f9fa !important; /* Lighter text color for small text in dark mode */
}

/* Count result styles */
#countResult {
    font-weight: normal; /* Set font weight to normal for the parent */
}

#count {
    background-color: #A5B68D; /* Set background color */
    font-weight: bold; /* Make text bold */
    padding: 0.2em; /* Add some padding for better appearance */
    border-radius: 4px; /* Optional: Add some border-radius for better appearance */
}

body.dark-mode #count {
    color: #212529;
}

tr td {
    text-transform: uppercase;
    font-weight: 700;
}

tr td a {
    font-weight: normal;
    color: #212529;
}

body.dark-mode tr td a {
    color: #f2feff;
}