
    /* CSS to style the login form, inputs, and buttons */
    #loginForm {
        max-width: 600px;
        margin-left: 180px;
        padding: 20px;
    }


    .inputGroup {
        display: block; /* Aligns items horizontally */
        margin-bottom: 10px; /* Adds space below each input group */
    }

    .inputGroup input {
        flex-grow: 1; /* Input fields take up the remaining space */
        padding: 10px;
        margin-right: 10px; /* Space between input field and button */
        border: 1px solid #ddd;
        border-radius: 5px;
    }

    .primaryButton {
        background-color: #007bff; /* Primary color for the button */
        color: white;
        padding: 10px 15px;
        border: none;
        border-radius: 5px;
        cursor: pointer;
    }

    #passwordDiv {
        display: none; /* Initially hide the password input group */
    }
    
    .nav-pills{
        --bs-nav-pills-link-active-bg:#8f1f622b;
        color:black;
    }
    .nav-pills .nav-link.active, .nav-pills .show>.nav-link{
        color:#000;
        border-bottom: 4px solid #8f1f62;
    }
    .nav-pills .nav-link {
        border-radius: 0px;
        background: #e5dcdc52;
    }

    .portal-header1 {
        background-color: #702b58;
        color: #ffffff;
        width: 101%;
        padding: 10px;
        text-align: center;
    }
    .portal-header1 a {
        color: #ffffff;
        text-decoration: none;
    }
    .user-info {
        text-align: left;
        margin-left: 40px !important;
    }

    body{
        width: 99%;
    }
    .nav-link{
        color: #787c82;
    }
    .form-control {
        padding: 0.2rem 0.75rem;
    }
    .nav-link{
        padding: 4px 20px;
    }
    .accordion {
        --bs-accordion-btn-focus-border-color: #fff;
        --bs-accordion-btn-focus-box-shadow: #fff;
        --bs-accordion-border-color: #fff;
    }
    .accordion-button:not(.collapsed) {
        box-shadow: #fff;
    }
    .accordion-item {
        border-bottom: 0.5px solid #fff !important;
    }
    .accordion-button:not(.collapsed)::after {
        margin-top: -7px;
        background-image: var(--bs-accordion-btn-active-icon);
        transform: var(--bs-accordion-btn-icon-transform);
    }
    .accordion-button::after {
    margin-top: 7px;
    flex-shrink: 0;
    width: var(--bs-accordion-btn-icon-width);
    height: var(--bs-accordion-btn-icon-width);
    margin-left: auto;
    content: "";
    background-image: var(--bs-accordion-btn-icon);
    background-repeat: no-repeat;
    background-size: 15px;
    transition: var(--bs-accordion-btn-icon-transition);
    }
    select[multiple] option:checked {
        color: #702b58;
    }
    .ui-dialog .ui-dialog-buttonpane button {
    border-radius: 10%;
    padding: 0px 14px;
    border: 0px;
    color: white;
    background: #3c80e4;
    margin: 0.5em 0.4em 0.5em 0;
    cursor: pointer;
    }
    .ui-dialog .ui-dialog-titlebar-close {
    display: none;
    }

    .form-control{
        border: 1px solid #0b5ed7;
        color: #0b5ed7;
    }
    .form-select{
        border: 1px solid #0b5ed7;
    }

    .custom-select-sm {
        padding-bottom: 2px;
        padding-top: 2px;
        min-height: auto;
        padding-left: 18px;
        font-size: 18px;
    }
    .alert-success{
        color:green;
        font-weight: bold;
    }

    .header-title-logo img {
        margin-top: -10px;
        width: auto;
        max-width: 100%;
        max-height: 50px;
    }
    .fc-scroller {
        height: 400px !important;
        overflow: hidden !important;
    }
    
        /* Mobile responsive */
        .checkmobile {
                margin-top: -20px; 
                margin-bottom: -12px;
            }
            .mobilehr{
                margin-top: -10px;
                margin-left: -12px
            }
        @media (width <= 1000px) {
            .checkmobile {
                margin-top: -16px; 
                margin-bottom: 0px;
            }
            .mobilehr{
                margin-top: 0px;
                margin-left: -12px
            }
        }