#progressbar li,ul li {
    list-style-type: none
}

.font-14,.input-group-text,body,h6,p {
    font-size: 14px
}

#sidebar-menu ul li ul.sub-menu,#sidebar-menu ul li ul.sub-menu li ul.sub-menu,*,.btn,.dataTables_wrapper.container-fluid,.tenant-portal-notice-tbl td,ul,ul li {
    padding: 0
}

h1,h2 {
    line-height: 48px
}

h5,h6 {
    line-height: 20px
}

.chat-item .dropdown .dropdown-toggle,.dropdown-item,.form-control,.form-select,.form-stepper-nav-icon i,.table td,.theme-text-color,a,body,p {
    color: var(--body-font-color)
}

*,body,figure,html,ul,ul li {
    margin: 0
}

.font-20,.font-24 {
    line-height: 31px
}

#page-topbar,#preloader {
    position: fixed;
    top: 0;
    right: 0
}

#sidebar-menu ul li a i,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a i {
    font-size: 1.1rem;
    line-height: 1.40625rem
}

.link-hover-effect,a,a:hover,a>* {
    text-decoration: none
}

* {
    border: none;
    outline: 0
}

.custom-scroll,body,html {
    height: 100%
}

body {
    background: var(--bg-light) none repeat scroll;
    font-weight: 400;
    font-family: var(--body-font-family);
    overflow-x: hidden;
    scroll-behavior: smooth
}

.edit-btn,.navbar .dropdown .dropdown-toggle::after,.page-link,.tenant-portal-notice-tbl td,.theme-btn,.theme-btn-back,.theme-btn-green,.theme-btn-purple,.theme-btn-red,a,button {
    transition: .2s ease-in-out
}

.fast-transition {
    transition: .3s ease-in-out
}

.slow-transition {
    transition: .7s ease-in-out
}

a,a>* {
    outline: 0;
    cursor: pointer
}

#sidebar-menu ul li a:hover,#sidebar-menu ul li a:hover i,.primary-color,a:hover {
    color: var(--primary-color)!important
}

img::selection {
    background: 0 0
}

.btn-close:focus,.form-check-input:focus,.page-link:focus {
    box-shadow: none
}

.d-none-content,.dropdown-toggle::after,.logo .logo-sm,.logo-light,.metismenu .mm-collapse,.metismenu .mm-collapse:not(.mm-show),.vertical-collpsed .logo span.logo-lg,.vertical-collpsed .vertical-menu #sidebar-menu .has-arrow:after {
    display: none
}

.page-link,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a span {
    display: inline
}

.form-control,.form-select {
    background-color: var(--white-color);
    height: 50px;
    border: 1px solid var(--border-color);
    border-radius: 20px;
    padding: 13px 20px;
    font-size: 14px
}

.form-control:focus {
    background-color: var(--white-color);
    box-shadow: none
}

#sidebar-menu ul li ul.sub-menu li:hover a::before,.account-settings-menu li ul.account-sub-menu li a:hover:before,.bg-primary-color,.form-check-input:checked,.upload-count-plus {
    background-color: var(--primary-color)
}

.form-select:focus {
    border-color: #86b7fe;
    box-shadow: none
}

.form-control::placeholder {
    color: #9f9f9f
}

.breadcrumb-item.active,.color-heading,.select-property-nav-tabs .nav-link,h1,h2,h3,h4,h5,h6 {
    color: var(--heading-color)
}

textarea {
    min-height: 100px!important
}

label {
    margin-bottom: 10px
}

.form-check-input:checked {
    border-color: var(--primary-color)
}

.form-select {
    padding: 13px 32px 13px 20px
}

.custom-checkbox input {
    padding: 0;
    height: initial;
    width: initial;
    margin-bottom: 0;
    display: none;
    cursor: pointer
}

.custom-checkbox label {
    position: relative;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    margin-bottom: 0
}

.custom-checkbox label:before {
    content: '';
    -webkit-appearance: none;
    background-color: transparent;
    border: 1px solid var(--border-color-2);
    box-shadow: none;
    padding: 7px;
    display: inline-block;
    position: relative;
    vertical-align: middle;
    cursor: pointer;
    margin-right: 7px;
    border-radius: 2px
}

.custom-checkbox input:checked+label:before,.invoice-payment-nav-tabs .nav-item.show .nav-link,.invoice-payment-nav-tabs .nav-link.active,.topic-content-item:hover {
    border: 1px solid var(--primary-color)
}

.custom-checkbox input:checked+label:after {
    content: '';
    display: block;
    position: absolute;
    top: 4px;
    left: 6px;
    width: 5px;
    height: 9px;
    border: solid var(--primary-color);
    border-width: 0 1px 1px 0;
    transform: rotate(45deg)
}

.custom-radiobox [type=radio]:checked,.custom-radiobox [type=radio]:not(:checked) {
    position: absolute;
    left: -9999px
}

.account-settings-menu li.menu-has-children,.content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-img,.exclamation,.link-hover-effect,.stepper-progressbar-wrap,.table.dataTable.dtr-inline.collapsed>tbody>tr>td,.user-profile-img,section,table.dataTable.dtr-inline.collapsed>tbody>tr>td {
    position: relative
}

.custom-radiobox [type=radio]:checked+label,.custom-radiobox [type=radio]:not(:checked)+label {
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: var(--body-font-color);
    margin-bottom: 0
}

.custom-radiobox [type=radio]:checked+label:before,.custom-radiobox [type=radio]:not(:checked)+label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 1px solid var(--border-color-2);
    border-radius: 100%;
    background: var(--white-color)
}

.custom-radiobox [type=radio]:checked+label:after,.custom-radiobox [type=radio]:not(:checked)+label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: var(--primary-color);
    position: absolute;
    top: 3px;
    left: 3px;
    border-radius: 100%;
    -webkit-transition: .2s;
    transition: .2s
}

.custom-radiobox [type=radio]:not(:checked)+label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0)
}

.custom-radiobox [type=radio]:checked+label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

h1,h2,h3,h4,h5,h6 {
    font-weight: 500;
    margin: 0
}

#ui-datepicker-div .ui-datepicker .ui-datepicker-title,.font-normal,.ui-datepicker-div label,p {
    font-weight: 400
}

h1 {
    font-size: 40px
}

h2 {
    font-size: 30px
}

.font-24,h3 {
    font-size: 24px
}

h3 {
    line-height: 36px
}

.dropdown-toggle .iconify,.dropdown-toggle i,h4 {
    font-size: 18px
}

h5 {
    font-size: 15px
}

p {
    margin-bottom: 0
}

:root {
    --navbar-bg: #F8F8F8;
    --footer-bg: #F8F8F8;
    --white-color: #fff;
    --bg-white: #fff;
    --bg-light: #fafafa;
    --off-white: #FAFAFA;
    --heading-color: #002b2d;
    --body-font-color: #737C91;
    --border-color: #f2f2f2;
    --border-color-2: #A5ABBA;
    --primary-hover-color: #0063E6;
    --primary-color-transparent: rgb(0 164 136 / 13%);
    --secondary-hover-color: #009688;
    --red-color: #02a388;
    --danger-color: #FF3D3D;
    --red-color-hover: #dc3545;
    --yellow-color: #FBBF37;
    --orange-color: #FFA043;
    --green-color: #24b855;
    --green-color-hover: #0d943a;
    --body-font-family: 'IBM Plex Sans Arabic',sans-serif
}

#progressbar .active,#progressbar li.active .form-stepper-nav-icon i,.account-settings-menu li:hover .toggle-account-menu,.account-settings-menu-item.active,.color-hover,.select-property-nav-tabs .nav-item.show .nav-link,.select-property-nav-tabs .nav-link.active,.tbl-action-btn:hover,.theme-link,.topic-content-item:hover h4,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a i,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>ul a:hover,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a:active,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a:focus,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a:hover,div.dt-button-info,div.dt-button-info h2 {
    color: var(--primary-color);
    padding: 10px;
    border-radius: 16px
}

.primary-color:hover,.theme-link:hover {
    color: var(--primary-hover-color)!important
}

.secondary-color,.theme-secondary-link {
    color: var(--secondary-color)
}

.bg-light {
    background-color: var(--bg-light)!important
}

.theme-border {
    border: 1px solid var(--border-color)
}

.border-bottom {
    border-bottom: 1px solid var(--border-color)!important
}

.border-top {
    border-top: 1px solid var(--border-color)!important
}

.orange-color {
    color: var(--orange-color)
}

.green-color {
    color: var(--green-color)
}

.red-color,.theme-link-red {
    color: var(--red-color)
}

.red-color:hover,.theme-link-red:hover {
    color: var(--red-color-hover)!important
}

.theme-link-red:hover,a.red-color:hover,button.red-color:hover {
    color: var(--red-color-hover)
}

.bg-orange {
    background-color: var(--orange-color)
}

.bg-off-white,.navbar-header .dropdown .show.header-item,.theme-btn-back:hover,thead {
    background-color: var(--off-white)
}

.bg-green,.online-offline-show.online,.theme-btn-green {
    background-color: var(--green-color)
}

.bg-red,.theme-btn-red {
    background-color: var(--red-color)
}

.bg-red-transparent {
    background-color: rgba(255,67,67,.1)
}

.bg-green-transparent {
    background-color: rgba(82,255,67,.1)
}

.bg-blue-transparent {
    background-color: var(--primary-color-transparent)
}

.bg-purple-transparent {
    background-color: #f0ebff
}

.bg-orange-transparent {
    background-color: #fff0e1
}

.sidebar-badge-light {
    background-color: #eee;
    color: var(--body-font-color)
}

.page-link:hover,button {
    background-color: transparent
}

.theme-secondary-link:hover {
    color: var(--secondary-hover-color)!important
}

.section-t-space {
    padding-top: 140px
}

.section-b-space {
    padding-bottom: 140px
}

.section-t-115-space {
    padding-top: 115px
}

.section-b-115-space {
    padding-bottom: 115px
}

.section-t-80-space {
    padding-top: 80px
}

.section-b-80-space {
    padding-bottom: 80px
}

.section-t-60-space {
    padding-top: 60px
}

.section-b-60-space {
    padding-bottom: 60px
}

.p-30 {
    padding: 15px;
}

.pl-30,.table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control,table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control {
    padding-left: 30px
}

.pr-30 {
    padding-right: 30px
}

.pt-30 {
    padding-top: 30px
}

.pb-30 {
    padding-bottom: 30px
}

.pb-15 {
    padding-bottom: 15px
}

.p-20 {
    padding: 14px
}

.page-title-box,.pb-20 {
    padding-bottom: 20px
}

.p-25 {
    padding: 25px
}

.pb-25 {
    padding-bottom: 25px
}

.invoice-table-part,.pt-20 {
    padding-top: 20px
}

.mt-10 {
    margin-top: 10px
}

.mt-15 {
    margin-top: 15px
}

.mb-15 {
    margin-bottom: 15px
}

.mt-25 {
    margin-top: 25px
}

.mb-25 {
    margin-bottom: 14px
}

.me-25 {
    margin-right: 25px
}

.ms-25 {
    margin-left: 25px
}

.mt-20,.section-title .section-sub-heading {
    margin-top: 20px
}

.mb-20 {
    margin-bottom: 20px
}

.mt-30 {
    margin-top: 30px
}

.mb-30 {
    margin-bottom: 30px
}

.mr-30 {
    margin-right: 30px
}

.mt-50 {
    margin-top: 50px
}

.mr-15 {
    margin-right: 15px
}

.radius-95 {
    border-radius: 95px
}

.radius-3 {
    border-radius: 3px
}

.radius-20,.radius-4 {
    border-radius: 20px
}

.radius-5 {
    border-radius: 5px
}

.radius-8 {
    border-radius: 8px
}

.radius-10 {
    border-radius: 10px
}

.radius-50 {
    border-radius: 50%
}

.radius-t-r-0 {
    border-top-right-radius: 0!important
}

.radius-t-l-0 {
    border-top-left-radius: 0!important
}

.radius-b-r-0 {
    border-bottom-right-radius: 0!important
}

.radius-b-l-0 {
    border-bottom-left-radius: 0!important
}

.page-link,.show-map-here,table {
    border-radius: 4px
}

.font-bold {
    font-weight: 700
}

.font-semi-bold {
    font-weight: 600
}

.font-medium,.page-link,table th {
    font-weight: 500
}

.font-20 {
    font-size: 20px
}

.font-18 {
    font-size: 18px;
    line-height: 150%
}

.font-17 {
    font-size: 17px
}

.font-16 {
    font-size: 16px
}

.font-15 {
    font-size: 15px;
    line-height: 23px
}

.font-13 {
    font-size: 13px;
    line-height: 18px
}

.font-12 {
    font-size: 12px;
    line-height: 13px
}

.font-11 {
    font-size: 11px;
    line-height: 12px
}

section {
    z-index: 9
}

.section-title {
    text-align: center;
    width: 63%;
    margin: -11px auto 60px
}

.section-small-title {
    font-weight: 500;
    margin-bottom: 15px
}

.app-favicon-user-profile-img .app-favicon-profile-photo-edit,.app-logo-user-profile-img .app-logo-profile-photo-edit,.app-preloader-user-profile-img .app-preloader-profile-photo-edit,.cursor,.default-user-profile-img .default-profile-photo-edit,.language-icon-img .language-icon-edit,.maintainer-user-profile-img .maintainer-profile-photo-edit,.pointer-auto,.signin-user-profile-img .signin-profile-photo-edit,.user-profile-img .profile-photo-edit {
    cursor: pointer
}

.h-36 {
    height: 36px
}

.w-36 {
    width: 36px
}

.mm-active>a,.mm-active>a i,.mm-active>i,table th {
    color: var(--heading-color)!important
}

table td,table th {
    font-size: 14px;
    max-width: 220px
}

.table>thead,tr {
    vertical-align: middle
}

.table>thead>tr>th {
    border-bottom: 1px solid var(--border-color)
}

.invoice-preview-wrap table td,.invoice-preview-wrap table th,.table>:not(caption)>*>*,table.dataTable thead tr td.sorting,table.dataTable thead tr td.sorting_asc,table.dataTable thead tr td.sorting_desc,table.dataTable thead tr th.sorting,table.dataTable thead tr th.sorting_asc,table.dataTable thead tr th.sorting_desc {
    padding: 1rem 1.5rem
}

tr:first-child td,tr:first-child th {
    border-top-left-radius: 4px
}

tr:last-child td,tr:last-child th {
    border-top-right-radius: 4px
}

.tbl-action-btn {
    font-size: 16px;
    color: var(--body-font-color)
}

.disabled>.page-link,.page-link,.page-link.disabled {
    background-color: transparent;
    border-color: transparent;
    color: #abb1b7
}

#sidebar-menu ul li a,.page-link,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a {
    color: var(--body-font-color);
    color: var(--body-font-color)
}

.page-link {
    font-size: 14px;
    padding: .5px 8.7px
}

.page-link:hover {
    border-color: transparent;
    color: var(--primary-color)!important
}

.active>.page-link,.page-link.active {
    color: var(--white-color);
    background-color: var(--primary-color);
    border-color: var(--primary-color)
}

.active>.page-link:hover,.page-link:hover.active {
    color: var(--white-color)!important;
    background-color: var(--primary-hover-color);
    border-color: var(--primary-hover-color)
}

.activate-select .sorting_1,.notification-item .d-flex:hover {
    background-color: #f8f9fa
}

div.dataTables_wrapper div.dataTables_filter label,div.dataTables_wrapper div.dataTables_length label {
    margin-bottom: 25px
}

.table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before,table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before {
    top: 64%;
    left: 5px;
    height: 14px;
    width: 14px;
    margin-top: -14px;
    display: block;
    position: absolute;
    color: var(--white-color);
    border: 2px solid var(--white-color);
    border-radius: 14px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    text-align: center;
    text-indent: 0!important;
    line-height: 12px;
    content: "+";
    background-color: var(--primary-color);
    padding: 2px 0 0
}

div.dataTables_wrapper div.dataTables_filter {
    text-align: right
}

@media (max-width: 767px) {
    div.dataTables_wrapper div.dataTables_filter {
        text-align:center
    }
}

div.dataTables_wrapper div.dataTables_filter input {
    margin-left: .5em;
    margin-right: 0
}

.datatable td:focus,.ui-datepicker-div input:focus,button:focus {
    outline: 0
}

div.table-responsive>div.dataTables_wrapper>div.row>div[class^=col-]:first-child {
    padding-left: 0
}

div.table-responsive>div.dataTables_wrapper>div.row>div[class^=col-]:last-child {
    padding-right: 0
}

table.dataTable {
    border-collapse: collapse!important;
    margin-bottom: 15px!important;
    margin-top: 0!important
}

table.dataTable thead .sorting:before,table.dataTable thead .sorting_asc:before,table.dataTable thead .sorting_asc_disabled:before,table.dataTable thead .sorting_desc:before,table.dataTable thead .sorting_desc_disabled:before {
    left: auto;
    right: .5rem;
    content: "\f0360";
    font-family: "IBM Plex Sans Arabic";
    font-size: 1rem;
    top: 9px
}

table.dataTable thead .sorting:after,table.dataTable thead .sorting_asc:after,table.dataTable thead .sorting_asc_disabled:after,table.dataTable thead .sorting_desc:after,table.dataTable thead .sorting_desc_disabled:after {
    left: auto;
    right: .5em;
    content: "\f035d";
    font-family: "IBM Plex Sans Arabic";
    top: 15px;
    font-size: 1rem
}

table.dataTable tbody>tr.selected,table.dataTable tbody>tr>.selected {
    background-color: rgba(4,162,179,.2)
}

table.dataTable tbody>tr.selected td,table.dataTable tbody>tr>.selected td {
    border-color: rgba(4,162,179,.2);
    color: #04a2b3
}

.my-custom-select-box .bootstrap-select .dropdown-toggle:focus,.my-custom-select-box .bootstrap-select>select.mobile-device:focus+.dropdown-toggle,table.dataTable tbody td:focus {
    outline: 0!important
}

table.dataTable tbody td.focus,table.dataTable tbody th.focus {
    outline: 2px solid var(--primary-color)!important;
    outline-offset: -1px;
    background-color: rgba(4,162,179,.15)
}

table.dataTable.dtr-inline.collapsed>tbody>tr[role=row]>td:first-child:before,table.dataTable.dtr-inline.collapsed>tbody>tr[role=row]>th:first-child:before {
    -webkit-box-shadow: 0 5px 12px rgba(0,0,0,.1);
    box-shadow: 0 5px 12px rgba(0,0,0,.1);
    background-color: #66d203;
    bottom: auto
}

table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before,table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th:first-child:before {
    background-color: #e66060
}

div.dt-button-info {
    background-color: #04a2b3;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 3px;
    text-align: center;
    z-index: 21
}

div.dt-button-info h2 {
    border-bottom: none;
    background-color: rgba(255,255,255,.2)
}

@media (max-width: 767.98px) {
    li.paginate_button.next,li.paginate_button.previous {
        display:inline-block;
        font-size: 1.5rem
    }

    li.paginate_button {
        display: none
    }

    .dataTables_paginate ul {
        text-align: center;
        display: block;
        margin: 1rem 0 0!important
    }

    div.dt-buttons {
        display: inline-table;
        margin-bottom: 1rem
    }
}

.link-hover-effect::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px;
    border-radius: 4px;
    background-color: var(--primary-color);
    bottom: 0;
    left: 0;
    transform-origin: right;
    transform: scaleX(0);
    transition: transform .6s ease-in-out
}

.link-hover-effect:hover::before {
    transform-origin: left;
    transform: scaleX(1)
}

.pulse {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    box-shadow: 0 0 1px 1px var(--red-color);
    animation: 2s infinite pulse-animation
}

@keyframes pulse-animation {
    0% {
        box-shadow: 0 0 0 0 rgb(95 204 201)
    }

    100% {
        box-shadow: 0 0 0 7px rgb(145 255 250 / 8%)
    }
}

.bg-img-property {
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover
}

.fit-image {
    width: 100%;
    object-fit: cover;
    -o-object-fit: cover
}

.avatar-md {
    height: 3.8rem;
    width: 3.8rem
}

.avatar-xl {
    height: 5.5rem;
    width: 5.5rem
}

.modal.fade .modal-content {
    -webkit-transform: scale(.9);
    -moz-transform: scale(.9);
    -ms-transform: scale(.9);
    transform: scale(.9);
    opacity: 0;
    transition: .2s ease-in-out
}

.modal.fade.show .modal-content {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    opacity: 1
}

.modal-backdrop {
    background-color: rgba(22,14,77,.7);
    opacity: 0;
    transition: .2s ease-in-out
}

.modal-backdrop.show {
    opacity: 1
}

.modal.fade .modal-dialog {
    transition: transform .2s ease-in-out;
    transition: transform .2s ease-in-out,-webkit-transform .2s ease-in-out;
    -webkit-transform: translate(0,0);
    transform: translate(0,0)
}

.modal.show .modal-dialog {
    -webkit-transform: translate(0,0);
    transform: translate(0,0)
}

.modal .btn-close {
    color: var(--body-font-color)!important;
    background-image: none;
    font-size: 18px;
    position: relative;
    top: -5px
}

.modal-content {
    padding: 25px;
    border-radius: 20px;
    background-color: var(--white-color)
}

.modal-header {
    border-bottom: 1px solid var(--border-color);
    padding: 0 0 20px
}

.modal-body {
    padding: 25px 0
}

.modal-footer {
    padding: 25px 0 0
}

.section-btn {
    margin-top: 42px
}

.btn.focus,.btn:focus {
    outline: 0;
    box-shadow: none
}

