@media (max-width: 1100px) {
    #id-font-Alro-Bold {
        font-size: 1rem !important;
    }

    .table-responsive {
        display: block;
        width: 100%;
        overflow-x: auto; /* Enables horizontal scrolling */
        white-space: nowrap;
    }

    #projectTable {
        min-width: 800px; /* Ensures table doesn't shrink too much */
    }

    .d-flex.justify-content-end img {
        width: 45px; 
        height: 45px;
    }

}        

@media (max-width: 850px) {
    html, body, * {
    font-size: 0.9rem;
    }

    button {
    font-size: 0.9rem;
    }

    #id-font-Alro-Bold {
        font-size: 1rem !important;
    }

}        
@media (max-height: 850px) {
    html, body, * {
    font-size: 0.9rem;
    }

    button {
    font-size: 0.9rem;
    }

    .login-container {
        flex-direction: row; /* Side-by-side layout for short screens */
        justify-content: space-around;
    }

    .login-logo {
        max-width: 40%; /* Slightly bigger when placed next to form */
    }

    .d-flex.justify-content-end img {
        width: 40px; 
        height: 40px;
    }

}