/* Page background */
html, body {
    background-color: #121212 !important;
    color: #e0e0e0 !important;
}

    /* All elements inherit dark background */
    body * {
        background-color: inherit !important;
        color: inherit !important;
    }

/* Cards / containers */
.card,
.modal-content,
.dropdown-menu {
    background-color: #1e1e1e !important;
    border-color: #2a2a2a !important;
}

/* Tables */
.table {
    color: #e0e0e0 !important;
}

    .table th,
    .table td {
        background-color: #1e1e1e !important;
        border-color: #2a2a2a !important;
    }

    /* Table header */
    .table thead th {
        background-color: #242424 !important;
        color: #ffffff !important;
    }

/* Links */
a {
    color: #4dabf7 !important;
}

    a:hover {
        color: #74c0fc !important;
    }

/* Muted text */
.text-muted {
    color: #b0b0b0 !important;
}

/* Inputs */
input,
select,
textarea {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
    border: 1px solid #2a2a2a !important;
}

/* Buttons (keep Bootstrap intent) */
.btn-outline-secondary {
    color: #e0e0e0 !important;
    border-color: #4dabf7 !important;
}

    .btn-outline-secondary:hover {
        background-color: #4dabf7 !important;
        color: #000000 !important;
    }

    

    @media (max-width: 768px) {
        .table-responsive {
            overflow-x: auto;
            overflow-y: hidden;
        }
    }

    @media (min-width: 769px) {
        .table-responsive {
            overflow-x: visible;
        }
    }

    @media (max-width: 768px) {
        .responsive-img {
            max-width: 80px; /* Smaller size for mobile */
            max-height: 80px; /* Smaller size for mobile */
        }
    }

    @media (min-width: 769px) and (max-width: 1024px) {
        .responsive-img {
            max-width: 100px; /* Medium size for tablets */
            max-height: 100px; /* Medium size for tablets */
        }
    }

    @media (min-width: 1025px) {
        .responsive-img {
            max-width: 150px; /* Larger size for desktops */
            max-height: 150px; /* Larger size for desktops */
        }

        #loginsection {
            margin-right: 200px;
            padding-left: 0px;
        }
    }