.edit-btn,.theme-btn,.theme-btn-back,.theme-btn-green,.theme-btn-purple,.theme-btn-red {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    outline: 0;
    z-index: 99;
    padding: 12px 50px!important;
    line-height: 20px;
    justify-content: center;
    border-radius: 16px;
    font-weight: 500!important;
    color: var(--white-color);
    border: 1px solid transparent
}

.mm-active,.theme-btn-green:hover,.theme-btn-purple:hover,.theme-btn-red:hover,.theme-btn:hover {
    color: var(--white-color)!important
}

.theme-btn {
    background-color: #e8f0f0;
    color: #1b6568
}

.theme-btn:hover {
    background-color: var(--button-hover-color)!important
}

.theme-btn-purple {
    background-color: var(--secondary-color)
}

.theme-btn-purple:hover {
    background-color: var(--secondary-hover-color)
}

.theme-btn-green:hover {
    background-color: var(--green-color-hover)
}

.theme-btn-red:hover {
    background-color: var(--red-color-hover)
}

.edit-btn {
    border: 1px solid var(--primary-color);
    color: var(--primary-color)!important
}

.edit-btn:hover {
    border: 1px solid var(--primary-hover-color)!important;
    color: var(--primary-hover-color)!important
}

.theme-btn-back {
    background-color: var(--white-color);
    border: 1px solid var(--border-color);
    color: var(--heading-color)
}

.status-btn {
    padding: 7px 15px!important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px
}

#preloaderInner,.navbar-header {
    display: -webkit-box;
    display: -ms-flexbox
}

.property-item-info .property-info-item:nth-of-type(2n+2),.table .status-btn {
    min-width: 100px
}

.status-btn-purple {
    background-color: #e8f0f0;
    color: var(--secondary-color)
}

.status-btn-green {
    background-color: rgba(82,255,67,.1);
    color: var(--green-color)
}

.status-btn-red {
    background-color: rgba(255,67,67,.1);
    color: var(--red-color)
}

.billing-center-nav-tabs .nav-item.show .nav-link,.billing-center-nav-tabs .nav-link.active,.status-btn-blue {
    background-color: var(--primary-color-transparent);
    color: var(--primary-color)
}

.status-btn-orange {
    background-color: #fff0e1;
    color: var(--orange-color)
}

#preloader {
    background-color: #fff;
    bottom: 0;
    left: 0;
    z-index: 9999999999999999
}

#preloaderInner {
    width: 100%;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

#page-topbar {
    left: 0;
    z-index: 999;
    background-color: var(--bg-light)
}

.navbar-header {
    display: flex;
    -ms-flex-pack: justify;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 auto;
    height: 80px;
    padding: 0 calc(24px / 2) 0 0;
    padding-right: 40px
}

.navbar-brand-box {
    padding: 0 1.5rem;
    width: 240px
}

.logo {
    line-height: 70px
}

.app-search {
    padding: calc(39px / 2) 0
}

.app-search .form-control {
    border: 1px solid #dadee7;
    height: 40px;
    padding-left: 40px;
    padding-right: 20px;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 4px;
    background-color: transparent;
    min-width: 400px
}

.app-search span {
    position: absolute;
    z-index: 10;
    font-size: 16px;
    line-height: 38px;
    left: 13px;
    top: 0
}

.custom-input-group input,.mobile-search-btn button {
    border-top-right-radius: 4px!important;
    border-bottom-right-radius: 4px!important
}

@media (max-width: 991px) {
    .navbar-brand-box {
        width:auto
    }

    .logo span.logo-lg {
        display: none
    }

    .logo span.logo-sm {
        display: inline-block
    }
}

