#authPanel.card {

    width: 70%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1), /* Slightly larger, softer shadow */
    0 1px 2px rgba(0, 0, 0, 0.1); /* Smaller, sharper shadow */


    .btr {

        border-top-right-radius: 5px !important;
    }


    .btl {

        border-top-left-radius: 5px !important;
    }

    .nav-tabs {
        display: table !important;
        width: 100%;
    }

    .nav-tabs .nav-link {
        border-radius: 0px;
        text-decoration: none;
        color: black;
        font-size: 1.4rem;
        font-weight: 500;
    }

    .nav-item {
        display: table-cell;
        background: rgb(238, 238, 238);
    }

    .nav-item .active {
        background: rgb(255, 255, 255);
        border-left-color: white;
        border-right-color: white;
        border-top-color: white;
    }

    form {
        padding: 20px;
    }

    form input {
        border-radius: 3px;
    }


    form input:focus {

        box-shadow: none;
    }

    form .form-group.submit button {
        width: 180px;
        background: rgb(201, 0, 0);
        border: none;
    }
    
    form .form-group.submit button:hover {
        background: rgb(173, 0, 0);
    }


    .password-strength {
        margin-top: 12px;
    }

    button {
        z-index: 0 !important;
    }

    .required-star {
        color: red;
    }

    .forgot-password-link {
        text-decoration: none;
        color: rgb(48, 48, 48);
        transition: color 0.2s ease-in;
    }

    .forgot-password-link:hover {
        color: rgba(255, 0, 0, 0.842);
    }

}

@media (max-width: 767px) {

    /* Styles for mobile devices */
    #authPanel.card {
        width: 90%;
        margin-top: 0px !important;
    }

    #maincontent {
        margin-top: 0 !important;
    }
}

/* Tablet devices */
@media (min-width: 768px) and (max-width: 1023px) {

    /* Styles for tablet devices */
    #authPanel.card {
        width: 90%;
    }
}