html[lang='ar'] .user-card.user-card-1 .list-group.list-group-flush li{
    display: flex;
    direction: rtl;
    justify-content: space-between;
}
.multiselect-dropdown-list::-webkit-scrollbar{
    width: 50px;
}
html[lang='ar'] .dir-ar{
    display: flex !important;
    flex-direction: row-reverse !important;
    justify-content: flex-end !important;
}
html[lang='ar'] .dir-ar span {
    margin-left: 5px !important;
}
html[lang='ar'] .dir-ar-hostel{
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
}
html[lang='ar'] .dir-ar-hostel span {
    margin-left: 5px !important;
}
html[lang='ar'] table th {
text-align: right !important;
}
div.table-responsive>div.dataTables_wrapper>div.row{
    align-items: center;
}

:root {
    --main-text-color: #851734;
    --main-bg-color: #851734;
    --main-bg-text-color: #ffffff;
    --main-box-shadow: rgba(0, 0, 0, 0.26) 2px 5px 10px;
    --main-box-shadow-hover: rgba(0, 0, 0, 0.32) 0px 5px 15px;
}

.theme .card {
    border-radius: 30px !important;
    padding-top: 20px !important;
    box-shadow: var(--main-box-shadow);
}

.theme .card.bg-c-blue {
    background-color: var(--main-bg-color) !important;
}

.theme .card .card-header h5:after {
    background-color: var(--main-bg-color) !important;
}

.theme .modal-header {
    background-color: var(--main-bg-color) !important;
}

.theme {
    background: #DFECFFFF !important;
    /*-webkit-box-shadow : var(--main-box-shadow) !important;*/
    /*outline: 10px solid transparent !important;*/
}

.theme header {
    border-radius: 30px !important;
    margin-top: 20px;
    margin-right: 280px;
    width: calc(100% - 300px);
    /*overflow: hidden;*/

    /*border: 15px solid #DFECFFFF !important;*/
}

.theme .pcoded-navbar.navbar-collapsed ~ .pcoded-header, .theme .navbar.navbar-collapsed:hover ~ .pcoded-header {
    margin-top: 20px !important;
    margin-right: 140px !important;
    width: calc(100% - 160px) !important;

}

.theme .pcoded-navbar {
    margin-top: 20px !important;
    border-radius: 30px !important;
    height: calc(100vh - 40px);
    overflow: hidden;
    position: fixed;
}

.theme .pcoded-main-container {
    padding-top: 100px !important;
    padding-right: 20px;
}

.theme .pcoded-navbar.navbar-collapsed:hover ~ .pcoded-main-container:before {
    background: transparent;
}

.theme .pcoded-header {
    background-color: var(--main-bg-color) !important;
    color: var(--main-bg-text-color) !important;
}

.theme .navbar-brand {
    background-color: var(--main-bg-color) !important;
    color: var(--main-bg-text-color) !important;
}

.theme .pcoded-navbar {
    -webkit-box-shadow: var(--main-box-shadow) !important;
    box-shadow: var(--main-box-shadow) !important;
}

.theme .pcoded-navbar .nav a:hover,
.theme .pcoded-navbar .nav ul.active > a,
.theme .pcoded-navbar .nav li.active > a:before,
.theme .pcoded-navbar .nav li.active > a {
    background: var(--main-text-color) !important;
    color: #fff !important;
    border-left: 5px solid #fff;
}

.theme .profile-notification .pro-head {
    background: var(--main-bg-color) !important;
}

.theme table thead th {
    background: var(--main-bg-color);
}

.theme table thead th:first-child {
    border-top-right-radius: 20px !important;
}

.theme table th:first-child, .theme table td:first-child {
    padding-right: 20px;
}

.theme table thead th:last-child {
    border-top-left-radius: 20px !important;
}

.theme .calendar table thead th {
    border-radius: 0 !important;
    background: #fff;
}

.theme .dt-buttons .btn {
    color: var(--main-text-color) !important;
    border-color: var(--main-text-color) !important;
}

@media only screen and (max-width: 991px) {
    .theme .pcoded-navbar ~ .pcoded-header {
        margin: 20px;
        width: calc(100% - 40px);
    }

    .theme .pcoded-navbar ~ .pcoded-header .navbar-collapse {
        border-radius: 30px;
    }
}

@media only screen and (max-width: 991px) {
    .theme .pcoded-header.headerpos-fixed ~ .pcoded-main-container {
        padding-top: 160px;
    }
}

@media only screen and (min-width: 991px) {

    .theme .pcoded-navbar {
        margin-right: 12px;
    }
}