.page-content {
    padding-left: 0;
    padding-right: 20px;
    padding: calc(80px) calc(0px) 0px;
    #progressbarli,ul li {
        list-style-type: none
    }

    .font-14,.input-group-text,body,h6,p {
        font-size: 14px
    }

    #sidebar-menuul li ul.sub-menu,#sidebar-menu ul li ul.sub-menu li ul.sub-menu,*,.btn,.dataTables_wrapper.container-fluid,.tenant-portal-notice-tbl td,ul,ul li {
        padding: 1px;
    }

    h1,h2 {
        line-height: 48px
    }

    h5,h6 {
        line-height: 20px
    }

    .chat-item .dropdown .dropdown-toggle,.dropdown-item,.form-control,.form-select,.form-stepper-nav-iconi,.table td,.theme-text-color,a,body,p {
        color: var(--body-font-color)
    }

    *,body,figure,html,ul,ul li {
        margin: 0px;
    }

    .font-20,.font-24 {
        line-height: 31px
    }

    #page-topbar,#preloader {
        position: fixed;
        top: 0;
        right: 0
    }

    #sidebar-menuul li a i,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a i {
        font-size: 1.1rem;
        line-height: 1.40625rem
    }

    .link-hover-effect,a,a: hover,a>* {
        text-decoration: none
    }

    * {
        border: none;
        outline: 0
    }

    .custom-scroll,body,html {
        height: 100%
    }

    body {
        background: var(--bg-light) none repeat scroll;
        font-weight: 400;
        font-family: var(--body-font-family);
        overflow-x: hidden;
        scroll-behavior: smooth
    }

    .edit-btn,.navbar .dropdown .dropdown-toggle::after,.page-link,.tenant-portal-notice-tbl td,.theme-btn,.theme-btn-back,.theme-btn-green,.theme-btn-purple,.theme-btn-red,a,button {
        transition: .2s ease-in-out
    }

    .fast-transition {
        transition: .3s ease-in-out
    }

    .slow-transition {
        transition: .7s ease-in-out
    }

    a,a>* {
        outline: 0;
        cursor: pointer
    }

    #sidebar-menuul li a: hover,#sidebar-menu ul li a:hover i,.primary-color,a:hover {
        color: var(--primary-color)!important
    }

    img: :selection {
        background: 0 0
    }

    .btn-close:focus,.form-check-input:focus,.page-link:focus {
        box-shadow: none
    }

    .d-none-content,.dropdown-toggle::after,.logo .logo-sm,.logo-light,.metismenu .mm-collapse,.metismenu .mm-collapse:not(.mm-show),.vertical-collpsed .logo span.logo-lg,.vertical-collpsed .vertical-menu #sidebar-menu .has-arrow: after {
        display: none
    }

    .page-link,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li: hover>a span {
        display: inline
    }

    .form-control,.form-select {
        background-color: var(--white-color);
        height: 50px;
        border: 1px solid var(--border-color);
        border-radius: 20px;
        padding: 13px 20px;
        font-size: 14px
    }

    .form-control:focus {
        background-color: var(--white-color);
        box-shadow: none
    }

    #sidebar-menuul li ul.sub-menu li: hover a::before,.account-settings-menu li ul.account-sub-menu li a:hover:before,.bg-primary-color,.form-check-input:checked,.upload-count-plus {
        background-color: var(--primary-color)
    }

    .form-select:focus {
        border-color: #86b7fe;
        box-shadow: none
    }

    .form-control::placeholder {
        color: #9f9f9f
    }

    .breadcrumb-item.active,.color-heading,.select-property-nav-tabs .nav-link,h1,h2,h3,h4,h5,h6 {
        color: var(--heading-color)
    }

    textarea {
        min-height: 100px!important
    }

    label {
        margin-bottom: 10px
    }

    .form-check-input:checked {
        border-color: var(--primary-color)
    }

    .form-select {
        padding: 13px 32px 13px 20px
    }

    .custom-checkboxinput {
        padding: 0;
        height: initial;
        width: initial;
        margin-bottom: 0;
        display: none;
        cursor: pointer
    }

    .custom-checkboxlabel {
        position: relative;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        margin-bottom: 0
    }

    .custom-checkboxlabel:before {
        content: '';
        -webkit-appearance: none;
        background-color: transparent;
        border: 1px solid var(--border-color-2);
        box-shadow: none;
        padding: 7px;
        display: inline-block;
        position: relative;
        vertical-align: middle;
        cursor: pointer;
        margin-right: 7px;
        border-radius: 2px
    }

    .custom-checkboxinput:checked+label: before,.invoice-payment-nav-tabs .nav-item.show .nav-link,.invoice-payment-nav-tabs .nav-link.active,.topic-content-item:hover {
        border: 1px solid var(--primary-color)
    }

    .custom-checkboxinput:checked+label: after {
        content: '';
        display: block;
        position: absolute;
        top: 4px;
        left: 6px;
        width: 5px;
        height: 9px;
        border: solid var(--primary-color);
        border-width: 0 1px 1px 0;
        transform: rotate(45deg)
    }

    .custom-radiobox [type=radio]: checked,.custom-radiobox [type=radio]:not(:checked) {
        position: absolute;
        left: -9999px
    }

    .account-settings-menuli.menu-has-children,.content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-img,.exclamation,.link-hover-effect,.stepper-progressbar-wrap,.table.dataTable.dtr-inline.collapsed>tbody>tr>td,.user-profile-img,section,table.dataTable.dtr-inline.collapsed>tbody>tr>td {
        position: relative
    }

    .custom-radiobox [type=radio]: checked+label,.custom-radiobox [type=radio]:not(:checked)+label {
        position: relative;
        padding-left: 28px;
        cursor: pointer;
        line-height: 20px;
        display: inline-block;
        color: var(--body-font-color);
        margin-bottom: 0
    }

    .custom-radiobox [type=radio]: checked+label:before,.custom-radiobox [type=radio]:not(:checked)+label:before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 18px;
        height: 18px;
        border: 1px solid var(--border-color-2);
        border-radius: 100%;
        background: var(--white-color)
    }

    .custom-radiobox [type=radio]: checked+label:after,.custom-radiobox [type=radio]:not(:checked)+label:after {
        content: '';
        width: 12px;
        height: 12px;
        background: var(--primary-color);
        position: absolute;
        top: 3px;
        left: 3px;
        border-radius: 100%;
        -webkit-transition: .2s;
        transition: .2s
    }

    .custom-radiobox [type=radio]: not(:checked)+label:after {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0)
    }

    .custom-radiobox [type=radio]: checked+label:after {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    h1,h2,h3,h4,h5,h6 {
        font-weight: 500;
        margin: 0
    }

    #ui-datepicker-div .ui-datepicker .ui-datepicker-title,.font-normal,.ui-datepicker-divlabel,p {
        font-weight: 400
    }

    h1 {
        font-size: 40px
    }

    h2 {
        font-size: 30px
    }

    .font-24,h3 {
        font-size: 24px
    }

    h3 {
        line-height: 36px
    }

    .dropdown-toggle .iconify,.dropdown-togglei,h4 {
        font-size: 13px;
    }

    h5 {
        font-size: 15px
    }

    p {
        margin-bottom: 0
    }

    :root {
        --navbar-bg: #F8F8F8;
        --footer-bg: #F8F8F8;
        --white-color: #fff;
        --bg-white: #fff;
        --bg-light: #fafafa;
        --off-white: #FAFAFA;
        --heading-color: #002b2d;
        --body-font-color: #737C91;
        --border-color: #f2f2f2;
        --border-color-2: #A5ABBA;
        --primary-hover-color: #0063E6;
        --primary-color-transparent: rgb(0 164 136 / 13%);
        --secondary-hover-color: #009688;
        --red-color: #02a388;
        --danger-color: #FF3D3D;
        --red-color-hover: #dc3545;
        --yellow-color: #FBBF37;
        --orange-color: #FFA043;
        --green-color: #24b855;
        --green-color-hover: #0d943a;
        --body-font-family: 'IBM Plex Sans Arabic',sans-serif
    }

    #progressbar .active,#progressbarli.active .form-stepper-nav-icon i,.account-settings-menu li: hover .toggle-account-menu,.account-settings-menu-item.active,.color-hover,.select-property-nav-tabs .nav-item.show .nav-link,.select-property-nav-tabs .nav-link.active,.tbl-action-btn:hover,.theme-link,.topic-content-item:hover h4,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a i,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>ul a:hover,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a:active,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a:focus,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a:hover,div.dt-button-info,div.dt-button-info h2 {
        color: var(--primary-color);
        background: #e8f0f0;
        padding: 10px;
        border-radius: 16px
    }

    .primary-color:hover,.theme-link:hover {
        color: var(--primary-hover-color)!important
    }

    .secondary-color,.theme-secondary-link {
        color: var(--secondary-color)
    }

    .bg-light {
        background-color: var(--bg-light)!important
    }

    .theme-border {
    margin: 3px;
    }

    .border-bottom {
        border-bottom: 1px solid var(--border-color)!important
    }

    .border-top {
        border-top: 1px solid var(--border-color)!important
    }

    .orange-color {
        color: var(--orange-color)
    }

    .green-color {
        color: var(--green-color)
    }

    .red-color,.theme-link-red {
        color: #ff0000;
    }

    .red-color:hover,.theme-link-red:hover {
        color: var(--red-color-hover)!important
    }

    .theme-link-red:hover,a.red-color: hover,button.red-color:hover {
        color: var(--red-color-hover)
    }

    .bg-orange {
        background-color: var(--orange-color)
    }

    .bg-off-white,.navbar-header .dropdown .show.header-item,.theme-btn-back:hover,thead {
        background-color: var(--off-white)
    }

    .bg-green,.online-offline-show.online,.theme-btn-green {
        background-color: var(--green-color)
    }

    .bg-red,.theme-btn-red {
        background-color: var(--red-color)
    }

    .bg-red-transparent {
        background-color: rgba(255,67,67,.1)
    }

    .bg-green-transparent {
        background-color: rgba(82,255,67,.1)
    }

    .bg-blue-transparent {
        background-color: var(--primary-color-transparent)
    }

    .bg-purple-transparent {
        background-color: #f0ebff
    }

    .bg-orange-transparent {
        background-color: #fff0e1
    }

    .sidebar-badge-light {
        background-color: #eee;
        color: var(--body-font-color)
    }

    .page-link:hover,button {
        background-color: transparent
    }

    .theme-secondary-link:hover {
        color: var(--secondary-hover-color)!important
    }

    .section-t-space {
        padding-top: 140px
    }

    .section-b-space {
        padding-bottom: 140px
    }

    .section-t-115-space {
        padding-top: 115px
    }

    .section-b-115-space {
        padding-bottom: 115px
    }

    .section-t-80-space {
        padding-top: 80px
    }

    .section-b-80-space {
        padding-bottom: 80px
    }

    .section-t-60-space {
        padding-top: 60px
    }

    .section-b-60-space {
        padding-bottom: 60px
    }

    .p-30 {
        padding: 20px;
    }

    .pl-30,.table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control,table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control {
        padding-left: 30px
    }

    .pr-30 {
        padding-right: 30px
    }

    .pt-30 {
        padding-top: 30px
    }

    .pb-30 {
        padding-bottom: 30px
    }

    .pb-15 {
        padding-bottom: 15px
    }

    .p-20 {
        padding: 14px
    }

    .page-title-box,.pb-20 {
        padding-bottom: 20px
    }

    .p-25 {
        padding: 2px;
    }

    .pb-25 {
        padding-bottom: 25px
    }

    .invoice-table-part,.pt-20 {
        padding-top: 20px
    }

    .mt-10 {
        margin-top: 10px
    }

    .mt-15 {
        margin-top: 15px
    }

    .mb-15 {
        margin-bottom: 15px
    }

    .mt-25 {
        margin-top: 25px
    }

    .mb-25 {
        margin-bottom: 1px;
    }

    .me-25 {
        margin-right: 25px
    }

    .ms-25 {
        margin-left: 25px
    }

    .mt-20,.section-title .section-sub-heading {
        margin-top: 14px;
    }

    .mb-20 {
        margin-bottom: 20px
    }

    .mt-30 {
        margin-top: 30px
    }

    .mb-30 {
        margin-bottom: 30px
    }

    .mr-30 {
        margin-right: 30px
    }

    .mt-50 {
        margin-top: 50px
    }

    .mr-15 {
        margin-right: 15px
    }

    .radius-95 {
        border-radius: 95px
    }

    .radius-3 {
        border-radius: 3px
    }

    .radius-20,.radius-4 {
        border-radius: 20px
    }

    .radius-5 {
        border-radius: 5px
    }

    .radius-8 {
        border-radius: 8px
    }

    .radius-10 {
        border-radius: 16px;
    }

    .radius-50 {
        border-radius: 50%
    }

    .radius-t-r-0 {
        border-top-right-radius: 0!important
    }

    .radius-t-l-0 {
        border-top-left-radius: 0!important
    }

    .radius-b-r-0 {
        border-bottom-right-radius: 0!important
    }

    .radius-b-l-0 {
        border-bottom-left-radius: 0!important
    }

    .page-link,.show-map-here,table {
        border-radius: 4px
    }

    .font-bold {
        font-weight: 700
    }

    .font-semi-bold {
        font-weight: 600
    }

    .font-medium,.page-link,table th {
        font-weight: 500
    }

    .font-20 {
        font-size: 20px
    }

    .font-18 {
        font-size: 18px;
        line-height: 150%
    }

    .font-17 {
        font-size: 17px
    }

    .font-16 {
        font-size: 16px
    }

    .font-15 {
        font-size: 15px;
        line-height: 23px
    }

    .font-13 {
        font-size: 11px;
        line-height: 12px;
        font-weight: 700;
    }

    .font-12 {
        font-size: 12px;
        line-height: 13px
    }

    .font-11 {
        font-size: 11px;
        line-height: 12px
    }

    section {
        z-index: 9
    }

    .section-title {
        text-align: center;
        width: 63%;
        margin: -11px auto 60px
    }

    .section-small-title {
        font-weight: 500;
        margin-bottom: 15px
    }

    .app-favicon-user-profile-img .app-favicon-profile-photo-edit,.app-logo-user-profile-img .app-logo-profile-photo-edit,.app-preloader-user-profile-img .app-preloader-profile-photo-edit,.cursor,.default-user-profile-img .default-profile-photo-edit,.language-icon-img .language-icon-edit,.maintainer-user-profile-img .maintainer-profile-photo-edit,.pointer-auto,.signin-user-profile-img .signin-profile-photo-edit,.user-profile-img .profile-photo-edit {
        cursor: pointer
    }

    .h-36 {
        height: 36px
    }

    .w-36 {
        width: 36px
    }

    .mm-active>a,.mm-active>a i,.mm-active>i,table th {
        color: var(--heading-color)!important
    }

    table td,table th {
        font-size: 14px;
        max-width: 220px
    }

    .table>thead,tr {
        vertical-align: middle
    }

    .table>thead>tr>th {
        border-bottom: 1px solid var(--border-color)
    }

    .invoice-preview-wraptable td,.invoice-preview-wrap table th,.table>: not(caption)>*>*,table.dataTable thead tr td.sorting,table.dataTable thead tr td.sorting_asc,table.dataTable thead tr td.sorting_desc,table.dataTable thead tr th.sorting,table.dataTable thead tr th.sorting_asc,table.dataTable thead tr th.sorting_desc {
        padding: 1rem 1.5rem
    }

    tr: first-child td,tr:first-child th {
        border-top-left-radius: 4px
    }

    tr: last-child td,tr:last-child th {
        border-top-right-radius: 4px
    }

    .tbl-action-btn {
        font-size: 16px;
        color: var(--body-font-color)
    }

    .disabled>.page-link,.page-link,.page-link.disabled {
        background-color: transparent;
        border-color: transparent;
        color: #abb1b7
    }

    #sidebar-menuul li a,.page-link,.vertical-collpsed .vertical-menu #sidebar-menu>ul>li: hover>a {
        color: var(--body-font-color);
        color: var(--body-font-color)
    }

    .page-link {
        font-size: 14px;
        padding: .5px 8.7px
    }

    .page-link:hover {
        border-color: transparent;
        color: var(--primary-color)!important
    }

    .active>.page-link,.page-link.active {
        color: var(--white-color);
        background-color: var(--primary-color);
        border-color: var(--primary-color)
    }

    .active>.page-link:hover,.page-link:hover.active {
        color: var(--white-color)!important;
        background-color: var(--primary-hover-color);
        border-color: var(--primary-hover-color)
    }

    .activate-select .sorting_1,.notification-item .d-flex:hover {
        background-color: #f8f9fa
    }

    div.dataTables_wrapper div.dataTables_filter label,div.dataTables_wrapper div.dataTables_length label {
        margin-bottom: 25px
    }

    .table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control: before,table.dataTable.dtr-inline.collapsed>tbody>tr>td.dtr-control:before {
        top: 64%;
        left: 5px;
        height: 14px;
        width: 14px;
        margin-top: -14px;
        display: block;
        position: absolute;
        color: var(--white-color);
        border: 2px solid var(--white-color);
        border-radius: 14px;
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
        text-align: center;
        text-indent: 0!important;
        line-height: 12px;
        content: "+";
        background-color: var(--primary-color);
        padding: 2px 0 0
    }

    div.dataTables_wrapper div.dataTables_filter {
        text-align: right
    }

    @media (max-width: 767px) {
        div.dataTables_wrapper div.dataTables_filter {
            text-align:center
        }
    }

    div.dataTables_wrapper div.dataTables_filter input {
        margin-left: .5em;
        margin-right: 0
    }

    .datatabletd:focus,.ui-datepicker-div input: focus,button:focus {
        outline: 0
    }

    div.table-responsive>div.dataTables_wrapper>div.row>div[class^=col-]: first-child {
        padding-left: 0
    }

    div.table-responsive>div.dataTables_wrapper>div.row>div[class^=col-]: last-child {
        padding-right: 0
    }

    table.dataTable {
        border-collapse: collapse!important;
        margin-bottom: 15px!important;
        margin-top: 0!important
    }

    table.dataTable thead .sorting: before,table.dataTable thead .sorting_asc:before,table.dataTable thead .sorting_asc_disabled:before,table.dataTable thead .sorting_desc:before,table.dataTable thead .sorting_desc_disabled:before {
        left: auto;
        right: .5rem;
        content: "\f0360";
        font-family: "IBM Plex Sans Arabic";
        font-size: 1rem;
        top: 9px
    }

    table.dataTable thead .sorting: after,table.dataTable thead .sorting_asc:after,table.dataTable thead .sorting_asc_disabled:after,table.dataTable thead .sorting_desc:after,table.dataTable thead .sorting_desc_disabled:after {
        left: auto;
        right: .5em;
        content: "\f035d";
        font-family: "IBM Plex Sans Arabic";
        top: 15px;
        font-size: 1rem
    }

    table.dataTable tbody>tr.selected,table.dataTable tbody>tr>.selected {
        background-color: rgba(4,162,179,.2)
    }

    table.dataTable tbody>tr.selected td,table.dataTable tbody>tr>.selected td {
        border-color: rgba(4,162,179,.2);
        color: #04a2b3
    }

    .my-custom-select-box .bootstrap-select .dropdown-toggle:focus,.my-custom-select-box .bootstrap-select>select.mobile-device: focus+.dropdown-toggle,table.dataTable tbody td:focus {
        outline: 0!important
    }

    table.dataTable tbody td.focus,table.dataTable tbody th.focus {
        outline: 2px solid var(--primary-color)!important;
        outline-offset: -1px;
        background-color: rgba(4,162,179,.15)
    }

    table.dataTable.dtr-inline.collapsed>tbody>tr[role=row]>td: first-child:before,table.dataTable.dtr-inline.collapsed>tbody>tr[role=row]>th:first-child:before {
        -webkit-box-shadow: 0 5px 12px rgba(0,0,0,.1);
        box-shadow: 0 5px 12px rgba(0,0,0,.1);
        background-color: #66d203;
        bottom: auto
    }

    table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td: first-child:before,table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th:first-child:before {
        background-color: #e66060
    }

    div.dt-button-info {
        background-color: #04a2b3;
        border: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        border-radius: 3px;
        text-align: center;
        z-index: 21
    }

    div.dt-button-info h2 {
        border-bottom: none;
        background-color: rgba(255,255,255,.2)
    }

    @media (max-width: 767.98px) {
        li.paginate_button.next,li.paginate_button.previous {
            display:inline-block;
            font-size: 1.5rem
        }

        li.paginate_button {
            display: none
        }

        .dataTables_paginate ul {
            text-align: center;
            display: block;
            margin: 1rem 0 0!important
        }

        div.dt-buttons {
            display: inline-table;
            margin-bottom: 1rem
        }
    }

    .link-hover-effect::before {
        content: '';
        position: absolute;
        width: 100%;
        height: 2px;
        border-radius: 4px;
        background-color: var(--primary-color);
        bottom: 0;
        left: 0;
        transform-origin: right;
        transform: scaleX(0);
        transition: transform .6s ease-in-out
    }

    .link-hover-effect:hover::before {
        transform-origin: left;
        transform: scaleX(1)
    }

    .pulse {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        box-shadow: 0 0 1px 1px var(--red-color);
        animation: 2s infinite pulse-animation
    }

    @keyframes pulse-animation {
        0% {
            box-shadow: 0 0 0 0 rgb(95 204 201)
        }

        100% {
            box-shadow: 0 0 0 7px rgb(145 255 250 / 8%)
        }
    }

    .bg-img-property {
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover
    }

    .fit-image {
        width: 100%;
        object-fit: cover;
        -o-object-fit: cover
    }

    .avatar-md {
        height: 3.8rem;
        width: 3.8rem
    }

    .avatar-xl {
        height: 5.5rem;
        width: 5.5rem
    }

    .modal.fade .modal-content {
        -webkit-transform: scale(.9);
        -moz-transform: scale(.9);
        -ms-transform: scale(.9);
        transform: scale(.9);
        opacity: 0;
        transition: .2s ease-in-out
    }

    .modal.fade.show .modal-content {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        -ms-transform: scale(1);
        transform: scale(1);
        opacity: 1
    }

    .modal-backdrop {
        background-color: rgba(22,14,77,.7);
        opacity: 0;
        transition: .2s ease-in-out
    }

    .modal-backdrop.show {
        opacity: 1
    }

    .modal.fade .modal-dialog {
        transition: transform .2s ease-in-out;
        transition: transform .2s ease-in-out,-webkit-transform .2s ease-in-out;
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }

    .modal.show .modal-dialog {
        -webkit-transform: translate(0,0);
        transform: translate(0,0)
    }

    .modal .btn-close {
        color: var(--body-font-color)!important;
        background-image: none;
        font-size: 18px;
        position: relative;
        top: -5px
    }

    .modal-content {
        padding: 25px;
        border-radius: 20px;
        background-color: var(--white-color)
    }

    .modal-header {
        border-bottom: 1px solid var(--border-color);
        padding: 0 0 20px
    }

    .modal-body {
        padding: 25px 0
    }

    .modal-footer {
        padding: 25px 0 0
    }

    .section-btn {
        margin-top: 42px
    }

    .btn.focus,.btn:focus {
        outline: 0;
        box-shadow: none
    }

    .edit-btn,.theme-btn,.theme-btn-back,.theme-btn-green,.theme-btn-purple,.theme-btn-red {
        display: inline-flex;
        align-items: center;
        cursor: pointer;
        outline: 0;
        z-index: 99;
        padding: 12px 50px!important;
        line-height: 20px;
        justify-content: center;
        border-radius: 16px;
        font-weight: 500!important;
        color: #ffffff;
        border: 1px solid transparent
    }

    .mm-active,.theme-btn-green:hover,.theme-btn-purple:hover,.theme-btn-red:hover,.theme-btn:hover {
        color: var(--white-color)!important
    }

    .theme-btn {
        background-color: #e8f0f0;
        color: #1b6568
    }

    .theme-btn:hover {
        background-color: var(--button-hover-color)!important
    }

    .theme-btn-purple {
        background-color: #08585b;
    }

    .theme-btn-purple:hover {
        background-color: var(--secondary-hover-color)
    }

    .theme-btn-green:hover {
        background-color: var(--green-color-hover)
    }

    .theme-btn-red:hover {
        background-color: var(--red-color-hover)
    }

    .edit-btn {
        border: 1px solid var(--primary-color);
        color: var(--primary-color)!important
    }

    .edit-btn:hover {
        border: 1px solid var(--primary-hover-color)!important;
        color: var(--primary-hover-color)!important
    }

    .theme-btn-back {
        background-color: var(--white-color);
        border: 1px solid var(--border-color);
        color: var(--heading-color)
    }

    .status-btn {
        padding: 7px 15px!important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 20px
    }

    #preloaderInner,.navbar-header {
        display: -webkit-box;
        display: -ms-flexbox
    }

    .property-item-info .property-info-item:nth-of-type(2n+2),.table .status-btn {
        min-width: 100px
    }

    .status-btn-purple {
        background-color: #e8f0f0;
        color: var(--secondary-color)
    }

    .status-btn-green {
        background-color: rgba(82,255,67,.1);
        color: var(--green-color)
    }

    .status-btn-red {
        background-color: rgba(255,67,67,.1);
        color: var(--red-color)
    }

    .billing-center-nav-tabs .nav-item.show .nav-link,.billing-center-nav-tabs .nav-link.active,.status-btn-blue {
        background-color: var(--primary-color-transparent);
        color: var(--primary-color)
    }

    .status-btn-orange {
        background-color: #fff0e1;
        color: var(--orange-color)
    }

    #preloader {
        background-color: #fff;
        bottom: 0;
        left: 0;
        z-index: 9999999999999999
    }

    #preloaderInner {
        width: 100%;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        height: 100%;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    #page-topbar {
        left: 0;
        z-index: 999;
        background-color: var(--bg-light)
    }

    .navbar-header {
        display: flex;
        -ms-flex-pack: justify;
        -webkit-box-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin: 0 auto;
        height: 80px;
        padding: 0 calc(24px / 2) 0 0;
        padding-right: 40px
    }

    .navbar-brand-box {
        padding: 0 1.5rem;
        width: 240px
    }

    .logo {
        line-height: 70px
    }

    .app-search {
        padding: calc(39px / 2) 0
    }

    .app-search .form-control {
        border: 1px solid #dadee7;
        height: 40px;
        padding-left: 40px;
        padding-right: 20px;
        -webkit-box-shadow: none;
        box-shadow: none;
        border-radius: 4px;
        background-color: transparent;
        min-width: 400px
    }

    .app-searchspan {
        position: absolute;
        z-index: 10;
        font-size: 16px;
        line-height: 38px;
        left: 13px;
        top: 0
    }

    .custom-input-groupinput,.mobile-search-btn button {
        border-top-right-radius: 4px!important;
        border-bottom-right-radius: 4px!important
    }

    @media (max-width: 991px) {
        .navbar-brand-box {
            width:auto
        }

        .logo span.logo-lg {
            display: none
        }

        .logo span.logo-sm {
            display: inline-block
        }
    }

    .page-content {
        padding: calc(80px + 0px) calc(24px / 2) 0;
        padding-left: 0;
        padding-right: 20px
    }

    .page-content-wrapper {
        min-height: calc(100vh - 100px)
    }

    .header-item {
        height: 80px;
        -webkit-box-shadow: none!important;
        box-shadow: none!important;
        color: var(--heading-color);
        border: 0;
        border-radius: 0;
        padding: .47rem .55rem;
        position: relative;
        display: inline-flex;
        align-items: center
    }

    .arrow-down,.noti-icon .noti-dot,.property-item-titlea,.user-dropdown .dropdown-item i {
        display: inline-block
    }

    .header-profile-user {
        background-color: #f1f5f7
    }

    .noti-iconi {
        font-size: 16px;
        color: #abb1bf
    }

    .noti-icon .noti-dot {
        position: absolute;
        height: 6px;
        width: 6px;
        background-color: var(--red-color);
        border-radius: 50%;
        top: 30px;
        right: 7px
    }

    .notification-item .d-flex {
        padding: .75rem 1rem
    }

    .avatar-xs {
        height: 1.5rem;
        width: 1.5rem
    }

    .avatar-title {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        background-color: var(--primary-color);
        color: var(--white-color);
        border: 1px solid var(--white-color);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        font-weight: 500;
        height: 100%;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        width: 100%
    }

    .dropdown-item:focus,.dropdown-item:hover {
        color: var(--heading-color)!important;
        background-color: #f8f9fa
    }

    .dropdown-divider {
        border-top: 1px solid var(--border-color)
    }

    .dropdown-menu {
        -webkit-box-shadow: 0 5px 12px rgb(0 0 0 / 10%);
        box-shadow: 0 5px 12px rgb(0 0 0 / 10%);
        -webkit-animation-name: DropDownSlide;
        animation-name: DropDownSlide;
        -webkit-animation-duration: .3s;
        animation-duration: .3s;
        -webkit-animation-fill-mode: both;
        animation-fill-mode: both;
        border: 1px solid transparent;
        font-size: 14px
    }

    .dropdown-menu.show {
        top: 100%!important
    }

    .dropdown-menu-end[style] {
        left: auto!important;
        right: 0!important
    }

    .dropdown-menu[data-popper-placement^=left],.dropdown-menu[data-popper-placement^=right],.dropdown-menu[data-popper-placement^=top] {
        top: auto!important;
        -webkit-animation: none!important;
        animation: none!important
    }

    @-webkit-keyframes DropDownSlide {
        100% {
            -webkit-transform: translateY(0);
            transform: translateY(0)
        }

        0% {
            -webkit-transform: translateY(10px);
            transform: translateY(10px)
        }
    }

    @keyframes DropDownSlide {
        100% {
            -webkit-transform: translateY(0);
            transform: translateY(0)
        }

        0% {
            -webkit-transform: translateY(10px);
            transform: translateY(10px)
        }
    }

    @media (min-width: 600px) {
        .dropdown-menu-lg {
            width:320px
        }
    }

    .dropdown-toggle {
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-end
    }

    @media (max-width: 600px) {
        .navbar-header .dropdown {
            position:static
        }

        .navbar-header .dropdown .dropdown-menu {
            left: 10px!important;
            right: 10px!important
        }
    }

    @media (max-width: 380px) {
        .navbar-brand-box {
            display:none
        }
    }

    .page-title-box .breadcrumb {
        background-color: transparent;
        padding: 0
    }

    .breadcrumb-item+.breadcrumb-item::before {
        float: left;
        padding-right: .5rem;
        color: #74788d;
        content: var(--bs-breadcrumb-divider, "\f0142");
        font-family: "IBM Plex Sans Arabic"
    }

    .metismenu {
        margin: 0;
        background: #fff;
        border-radius: 20px;
        padding-top: 4px
    }

    .metismenuli {
        display: block;
        width: 100%
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user.active,.metismenu .mm-collapse.mm-show,.navbar-brand-box .logo-light,.vertical-collpsed .logospan.logo-sm {
        display: block
    }

    .metismenu .mm-collapsing {
        position: relative;
        height: 0;
        overflow: hidden;
        -webkit-transition-timing-function: ease;
        transition-timing-function: ease;
        -webkit-transition-duration: .35s;
        transition-duration: .35s;
        -webkit-transition-property: height,visibility;
        transition-property: height,visibility
    }

    .vertical-menu {
        width: 260px;
        z-index: 1003;
        background: var(--bg-light);
        bottom: 0;
        margin-top: -28px;
        position: fixed;
        top: 100px
    }

    .navbar-brand-box {
        background-color: var(--bg-light);
        transition: .2s
    }

    .main-content {
        margin-left: 240px;
        overflow: hidden
    }

    .main-content .content {
        padding: 0 15px 10px;
        margin-top: 70px
    }

    #sidebar-menu {
        padding: 10px
    }

    #sidebar-menu .mm-active>.has-arrow:after {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    #sidebar-menu .has-arrow:after {
        content: "\2b";
        font-family: "IBM Plex Sans Arabic";
        display: block;
        float: right;
        -webkit-transition: -webkit-transform .2s;
        transition: transform .2s;
        transition: transform .2s,-webkit-transform .2s;
        font-size: 1rem
    }

    #sidebar-menuul li a {
        display: block;
        padding: .3rem;
        position: relative;
        font-size: 14px;
        -webkit-transition: .4s;
        transition: .4s;
        font-weight: 600;
        border-radius: 16px;
        margin: 5px
    }

    #sidebar-menuul li a i {
        display: inline-flex;
        min-width: 2.9rem;
        height: 2.9rem;
        vertical-align: middle;
        -webkit-transition: .4s;
        transition: .4s;
        justify-content: center;
        align-items: center;
        padding: 0;
        border-radius: 14px;
        MARGIN-LEFT: 8PX
    }

    #sidebar-menuul li .badge {
        margin-top: 4px;
        font-size: 13px
    }

    #sidebar-menuul li ul.sub-menu li a {
        padding: .4rem 1.5rem .4rem 3.2rem;
        font-size: 12px;
    }

    #sidebar-menuul li ul.sub-menu li a: :before {
        content: "";
        height: 6px;
        width: 6px;
        background-color: var(--body-font-color);
        display: inline-block;
        border-radius: 50%;
        margin-right: 5px
    }

    #sidebar-menuul li ul.sub-menu li ul.sub-menu li a {
        padding: .4rem 1.5rem .4rem 4.2rem;
        font-size: 13.5px
    }

    .mm-active .active {
        color: #025457!important;
        background: #02545717
    }

    .mm-active .activei {
        color: #60ccc9!important;
        background-color: rgb(2 84 87)
    }

    .mm-active .active::before {
        background-color: var(--primary-color)!important
    }

    @media (max-width: 992px) {
        .vertical-menu {
            display:none
        }

        .main-content {
            margin-left: 0!important
        }

        body.sidebar-enable .vertical-menu {
            display: block
        }
    }

    .vertical-collpsed .main-content {
        margin-left: 70px
    }

    .vertical-collpsed .vertical-menu {
        position: absolute;
        width: 80px!important;
        z-index: 5
    }

    .vertical-collpsed .vertical-menu .simplebar-content-wrapper,.vertical-collpsed .vertical-menu .simplebar-mask {
        overflow: visible!important
    }

    .vertical-collpsed .vertical-menu #sidebar-menu .badge,.vertical-collpsed .vertical-menu #sidebar-menu .collapse.in,.vertical-collpsed .vertical-menu #sidebar-menu .menu-title,.vertical-collpsed .vertical-menu .simplebar-scrollbar {
        display: none!important
    }

    .vertical-collpsed .vertical-menu .simplebar-offset {
        bottom: 0!important
    }

    .vertical-collpsed .vertical-menu #sidebar-menu .nav.collapse {
        height: inherit!important
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul>li {
        position: relative;
        white-space: nowrap
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a {
        min-height: 55px;
        -webkit-transition: none;
        transition: none;
        padding: 0
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a span {
        display: none;
        padding-left: 25px
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul>li: hover>a {
        position: relative;
        width: calc(190px + 70px);
        background-color: var(--bg-light);
        -webkit-transition: none;
        transition: none
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul>li: hover>ul {
        display: block;
        left: 70px;
        position: absolute;
        width: 190px;
        height: auto!important;
        -webkit-box-shadow: 3px 5px 12px -4px rgba(18,19,21,.1);
        box-shadow: 3px 5px 12px -4px rgba(18,19,21,.1)
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul>li: hover>ul ul {
        -webkit-box-shadow: 3px 5px 12px -4px rgba(18,19,21,.1);
        box-shadow: 3px 5px 12px -4px rgba(18,19,21,.1)
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul>li: hover>ul a {
        padding: 0 20px 11px;
        color: var(--body-font-color);
        -webkit-box-shadow: none;
        box-shadow: none;
        position: relative;
        width: 190px;
        z-index: 6;
        color: var(--body-font-color)
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul ul {
        padding: 0 0 11px;
        z-index: 9999;
        display: none;
        background-color: var(--bg-light)
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul ul li: hover>ul {
        display: block;
        left: 190px;
        height: auto!important;
        margin-top: -36px;
        position: absolute;
        width: 190px
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul ul li>a span.pull-right {
        position: absolute;
        right: 20px;
        top: 12px;
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg)
    }

    .vertical-collpsed .vertical-menu #sidebar-menu>ul ul li.active a {
        color: #f8f9fa
    }

    .arrow-down:after {
        border-color: initial;
        border-style: solid;
        border-width: 0 0 1px 1px;
        content: "";
        height: .4em;
        display: inline-block;
        right: 5px;
        top: 50%;
        margin-left: 10px;
        -webkit-transform: rotate(-45deg) translateY(-50%);
        transform: rotate(-45deg) translateY(-50%);
        -webkit-transform-origin: top;
        transform-origin: top;
        -webkit-transition: .3s ease-out;
        transition: .3s ease-out;
        width: .4em
    }

    [data-simplebar] {
        position: relative;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -ms-flex-line-pack: start;
        align-content: flex-start;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }

    .simplebar-mask,.simplebar-offset {
        position: absolute;
        padding: 0;
        margin: 0;
        bottom: 0;
        top: 0
    }

    .simplebar-wrapper {
        overflow: hidden;
        width: inherit;
        height: inherit;
        max-width: inherit;
        max-height: 300px
    }

    .simplebar-mask {
        direction: inherit;
        overflow: hidden;
        left: 0;
        right: 0;
        width: auto!important;
        height: auto!important;
        z-index: 0
    }

    .simplebar-offset {
        direction: inherit!important;
        -webkit-box-sizing: inherit!important;
        box-sizing: inherit!important;
        resize: none!important;
        left: 0!important;
        right: 0!important;
        -webkit-overflow-scrolling: touch
    }

    .simplebar-content-wrapper {
        direction: inherit;
        -webkit-box-sizing: border-box!important;
        box-sizing: border-box!important;
        position: relative;
        display: block;
        height: 100%;
        width: auto;
        visibility: visible;
        overflow: auto;
        max-width: 100%;
        max-height: 100%;
        scrollbar-width: none;
        padding: 0!important
    }

    .simplebar-content-wrapper::-webkit-scrollbar,.simplebar-hide-scrollbar::-webkit-scrollbar {
        display: none
    }

    .simplebar-content:after,.simplebar-content:before {
        content: " ";
        display: table
    }

    .simplebar-placeholder {
        max-height: 100%;
        max-width: 100%;
        width: 100%;
        pointer-events: none
    }

    .simplebar-height-auto-observer-wrapper {
        -webkit-box-sizing: inherit!important;
        box-sizing: inherit!important;
        height: 100%;
        width: 100%;
        max-width: 1px;
        position: relative;
        float: left;
        max-height: 1px;
        overflow: hidden;
        z-index: -1;
        padding: 0;
        margin: 0;
        pointer-events: none;
        -webkit-box-flex: inherit;
        -ms-flex-positive: inherit;
        flex-grow: inherit;
        -ms-flex-negative: 0;
        flex-shrink: 0;
        -ms-flex-preferred-size: 0;
        flex-basis: 0
    }

    .simplebar-height-auto-observer {
        -webkit-box-sizing: inherit;
        box-sizing: inherit;
        display: block;
        opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        height: 1000%;
        width: 1000%;
        min-height: 1px;
        min-width: 1px;
        overflow: hidden;
        pointer-events: none;
        z-index: -1
    }

    .simplebar-track {
        z-index: 1;
        position: absolute;
        right: 0;
        bottom: 0;
        pointer-events: none;
        overflow: hidden
    }

    [data-simplebar].simplebar-dragging .simplebar-content {
        pointer-events: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-user-select: none
    }

    [data-simplebar].simplebar-dragging .simplebar-track {
        pointer-events: all
    }

    .simplebar-scrollbar {
        position: absolute;
        right: 2px;
        width: 6px;
        min-height: 10px
    }

    .simplebar-scrollbar:before {
        position: absolute;
        content: "";
        background: #a2adb7;
        border-radius: 7px;
        left: 0;
        right: 0;
        opacity: 0;
        -webkit-transition: opacity .2s linear;
        transition: opacity .2s linear
    }

    .simplebar-scrollbar.simplebar-visible:before {
        opacity: .5;
        -webkit-transition: opacity linear;
        transition: opacity linear
    }

    .simplebar-track.simplebar-vertical {
        top: 0;
        width: 11px
    }

    .simplebar-track.simplebar-vertical .simplebar-scrollbar:before {
        top: 2px;
        bottom: 2px
    }

    .simplebar-track.simplebar-horizontal {
        left: 0;
        height: 11px
    }

    .simplebar-track.simplebar-horizontal .simplebar-scrollbar:before {
        height: 100%;
        left: 2px;
        right: 2px
    }

    .simplebar-track.simplebar-horizontal .simplebar-scrollbar {
        right: auto;
        left: 0;
        top: 2px;
        height: 7px;
        min-height: 0;
        min-width: 10px;
        width: auto
    }

    [data-simplebar-direction=rtl] .simplebar-track.simplebar-vertical {
        right: auto;
        left: 0
    }

    .hs-dummy-scrollbar-size {
        direction: rtl;
        position: fixed;
        opacity: 0;
        visibility: hidden;
        height: 500px;
        width: 500px;
        overflow-y: hidden;
        overflow-x: scroll
    }

    .simplebar-hide-scrollbar {
        position: fixed;
        left: 0;
        visibility: hidden;
        overflow-y: scroll;
        scrollbar-width: none
    }

    .dashboard-feature-item-icon-wrap {
        box-shadow: 0 4px 12px rgba(247,247,247,.6);
        width: 35px;
        height: 35px
    }

    .net-revenue-right .icon-box {
        height: 16px;
        width: 16px;
        padding: 2px;
        margin-bottom: 1px
    }

    .sign-up-page {
        overflow-x: hidden
    }

    .sign-up-left-content {
        background-color: var(--primary-color);
        padding: 30px 100px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        overflow: hidden
    }

    .sign-up-left-content::before {
        content: "";
        position: absolute;
        width: 709px;
        height: 1068px;
        right: 86px;
        top: 65px;
        background: linear-gradient(166.46deg,rgba(255,255,255,.05) 15.3%,rgba(255,255,255,0) 84.41%);
        transform: rotate(61deg)
    }

    .account-settings-leftside,.account-settings-rightside,.sign-up-left-content,.sign-up-right-content {
        min-height: 100vh;
        height: 100%
    }

    .sign-up-right-content {
        align-items: center;
        display: flex
    }

    .sign-up-right-contentform {
        width: 479px;
        margin: 0 auto
    }

    .sign-up-left-contentp {
        color: var(--border-color)
    }

    .sign-up-right-content .pass-icon {
        font-size: 13px;
        float: right;
        top: 18px;
        position: absolute;
        right: 10px
    }

    .sign-in-floating-1 {
        top: 30px;
        left: 30px
    }

    .sign-in-floating-2 {
        bottom: 30px;
        right: 30px
    }

    .empty-properties-box {
        padding: 25% 0
    }

    .page-inner-search {
        width: 270px;
        max-width: 100%
    }

    .page-inner-search .form-control {
        height: 50px;
        padding-left: 40px;
        padding-right: 20px
    }

    .page-inner-searchspan {
        position: absolute;
        z-index: 10;
        font-size: 16px;
        line-height: 50px;
        left: 13px;
        top: 0
    }

    .information-details-imgimg,.property-item-img img {
        min-height: 240px;
        height: 240px
    }

    .property-info-item {
        padding: 0 4px;
        text-align: center;
        display: inline-flex;
        align-items: center;
        justify-content: flex-start;
        width: auto;
        flex: auto
    }

    .property-item-info .property-info-item:nth-of-type(odd) {
        min-width: 80px
    }

    .property-item-info .property-info-item:nth-of-type(2n+3) {
        min-width: 120px
    }

    .property-item-dropdown {
        top: 0;
        right: -3px
    }

    .property-item-img-wrap {
        background: var(--primary-color)
    }

    .property-item-img {
        transition: opacity .35s,transform .35s;
        transform: scale3d(1.05,1.05,1)
    }

    .property-item-img-wrap::before {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(255,255,255,.5);
        content: "";
        transition: transform .6s;
        transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0)
    }

    .property-item-img-wrap:hover .property-item-img {
        opacity: .6;
        transform: scale3d(1,1,1)
    }

    .property-item-img-wrap:hover::before {
        transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,105%,0)
    }

    .property-details-imgimg {
        height: 490px
    }

    .vbox-containerimg {
        border-radius: 4px;
        min-height: 400px
    }

    .dropzone,.show-uploaded-img {
        min-height: 120px
    }

    .gallery-slider-carousel.owl-carousel .owl-nav .owl-next,.gallery-slider-carousel.owl-carousel .owl-nav .owl-prev {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        font-size: 20px;
        box-shadow: 0 8px 61px rgba(89,145,255,.19);
        background-color: var(--white-color);
        color: var(--body-font-color);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0 7px;
        position: absolute;
        border: 1px solid var(--border-color);
        top: 50%;
        transform: translateY(-50%)
    }

    #msform .action-button-previous,.form-stepper-nav-icon {
        border: 1px solid var(--border-color);
        background-color: var(--white-color)
    }

    .gallery-slider-carousel.owl-theme .owl-nav {
        width: 100%;
        margin-top: 0
    }

    .gallery-slider-carousel.owl-carousel .owl-nav .owl-prev {
        left: 0
    }

    .gallery-slider-carousel.owl-carousel .owl-nav .owl-next {
        right: 0
    }

    #msformfieldset:not(:first-of-type),.chat-item .dropdown-toggle::after,.chat-sidebar-offcanvas .offcanvas-header,.exclamation-btu,.message-chat-top-right .dropdown-toggle::after,.profile-user .app-favicon-profile-img-file-input,.profile-user .app-logo-profile-img-file-input,.profile-user .app-logo-white-profile-img-file-input,.profile-user .app-preloader-profile-img-file-input,.profile-user .default-profile-img-file-input,.profile-user .language-icon-img-file-input,.profile-user .language-icon-img-file-input-edit,.profile-user .maintainer-profile-img-file-input,.profile-user .profile-img-file-input,.profile-user .signin-profile-img-file-input,.ui-datepicker-div .ui-datepicker-header a>span {
        display: none
    }

    #msform .action-button-previous {
        color: var(--heading-color);
        margin-right: 15px
    }

    #msform .action-button-previous:focus,#msform .action-button-previous:hover {
        background-color: var(--off-white)!important;
        color: var(--heading-color)!important
    }

    .card {
        z-index: 0;
        border: none;
        position: relative
    }

    #progressbar {
        display: inline-flex;
        overflow-y: auto;
        -ms-overflow-style: none;
        scrollbar-width: none;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        width: 100%;
        flex-wrap: wrap;
        justify-content: flex-start;
        row-gap: 15px;
        scrollbar-width: thin;
        scrollbar-color: #a2adb7 #fff
    }

    #progressbar::-webkit-scrollbar {
        width: 4px;
        height: 6px
    }

    #progressbar::-webkit-scrollbar-track {
        background-color: #fff
    }

    #progressbar::-webkit-scrollbar-thumb {
        background-color: #a2adb7
    }

    #progressbar::-webkit-scrollbar-thumb,#progressbar::-webkit-scrollbar-track {
        border-radius: 5px
    }

    #progressbarli {
        min-width: 20%;
        position: relative;
        color: var(--body-font-color);
        font-size: 15px;
        font-weight: 500;
        line-height: 20px;
        display: flex;
        flex-direction: column
    }

    .form-stepper-nav-icon {
        width: 50px;
        height: 50px;
        line-height: 45px;
        display: block;
        font-size: 20px;
        border-radius: 50%;
        margin: 0 auto 10px;
        padding: 2px;
        z-index: 9;
        position: relative
    }

    #progressbarli:after {
        content: '';
        width: 22%;
        height: 0;
        background: 0 0;
        position: absolute;
        top: 25px;
        border-bottom: 1.5px dashed #a5abba;
        right: -12%
    }

    #progressbarli.active:after,#progressbar li.active: before {
        border-bottom: 1.5px dashed var(--primary-color)
    }

    #progressbarli:last-child::after {
        border-bottom: none
    }

    #msformtextarea {
        height: 220px
    }

    .add-field.theme-link {
        text-align: left
    }

    .select-property-nav-tabs .nav-item.show .nav-link,.select-property-nav-tabs .nav-link.active,.select-property-nav-tabs .nav-link:focus,.select-property-nav-tabs .nav-link:hover {
        border-color: transparent
    }

    .select-property-nav-text .select-property-nav-text-box {
        background-color: transparent;
        border: 1px solid var(--border-color);
        height: 24px;
        width: 24px;
        display: inline-flex;
        border-radius: 4px
    }

    .nav-tabs .nav-item.show .nav-link .select-property-nav-text-box::after,.nav-tabs .nav-link.active .select-property-nav-text-box::after {
        content: '';
        display: block;
        position: absolute;
        top: 5px;
        left: 10px;
        width: 6px;
        height: 10px;
        border: solid var(--primary-color);
        border-width: 0 1px 1px 0;
        transform: rotate(45deg)
    }

    input[type=date]: :-webkit-calendar-picker-indicator,input[type=date]::-webkit-inner-spin-button {
        -webkit-appearance: none;
        color: var(--border-color)
    }

    .ui-datepicker {
        width: auto
    }

    .custom-datepicker-inneri {
        position: absolute;
        right: 15px;
        top: 12px;
        font-size: 18px;
        color: var(--body-font-color)
    }

    .ui-widget-header .ui-icon {
        background-image: none
    }

    .ui-datepicker-divlabel {
        font-size: .75rem;
        display: block;
        margin-bottom: .5rem;
        color: #b0bec5;
        border: 1px solid #eceff1;
        padding: .5rem .75rem;
        border-radius: .5rem
    }

    .ui-datepicker-divinput {
        font-family: 'IBM Plex Sans Arabic',sans-serif;
        display: block;
        border: 1px solid transparent;
        border-radius: .25rem;
        line-height: 1.5rem;
        padding: 0;
        font-size: 1rem;
        color: #607d8b;
        width: 100%;
        margin-top: .5rem
    }

    .ui-datepicker-div #ui-datepicker-div {
        display: none;
        background-color: var(--white-color);
        box-shadow: 0 .125rem .5rem rgba(0,0,0,.1);
        margin-top: .25rem;
        border-radius: .5rem;
        padding: .5rem
    }

    .ui-datepicker-divtable {
        border-collapse: collapse;
        border-spacing: 0
    }

    .ui-datepicker-div .ui-datepicker-calendarthead th {
        padding: .25rem 0;
        text-align: center;
        font-size: .75rem;
        font-weight: 400;
        color: #78909c
    }

    .ui-datepicker-div .ui-datepicker-calendartbody td {
        width: 2.5rem;
        text-align: center;
        padding: 0
    }

    .ui-datepicker-div .ui-datepicker-calendartbody td a {
        display: block;
        border-radius: .25rem;
        line-height: 2rem;
        transition: .3s;
        color: #546e7a;
        font-size: .875rem;
        text-decoration: none
    }

    .ui-datepicker-div .ui-datepicker-calendartbody td a: hover {
        background-color: #e0f2f1
    }

    .ui-datepicker-div .ui-datepicker-calendartbody td a.ui-state-active {
        background-color: #009688;
        color: var(--white-color)
    }

    .ui-datepicker-div .ui-datepicker-headera.ui-corner-all {
        cursor: pointer;
        position: absolute;
        top: 0;
        width: 2rem;
        height: 2rem;
        margin: .5rem;
        border-radius: .25rem;
        transition: .3s
    }

    .ui-datepicker-div .ui-datepicker-headera.ui-corner-all:hover {
        background-color: #eceff1
    }

    #ui-datepicker-div .ui-datepicker-headera.ui-datepicker-prev,.ui-datepicker-div .ui-datepicker-header a.ui-datepicker-prev {
        left: 0;
        background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48cGF0aCBmaWxsPSIjNDI0NzcwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjI4OCA2LjI5NkwzLjIwMiAyLjIxYS43MS43MSAwIDAgMSAuMDA3LS45OTljLjI4LS4yOC43MjUtLjI4Ljk5OS0uMDA3TDguODAzIDUuOGEuNjk1LjY5NSAwIDAgMSAuMjAyLjQ5Ni42OTUuNjk1IDAgMCAxLS4yMDIuNDk3bC00LjU5NSA0LjU5NWEuNzA0LjcwNCAwIDAgMS0xLS4wMDcuNzEuNzEgMCAwIDEtLjAwNi0uOTk5bDQuMDg2LTQuMDg2eiIvPjwvc3ZnPg==") 50%/.5rem no-repeat;
        transform: rotate(180deg)
    }

    .ui-datepicker-div .ui-datepicker-headera.ui-datepicker-next {
        right: 0;
        background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48cGF0aCBmaWxsPSIjNDI0NzcwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjI4OCA2LjI5NkwzLjIwMiAyLjIxYS43MS43MSAwIDAgMSAuMDA3LS45OTljLjI4LS4yOC43MjUtLjI4Ljk5OS0uMDA3TDguODAzIDUuOGEuNjk1LjY5NSAwIDAgMSAuMjAyLjQ5Ni42OTUuNjk1IDAgMCAxLS4yMDIuNDk3bC00LjU5NSA0LjU5NWEuNzA0LjcwNCAwIDAgMS0xLS4wMDcuNzEuNzEgMCAwIDEtLjAwNi0uOTk5bDQuMDg2LTQuMDg2eiIvPjwvc3ZnPg==') 50%/10px no-repeat
    }

    .ui-datepicker-div .ui-datepicker-title {
        text-align: center;
        line-height: 2rem;
        margin-bottom: .25rem;
        font-size: .875rem;
        font-weight: 500;
        padding-bottom: .25rem
    }

    .ui-datepicker-div .ui-datepicker-week-col {
        color: #78909c;
        font-weight: 400;
        font-size: .75rem
    }

    .ui-datepicker-calendartbody tr,.ui-datepicker-calendar thead tr {
        display: flex!important
    }

    .ui-datepicker-calendarthead tr th {
        width: 37px!important;
        min-width: 37px!important;
        font-weight: 400
    }

    .ui-datepicker-calendartbody tr td,.ui-datepicker-next.ui-corner-all {
        width: 37px!important
    }

    #ui-datepicker-div .ui-widget-header {
        background: 0 0;
        border: none
    }

    #ui-datepicker-div {
        background-color: var(--white-color);
        box-shadow: 0 .125rem .5rem rgba(0,0,0,.1);
        border-radius: .5rem;
        border: 1px solid transparent
    }

    #ui-datepicker-div .ui-button,#ui-datepicker-div .ui-state-default,#ui-datepicker-div .ui-widget-content .ui-state-default,#ui-datepicker-div .ui-widget-header .ui-state-default {
        border: 1px solid transparent!important;
        text-align: center!important;
        border-radius: 5px!important
    }

    #ui-datepicker-div .ui-datepicker-headera.ui-datepicker-next,#ui-datepicker-div .ui-datepicker-header a.ui-datepicker-prev {
        border: 1px solid transparent
    }

    #ui-datepicker-div .ui-datepicker-headera.ui-datepicker-next {
        right: 0;
        background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48cGF0aCBmaWxsPSIjNDI0NzcwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjI4OCA2LjI5NkwzLjIwMiAyLjIxYS43MS43MSAwIDAgMSAuMDA3LS45OTljLjI4LS4yOC43MjUtLjI4Ljk5OS0uMDA3TDguODAzIDUuOGEuNjk1LjY5NSAwIDAgMSAuMjAyLjQ5Ni42OTUuNjk1IDAgMCAxLS4yMDIuNDk3bC00LjU5NSA0LjU5NWEuNzA0LjcwNCAwIDAgMS0xLS4wMDcuNzEuNzEgMCAwIDEtLjAwNi0uOTk5bDQuMDg2LTQuMDg2eiIvPjwvc3ZnPg==') 50%/.5rem no-repeat
    }

    #ui-datepicker-div .ui-icon.ui-icon-circle-triangle-e {
        height: 37px;
        width: 37px
    }

    .unit-block-item-box {
        border: 1px solid var(--border-color)!important
    }

    .unit-block-item-box .accordion-button {
        background-color: rgba(54,134,252,.03)!important
    }

    .unit-block-item-box .accordion-button:focus {
        border-color: var(--border-color);
        box-shadow: none
    }

    .unit-block-item-box .accordion-button:not(.collapsed) {
        color: var(--primary-color);
        box-shadow: none;
        border-bottom: 1px solid var(--border-color)
    }

    .unit-block-item-box .accordion-button::after {
        background-image: none;
        content: "\f0140";
        font-family: "IBM Plex Sans Arabic";
        font-size: 20px
    }

    .unit-block-item-box .accordion-body {
        padding-bottom: 0
    }

    .show-map-hereiframe {
        height: 253px!important;
        width: 100%!important;
        border: 0
    }

    .show-uploaded-imgimg {
        min-height: 120px;
        width: auto
    }

    .dropzone {
        border: 2px dashed #ced4da;
        background: #fff;
        border-radius: 4px;
        border: 2px dashed var(--border-color);
        display: inline-flex;
        align-items: center;
        width: 100%;
        height: 100%;
        padding: 10px
    }

    .dropzone-img-wrap {
        margin-right: 5px
    }

    .dropzone .dz-message {
        width: 100%;
        margin: 0
    }

    .dropzone-remove-icon {
        position: absolute;
        top: 8px;
        right: 8px
    }

    .dropzone-remove-iconbutton {
        width: 20px;
        height: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 4px
    }

    .dropzone-upload-sign-icon.mb-2 {
        width: 32px;
        height: 32px;
        background-color: var(--bg-light);
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        margin: 0 auto
    }

    .tenant-img {
        height: 60px;
        width: 60px
    }

    .tenants-item-info {
        padding: 0 14px
    }

    .tenants-item-info-box {
        padding: 2px 0px;
    }

    .tenants-info-right {
        display: inline-flex;
        justify-content: flex-end;
        width: 100%;
        align-items: center;
    }

    .tenants-property-item-list-view .property-item-imgimg {
        width: 340px
    }

    .tenants-property-item-list-view .property-item-address,.tenants-property-item-list-view .property-item-title {
        width: 75%
    }

    .tenants-property-item-list-view .property-item-info {
        width: 400px
    }

    .tenants-property-item-list-view .property-info-item-right {
        justify-content: flex-end
    }

    .tenants-property-item-list-view .property-info-item {
        width: 100%
    }

    .input-group-text-edit {
        font-size: 23px
    }

    .file-uplode-dropzone.dropzone {
        min-height: 200px
    }

    .dropzone-documents-additional-infoimg {
        height: 100px;
        min-width: 120px
    }

    .account-settings-menu-item {
        display: flex;
        align-items: center;
        position: relative;
        margin: 10px 0
    }

    .account-settings-menu-item .iconify,.account-settings-menu-itemi {
        font-size: 20px;
        margin-right: 12px
    }

    .remove-tenants-item .account-settings-menu-item .iconify,.remove-tenants-item .account-settings-menu-itemi {
        margin-right: 0
    }

    .upload-new-picture .form-control {
        padding: 10px 15px
    }

    .account-settings-info-item {
        padding: 10px 0
    }

    .tenants-details-leftsidebar-wrap {
        flex-direction: column;
        justify-content: space-between;
        height: 100%
    }

    .profile-user {
        position: relative;
        display: inline-block
    }

    .profile-user .app-favicon-profile-photo-edit,.profile-user .app-logo-profile-photo-edit,.profile-user .app-preloader-profile-photo-edit,.profile-user .default-profile-photo-edit,.profile-user .language-icon-edit,.profile-user .maintainer-profile-photo-edit,.profile-user .profile-photo-edit,.profile-user .signin-profile-photo-edit {
        position: absolute;
        right: 0;
        left: auto;
        bottom: -5px;
        cursor: pointer
    }

    .profile-user .app-favicon-user-profile-image,.profile-user .app-logo-user-profile-image,.profile-user .app-logo-white-user-profile-image,.profile-user .app-preloader-user-profile-image,.profile-user .default-user-profile-image,.profile-user .language-icon-image,.profile-user .maintainer-user-profile-image,.profile-user .signin-user-profile-image,.profile-user .user-profile-image,.tbl-user-image {
        -o-object-fit: cover;
        object-fit: cover
    }

    .tenants-details-home-details-property-item .property-item-content {
        display: flex;
        width: 100%
    }

    .tenants-details-home-details-property-item .property-item-img-wrap::before {
        height: 130%
    }

    .tenants-details-home-details-property-item .property-item-imgimg {
        height: 450px
    }

    .tenants-details-property-info-left {
        width: 50%
    }

    .tenants-details-property-info-right {
        width: 50%;
        text-align: right
    }

    .billing-center-nav-tabs .nav-link {
        border: none;
        border-radius: 4px;
        color: var(--body-font-color)
    }

    .billing-center-nav-tabs,.invoice-payment-nav-tabs {
        border-bottom: 0
    }

    .billing-center-nav-tabs .nav-link:focus,.billing-center-nav-tabs .nav-link:hover {
        color: var(--primary-hover-color)
    }

    .document-item-box {
        height: 178px;
        width: 194px;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center
    }

    .document-item-boximg {
        height: 45px
    }

    .invoice-heading-part {
        display: flex;
        justify-content: space-between
    }

    .invoice-heading-leftimg {
        margin-bottom: 13px
    }

    .invoice-address-part {
        margin-bottom: 20px;
        margin-top: 20px;
        border-top: 1px solid #e5e4e4;
        padding-top: 20px;
        display: flex;
        justify-content: space-between
    }

    .invoice-address-part .invoice-generate-title {
        margin-bottom: 12px
    }

    .invoice-addressh6 {
        margin-top: 8px
    }

    .invoice-addressh5,.invoice-address h6 {
        color: #737c91
    }

    .invoice-preview-wrap .invoice-table-partthead {
        border-top: 1px solid #e5e4e4;
        background-color: #fff
    }

    .invoice-payment-nav-tabs .nav-link,.tenant-portal-notice-tbltd:hover {
        background-color: var(--white-color)
    }

    .invoice-preview-wrap .invoice-table-part .show-total-box {
        border-bottom: 1px solid #e5e4e4;
        margin-bottom: 20px;
        padding-bottom: 20px
    }

    .invoice-tbl-last-field {
        text-align: right;
        padding-right: 1.5rem
    }

    .invoice-tbl-last-field>span {
        margin-left: 15px
    }

    .invoice-heading-color {
        color: #160e4d
    }

    .invoice-generate-title {
        text-align: left;
        margin-bottom: 20px
    }

    .invoice-preview-wrapthead {
        background-color: #fafafa
    }

    .invoice-table-parttable {
        background-color: #fff
    }

    .transaction-table-parttable {
        background-color: #fafafa;
        border: 1px solid #eaeaea;
        border-radius: 4px
    }

    .invoice-preview-wrap .table>thead>tr>th {
        border-bottom: 1px solid #e5e4e4
    }

    .invoice-heading-right-status-btn {
        background: rgba(54,134,252,.1);
        border-radius: 4px;
        display: inline-flex;
        padding: 10px 18px;
        color: #3686fc
    }

    .show-uploaded-documents-imgimg {
        height: 24px;
        width: 24px;
        -o-object-fit: cover;
        object-fit: cover
    }

    .ticket-item-content-box.attachment-ticket-item-content-box {
        padding-bottom: 12px;
        margin-bottom: 20px
    }

    .tickets-attachment-item {
        width: 75px;
        height: 75px;
        border-radius: 4px;
        overflow: hidden;
        display: inline-block
    }

    .tickets-attachment-gallery .col-auto {
        padding: 2px 5px
    }

    .tickets-attachment-gallery {
        padding: 0 5px
    }

    .tickets-attachment-itemimg {
        height: 75px;
        width: 75px
    }

    .vbox-overlay {
        background: rgba(22,14,77,.7)
    }

    .ticket-replies-item {
        background-color: rgba(242,246,249,.8)
    }

    .ticket-details-write-reply-boxtextarea {
        min-height: 160px!important
    }

    .account-settings-menuli,.account-settings-menu li ul.account-sub-menu li a,.account-settings-menu li ul.account-sub-menu li a: :before,.account-settings-menu-item {
        -webkit-transition: .5s linear;
        transition: .5s linear
    }

    .account-settings-menuli .toggle-account-menu {
        position: absolute;
        top: 14px;
        right: 10px;
        cursor: pointer;
        font-size: 10px;
        text-align: right;
        z-index: 9
    }

    .account-settings-menuli.menu-has-children .account-sub-menu {
        padding: 0;
        display: none
    }

    .account-settings-menuli.menu-has-children .account-sub-menu li a {
        display: block;
        position: relative;
        height: auto;
        background: 0 0;
        padding: 5px 0;
        text-transform: capitalize;
        -webkit-transition: .5s linear;
        transition: .5s linear
    }

    .account-settings-menuli.menu-has-children.has-open .account-sub-menu {
        display: block;
        margin-left: 20px
    }

    .account-settings-menuli ul.account-sub-menu li a: :before {
        content: "";
        height: 6px;
        width: 6px;
        background-color: var(--body-font-color);
        display: inline-block;
        border-radius: 50%;
        margin-right: 5px;
        top: -2px;
        position: relative
    }

    .color-settings-fields-wrap .sp-original-input-container {
        border: 1px solid var(--border-color);
        border-radius: 4px;
        height: 50px;
        align-items: center;
        width: 100%
    }

    .color-settings-fields-wrap .sp-original-input-container .sp-add-on {
        height: 30px;
        width: 30px!important;
        border-radius: 4px!important;
        margin: 0 10px;
        flex-shrink: 0
    }

    .color-settings-fields-wrap .sp-original-input-containerinput {
        height: 100%;
        width: 100%
    }

    .tenant-portal-notice-tbltd .tenant-portal-notice-tbl-item {
        padding: 1rem 1.5rem;
        width: 100%;
        display: block
    }

    .invoice-payment-imgimg {
        height: 70px
    }

    .invoice-payment-nav-tabs .nav-link {
        display: flex;
        justify-content: space-between;
        align-items: center;
        border: 1px solid var(--border-color);
        padding: 20px;
        border-radius: 4px
    }

    .invoice-payment-nav-tabs .nav-item.show .nav-link .custom-radiobox [type=radio]+label: after,.invoice-payment-nav-tabs .nav-link.active .custom-radiobox [type=radio]+label:after {
        content: '';
        width: 12px;
        height: 12px;
        background: var(--primary-color);
        position: absolute;
        top: 3px;
        left: 3px;
        border-radius: 100%;
        -webkit-transition: .2s;
        transition: .2s;
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    .tenant-nid-icon.text-white.rounded-circle {
        height: 46px;
        width: 46px;
        background-color: var(--heading-color)
    }

    .upload-nid-wrap {
        background: linear-gradient(90deg,#ecf4ff 0,#e3efff 63.02%,#d8c9ff 84.44%,#baffcd 100%)
    }

    .message-user-top-part {
        padding: 20px
    }

    .message-user-top-part-btns .nav-link {
        background-color: transparent;
        color: var(--body-font-color);
        border: none;
        border-radius: 4px
    }

    .message-user-top-part-btns .nav-item.show .nav-link,.message-user-top-part-btns .nav-link.active {
        background-color: var(--primary-color);
        color: var(--white-color)
    }

    .search-message-boxinput {
        height: 32px;
        border: 1px solid #e9e8e8;
        color: #767588;
        border-left: 0
    }

    .search-message-box .form-control:focus {
        border-color: #e9e8e8;
        outline: 0;
        box-shadow: none
    }

    .message-chat-right-part,.message-user-sidebar {
        height: 719px
    }

    .message-user-list-part {
        height: calc(100% - 94px)
    }

    .message-user-list-wrap {
        max-height: 600px;
        overflow-y: auto
    }

    .message-user-list-part-titleh6 {
        padding: 0 30px
    }

    .message-user-item {
        padding: 12px 20px;
        margin-bottom: 2px
    }

    .message-user-item.active,.message-user-item:hover {
        background-color: #f3f6f8
    }

    .chat-item .user-img-wrap,.message-user-item .user-img-wrap,.message-user-item-left .user-img-wrap {
        height: 42px;
        width: 42px
    }

    .chat-item .user-img-wrapimg,.message-user-item .user-img-wrap img,.message-user-item-left .user-img-wrap img {
        height: 42px;
        width: 42px;
        border-radius: 50%
    }

    .message-user-item-leftp {
        line-height: 16px
    }

    .online-offline-show {
        height: 12px;
        width: 12px;
        border-radius: 50%;
        border: 2px solid var(--white-color);
        right: 0;
        bottom: 4px;
        z-index: 9
    }

    .online-offline-show.offline {
        background-color: var(--yellow-color)
    }

    .message-user-notification-box {
        background-color: rgba(255,67,67,.1);
        color: var(--red-color);
        min-height: 18px;
        min-width: 18px;
        border-radius: 32px;
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: right;
        float: right;
        font-size: 10px;
        padding: 0 4px
    }

    .message-chat-right-part .dropdown-toggle .iconify,.message-chat-right-part .dropdown-togglei {
        font-size: 22px
    }

    .message-chat-top-part {
        border-bottom: 1px solid var(--border-color);
        background-color: var(--white-color);
        min-height: 88px;
        padding: 20px;
        position: relative;
        z-index: 9
    }

    .in-chat-mode-online-offline .yes-online {
        background-color: var(--green-color);
        color: var(--white-color)
    }

    .in-chat-mode-online-offline .online-offline-btn {
        border-radius: 71px;
        padding: 3px 8px
    }

    .message-chat-top-action-btn {
        color: var(--body-font-color);
        display: inline-flex;
        align-items: center;
        justify-content: center
    }

    .message-chat-top-right .dropdown-toggle {
        display: inline-flex!important
    }

    .message-chat-top-right .dropdown {
        display: inline-flex;
        align-items: center;
        justify-content: center
    }

    .message-chat-top-right .dropdown-menu {
        min-width: 6rem
    }

    .message-chat-top-right .dropdown-menu .dropdown-item {
        display: inline-flex;
        align-items: center
    }

    .message-chat-top-right .dropdown-menu .dropdown-item .iconify {
        margin-right: 6px
    }

    .message-chat-top-right .dropdown-menuli:first-child .dropdown-item .iconify {
        color: #f44
    }

    .message-chat-top-right .dropdown-menuli:nth-child(2) .dropdown-item .iconify {
        color: var(--yellow-color)
    }

    .message-chat-top-right .dropdown-menuli:nth-child(3) .dropdown-item .iconify {
        color: var(--theme-color)
    }

    .message-chat-bottom-part {
        bottom: 0;
        width: 100%;
        padding: 5px 20px 20px;
        background-color: var(--white-color)
    }

    .message-chat-bottom-left {
        width: calc(100% - 71px)
    }

    .message-chat-bottom-left .input-group {
        background-color: #f4f4f8;
        border-radius: 4px;
        color: var(--body-font-color);
        padding: 10px
    }

    .emogi-collection-btn {
        color: var(--body-font-color);
        height: 36px;
        width: 36px;
        border-radius: 4px!important;
        font-size: 21px;
        padding: 0;
        justify-content: center
    }

    .chat-text-input {
        height: 36px;
        padding: 5px 14px
    }

    .message-chat-bottom-right {
        width: 56px
    }

    .message-chat-bottom-action-btn {
        height: 56px;
        width: 56px;
        border-radius: 4px;
        color: var(--body-font-color);
        background-color: #f4f4f8;
        font-size: 20px
    }

    .custom-scrollbar {
        scrollbar-width: thin;
        scrollbar-color: #E6E3EB #fff
    }

    .custom-scrollbar::-webkit-scrollbar {
        width: 3px;
        height: 10px
    }

    .custom-scrollbar::-webkit-scrollbar-track {
        background-color: #fff
    }

    .custom-scrollbar::-webkit-scrollbar-thumb {
        background-color: #e6e3eb
    }

    .custom-scrollbar::-webkit-scrollbar-thumb,.custom-scrollbar::-webkit-scrollbar-track {
        border-radius: 5px
    }

    .message-chat-main-part {
        padding: 0 20px;
        position: absolute;
        width: 100%;
        max-height: 541px;
        overflow-y: auto
    }

    .conversation-start-date {
        margin: 40px 0 20px
    }

    .conversation-start-date:before {
        content: "";
        background-color: var(--border-color);
        width: 100%;
        height: 1px;
        left: 0;
        position: absolute
    }

    .conversation-start-datespan {
        top: -9px;
        padding: 0 12px
    }

    .chat-item {
        max-width: 680px
    }

    .chat-item .dropdown {
        right: -25px;
        float: right;
        color: var(--body-font-color)
    }

    .chat-item .dropdown-menu {
        min-width: 6rem;
        border: 1px solid #eeeded;
        border-radius: 8px
    }

    .chat-item.chat-item-right {
        float: right
    }

    .chat-item.chat-item-right .chat-text-boxp {
        background-color: #e9f6ff;
        border-radius: 4px 4px 0
    }

    .chat-text-box {
        margin-right: 20px
    }

    .chat-text-boxp {
        background: #f2f6f9;
        border-radius: 4px 4px 4px 0;
        color: var(--heading-color);
        margin-bottom: 15px;
        padding: 18px 20px
    }

    .chat-sidebar-toggle-btn {
        height: 38px;
        width: 38px;
        display: none
    }

    .chat-sidebar-offcanvas {
        z-index: 1;
        transform: translateX(0)!important;
        visibility: visible;
        position: relative;
        border-right-color: var(--border-color)!important
    }

    .chat-sidebar-offcanvas .offcanvas-body {
        overflow-y: hidden;
        background-color: var(--white-color)
    }

    .choose-plan-area-title,.payment-method-area-title {
        margin-bottom: 20px;
        margin-top: -5px
    }

    .price-card-item {
        border: .776515px solid rgba(0,0,0,.1);
        border-radius: 15.5303px;
        background-color: var(--bg-primary)
    }

    .price-titlespan {
        color: #727b8f
    }

    hr {
        border: 1.6px solid rgba(0,0,0,.1)
    }

    .pricing-features {
        margin: 18px 0 11px
    }

    .price-check-icon {
        width: 17px;
        height: 17px
    }

    .payment-subscription-switch .form-check-input {
        width: 4.55em;
        height: 2.25em
    }

    .theme-btn-outline {
        border: 1px solid var(--secondary-color);
        background-color: transparent;
        color: var(--button-primary-color)!important;
        border-radius: 111.818px;
        padding: 14px 41px!important;
        width: 100%
    }

    .current-plan-button {
        background-color: var(--secondary-color);
        color: var(--white-color)!important
    }

    .theme-btn-outline.active,.theme-btn-outline:hover {
        background-color: var(--secondary-hover-color);
        color: var(--white-color)!important
    }

    @media (min-width: 576px) {
        .modal-dialog {
            max-width:740px
        }

        #invoicePreviewModal .modal-dialog {
            max-width: 1024px
        }

        .big-modal .modal-dialog {
            max-width: 1212px
        }

        #paymentMethodModal.big-modal .modal-dialog {
            max-width: 1250px
        }
    }

    @media (min-width: 1400px) {
        #paymentMethodModal .col-xxl-3 {
            width:20%
        }
    }

    .payment-method-item {
        background-color: var(--bg-primary);
        padding: 20px
    }

    .payment-method-item-title {
        border-radius: 60px;
        padding: 8px 20px;
        min-height: 30px
    }

    .payment-method-img {
        margin-top: 30px;
        height: 70px;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .payment-method-item .theme-btn-outline {
        padding: 9px 20px!important
    }

    .dashboard-topic-content {
        height: 69vh;
        overflow-x: hidden
    }

    .topic-content-item {
        border: 1px solid rgba(0,0,0,.15)
    }

    .topic-content-item-icon {
        height: 52px;
        width: 52px;
        font-size: 20px;
        background-color: var(--bg-icon)
    }

    .dropdown-menuli.selected {
        background: #f0f8ff;
        margin-bottom: 2px
    }

    .my-custom-select-box>.bootstrap-select>.dropdown-toggle {
        outline: 0!important;
        background: no-repeat;
        border: none
    }

    .exclamation-area {
        background: #ffc107;
        padding: 7px 20px;
        border-radius: 50px
    }

    .close.topBannerClose.ms-2 {
        position: absolute;
        right: 6px;
        top: 25%
    }

    @media (min-width: 68px) and (max-width:768.98px) {
        .exclamation-btu {
            display:block
        }

        .exclamation-area {
            display: none;
            width: 100%
        }

        .close.topBannerClose {
            display: none
        }

        .exclamation {
            width: 100%;
            justify-content: end
        }

        .clickOption.exclamation {
            position: absolute;
            top: 10px;
            z-index: 9;
            width: 100%;
            justify-content: center
        }
    }

    .has-search .form-control-feedback {
        position: absolute;
        z-index: 2;
        display: block;
        line-height: 2.95rem;
        text-align: center;
        pointer-events: none;
        color: #aaa;
        padding-left: 14px;
        padding-top: 3px
    }

    @media screen and (min-width: 768px) and (max-width:1199px) {
        .tenantReportDataTable-search #tenantReportDataTable_filter {
            text-align:left
        }
    }

    .bg-button-primary-color {
        background-color: #3686fc!important
    }

    .text-button-primary-color {
        color: #3686fc!important
    }

    .payNowMaxWidth {
        max-width: 630px
    }

    .g-1 {
        gap: 1px!important
    }

    .g-2 {
        gap: 2px!important
    }

    .g-3 {
        gap: 3px!important
    }

    .g-4 {
        gap: 4px!important
    }

    .g-5 {
        gap: 5px!important
    }

    .g-6 {
        gap: 6px!important
    }

    .g-7 {
        gap: 7px!important
    }

    .g-8 {
        gap: 8px!important
    }

    .g-9 {
        gap: 9px!important
    }

    .g-10 {
        gap: 10px!important
    }

    .g-11 {
        gap: 11px!important
    }

    .g-12 {
        gap: 12px!important
    }

    .g-13 {
        gap: 13px!important
    }

    .g-14 {
        gap: 14px!important
    }

    .g-15 {
        gap: 15px!important
    }

    .g-16 {
        gap: 16px!important
    }

    .g-17 {
        gap: 17px!important
    }

    .g-18 {
        gap: 18px!important
    }

    .g-19 {
        gap: 19px!important
    }

    .g-20 {
        gap: 20px!important
    }

    .g-21 {
        gap: 21px!important
    }

    .g-22 {
        gap: 22px!important
    }

    .g-23 {
        gap: 23px!important
    }

    .g-24 {
        gap: 24px!important
    }

    .g-25 {
        gap: 25px!important
    }

    .g-26 {
        gap: 26px!important
    }

    .g-27 {
        gap: 27px!important
    }

    .g-28 {
        gap: 28px!important
    }

    .g-29 {
        gap: 29px!important
    }

    .g-30 {
        gap: 30px!important
    }

    .rg-1 {
        row-gap: 1px!important
    }

    .rg-2 {
        row-gap: 2px!important
    }

    .rg-3 {
        row-gap: 3px!important
    }

    .rg-4 {
        row-gap: 4px!important
    }

    .rg-5 {
        row-gap: 5px!important
    }

    .rg-6 {
        row-gap: 6px!important
    }

    .rg-7 {
        row-gap: 7px!important
    }

    .rg-8 {
        row-gap: 8px!important
    }

    .rg-9 {
        row-gap: 9px!important
    }

    .rg-10 {
        row-gap: 10px!important
    }

    .rg-11 {
        row-gap: 11px!important
    }

    .rg-12 {
        row-gap: 12px!important
    }

    .rg-13 {
        row-gap: 13px!important
    }

    .rg-14 {
        row-gap: 14px!important
    }

    .rg-15 {
        row-gap: 15px!important
    }

    .rg-16 {
        row-gap: 16px!important
    }

    .rg-17 {
        row-gap: 17px!important
    }

    .rg-18 {
        row-gap: 18px!important
    }

    .rg-19 {
        row-gap: 19px!important
    }

    .rg-20 {
        row-gap: 20px!important
    }

    .rg-21 {
        row-gap: 21px!important
    }

    .rg-22 {
        row-gap: 22px!important
    }

    .rg-23 {
        row-gap: 23px!important
    }

    .rg-24 {
        row-gap: 24px!important
    }

    .rg-25 {
        row-gap: 25px!important
    }

    .rg-26 {
        row-gap: 26px!important
    }

    .rg-27 {
        row-gap: 27px!important
    }

    .rg-28 {
        row-gap: 28px!important
    }

    .rg-29 {
        row-gap: 29px!important
    }

    .rg-30 {
        row-gap: 30px!important
    }

    .content-chat {
        display: flex;
        gap: 30px
    }

    .content-chat .content-chat-user {
        background-color: #fff;
        border: 1px solid #eaeaea;
        border-radius: 20px;
        max-width: 350px;
        width: 100%;
        padding: 25px 0 10px
    }

    @media screen and (max-width: 991px) {
        .account-settings-menu {
            column-gap:15px
        }

        .content-chat {
            gap: 10px
        }

        .content-chat .content-chat-user {
            max-width: 300px;
            width: 100%
        }
    }

    .content-chat .content-chat-user .head-chat {
        padding: 0 24px 12px
    }

    .content-chat .content-chat-user .head-chat .title {
        font-size: 24px;
        font-weight: 600;
        line-height: 30px;
        color: #160e4d
    }

    .content-chat .content-chat-user .search-two {
        margin: 0 24px 10px;
        max-width: 100%
    }

    .content-chat .content-chat-user .list-search-user-chat {
        max-height: 620px;
        overflow-y: auto;
        scrollbar-gutter: stable both-edges;
        scrollbar-width: thin
    }

    .content-chat .content-chat-user .list-search-user-chat::-webkit-scrollbar {
        width: 6px
    }

    .content-chat .content-chat-user .list-search-user-chat::-webkit-scrollbar-track {
        background: #efefef;
        border-radius: 50px
    }

    .content-chat .content-chat-user .list-search-user-chat::-webkit-scrollbar-thumb {
        background: #dadada;
        border-radius: 50px
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat {
        display: flex;
        gap: 14px;
        padding: 12px 24px;
        cursor: pointer;
        transition: .3s
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat.active,.content-chat .content-chat-user .list-search-user-chat .user-chat:hover {
        background-color: #0063e6
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-img {
        position: relative;
        width: 50px;
        height: 50px;
        border-radius: 50%
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-imgimg,.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-img img {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        object-fit: cover
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-img .online,.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-img .online {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 14px;
        height: 14px;
        background-color: #fbbf37;
        border-radius: 50%;
        border: 2px solid #fff
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-img .offline,.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-img .offline {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 14px;
        height: 14px;
        background-color: #737c91;
        border-radius: 50%;
        border: 2px solid #fff
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-text-time {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-grow: 1;
        gap: 5px
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-text-time .time {
        font-size: 12px;
        font-weight: 400;
        line-height: 17px;
        color: #737c91;
        padding-bottom: 6px;
        transition: .3s
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat.active .user-chat-textsmall,.content-chat .content-chat-user .list-search-user-chat .user-chat.active .user-chat-text-time .time,.content-chat .content-chat-user .list-search-user-chat .user-chat:hover .user-chat-text small,.content-chat .content-chat-user .list-search-user-chat .user-chat: hover .user-chat-text-time .time {
        color: rgba(255,255,255,.7)
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-text-time .notify {
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background-color: #3686fc;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 11px;
        font-weight: 400;
        line-height: 13px;
        color: #fff;
        margin-left: auto!important
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-text .name {
        font-size: 14px;
        font-weight: 500;
        line-height: 24px;
        color: #160e4d;
        transition: .3s
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat.active .user-chat-text .name,.content-chat .content-chat-user .list-search-user-chat .user-chat:hover .user-chat-text .name {
        color: #fff
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-textsmall {
        font-size: 14px;
        font-weight: 400;
        line-height: 17px;
        color: #737c91;
        transition: .3s
    }

    .content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-time {
        flex-shrink: 0
    }

    .content-chat .content-chat-message-user-wrap {
        max-width: 100%;
        width: 100%;
        border: 1px solid #eaeaea;
        border-radius: 20px;
        overflow: hidden
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user {
        display: none;
        background-color: #fff;
        border-bottom: none;
        overflow: hidden
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 30px 30px 21px;
        background-color: #fff;
        border-bottom: 1px solid #eaeaea
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-text .title {
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
        color: #160e4d
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-text .status {
        font-size: 14px;
        font-weight: 400;
        line-height: 17px;
        color: #737c91
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user {
        display: flex;
        flex-direction: column;
        gap: 30px;
        box-sizing: border-box;
        padding: 15px 30px;
        height: 580px;
        overflow-y: auto;
        scrollbar-gutter: stable both-edges;
        scrollbar-width: thin;
        background-color: #fff
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user::-webkit-scrollbar {
        width: 6px
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user::-webkit-scrollbar-track {
        background: #efefef;
        border-radius: 50px
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user::-webkit-scrollbar-thumb {
        background: #dadada;
        border-radius: 50px
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left {
        display: flex;
        flex-direction: column;
        gap: 4px
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text {
        position: relative;
        max-width: calc(toRem(508) + 12px + 35px);
        display: flex;
        align-items: center;
        gap: 12px
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .text {
        padding: 6px 12px;
        background-color: #f9f9f9;
        border: 1px solid #eaeaea;
        border-radius: 15px;
        color: #160e4d
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .text>p,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text .text>p {
        padding-bottom: 8px
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .text .time-read {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 4px
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .text .time-read .time,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text .text .time-read .time {
        font-size: 13px;
        font-weight: 400;
        line-height: 16px;
        color: #160e4d
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .share-icon,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .share-icon {
        opacity: 0;
        visibility: hidden;
        flex-shrink: 0;
        width: 35px;
        height: 35px;
        border: none;
        border-radius: 50%;
        padding: 0;
        background-color: #eaeaea;
        display: flex;
        justify-content: center;
        align-items: center
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .share-iconimg,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .share-icon img {
        max-width: 15px
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text:hover .share-icon,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text:hover .share-icon {
        opacity: 1;
        visibility: visible
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right {
        display: flex;
        flex-direction: column;
        align-items: end;
        gap: 4px
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text {
        position: relative;
        max-width: calc(toRem(508) + toRem(12) + toRem(35));
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        gap: 12px
    }

    @media screen and (max-width: 575px) {
        #progressbar li:after {
            display:none
        }

        .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text {
            gap: 5px
        }
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text .text {
        padding: 6px 12px;
        background-color: #cdffc5;
        border: 1px solid #cdffc5;
        border-radius: 15px;
        color: #160e4d
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text .text .time-read {
        display: flex;
        justify-content: flex-end;
        align-items: center;
        gap: 4px
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-user {
        background-color: #fff;
        border-top: 1px solid #eaeaea;
        padding: 15px 30px 30px;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        gap: 10px
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-user .message-user-send {
        flex: 1 1 auto;
        position: relative;
        width: 100%
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-user .message-user-sendinput {
        box-sizing: border-box;
        width: 100%;
        padding: 13px 20px;
        border-radius: 50px;
        outline: 0;
        border: none;
        background-color: #eaeaea
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-userbutton {
        flex: 0 0 auto;
        border: none;
        padding: 0;
        background-color: transparent;
        display: flex;
        justify-content: center;
        align-items: center
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-userbutton.emoji-btn,.content-chat .content-chat-message-user-wrap .footer-chat-message-user button.send-btn {
        flex: 0 0 auto;
        width: 50px;
        height: 50px;
        border-radius: 50%;
        border: none;
        background-color: #eaeaea;
        cursor: pointer
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-userbutton.emoji-btn:hover,.content-chat .content-chat-message-user-wrap .footer-chat-message-user button.send-btn: hover {
        background-color: #eaeaea
    }

    @media screen and (max-width: 767px) {
        .content-chat {
            flex-direction:column
        }

        .content-chat .content-chat-user {
            padding: 10px 0;
            max-width: 100%
        }

        .content-chat .content-chat-user .head-chat,.content-chat .content-chat-user .search-two {
            display: none
        }

        .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user,.content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user {
            padding: 15px
        }

        .content-chat .content-chat-message-user-wrap .footer-chat-message-user .footer-inputs {
            position: relative;
            gap: 0;
            height: 50px;
            background-color: #f4f4ef;
            border-radius: 50px
        }

        .content-chat .content-chat-message-user-wrap .footer-chat-message-user {
            padding: 15px 15px 30px
        }

        .content-chat .content-chat-message-user-wrap .footer-chat-message-user .message-user-send {
            order: 1
        }

        .content-chat .content-chat-message-user-wrap .footer-chat-message-user .message-user-send input {
            padding: 13px 45px
        }

        .content-chat .content-chat-message-user-wrap .footer-chat-message-user button.emoji-btn,.content-chat .content-chat-message-user-wrap .footer-chat-message-user button.send-btn {
            z-index: 1;
            order: 2;
            width: 31px;
            height: 31px;
            background-color: #3686fc;
            position: absolute;
            top: 50%;
            right: 13px;
            transform: translateY(-50%)
        }

        .content-chat .content-chat-message-user-wrap .footer-chat-message-user button.emoji-btn img,.content-chat .content-chat-message-user-wrap .footer-chat-message-user button.send-btn img {
            max-width: 13px
        }
    }

    img {
        max-width: 100%
    }
}

.page-content-wrapper {
    min-height: calc(100vh - 100px)
}

.header-item {
    height: 80px;
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
    color: var(--heading-color);
    border: 0;
    border-radius: 0;
    padding: .47rem .55rem;
    position: relative;
    display: inline-flex;
    align-items: center
}

.arrow-down,.noti-icon .noti-dot,.property-item-title a,.user-dropdown .dropdown-item i {
    display: inline-block
}

.header-profile-user {
    background-color: #f1f5f7
}

.noti-icon i {
    font-size: 16px;
    color: #abb1bf
}

.noti-icon .noti-dot {
    position: absolute;
    height: 6px;
    width: 6px;
    background-color: var(--red-color);
    border-radius: 50%;
    top: 30px;
    right: 7px
}

.notification-item .d-flex {
    padding: .75rem 1rem
}

.avatar-xs {
    height: 1.5rem;
    width: 1.5rem
}

.avatar-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--primary-color);
    color: var(--white-color);
    border: 1px solid var(--white-color);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-weight: 500;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%
}

.dropdown-item:focus,.dropdown-item:hover {
    color: var(--heading-color)!important;
    background-color: #f8f9fa
}

.dropdown-divider {
    border-top: 1px solid var(--border-color)
}

.dropdown-menu {
    -webkit-box-shadow: 0 5px 12px rgb(0 0 0 / 10%);
    box-shadow: 0 5px 12px rgb(0 0 0 / 10%);
    -webkit-animation-name: DropDownSlide;
    animation-name: DropDownSlide;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    border: 1px solid transparent;
    font-size: 14px
}

.dropdown-menu.show {
    top: 100%!important
}

.dropdown-menu-end[style] {
    left: auto!important;
    right: 0!important
}

.dropdown-menu[data-popper-placement^=left],.dropdown-menu[data-popper-placement^=right],.dropdown-menu[data-popper-placement^=top] {
    top: auto!important;
    -webkit-animation: none!important;
    animation: none!important
}

@-webkit-keyframes DropDownSlide {
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    0% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px)
    }
}

@keyframes DropDownSlide {
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    0% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px)
    }
}

@media (min-width: 600px) {
    .dropdown-menu-lg {
        width:320px
    }
}

.dropdown-toggle {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-end
}

@media (max-width: 600px) {
    .navbar-header .dropdown {
        position:static
    }

    .navbar-header .dropdown .dropdown-menu {
        left: 10px!important;
        right: 10px!important
    }
}

@media (max-width: 380px) {
    .navbar-brand-box {
        display:none
    }
}

.page-title-box .breadcrumb {
    background-color: transparent;
    padding: 0
}

.breadcrumb-item+.breadcrumb-item::before {
    float: left;
    padding-right: .5rem;
    color: #74788d;
    content: var(--bs-breadcrumb-divider, "\f0142");
    font-family: "IBM Plex Sans Arabic"
}

.metismenu {
    margin: 0;
    background: #fff;
    border-radius: 20px;
    padding-top: 4px
}

.metismenu li {
    display: block;
    width: 100%
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user.active,.metismenu .mm-collapse.mm-show,.navbar-brand-box .logo-light,.vertical-collpsed .logo span.logo-sm {
    display: block
}

.metismenu .mm-collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition-duration: .35s;
    transition-duration: .35s;
    -webkit-transition-property: height,visibility;
    transition-property: height,visibility
}

.vertical-menu {
    width: 260px;
    z-index: 1003;
    background: var(--bg-light);
    bottom: 0;
    margin-top: -28px;
    position: fixed;
    top: 100px
}

.navbar-brand-box {
    background-color: var(--bg-light);
    transition: .2s
}

.main-content {
    margin-left: 240px;
    overflow: hidden
}

.main-content .content {
    padding: 0 15px 10px;
    margin-top: 70px
}

#sidebar-menu {
    padding: 10px
}

#sidebar-menu .mm-active>.has-arrow:after {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

#sidebar-menu .has-arrow:after {
    content: "\2b";
    font-family: "IBM Plex Sans Arabic";
    display: block;
    float: right;
    -webkit-transition: -webkit-transform .2s;
    transition: transform .2s;
    transition: transform .2s,-webkit-transform .2s;
    font-size: 1rem
}

#sidebar-menu ul li a {
    display: block;
    padding: .3rem;
    position: relative;
    font-size: 14px;
    -webkit-transition: .4s;
    transition: .4s;
    font-weight: 600;
    border-radius: 16px;
    margin: 5px
}

#sidebar-menu ul li a i {
    display: inline-flex;
    min-width: 2.9rem;
    height: 2.9rem;
    vertical-align: middle;
    -webkit-transition: .4s;
    transition: .4s;
    justify-content: center;
    align-items: center;
    padding: 0;
    border-radius: 14px;
    MARGIN-LEFT: 8PX
}

#sidebar-menu ul li .badge {
    margin-top: 4px;
    font-size: 13px
}

#sidebar-menu ul li ul.sub-menu li a {
    padding: .4rem 1.5rem .4rem 3.2rem;
    font-size: 13px
}

#sidebar-menu ul li ul.sub-menu li a::before {
    content: "";
    height: 6px;
    width: 6px;
    background-color: var(--body-font-color);
    display: inline-block;
    border-radius: 50%;
    margin-right: 5px
}

#sidebar-menu ul li ul.sub-menu li ul.sub-menu li a {
    padding: .4rem 1.5rem .4rem 4.2rem;
    font-size: 13.5px
}

.mm-active .active {
    color: #025457!important;
    background: #02545717
}

.mm-active .active i {
    color: #60ccc9!important;
    background-color: rgb(2 84 87)
}

.mm-active .active::before {
    background-color: var(--primary-color)!important
}

@media (max-width: 992px) {
    .vertical-menu {
        display:none
    }

    .main-content {
        margin-left: 0!important
    }

    body.sidebar-enable .vertical-menu {
        display: block
    }
}

.vertical-collpsed .main-content {
    margin-left: 70px
}

.vertical-collpsed .vertical-menu {
    position: absolute;
    width: 80px!important;
    z-index: 5
}

.vertical-collpsed .vertical-menu .simplebar-content-wrapper,.vertical-collpsed .vertical-menu .simplebar-mask {
    overflow: visible!important
}

.vertical-collpsed .vertical-menu #sidebar-menu .badge,.vertical-collpsed .vertical-menu #sidebar-menu .collapse.in,.vertical-collpsed .vertical-menu #sidebar-menu .menu-title,.vertical-collpsed .vertical-menu .simplebar-scrollbar {
    display: none!important
}

.vertical-collpsed .vertical-menu .simplebar-offset {
    bottom: 0!important
}

.vertical-collpsed .vertical-menu #sidebar-menu .nav.collapse {
    height: inherit!important
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul>li {
    position: relative;
    white-space: nowrap
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a {
    min-height: 55px;
    -webkit-transition: none;
    transition: none;
    padding: 0
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul>li>a span {
    display: none;
    padding-left: 25px
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>a {
    position: relative;
    width: calc(190px + 70px);
    background-color: var(--bg-light);
    -webkit-transition: none;
    transition: none
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>ul {
    display: block;
    left: 70px;
    position: absolute;
    width: 190px;
    height: auto!important;
    -webkit-box-shadow: 3px 5px 12px -4px rgba(18,19,21,.1);
    box-shadow: 3px 5px 12px -4px rgba(18,19,21,.1)
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>ul ul {
    -webkit-box-shadow: 3px 5px 12px -4px rgba(18,19,21,.1);
    box-shadow: 3px 5px 12px -4px rgba(18,19,21,.1)
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul>li:hover>ul a {
    padding: 0 20px 11px;
    color: var(--body-font-color);
    -webkit-box-shadow: none;
    box-shadow: none;
    position: relative;
    width: 190px;
    z-index: 6;
    color: var(--body-font-color)
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul ul {
    padding: 0 0 11px;
    z-index: 9999;
    display: none;
    background-color: var(--bg-light)
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul ul li:hover>ul {
    display: block;
    left: 190px;
    height: auto!important;
    margin-top: -36px;
    position: absolute;
    width: 190px
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul ul li>a span.pull-right {
    position: absolute;
    right: 20px;
    top: 12px;
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg)
}

.vertical-collpsed .vertical-menu #sidebar-menu>ul ul li.active a {
    color: #f8f9fa
}

.arrow-down:after {
    border-color: initial;
    border-style: solid;
    border-width: 0 0 1px 1px;
    content: "";
    height: .4em;
    display: inline-block;
    right: 5px;
    top: 50%;
    margin-left: 10px;
    -webkit-transform: rotate(-45deg) translateY(-50%);
    transform: rotate(-45deg) translateY(-50%);
    -webkit-transform-origin: top;
    transform-origin: top;
    -webkit-transition: .3s ease-out;
    transition: .3s ease-out;
    width: .4em
}

[data-simplebar] {
    position: relative;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-line-pack: start;
    align-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.simplebar-mask,.simplebar-offset {
    position: absolute;
    padding: 0;
    margin: 0;
    bottom: 0;
    top: 0
}

.simplebar-wrapper {
    overflow: hidden;
    width: inherit;
    height: inherit;
    max-width: inherit;
    max-height: 300px
}

.simplebar-mask {
    direction: inherit;
    overflow: hidden;
    left: 0;
    right: 0;
    width: auto!important;
    height: auto!important;
    z-index: 0
}

.simplebar-offset {
    direction: inherit!important;
    -webkit-box-sizing: inherit!important;
    box-sizing: inherit!important;
    resize: none!important;
    left: 0!important;
    right: 0!important;
    -webkit-overflow-scrolling: touch
}

.simplebar-content-wrapper {
    direction: inherit;
    -webkit-box-sizing: border-box!important;
    box-sizing: border-box!important;
    position: relative;
    display: block;
    height: 100%;
    width: auto;
    visibility: visible;
    overflow: auto;
    max-width: 100%;
    max-height: 100%;
    scrollbar-width: none;
    padding: 0!important
}

.simplebar-content-wrapper::-webkit-scrollbar,.simplebar-hide-scrollbar::-webkit-scrollbar {
    display: none
}

.simplebar-content:after,.simplebar-content:before {
    content: " ";
    display: table
}

.simplebar-placeholder {
    max-height: 100%;
    max-width: 100%;
    width: 100%;
    pointer-events: none
}

.simplebar-height-auto-observer-wrapper {
    -webkit-box-sizing: inherit!important;
    box-sizing: inherit!important;
    height: 100%;
    width: 100%;
    max-width: 1px;
    position: relative;
    float: left;
    max-height: 1px;
    overflow: hidden;
    z-index: -1;
    padding: 0;
    margin: 0;
    pointer-events: none;
    -webkit-box-flex: inherit;
    -ms-flex-positive: inherit;
    flex-grow: inherit;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -ms-flex-preferred-size: 0;
    flex-basis: 0
}

.simplebar-height-auto-observer {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
    display: block;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    height: 1000%;
    width: 1000%;
    min-height: 1px;
    min-width: 1px;
    overflow: hidden;
    pointer-events: none;
    z-index: -1
}

.simplebar-track {
    z-index: 1;
    position: absolute;
    right: 0;
    bottom: 0;
    pointer-events: none;
    overflow: hidden
}

[data-simplebar].simplebar-dragging .simplebar-content {
    pointer-events: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-select: none
}

[data-simplebar].simplebar-dragging .simplebar-track {
    pointer-events: all
}

.simplebar-scrollbar {
    position: absolute;
    right: 2px;
    width: 6px;
    min-height: 10px
}

.simplebar-scrollbar:before {
    position: absolute;
    content: "";
    background: #a2adb7;
    border-radius: 7px;
    left: 0;
    right: 0;
    opacity: 0;
    -webkit-transition: opacity .2s linear;
    transition: opacity .2s linear
}

.simplebar-scrollbar.simplebar-visible:before {
    opacity: .5;
    -webkit-transition: opacity linear;
    transition: opacity linear
}

.simplebar-track.simplebar-vertical {
    top: 0;
    width: 11px
}

.simplebar-track.simplebar-vertical .simplebar-scrollbar:before {
    top: 2px;
    bottom: 2px
}

.simplebar-track.simplebar-horizontal {
    left: 0;
    height: 11px
}

.simplebar-track.simplebar-horizontal .simplebar-scrollbar:before {
    height: 100%;
    left: 2px;
    right: 2px
}

.simplebar-track.simplebar-horizontal .simplebar-scrollbar {
    right: auto;
    left: 0;
    top: 2px;
    height: 7px;
    min-height: 0;
    min-width: 10px;
    width: auto
}

[data-simplebar-direction=rtl] .simplebar-track.simplebar-vertical {
    right: auto;
    left: 0
}

.hs-dummy-scrollbar-size {
    direction: rtl;
    position: fixed;
    opacity: 0;
    visibility: hidden;
    height: 500px;
    width: 500px;
    overflow-y: hidden;
    overflow-x: scroll
}

.simplebar-hide-scrollbar {
    position: fixed;
    left: 0;
    visibility: hidden;
    overflow-y: scroll;
    scrollbar-width: none
}

.dashboard-feature-item-icon-wrap {
    box-shadow: 0 4px 12px rgba(247,247,247,.6);
    width: 35px;
    height: 35px
}

.net-revenue-right .icon-box {
    height: 16px;
    width: 16px;
    padding: 2px;
    margin-bottom: 1px
}

.sign-up-page {
    overflow-x: hidden
}

.sign-up-left-content {
    background-color: var(--primary-color);
    padding: 30px 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden
}

.sign-up-left-content::before {
    content: "";
    position: absolute;
    width: 709px;
    height: 1068px;
    right: 86px;
    top: 65px;
    background: linear-gradient(166.46deg,rgba(255,255,255,.05) 15.3%,rgba(255,255,255,0) 84.41%);
    transform: rotate(61deg)
}

.account-settings-leftside,.account-settings-rightside,.sign-up-left-content,.sign-up-right-content {
    min-height: 100vh;
    height: 100%
}

.sign-up-right-content {
    align-items: center;
    display: flex
}

.sign-up-right-content form {
    width: 479px;
    margin: 0 auto
}

.sign-up-left-content p {
    color: var(--border-color)
}

.sign-up-right-content .pass-icon {
    font-size: 13px;
    float: right;
    top: 18px;
    position: absolute;
    right: 10px
}

.sign-in-floating-1 {
    top: 30px;
    left: 30px
}

.sign-in-floating-2 {
    bottom: 30px;
    right: 30px
}

.empty-properties-box {
    padding: 25% 0
}

.page-inner-search {
    width: 270px;
    max-width: 100%
}

.page-inner-search .form-control {
    height: 50px;
    padding-left: 40px;
    padding-right: 20px
}

.page-inner-search span {
    position: absolute;
    z-index: 10;
    font-size: 16px;
    line-height: 50px;
    left: 13px;
    top: 0
}

.information-details-img img,.property-item-img img {
    min-height: 240px;
    height: 240px
}

.property-info-item {
    padding: 0 4px;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    width: auto;
    flex: auto
}

.property-item-info .property-info-item:nth-of-type(odd) {
    min-width: 80px
}

.property-item-info .property-info-item:nth-of-type(2n+3) {
    min-width: 120px
}

.property-item-dropdown {
    top: 0;
    right: -3px
}

.property-item-img-wrap {
    background: var(--primary-color)
}

.property-item-img {
    transition: opacity .35s,transform .35s;
    transform: scale3d(1.05,1.05,1)
}

.property-item-img-wrap::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,.5);
    content: "";
    transition: transform .6s;
    transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0)
}

.property-item-img-wrap:hover .property-item-img {
    opacity: .6;
    transform: scale3d(1,1,1)
}

.property-item-img-wrap:hover::before {
    transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,105%,0)
}

.property-details-img img {
    height: 490px
}

.vbox-container img {
    border-radius: 4px;
    min-height: 400px
}

.dropzone,.show-uploaded-img {
    min-height: 120px
}

.gallery-slider-carousel.owl-carousel .owl-nav .owl-next,.gallery-slider-carousel.owl-carousel .owl-nav .owl-prev {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    font-size: 20px;
    box-shadow: 0 8px 61px rgba(89,145,255,.19);
    background-color: var(--white-color);
    color: var(--body-font-color);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 7px;
    position: absolute;
    border: 1px solid var(--border-color);
    top: 50%;
    transform: translateY(-50%)
}

#msform .action-button-previous,.form-stepper-nav-icon {
    border: 1px solid var(--border-color);
    background-color: var(--white-color)
}

.gallery-slider-carousel.owl-theme .owl-nav {
    width: 100%;
    margin-top: 0
}

.gallery-slider-carousel.owl-carousel .owl-nav .owl-prev {
    left: 0
}

.gallery-slider-carousel.owl-carousel .owl-nav .owl-next {
    right: 0
}

#msform fieldset:not(:first-of-type),.chat-item .dropdown-toggle::after,.chat-sidebar-offcanvas .offcanvas-header,.exclamation-btu,.message-chat-top-right .dropdown-toggle::after,.profile-user .app-favicon-profile-img-file-input,.profile-user .app-logo-profile-img-file-input,.profile-user .app-logo-white-profile-img-file-input,.profile-user .app-preloader-profile-img-file-input,.profile-user .default-profile-img-file-input,.profile-user .language-icon-img-file-input,.profile-user .language-icon-img-file-input-edit,.profile-user .maintainer-profile-img-file-input,.profile-user .profile-img-file-input,.profile-user .signin-profile-img-file-input,.ui-datepicker-div .ui-datepicker-header a>span {
    display: none
}

#msform .action-button-previous {
    color: var(--heading-color);
    margin-right: 15px
}

#msform .action-button-previous:focus,#msform .action-button-previous:hover {
    background-color: var(--off-white)!important;
    color: var(--heading-color)!important
}

.card {
    z-index: 0;
    border: none;
    position: relative
}

#progressbar {
    display: inline-flex;
    overflow-y: auto;
    -ms-overflow-style: none;
    scrollbar-width: none;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
    row-gap: 15px;
    scrollbar-width: thin;
    scrollbar-color: #a2adb7 #fff
}

#progressbar::-webkit-scrollbar {
    width: 4px;
    height: 6px
}

#progressbar::-webkit-scrollbar-track {
    background-color: #fff
}

#progressbar::-webkit-scrollbar-thumb {
    background-color: #a2adb7
}

#progressbar::-webkit-scrollbar-thumb,#progressbar::-webkit-scrollbar-track {
    border-radius: 5px
}

#progressbar li {
    min-width: 20%;
    position: relative;
    color: var(--body-font-color);
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
    display: flex;
    flex-direction: column
}

.form-stepper-nav-icon {
    width: 50px;
    height: 50px;
    line-height: 45px;
    display: block;
    font-size: 20px;
    border-radius: 50%;
    margin: 0 auto 10px;
    padding: 2px;
    z-index: 9;
    position: relative
}

#progressbar li:after {
    content: '';
    width: 22%;
    height: 0;
    background: 0 0;
    position: absolute;
    top: 25px;
    border-bottom: 1.5px dashed #a5abba;
    right: -12%
}

#progressbar li.active:after,#progressbar li.active:before {
    border-bottom: 1.5px dashed var(--primary-color)
}

#progressbar li:last-child::after {
    border-bottom: none
}

#msform textarea {
    height: 220px
}

.add-field.theme-link {
    text-align: left
}

.select-property-nav-tabs .nav-item.show .nav-link,.select-property-nav-tabs .nav-link.active,.select-property-nav-tabs .nav-link:focus,.select-property-nav-tabs .nav-link:hover {
    border-color: transparent
}

.select-property-nav-text .select-property-nav-text-box {
    background-color: transparent;
    border: 1px solid var(--border-color);
    height: 24px;
    width: 24px;
    display: inline-flex;
    border-radius: 4px
}

.nav-tabs .nav-item.show .nav-link .select-property-nav-text-box::after,.nav-tabs .nav-link.active .select-property-nav-text-box::after {
    content: '';
    display: block;
    position: absolute;
    top: 5px;
    left: 10px;
    width: 6px;
    height: 10px;
    border: solid var(--primary-color);
    border-width: 0 1px 1px 0;
    transform: rotate(45deg)
}

input[type=date]::-webkit-calendar-picker-indicator,input[type=date]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    color: var(--border-color)
}

.ui-datepicker {
    width: auto
}

.custom-datepicker-inner i {
    position: absolute;
    right: 15px;
    top: 12px;
    font-size: 18px;
    color: var(--body-font-color)
}

.ui-widget-header .ui-icon {
    background-image: none
}

.ui-datepicker-div label {
    font-size: .75rem;
    display: block;
    margin-bottom: .5rem;
    color: #b0bec5;
    border: 1px solid #eceff1;
    padding: .5rem .75rem;
    border-radius: .5rem
}

.ui-datepicker-div input {
    font-family: 'IBM Plex Sans Arabic',sans-serif;
    display: block;
    border: 1px solid transparent;
    border-radius: .25rem;
    line-height: 1.5rem;
    padding: 0;
    font-size: 1rem;
    color: #607d8b;
    width: 100%;
    margin-top: .5rem
}

.ui-datepicker-div #ui-datepicker-div {
    display: none;
    background-color: var(--white-color);
    box-shadow: 0 .125rem .5rem rgba(0,0,0,.1);
    margin-top: .25rem;
    border-radius: .5rem;
    padding: .5rem
}

.ui-datepicker-div table {
    border-collapse: collapse;
    border-spacing: 0
}

.ui-datepicker-div .ui-datepicker-calendar thead th {
    padding: .25rem 0;
    text-align: center;
    font-size: .75rem;
    font-weight: 400;
    color: #78909c
}

.ui-datepicker-div .ui-datepicker-calendar tbody td {
    width: 2.5rem;
    text-align: center;
    padding: 0
}

.ui-datepicker-div .ui-datepicker-calendar tbody td a {
    display: block;
    border-radius: .25rem;
    line-height: 2rem;
    transition: .3s;
    color: #546e7a;
    font-size: .875rem;
    text-decoration: none
}

.ui-datepicker-div .ui-datepicker-calendar tbody td a:hover {
    background-color: #e0f2f1
}

.ui-datepicker-div .ui-datepicker-calendar tbody td a.ui-state-active {
    background-color: #009688;
    color: var(--white-color)
}

.ui-datepicker-div .ui-datepicker-header a.ui-corner-all {
    cursor: pointer;
    position: absolute;
    top: 0;
    width: 2rem;
    height: 2rem;
    margin: .5rem;
    border-radius: .25rem;
    transition: .3s
}

.ui-datepicker-div .ui-datepicker-header a.ui-corner-all:hover {
    background-color: #eceff1
}

#ui-datepicker-div .ui-datepicker-header a.ui-datepicker-prev,.ui-datepicker-div .ui-datepicker-header a.ui-datepicker-prev {
    left: 0;
    background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48cGF0aCBmaWxsPSIjNDI0NzcwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjI4OCA2LjI5NkwzLjIwMiAyLjIxYS43MS43MSAwIDAgMSAuMDA3LS45OTljLjI4LS4yOC43MjUtLjI4Ljk5OS0uMDA3TDguODAzIDUuOGEuNjk1LjY5NSAwIDAgMSAuMjAyLjQ5Ni42OTUuNjk1IDAgMCAxLS4yMDIuNDk3bC00LjU5NSA0LjU5NWEuNzA0LjcwNCAwIDAgMS0xLS4wMDcuNzEuNzEgMCAwIDEtLjAwNi0uOTk5bDQuMDg2LTQuMDg2eiIvPjwvc3ZnPg==") 50%/.5rem no-repeat;
    transform: rotate(180deg)
}

.ui-datepicker-div .ui-datepicker-header a.ui-datepicker-next {
    right: 0;
    background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48cGF0aCBmaWxsPSIjNDI0NzcwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjI4OCA2LjI5NkwzLjIwMiAyLjIxYS43MS43MSAwIDAgMSAuMDA3LS45OTljLjI4LS4yOC43MjUtLjI4Ljk5OS0uMDA3TDguODAzIDUuOGEuNjk1LjY5NSAwIDAgMSAuMjAyLjQ5Ni42OTUuNjk1IDAgMCAxLS4yMDIuNDk3bC00LjU5NSA0LjU5NWEuNzA0LjcwNCAwIDAgMS0xLS4wMDcuNzEuNzEgMCAwIDEtLjAwNi0uOTk5bDQuMDg2LTQuMDg2eiIvPjwvc3ZnPg==') 50%/10px no-repeat
}

.ui-datepicker-div .ui-datepicker-title {
    text-align: center;
    line-height: 2rem;
    margin-bottom: .25rem;
    font-size: .875rem;
    font-weight: 500;
    padding-bottom: .25rem
}

.ui-datepicker-div .ui-datepicker-week-col {
    color: #78909c;
    font-weight: 400;
    font-size: .75rem
}

.ui-datepicker-calendar tbody tr,.ui-datepicker-calendar thead tr {
    display: flex!important
}

.ui-datepicker-calendar thead tr th {
    width: 37px!important;
    min-width: 37px!important;
    font-weight: 400
}

.ui-datepicker-calendar tbody tr td,.ui-datepicker-next.ui-corner-all {
    width: 37px!important
}

#ui-datepicker-div .ui-widget-header {
    background: 0 0;
    border: none
}

#ui-datepicker-div {
    background-color: var(--white-color);
    box-shadow: 0 .125rem .5rem rgba(0,0,0,.1);
    border-radius: .5rem;
    border: 1px solid transparent
}

#ui-datepicker-div .ui-button,#ui-datepicker-div .ui-state-default,#ui-datepicker-div .ui-widget-content .ui-state-default,#ui-datepicker-div .ui-widget-header .ui-state-default {
    border: 1px solid transparent!important;
    text-align: center!important;
    border-radius: 5px!important
}

#ui-datepicker-div .ui-datepicker-header a.ui-datepicker-next,#ui-datepicker-div .ui-datepicker-header a.ui-datepicker-prev {
    border: 1px solid transparent
}

#ui-datepicker-div .ui-datepicker-header a.ui-datepicker-next {
    right: 0;
    background: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMyIgaGVpZ2h0PSIxMyIgdmlld0JveD0iMCAwIDEzIDEzIj48cGF0aCBmaWxsPSIjNDI0NzcwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGQ9Ik03LjI4OCA2LjI5NkwzLjIwMiAyLjIxYS43MS43MSAwIDAgMSAuMDA3LS45OTljLjI4LS4yOC43MjUtLjI4Ljk5OS0uMDA3TDguODAzIDUuOGEuNjk1LjY5NSAwIDAgMSAuMjAyLjQ5Ni42OTUuNjk1IDAgMCAxLS4yMDIuNDk3bC00LjU5NSA0LjU5NWEuNzA0LjcwNCAwIDAgMS0xLS4wMDcuNzEuNzEgMCAwIDEtLjAwNi0uOTk5bDQuMDg2LTQuMDg2eiIvPjwvc3ZnPg==') 50%/.5rem no-repeat
}

#ui-datepicker-div .ui-icon.ui-icon-circle-triangle-e {
    height: 37px;
    width: 37px
}

.unit-block-item-box {
    border: 1px solid var(--border-color)!important
}

.unit-block-item-box .accordion-button {
    background-color: rgba(54,134,252,.03)!important
}

.unit-block-item-box .accordion-button:focus {
    border-color: var(--border-color);
    box-shadow: none
}

.unit-block-item-box .accordion-button:not(.collapsed) {
    color: var(--primary-color);
    box-shadow: none;
    border-bottom: 1px solid var(--border-color)
}

.unit-block-item-box .accordion-button::after {
    background-image: none;
    content: "\f0140";
    font-family: "IBM Plex Sans Arabic";
    font-size: 20px
}

.unit-block-item-box .accordion-body {
    padding-bottom: 0
}

.show-map-here iframe {
    height: 253px!important;
    width: 100%!important;
    border: 0
}

.show-uploaded-img img {
    min-height: 120px;
    width: auto
}

.dropzone {
    border: 2px dashed #ced4da;
    background: #fff;
    border-radius: 4px;
    border: 2px dashed var(--border-color);
    display: inline-flex;
    align-items: center;
    width: 100%;
    height: 100%;
    padding: 10px
}

.dropzone-img-wrap {
    margin-right: 5px
}

.dropzone .dz-message {
    width: 100%;
    margin: 0
}

.dropzone-remove-icon {
    position: absolute;
    top: 8px;
    right: 8px
}

.dropzone-remove-icon button {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px
}

.dropzone-upload-sign-icon.mb-2 {
    width: 32px;
    height: 32px;
    background-color: var(--bg-light);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    margin: 0 auto
}

.tenant-img {
    height: 60px;
    width: 60px
}

.tenants-item-info {
    padding: 0 14px
}

.tenants-item-info-box {
    padding: 20px 0
}

.tenants-info-right {
    display: inline-flex;
    justify-content: flex-end;
    width: 100%;
    align-items: center
}

.tenants-property-item-list-view .property-item-img img {
    width: 340px
}

.tenants-property-item-list-view .property-item-address,.tenants-property-item-list-view .property-item-title {
    width: 75%
}

.tenants-property-item-list-view .property-item-info {
    width: 400px
}

.tenants-property-item-list-view .property-info-item-right {
    justify-content: flex-end
}

.tenants-property-item-list-view .property-info-item {
    width: 100%
}

.input-group-text-edit {
    font-size: 23px
}

.file-uplode-dropzone.dropzone {
    min-height: 200px
}

.dropzone-documents-additional-info img {
    height: 100px;
    min-width: 120px
}

.account-settings-menu-item {
    display: flex;
    align-items: center;
    position: relative;
    margin: 10px 0
}

.account-settings-menu-item .iconify,.account-settings-menu-item i {
    font-size: 20px;
    margin-right: 12px
}

.remove-tenants-item .account-settings-menu-item .iconify,.remove-tenants-item .account-settings-menu-item i {
    margin-right: 0
}

.upload-new-picture .form-control {
    padding: 10px 15px
}

.account-settings-info-item {
    padding: 10px 0
}

.tenants-details-leftsidebar-wrap {
    flex-direction: column;
    justify-content: space-between;
    height: 100%
}

.profile-user {
    position: relative;
    display: inline-block
}

.profile-user .app-favicon-profile-photo-edit,.profile-user .app-logo-profile-photo-edit,.profile-user .app-preloader-profile-photo-edit,.profile-user .default-profile-photo-edit,.profile-user .language-icon-edit,.profile-user .maintainer-profile-photo-edit,.profile-user .profile-photo-edit,.profile-user .signin-profile-photo-edit {
    position: absolute;
    right: 0;
    left: auto;
    bottom: -5px;
    cursor: pointer
}

.profile-user .app-favicon-user-profile-image,.profile-user .app-logo-user-profile-image,.profile-user .app-logo-white-user-profile-image,.profile-user .app-preloader-user-profile-image,.profile-user .default-user-profile-image,.profile-user .language-icon-image,.profile-user .maintainer-user-profile-image,.profile-user .signin-user-profile-image,.profile-user .user-profile-image,.tbl-user-image {
    -o-object-fit: cover;
    object-fit: cover
}

.tenants-details-home-details-property-item .property-item-content {
    display: flex;
    width: 100%
}

.tenants-details-home-details-property-item .property-item-img-wrap::before {
    height: 130%
}

.tenants-details-home-details-property-item .property-item-img img {
    height: 450px
}

.tenants-details-property-info-left {
    width: 50%
}

.tenants-details-property-info-right {
    width: 50%;
    text-align: right
}

.billing-center-nav-tabs .nav-link {
    border: none;
    border-radius: 4px;
    color: var(--body-font-color)
}

.billing-center-nav-tabs,.invoice-payment-nav-tabs {
    border-bottom: 0
}

.billing-center-nav-tabs .nav-link:focus,.billing-center-nav-tabs .nav-link:hover {
    color: var(--primary-hover-color)
}

.document-item-box {
    height: 178px;
    width: 194px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center
}

.document-item-box img {
    height: 45px
}

.invoice-heading-part {
    display: flex;
    justify-content: space-between
}

.invoice-heading-left img {
    margin-bottom: 13px
}

.invoice-address-part {
    margin-bottom: 20px;
    margin-top: 20px;
    border-top: 1px solid #e5e4e4;
    padding-top: 20px;
    display: flex;
    justify-content: space-between
}

.invoice-address-part .invoice-generate-title {
    margin-bottom: 12px
}

.invoice-address h6 {
    margin-top: 8px
}

.invoice-address h5,.invoice-address h6 {
    color: #737c91
}

.invoice-preview-wrap .invoice-table-part thead {
    border-top: 1px solid #e5e4e4;
    background-color: #fff
}

.invoice-payment-nav-tabs .nav-link,.tenant-portal-notice-tbl td:hover {
    background-color: var(--white-color)
}

.invoice-preview-wrap .invoice-table-part .show-total-box {
    border-bottom: 1px solid #e5e4e4;
    margin-bottom: 20px;
    padding-bottom: 20px
}

.invoice-tbl-last-field {
    text-align: right;
    padding-right: 1.5rem
}

.invoice-tbl-last-field>span {
    margin-left: 15px
}

.invoice-heading-color {
    color: #160e4d
}

.invoice-generate-title {
    text-align: left;
    margin-bottom: 20px
}

.invoice-preview-wrap thead {
    background-color: #fafafa
}

.invoice-table-part table {
    background-color: #fff
}

.transaction-table-part table {
    background-color: #fafafa;
    border: 1px solid #eaeaea;
    border-radius: 4px
}

.invoice-preview-wrap .table>thead>tr>th {
    border-bottom: 1px solid #e5e4e4
}

.invoice-heading-right-status-btn {
    background: rgba(54,134,252,.1);
    border-radius: 4px;
    display: inline-flex;
    padding: 10px 18px;
    color: #3686fc
}

.show-uploaded-documents-img img {
    height: 24px;
    width: 24px;
    -o-object-fit: cover;
    object-fit: cover
}

.ticket-item-content-box.attachment-ticket-item-content-box {
    padding-bottom: 12px;
    margin-bottom: 20px
}

.tickets-attachment-item {
    width: 75px;
    height: 75px;
    border-radius: 4px;
    overflow: hidden;
    display: inline-block
}

.tickets-attachment-gallery .col-auto {
    padding: 2px 5px
}

.tickets-attachment-gallery {
    padding: 0 5px
}

.tickets-attachment-item img {
    height: 75px;
    width: 75px
}

.vbox-overlay {
    background: rgba(22,14,77,.7)
}

.ticket-replies-item {
    background-color: rgba(242,246,249,.8)
}

.ticket-details-write-reply-box textarea {
    min-height: 160px!important
}

.account-settings-menu li,.account-settings-menu li ul.account-sub-menu li a,.account-settings-menu li ul.account-sub-menu li a::before,.account-settings-menu-item {
    -webkit-transition: .5s linear;
    transition: .5s linear
}

.account-settings-menu li .toggle-account-menu {
    position: absolute;
    top: 14px;
    right: 10px;
    cursor: pointer;
    font-size: 10px;
    text-align: right;
    z-index: 9
}

.account-settings-menu li.menu-has-children .account-sub-menu {
    padding: 0;
    display: none
}

.account-settings-menu li.menu-has-children .account-sub-menu li a {
    display: block;
    position: relative;
    height: auto;
    background: 0 0;
    padding: 5px 0;
    text-transform: capitalize;
    -webkit-transition: .5s linear;
    transition: .5s linear
}

.account-settings-menu li.menu-has-children.has-open .account-sub-menu {
    display: block;
    margin-left: 20px
}

.account-settings-menu li ul.account-sub-menu li a::before {
    content: "";
    height: 6px;
    width: 6px;
    background-color: var(--body-font-color);
    display: inline-block;
    border-radius: 50%;
    margin-right: 5px;
    top: -2px;
    position: relative
}

.color-settings-fields-wrap .sp-original-input-container {
    border: 1px solid var(--border-color);
    border-radius: 4px;
    height: 50px;
    align-items: center;
    width: 100%
}

.color-settings-fields-wrap .sp-original-input-container .sp-add-on {
    height: 30px;
    width: 30px!important;
    border-radius: 4px!important;
    margin: 0 10px;
    flex-shrink: 0
}

.color-settings-fields-wrap .sp-original-input-container input {
    height: 100%;
    width: 100%
}

.tenant-portal-notice-tbl td .tenant-portal-notice-tbl-item {
    padding: 1rem 1.5rem;
    width: 100%;
    display: block
}

.invoice-payment-img img {
    height: 70px
}

.invoice-payment-nav-tabs .nav-link {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: 1px solid var(--border-color);
    padding: 20px;
    border-radius: 4px
}

.invoice-payment-nav-tabs .nav-item.show .nav-link .custom-radiobox [type=radio]+label:after,.invoice-payment-nav-tabs .nav-link.active .custom-radiobox [type=radio]+label:after {
    content: '';
    width: 12px;
    height: 12px;
    background: var(--primary-color);
    position: absolute;
    top: 3px;
    left: 3px;
    border-radius: 100%;
    -webkit-transition: .2s;
    transition: .2s;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1)
}

.tenant-nid-icon.text-white.rounded-circle {
    height: 46px;
    width: 46px;
    background-color: var(--heading-color)
}

.upload-nid-wrap {
    background: linear-gradient(90deg,#ecf4ff 0,#e3efff 63.02%,#d8c9ff 84.44%,#baffcd 100%)
}

.message-user-top-part {
    padding: 20px
}

.message-user-top-part-btns .nav-link {
    background-color: transparent;
    color: var(--body-font-color);
    border: none;
    border-radius: 4px
}

.message-user-top-part-btns .nav-item.show .nav-link,.message-user-top-part-btns .nav-link.active {
    background-color: var(--primary-color);
    color: var(--white-color)
}

.search-message-box input {
    height: 32px;
    border: 1px solid #e9e8e8;
    color: #767588;
    border-left: 0
}

.search-message-box .form-control:focus {
    border-color: #e9e8e8;
    outline: 0;
    box-shadow: none
}

.message-chat-right-part,.message-user-sidebar {
    height: 719px
}

.message-user-list-part {
    height: calc(100% - 94px)
}

.message-user-list-wrap {
    max-height: 600px;
    overflow-y: auto
}

.message-user-list-part-title h6 {
    padding: 0 30px
}

.message-user-item {
    padding: 12px 20px;
    margin-bottom: 2px
}

.message-user-item.active,.message-user-item:hover {
    background-color: #f3f6f8
}

.chat-item .user-img-wrap,.message-user-item .user-img-wrap,.message-user-item-left .user-img-wrap {
    height: 42px;
    width: 42px
}

.chat-item .user-img-wrap img,.message-user-item .user-img-wrap img,.message-user-item-left .user-img-wrap img {
    height: 42px;
    width: 42px;
    border-radius: 50%
}

.message-user-item-left p {
    line-height: 16px
}

.online-offline-show {
    height: 12px;
    width: 12px;
    border-radius: 50%;
    border: 2px solid var(--white-color);
    right: 0;
    bottom: 4px;
    z-index: 9
}

.online-offline-show.offline {
    background-color: var(--yellow-color)
}

.message-user-notification-box {
    background-color: rgba(255,67,67,.1);
    color: var(--red-color);
    min-height: 18px;
    min-width: 18px;
    border-radius: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: right;
    float: right;
    font-size: 10px;
    padding: 0 4px
}

.message-chat-right-part .dropdown-toggle .iconify,.message-chat-right-part .dropdown-toggle i {
    font-size: 22px
}

.message-chat-top-part {
    border-bottom: 1px solid var(--border-color);
    background-color: var(--white-color);
    min-height: 88px;
    padding: 20px;
    position: relative;
    z-index: 9
}

.in-chat-mode-online-offline .yes-online {
    background-color: var(--green-color);
    color: var(--white-color)
}

.in-chat-mode-online-offline .online-offline-btn {
    border-radius: 71px;
    padding: 3px 8px
}

.message-chat-top-action-btn {
    color: var(--body-font-color);
    display: inline-flex;
    align-items: center;
    justify-content: center
}

.message-chat-top-right .dropdown-toggle {
    display: inline-flex!important
}

.message-chat-top-right .dropdown {
    display: inline-flex;
    align-items: center;
    justify-content: center
}

.message-chat-top-right .dropdown-menu {
    min-width: 6rem
}

.message-chat-top-right .dropdown-menu .dropdown-item {
    display: inline-flex;
    align-items: center
}

.message-chat-top-right .dropdown-menu .dropdown-item .iconify {
    margin-right: 6px
}

.message-chat-top-right .dropdown-menu li:first-child .dropdown-item .iconify {
    color: #f44
}

.message-chat-top-right .dropdown-menu li:nth-child(2) .dropdown-item .iconify {
    color: var(--yellow-color)
}

.message-chat-top-right .dropdown-menu li:nth-child(3) .dropdown-item .iconify {
    color: var(--theme-color)
}

.message-chat-bottom-part {
    bottom: 0;
    width: 100%;
    padding: 5px 20px 20px;
    background-color: var(--white-color)
}

.message-chat-bottom-left {
    width: calc(100% - 71px)
}

.message-chat-bottom-left .input-group {
    background-color: #f4f4f8;
    border-radius: 4px;
    color: var(--body-font-color);
    padding: 10px
}

.emogi-collection-btn {
    color: var(--body-font-color);
    height: 36px;
    width: 36px;
    border-radius: 4px!important;
    font-size: 21px;
    padding: 0;
    justify-content: center
}

.chat-text-input {
    height: 36px;
    padding: 5px 14px
}

.message-chat-bottom-right {
    width: 56px
}

.message-chat-bottom-action-btn {
    height: 56px;
    width: 56px;
    border-radius: 4px;
    color: var(--body-font-color);
    background-color: #f4f4f8;
    font-size: 20px
}

.custom-scrollbar {
    scrollbar-width: thin;
    scrollbar-color: #E6E3EB #fff
}

.custom-scrollbar::-webkit-scrollbar {
    width: 3px;
    height: 10px
}

.custom-scrollbar::-webkit-scrollbar-track {
    background-color: #fff
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background-color: #e6e3eb
}

.custom-scrollbar::-webkit-scrollbar-thumb,.custom-scrollbar::-webkit-scrollbar-track {
    border-radius: 5px
}

.message-chat-main-part {
    padding: 0 20px;
    position: absolute;
    width: 100%;
    max-height: 541px;
    overflow-y: auto
}

.conversation-start-date {
    margin: 40px 0 20px
}

.conversation-start-date:before {
    content: "";
    background-color: var(--border-color);
    width: 100%;
    height: 1px;
    left: 0;
    position: absolute
}

.conversation-start-date span {
    top: -9px;
    padding: 0 12px
}

.chat-item {
    max-width: 680px
}

.chat-item .dropdown {
    right: -25px;
    float: right;
    color: var(--body-font-color)
}

.chat-item .dropdown-menu {
    min-width: 6rem;
    border: 1px solid #eeeded;
    border-radius: 8px
}

.chat-item.chat-item-right {
    float: right
}

.chat-item.chat-item-right .chat-text-box p {
    background-color: #e9f6ff;
    border-radius: 4px 4px 0
}

.chat-text-box {
    margin-right: 20px
}

.chat-text-box p {
    background: #f2f6f9;
    border-radius: 4px 4px 4px 0;
    color: var(--heading-color);
    margin-bottom: 15px;
    padding: 18px 20px
}

.chat-sidebar-toggle-btn {
    height: 38px;
    width: 38px;
    display: none
}

.chat-sidebar-offcanvas {
    z-index: 1;
    transform: translateX(0)!important;
    visibility: visible;
    position: relative;
    border-right-color: var(--border-color)!important
}

.chat-sidebar-offcanvas .offcanvas-body {
    overflow-y: hidden;
    background-color: var(--white-color)
}

.choose-plan-area-title,.payment-method-area-title {
    margin-bottom: 20px;
    margin-top: -5px
}

.price-card-item {
    border: .776515px solid rgba(0,0,0,.1);
    border-radius: 15.5303px;
    background-color: var(--bg-primary)
}

.price-title span {
    color: #727b8f
}

hr {
    border: 1.6px solid rgba(0,0,0,.1)
}

.pricing-features {
    margin: 18px 0 11px
}

.price-check-icon {
    width: 17px;
    height: 17px
}

.payment-subscription-switch .form-check-input {
    width: 4.55em;
    height: 2.25em
}

.theme-btn-outline {
    border: 1px solid var(--secondary-color);
    background-color: transparent;
    color: var(--button-primary-color)!important;
    border-radius: 111.818px;
    padding: 14px 41px!important;
    width: 100%
}

.current-plan-button {
    background-color: var(--secondary-color);
    color: var(--white-color)!important
}

.theme-btn-outline.active,.theme-btn-outline:hover {
    background-color: var(--secondary-hover-color);
    color: var(--white-color)!important
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width:740px
    }

    #invoicePreviewModal .modal-dialog {
        max-width: 1024px
    }

    .big-modal .modal-dialog {
        max-width: 1212px
    }

    #paymentMethodModal.big-modal .modal-dialog {
        max-width: 1250px
    }
}

