body{
    font-size:14px;
}
.main-panel{
    overflow-y:scroll;
    height:calc(100vh - 97px);
}
.sidebar .nav .nav-item .nav-link{
    padding:10px 20px;
}
.sidebar .nav .nav-item .nav-link,.sidebar .nav .nav-item .nav-link i.menu-icon{
    color:#fff;
}
.sidebar-toggle{
    right:-14px;
}
.sidebar-toggle span{
    font-size:14px;
}
.sidebar-icon-only .navbar .navbar-brand-wrapper{
    padding:1rem;
}
.sidebar-icon-only .navbar .navbar-brand-wrapper .brand-logo-mini img{
    width:100%;
}
.sidebar .nav .nav-item:hover > .nav-link i, .sidebar .nav .nav-item:hover > .nav-link .menu-title, .sidebar .nav .nav-item:hover > .nav-link .menu-arrow{
    color:#045CB4;
}
.sidebar-icon-only .sidebar .nav .nav-item .nav-link i.menu-icon{
    color:#fff;
}
.sidebar-icon-only .sidebar .nav .nav-item:hover .nav-link i.menu-icon{
    color:#045CB4;
}
select#viewform_list{
    height:auto!important;
    padding:5px!important;
    color:#000!important;
    outline-color:#000!important;
}
.profile-img{
    width:150px;
    height:150px;
    object-fit:cover;
}
#profileImageDropdown{
    width:50px;
    height:50px;
    object-fit:cover;
}
.sorting{
    width:125px;
    height:30px;
}
#sortOrder.form-select{
    height:auto;
    padding:0;
    outline:0;
    font-size:12px;
    color:initial;
    background-size:16px;
}
@keyframes dropdownAnimation{
    0%{
        transform:translate3d(100px,0,0);
    }
}
.navbar .navbar-menu-wrapper .navbar-nav .nav-item.dropdown .navbar-dropdown{
    width:250px;
}
.notification-modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
.notification-modal-content {
    background-color: #4CAF50; /* Green Background */
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
    max-width: 450px; /* Adjust as needed */
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
    animation-name: animatetop;
    animation-duration: 0.4s;
    border-radius: 10px; /* Rounded Corners */
    color: white;
    position:absolute;
    bottom:50px;
    right:50px;
}
/* Add Animation */
@keyframes animatetop {
    from {top: -300px; opacity: 0}
    to {top: 0; opacity: 1}
}
.notification-close {
    color: white;
    float: right;
    font-size: 28px;
    font-weight: bold;
}
.notification-close:hover,
.notification-close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}
.notification-header {
    padding: 2px 16px;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 10px;
}
.notification-icon {
    font-size: 2em;  /* Example: Adjust size as needed */
}
.notification-body {
    padding: 2px 16px;
    text-align: left;
}
.notification-body p {
    margin-bottom: 5px;
}
.notification-time {
    font-size: 0.8em; /* Adjust as needed */
    text-align: right;
    font-style: italic;
}
.navbar .navbar-menu-wrapper .navbar-nav .nav-item.dropdown .navbar-dropdown .dropdown-item{
    cursor: unset;
}
.dropdown-item:hover, .dropdown-item:focus{
    background:initial;
}
.header.position-fixed{
    width:70%!important;
    margin-left:auto;
    margin-right:auto;
}
.dropdown-menu{
    font-size:14px;
}
#uploadForm .form-control{
    height:auto;
}
.modal{
    z-index:99999;
}
@media (max-width:991px){
    .navbar{
        background:#045CB4;
    }
    .navbar .navbar-brand-wrapper{
        width:150px;
        height:65px;
        padding:10px 0;
    }
    .navbar .navbar-menu-wrapper{
        background:transparent;
        width:calc(100% - 150px);
        padding:10px;
    }
    .navbar .navbar-menu-wrapper .navbar-toggler{
        color:#fff;
    }
    .navbar .navbar-brand-wrapper .brand-logo-mini img{
        height:auto;
    }
    .navbar .navbar-menu-wrapper .navbar-nav .nav-item.dropdown .navbar-dropdown{
        left:auto;
    }
    .sidebar-offcanvas{
        max-height: calc(100vh - 65px);
        top:65px;
    }
    .page-body-wrapper{
        min-height: calc(100vh - 65px);
        padding-top:65px;
    }
    .header.position-fixed{
        position:relative!important;
        width:100%!important;
        padding-bottom:25px;
        z-index:9!important;
    }
    form .para{
        width:100%!important;
    }
    .home-tab .circle-progress-width{
        width:30%;
    }
    .statistics-details div{
        width:47%;
        margin:1%;
        padding:10px 5px;
        display:inline-block;
        background:#fff;
        border-radius:5px;
    }
    .content-wrapper{
        padding:0 5px 5px 5px;
    }
    .card .card-body{
        padding:10px;
    }
    div.dataTables_wrapper div.dataTables_length, div.dataTables_wrapper div.dataTables_filter{
        text-align: left;
        display:inline-block;
    }
    div.dataTables_wrapper div.dataTables_length{
        width:45%;
    }
    div.dataTables_wrapper div.dataTables_filter{
        width:55%;
    }
    div.dataTables_wrapper div.dataTables_length label,div.dataTables_wrapper div.dataTables_filter label{
        font-size:15px;
    }
    div.dataTables_wrapper div.dataTables_filter input{
        width:70%;
        margin-left:3px;
    }
    div.dataTables_wrapper div.dataTables_paginate{
        display:flex;
        justify-content:space-between;
    }
    table th:last-child,table td:last-child{
        border-left:1px solid #ccc;
        padding:5px;
    }
    td .btn{
        padding:5px!important;
    }
    td .btn i{
        margin-left:0!important;
    }
    .menu-option a.btn{
        padding:8px;
    }
    .list-board label{
        font-size:15px;
    }
}