@media (min-width: 1400px) {
    #paymentMethodModal .col-xxl-3 {
        width:20%
    }
}

.payment-method-item {
    background-color: var(--bg-primary);
    padding: 20px
}

.payment-method-item-title {
    border-radius: 60px;
    padding: 8px 20px;
    min-height: 30px
}

.payment-method-img {
    margin-top: 30px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center
}

.payment-method-item .theme-btn-outline {
    padding: 9px 20px!important
}

.dashboard-topic-content {
    height: 69vh;
    overflow-x: hidden
}

.topic-content-item {
    border: 1px solid rgba(0,0,0,.15)
}

.topic-content-item-icon {
    height: 52px;
    width: 52px;
    font-size: 20px;
    background-color: var(--bg-icon)
}

.dropdown-menu li.selected {
    background: #f0f8ff;
    margin-bottom: 2px
}

.my-custom-select-box>.bootstrap-select>.dropdown-toggle {
    outline: 0!important;
    background: no-repeat;
    border: none
}

.exclamation-area {
    background: #ffc107;
    padding: 7px 20px;
    border-radius: 50px
}

.close.topBannerClose.ms-2 {
    position: absolute;
    right: 6px;
    top: 25%
}

@media (min-width: 68px) and (max-width:768.98px) {
    .exclamation-btu {
        display:block
    }

    .exclamation-area {
        display: none;
        width: 100%
    }

    .close.topBannerClose {
        display: none
    }

    .exclamation {
        width: 100%;
        justify-content: end
    }

    .clickOption.exclamation {
        position: absolute;
        top: 10px;
        z-index: 9;
        width: 100%;
        justify-content: center
    }
}

.has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    line-height: 2.95rem;
    text-align: center;
    pointer-events: none;
    color: #aaa;
    padding-left: 14px;
    padding-top: 3px
}

@media screen and (min-width: 768px) and (max-width:1199px) {
    .tenantReportDataTable-search #tenantReportDataTable_filter {
        text-align:left
    }
}

.bg-button-primary-color {
    background-color: #3686fc!important
}

.text-button-primary-color {
    color: #3686fc!important
}

.payNowMaxWidth {
    max-width: 630px
}

.g-1 {
    gap: 1px!important
}

.g-2 {
    gap: 2px!important
}

.g-3 {
    gap: 3px!important
}

.g-4 {
    gap: 4px!important
}

.g-5 {
    gap: 5px!important
}

.g-6 {
    gap: 6px!important
}

.g-7 {
    gap: 7px!important
}

.g-8 {
    gap: 8px!important
}

.g-9 {
    gap: 9px!important
}

.g-10 {
    gap: 10px!important
}

.g-11 {
    gap: 11px!important
}

.g-12 {
    gap: 12px!important
}

.g-13 {
    gap: 13px!important
}

.g-14 {
    gap: 14px!important
}

.g-15 {
    gap: 15px!important
}

.g-16 {
    gap: 16px!important
}

.g-17 {
    gap: 17px!important
}

.g-18 {
    gap: 18px!important
}

.g-19 {
    gap: 19px!important
}

.g-20 {
    gap: 20px!important
}

.g-21 {
    gap: 21px!important
}

.g-22 {
    gap: 22px!important
}

.g-23 {
    gap: 23px!important
}

.g-24 {
    gap: 24px!important
}

.g-25 {
    gap: 25px!important
}

.g-26 {
    gap: 26px!important
}

.g-27 {
    gap: 27px!important
}

.g-28 {
    gap: 28px!important
}

.g-29 {
    gap: 29px!important
}

.g-30 {
    gap: 30px!important
}

.rg-1 {
    row-gap: 1px!important
}

.rg-2 {
    row-gap: 2px!important
}

.rg-3 {
    row-gap: 3px!important
}

.rg-4 {
    row-gap: 4px!important
}

.rg-5 {
    row-gap: 5px!important
}

.rg-6 {
    row-gap: 6px!important
}

.rg-7 {
    row-gap: 7px!important
}

.rg-8 {
    row-gap: 8px!important
}

.rg-9 {
    row-gap: 9px!important
}

.rg-10 {
    row-gap: 10px!important
}

.rg-11 {
    row-gap: 11px!important
}

.rg-12 {
    row-gap: 12px!important
}

.rg-13 {
    row-gap: 13px!important
}

.rg-14 {
    row-gap: 14px!important
}

.rg-15 {
    row-gap: 15px!important
}

.rg-16 {
    row-gap: 16px!important
}

.rg-17 {
    row-gap: 17px!important
}

.rg-18 {
    row-gap: 18px!important
}

.rg-19 {
    row-gap: 19px!important
}

.rg-20 {
    row-gap: 20px!important
}

.rg-21 {
    row-gap: 21px!important
}

.rg-22 {
    row-gap: 22px!important
}

.rg-23 {
    row-gap: 23px!important
}

.rg-24 {
    row-gap: 24px!important
}

.rg-25 {
    row-gap: 25px!important
}

.rg-26 {
    row-gap: 26px!important
}

.rg-27 {
    row-gap: 27px!important
}

.rg-28 {
    row-gap: 28px!important
}

.rg-29 {
    row-gap: 29px!important
}

.rg-30 {
    row-gap: 30px!important
}

.content-chat {
    display: flex;
    gap: 30px
}

.content-chat .content-chat-user {
    background-color: #fff;
    border: 1px solid #eaeaea;
    border-radius: 20px;
    max-width: 350px;
    width: 100%;
    padding: 25px 0 10px
}

@media screen and (max-width: 991px) {
    .account-settings-menu {
        column-gap:15px
    }

    .content-chat {
        gap: 10px
    }

    .content-chat .content-chat-user {
        max-width: 300px;
        width: 100%
    }
}

.content-chat .content-chat-user .head-chat {
    padding: 0 24px 12px
}

.content-chat .content-chat-user .head-chat .title {
    font-size: 24px;
    font-weight: 600;
    line-height: 30px;
    color: #160e4d
}

.content-chat .content-chat-user .search-two {
    margin: 0 24px 10px;
    max-width: 100%
}

.content-chat .content-chat-user .list-search-user-chat {
    max-height: 620px;
    overflow-y: auto;
    scrollbar-gutter: stable both-edges;
    scrollbar-width: thin
}

.content-chat .content-chat-user .list-search-user-chat::-webkit-scrollbar {
    width: 6px
}

.content-chat .content-chat-user .list-search-user-chat::-webkit-scrollbar-track {
    background: #efefef;
    border-radius: 50px
}

.content-chat .content-chat-user .list-search-user-chat::-webkit-scrollbar-thumb {
    background: #dadada;
    border-radius: 50px
}

.content-chat .content-chat-user .list-search-user-chat .user-chat {
    display: flex;
    gap: 14px;
    padding: 12px 24px;
    cursor: pointer;
    transition: .3s
}

.content-chat .content-chat-user .list-search-user-chat .user-chat.active,.content-chat .content-chat-user .list-search-user-chat .user-chat:hover {
    background-color: #0063e6
}

.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-img {
    position: relative;
    width: 50px;
    height: 50px;
    border-radius: 50%
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-img img,.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-img img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-img .online,.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-img .online {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 14px;
    height: 14px;
    background-color: #fbbf37;
    border-radius: 50%;
    border: 2px solid #fff
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-img .offline,.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-img .offline {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 14px;
    height: 14px;
    background-color: #737c91;
    border-radius: 50%;
    border: 2px solid #fff
}

.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-text-time {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-grow: 1;
    gap: 5px
}

.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-text-time .time {
    font-size: 12px;
    font-weight: 400;
    line-height: 17px;
    color: #737c91;
    padding-bottom: 6px;
    transition: .3s
}

.content-chat .content-chat-user .list-search-user-chat .user-chat.active .user-chat-text small,.content-chat .content-chat-user .list-search-user-chat .user-chat.active .user-chat-text-time .time,.content-chat .content-chat-user .list-search-user-chat .user-chat:hover .user-chat-text small,.content-chat .content-chat-user .list-search-user-chat .user-chat:hover .user-chat-text-time .time {
    color: rgba(255,255,255,.7)
}

.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-text-time .notify {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #3686fc;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 11px;
    font-weight: 400;
    line-height: 13px;
    color: #fff;
    margin-left: auto!important
}

.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-text .name {
    font-size: 14px;
    font-weight: 500;
    line-height: 24px;
    color: #160e4d;
    transition: .3s
}

.content-chat .content-chat-user .list-search-user-chat .user-chat.active .user-chat-text .name,.content-chat .content-chat-user .list-search-user-chat .user-chat:hover .user-chat-text .name {
    color: #fff
}

.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-text small {
    font-size: 14px;
    font-weight: 400;
    line-height: 17px;
    color: #737c91;
    transition: .3s
}

.content-chat .content-chat-user .list-search-user-chat .user-chat .user-chat-time {
    flex-shrink: 0
}

.content-chat .content-chat-message-user-wrap {
    max-width: 100%;
    width: 100%;
    border: 1px solid #eaeaea;
    border-radius: 20px;
    overflow: hidden
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user {
    display: none;
    background-color: #fff;
    border-bottom: none;
    overflow: hidden
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 30px 30px 21px;
    background-color: #fff;
    border-bottom: 1px solid #eaeaea
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-text .title {
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: #160e4d
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user .message-user-text .status {
    font-size: 14px;
    font-weight: 400;
    line-height: 17px;
    color: #737c91
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user {
    display: flex;
    flex-direction: column;
    gap: 30px;
    box-sizing: border-box;
    padding: 15px 30px;
    height: 580px;
    overflow-y: auto;
    scrollbar-gutter: stable both-edges;
    scrollbar-width: thin;
    background-color: #fff
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user::-webkit-scrollbar {
    width: 6px
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user::-webkit-scrollbar-track {
    background: #efefef;
    border-radius: 50px
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user::-webkit-scrollbar-thumb {
    background: #dadada;
    border-radius: 50px
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left {
    display: flex;
    flex-direction: column;
    gap: 4px
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text {
    position: relative;
    max-width: calc(toRem(508) + 12px + 35px);
    display: flex;
    align-items: center;
    gap: 12px
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .text {
    padding: 6px 12px;
    background-color: #f9f9f9;
    border: 1px solid #eaeaea;
    border-radius: 15px;
    color: #160e4d
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .text>p,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text .text>p {
    padding-bottom: 8px
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .text .time-read {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 4px
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .text .time-read .time,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text .text .time-read .time {
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    color: #160e4d
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .share-icon,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .share-icon {
    opacity: 0;
    visibility: hidden;
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    border: none;
    border-radius: 50%;
    padding: 0;
    background-color: #eaeaea;
    display: flex;
    justify-content: center;
    align-items: center
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text .share-icon img,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .share-icon img {
    max-width: 15px
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text:hover .share-icon,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text:hover .share-icon {
    opacity: 1;
    visibility: visible
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right {
    display: flex;
    flex-direction: column;
    align-items: end;
    gap: 4px
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text {
    position: relative;
    max-width: calc(toRem(508) + toRem(12) + toRem(35));
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    gap: 12px
}

@media screen and (max-width: 575px) {
    #progressbar li:after {
        display:none
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-left .message-user-left-text,.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text {
        gap: 5px
    }
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text .text {
    padding: 6px 12px;
    background-color: #cdffc5;
    border: 1px solid #cdffc5;
    border-radius: 15px;
    color: #160e4d
}

.content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user .message-user-right .message-user-right-text .text .time-read {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 4px
}

.content-chat .content-chat-message-user-wrap .footer-chat-message-user {
    background-color: #fff;
    border-top: 1px solid #eaeaea;
    padding: 15px 30px 30px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 10px
}

.content-chat .content-chat-message-user-wrap .footer-chat-message-user .message-user-send {
    flex: 1 1 auto;
    position: relative;
    width: 100%
}

.content-chat .content-chat-message-user-wrap .footer-chat-message-user .message-user-send input {
    box-sizing: border-box;
    width: 100%;
    padding: 13px 20px;
    border-radius: 50px;
    outline: 0;
    border: none;
    background-color: #eaeaea
}

.content-chat .content-chat-message-user-wrap .footer-chat-message-user button {
    flex: 0 0 auto;
    border: none;
    padding: 0;
    background-color: transparent;
    display: flex;
    justify-content: center;
    align-items: center
}

.content-chat .content-chat-message-user-wrap .footer-chat-message-user button.emoji-btn,.content-chat .content-chat-message-user-wrap .footer-chat-message-user button.send-btn {
    flex: 0 0 auto;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    background-color: #eaeaea;
    cursor: pointer
}

.content-chat .content-chat-message-user-wrap .footer-chat-message-user button.emoji-btn:hover,.content-chat .content-chat-message-user-wrap .footer-chat-message-user button.send-btn:hover {
    background-color: #eaeaea
}

@media screen and (max-width: 767px) {
    .content-chat {
        flex-direction:column
    }

    .content-chat .content-chat-user {
        padding: 10px 0;
        max-width: 100%
    }

    .content-chat .content-chat-user .head-chat,.content-chat .content-chat-user .search-two {
        display: none
    }

    .content-chat .content-chat-message-user-wrap .content-chat-message-user .body-chat-message-user,.content-chat .content-chat-message-user-wrap .content-chat-message-user .head-chat-message-user {
        padding: 15px
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-user .footer-inputs {
        position: relative;
        gap: 0;
        height: 50px;
        background-color: #f4f4ef;
        border-radius: 50px
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-user {
        padding: 15px 15px 30px
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-user .message-user-send {
        order: 1
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-user .message-user-send input {
        padding: 13px 45px
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-user button.emoji-btn,.content-chat .content-chat-message-user-wrap .footer-chat-message-user button.send-btn {
        z-index: 1;
        order: 2;
        width: 31px;
        height: 31px;
        background-color: #3686fc;
        position: absolute;
        top: 50%;
        right: 13px;
        transform: translateY(-50%)
    }

    .content-chat .content-chat-message-user-wrap .footer-chat-message-user button.emoji-btn img,.content-chat .content-chat-message-user-wrap .footer-chat-message-user button.send-btn img {
        max-width: 13px
    }
}

img {
    max-width: 100%
}