/* For Chrome, Edge, and Safari */
::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-thumb {
    background-color: #888;
    border-radius: 20px;
}

::-webkit-scrollbar-track {
    background-color: #f1f1f1;
    border-radius: 20px;
}

/* For Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #888 #f1f1f1;
}
.main-header .search-dropdown .search-recomendation ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

@font-face {
    font-family: 'matat_icon';
    src: url('../fonts/icomoon.eot?4zintq');
    src: url('../fonts/icomoon.eot?4zintq#iefix') format('embedded-opentype'),
        url('../fonts/icomoon.ttf?4zintq') format('truetype'),
        url('../fonts/icomoon.woff?4zintq') format('woff'),
        url('../fonts/icomoon.svg?4zintq#icomoon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

[class^='mti-'],
[class*=' mti-'] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'matat_icon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1; /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.mti-add-user:before {
    content: '\e900';
}

.mti-angle-down:before {
    content: '\e901';
}

.mti-angle-left:before {
    content: '\e902';
}

.mti-angle-right:before {
    content: '\e903';
}

.mti-angle-up:before {
    content: '\e904';
}

.mti-barcode:before {
    content: '\e905';
}

.mti-bell:before {
    content: '\e906';
}

.mti-business-report:before {
    content: '\e907';
}

.mti-calculator:before {
    content: '\e908';
}

.mti-cash-back:before,
.mti-bank_transfer:before {
    content: '\e909';
}

.mti-check:before {
    content: '\e90a';
}

.mti-credit_pay:before,
.mti-ern_cheques:before,
.mti-super_pharm:before,
.mti-pay_box:before,
.mti-cheque:before {
    content: '\e90b';
}

.mti-convert:before {
    content: '\e90c';
}

.mti-credit-card:before,
.mti-card:before {
    content: '\e90d';
}

.mti-date:before {
    content: '\e90e';
}

.mti-delete:before {
    content: '\e90f';
}

.mti-download:before {
    content: '\e910';
}

.mti-exclamation:before {
    content: '\e911';
}

.mti-eye:before {
    content: '\e912';
}

.mti-file:before {
    content: '\e913';
}

.mti-giftcard:before {
    content: '\e914';
}

.mti-grid:before {
    content: '\e915';
}

.mti-link:before {
    content: '\e916';
}

.mti-location-pin:before {
    content: '\e917';
}

.mti-mail:before {
    content: '\e918';
}

.mti-money:before,
.mti-cash:before {
    content: '\e919';
}

.mti-paper:before {
    content: '\e91a';
}

.mti-paypal:before {
    content: '\e91b';
}

.mti-plus-circle:before {
    content: '\e91c';
}

.mti-plus:before {
    content: '\e91d';
}

.mti-printing:before {
    content: '\e91e';
}

.mti-remove:before {
    content: '\e91f';
}

.mti-search:before {
    content: '\e920';
}

.mti-share:before {
    content: '\e921';
}

.mti-shopping-cart:before {
    content: '\e922';
}

.mti-sms:before {
    content: '\e923';
}

.mti-tick-mark:before {
    content: '\e924';
}

.mti-time-management:before {
    content: '\e925';
}

.mti-times:before {
    content: '\e926';
}

.mti-wallet:before,
.mti-other:before {
    content: '\e927';
}

.mti-whatsapp:before {
    content: '\e928';
}

.mti-logout:before {
    content: '\e929';
}

.mti-setting:before {
    content: '\e92a';
}

.mti-user:before {
    content: '\e92b';
}

.mti-bell-fill:before {
    content: '\e92c';
}

.mti-bill:before {
    content: '\e92d';
}

.mti-cancel:before {
    content: '\e92e';
}

.mti-stat-bars:before {
    content: '\e92f';
}

.mti-trade:before {
    content: '\e930';
}

.mti-information-circle:before {
    content: '\e931';
}

.mti-new-plus:before {
    content: '\e932';
}

.mti-minus-alt:before {
    content: '\e933';
}

.mti-plus-alt:before {
    content: '\e934';
}

.mti-add-comment:before {
    content: '\e935';
}

.mti-close-circle:before {
    content: '\e936';
}

.mti-close-new:before {
    content: '\e937';
}

.mti-edc:before {
    content: '\e938';
}

.mti-calculator-alt:before {
    content: '\e939';
}

.mti-back:before {
    content: '\e93a';
}

.mti-clock:before {
    content: '\e93b';
}

.mti-close-alt:before {
    content: '\e93c';
}

.mti-edit:before {
    content: '\e93d';
}

.mti-full-screen:before {
    content: '\e93e';
}

.mti-keyboard:before {
    content: '\e93f';
}

.mti-location:before {
    content: '\e940';
}

.mti-report:before {
    content: '\e941';
}

.mti-money-alt:before {
    content: '\e942';
}

html body,
html * {
    font-family: 'Heebo', sans-serif;
}

body {
    background: #F8F7F9;
}

body.lockscreen {
    background: #F8F7F9;
}

.tooltip{
    z-index:1035;
}

.tooltip.top .tooltip-arrow{
    bottom:1px;
}

.main-footer {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    width: calc(100% - 230px);
}

.content-wrapper{
    margin-bottom:62px;
}

.skin-black-light .content-wrapper,
.skin-black-light .main-footer,
.skin-black-light .main-header .navbar {
    border: none;
}

.bootstrap-datetimepicker-widget table td.active,
.bootstrap-datetimepicker-widget table td.active:hover {
    background: #813eff !important;
    color: #fff !important;
}

.skin-black-light .main-header {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}

.content-wrapper,
.accrodion-top-static-border,
.accrodion-bottom-static-border,
.right-side {
    background: #F8F7F9;
}

.skin-black-light .main-header .navbar > .sidebar-toggle,
.skin-black-light .main-header .navbar .navbar-nav > li > a {
    border: none;
}

.skin-black-light .main-header .navbar > .sidebar-toggle:hover .toggle-bar {
    background: #7638ff;
}

.skin-black-light .main-header .navbar > .sidebar-toggle:hover .toggle-bar:before,
.skin-black-light .main-header .navbar > .sidebar-toggle:hover .toggle-bar:after {
    background: #7638ff;
}

.checkbox label.custom_checkbox {
    padding: 0 0 0 32px;
    font-size: 14px;
    line-height: 18px;
    color: #7638ff;
}

.checkbox label.custom_checkbox input[type='checkbox'] {
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    opacity: 0;
}

.checkbox label.custom_checkbox input[type='checkbox']:checked ~ .fake-input:before {
    opacity: 1;
}

.rtl .checkbox label.custom_checkbox {
    padding: 0 32px 0 0;
}

.checkbox label.custom_checkbox .fake-input {
    position: absolute;
    top: -2px;
    left: 0;
    width: 22px;
    height: 22px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 3px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.checkbox label.custom_checkbox .fake-input:before {
    content: '\e924';
    font: 10px/1 'matat_icon';
    opacity: 0;
    -webkit-transition: 0.15s ease opacity;
    transition: 0.15s ease opacity;
}

.rtl .checkbox label.custom_checkbox .fake-input {
    left: auto;
    right: 0;
}

.row {
    margin-left: -10px;
    margin-right: -10px;
}

.row [class^='col-'],
.row [class*=' col-'] {
    padding-left: 10px;
    padding-right: 10px;
}

.push-notifications {
    position: fixed;
    top: 61px;
    right: 20px;
    z-index: 99;
}

.rtl .push-notifications {
    right: auto;
    left: 20px;
}

.push-notification-item {
    position: relative;
    background: #fff;
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.15);
    border-radius: 7px;
    font-size: 12px;
    line-height: 1.25;
    color: #000;
    padding: 18px 14px 15px;
    margin: 0 0 18px;
}

.push-notification-item .ico-notification {
    position: absolute;
    top: -7px;
    right: -5px;
    background: #efe8ff;
    width: 31px;
    height: 31px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 15px;
    text-shadow: 0 1px 4px #9278cf;
    color: #fff;
    border-radius: 50%;
}

.rtl .push-notification-item .ico-notification {
    right: auto;
    left: -5px;
}

.push-notification-item .notification-title {
    display: block;
    margin: 0 0 6px;
}

.main-header {
    background: #fff;
}

.main-header .logo {
    width: 132px;
    padding: 0;
    margin: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.sidebar-mini.sidebar-collapse .main-header .logo {
    width: 132px;
}

.main-header .logo .logo-img {
    display: block;
    width: 100%;
}

.main-header .logo .logo-lg {
    font-size: 14px;
    line-height: 1.1;
    color: #7638ff;
}

.main-header .logo img {
    width: 100%;
    height: auto;
    max-height: none;
    display: block;
}

.main-header .sidebar-toggle {
    position: relative;
    padding: 0;
    margin: 0 5px;
    height: 50px;
    width: 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.main-header .sidebar-toggle:before {
    display: none;
}

.main-header .sidebar-toggle .toggle-bar {
    font-size: 0;
    height: 4px;
    border-radius: 5px;
    background: -webkit-linear-gradient(285deg, #7638ff 2%, #282460 100%);
    background: linear-gradient(165deg, #7638ff 2%, #282460 100%);
    position: relative;
    width: 25px;
}

.main-header .sidebar-toggle .toggle-bar:before,
.main-header .sidebar-toggle .toggle-bar:after {
    position: absolute;
    left: 0;
    height: 4px;
    background: -webkit-linear-gradient(285deg, #7638ff 2%, #282460 100%);
    background: linear-gradient(165deg, #7638ff 2%, #282460 100%);
    content: '';
    margin: 0;
    border-radius: 5px;
    width: 100%;
}

.nav-active .main-header .sidebar-toggle .toggle-bar:before,
.nav-active .main-header .sidebar-toggle .toggle-bar:after {
    -webkit-transition-delay: 0s, 0.3s;
    transition-delay: 0s, 0.3s;
}

.resize-active .main-header .sidebar-toggle .toggle-bar:before,
.resize-active .main-header .sidebar-toggle .toggle-bar:after {
    -webkit-transition: none;
    transition: none;
    -webkit-transition-delay: 0s, 0s;
    transition-delay: 0s, 0s;
}

.main-header .sidebar-toggle .toggle-bar:before {
    top: -6px;
    -webkit-transition: 0.3s ease top 0.3s, 0.3s ease transform 0s, 0.3s ease-in-out background;
    transition: 0.3s ease top 0.3s, 0.3s ease transform 0s, 0.3s ease-in-out background;
}

.nav-active .main-header .sidebar-toggle .toggle-bar:before {
    top: 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: 0.3s ease top 0s, 0.3s ease transform 0.3s, 0.3s ease-in-out background;
    transition: 0.3s ease top 0s, 0.3s ease transform 0.3s, 0.3s ease-in-out background;
}

.main-header .sidebar-toggle .toggle-bar:after {
    bottom: -6px;
    -webkit-transition: 0.3s ease bottom 0.3s, 0.3s ease transform 0s, 0.3s ease-in-out background;
    transition: 0.3s ease bottom 0.3s, 0.3s ease transform 0s, 0.3s ease-in-out background;
}

.nav-active .main-header .sidebar-toggle .toggle-bar:after {
    bottom: 0;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transition: 0.3s ease bottom 0s, 0.3s ease transform 0.3s, 0.3s ease width 0.3s,
        0.3s ease-in-out background;
    transition: 0.3s ease bottom 0s, 0.3s ease transform 0.3s, 0.3s ease width 0.3s,
        0.3s ease-in-out background;
}

.main-header .user-menu .dropdown-menu {
    background: #fff;
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.15);
    border: none;
    border-radius: 10px;
    padding: 9px 0;
    min-width: 121px;
    width: 145px;
    margin: 0 10px;
    margin-top: 2px;
}

.main-header .user-menu .dropdown-menu .user-title {
    padding: 5px 12px;
    font-size: 12px;
    line-height: 1.25;
    font-weight: 700;
    color: #000;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.main-header .user-menu .dropdown-menu .user-title img {
    width: 40px;
    margin-right: 6px;
}

.rtl .main-header .user-menu .dropdown-menu .user-title img {
    margin-right: 0;
    margin-left: 6px;
}

.main-header .user-menu .dropdown-menu .user-title p {
    margin: 0;
}

.main-header .user-menu .dropdown-menu a {
    font-size: 12px;
    line-height: 1.25;
    color: #000;
    padding: 5px 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.main-header .user-menu .dropdown-menu a [class^='mti-'],
.main-header .user-menu .dropdown-menu a [class*=' mti-'],
.main-header .user-menu .dropdown-menu a [class^='fa-'],
.main-header .user-menu .dropdown-menu a [class*=' fa-'] {
    font-size: 10px;
    margin-right: 6px;
}

.rtl .main-header .user-menu .dropdown-menu a [class^='mti-'],
.rtl .main-header .user-menu .dropdown-menu a [class*=' mti-'],
.rtl .main-header .user-menu .dropdown-menu a [class^='fa-'],
.rtl .main-header .user-menu .dropdown-menu a [class*=' fa-'] {
    margin-right: 0;
    margin-left: 6px;
}

.main-header .navbar {
    box-shadow: 0 0 5px rgb(40 36 96 / 51%);
    margin: 0;
}

.sidebar-mini.sidebar-collapse .main-header .navbar {
    margin: 0;
}

.main-header .navbar .navbar-nav > li.notifications-menu .dropdown-menu {
    border: none;
    background: #fff;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
    border-radius: 8px;
    width: 237px;
    margin: 5px -40px 0;
    overflow: hidden;
}

.main-header .navbar .navbar-nav > li.notifications-menu .dropdown-menu > li .menu > li {
    border-top: 1px solid #e0e0e0;
    font-size: 12px;
    line-height: 1.25;
    color: #000;
    font-weight: 300;
}

.main-header
    .navbar
    .navbar-nav
    > li.notifications-menu
    .dropdown-menu
    > li
    .menu
    > li.no-notification {
    padding: 7px 12px;
}

.main-header .navbar .navbar-nav > li.notifications-menu .dropdown-menu > li .menu > li > a {
    color: #000;
    border: none;
    padding: 7px 12px;
}

.main-header
    .navbar
    .navbar-nav
    > li.notifications-menu
    .dropdown-menu
    > li
    .menu
    > li
    .notify-time {
    font-size: 9px;
    display: block;
    margin: 5px 0 0;
}

.main-header .navbar .navbar-nav > li.notifications-menu .notification-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 12px;
    line-height: 1.25;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-weight: 700;
    padding: 9px 12px;
}

.main-header .navbar .navbar-nav > li.notifications-menu .notification-header .notification-title {
    color: #282460;
}

.main-header .navbar .navbar-nav > li.notifications-menu .notification-header .clear-notification {
    color: #7638ff;
    font-size: 11px;
}

.main-header .navbar .navbar-nav > li.user-menu > a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 300;
    font-size: 14px;
    line-height: 1.5;
    height: 55px;
}

.main-header .navbar .navbar-nav > li.user-menu > a .mti-angle-down {
    font-size: 4px;
    margin-left: 6px;
}

.main-header .navbar .navbar-nav > li.user-menu.open > a .mti-angle-down {
    transform: rotate(180deg);
}

.rtl .main-header .navbar .navbar-nav > li.user-menu > a .mti-angle-down {
    margin-left: 0;
    margin-right: 6px;
}

.main-header .navbar .navbar-nav > li > a.load_notifications,
.release-note-announcement .HW_badge_cont{
    font-size: 13px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 55px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.release-note-announcement {
    border-left: 1px solid #eee;
    min-width: 32px;
}

.release-note-announcement .HW_badge_cont {
    position: relative;
}

.release-note-announcement .HW_badge_cont:before {
    content: "\f675";
    font-weight: 900;
    font-family: "Font Awesome 6 Pro";
}

.main-header .navbar .navbar-nav > li > a.load_notifications i {
    display: block;
}

.main-header .navbar .header_btn_business {
    background: #fff;
    border: 1px solid #e0e0e0 !important;
    border-radius: 3px;
    font-size: 13px;
    line-height: 18px;
    padding: 5px;
    min-width: 123px;
    text-align: center;
    color: #000;
}

.main-header .header_date {
    display: none;
}

.main-header .header-add-wrap {
    float: left;
}

.rtl .main-header .header-add-wrap {
    float: right;
}

.rtl .main-header .header-add-wrap .tooltip.right {
    margin-left: -150px;
    margin-right: 80px;
}

.text-brown{
    color: brown !important;     
}

@media (max-width: 991px) {
    .rtl .main-header .header-add-wrap .tooltip.right {
        margin-left: -90px;
        margin-right: 40px;
    }
}

.main-header .header-add-wrap .drop-title {
    display: block;
    border-bottom: 1px solid #efe8ff;
    font-weight: 700;
    font-size: 13px;
    line-height: 1.6;
    color: #362d7b;
    padding: 10px 20px;
    margin: 0 0 1px;
}

.main-header .header-add-wrap .dropdown-menu {
    background: #fff;
    box-shadow: 0 5px 10px rgba(118, 56, 255, 0.14);
    border-radius: 0 0 7px 7px;
    border: none;
    margin: 1px 0 -38px;
    width: 188px;
    padding: 1px 0 5px;
}

.rtl .main-header .header-add-wrap .dropdown-menu {
    margin-left: 0;
    margin-right: -38px;
}

.main-header .header-add-wrap .dropdown-menu .navbar-custom-menu {
    float: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 8px;
}

.main-header .header-add-wrap .dropdown-menu > li .matat-header-btn {
    margin: 0 4px;
    padding: 3px 5px;
    -ms-flex-preferred-size: 32px;
    flex-basis: 32px;
    max-width: 32px;
}

.main-header .header-add-wrap .dropdown-menu > li .btn-pos {
    margin: 0 4px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border: 1px solid #7638ff;
    background: #7638ff;
    border-radius: 4px;
    font-size: 14px;
    line-height: 20px;
    padding: 5px;
    color: #fff;
    -webkit-transition: 0.25s ease background, 0.25s ease color, 0.25s ease border;
    transition: 0.25s ease background, 0.25s ease color, 0.25s ease border;
}

.main-header .header-add-wrap .dropdown-menu > li .btn-pos:hover {
    background: #fff;
    color: #7638ff;
    border-color: #7638ff;
}

.main-header .header-add-wrap .dropdown-menu > li > button {
    padding-left: 20px;
    padding-right: 20px;
}

.main-header .header-add-wrap .dropdown-menu > li > a {
    font-size: 12px;
    font-weight: 300;
    line-height: 1.5;
    color: #000;
    padding: 6px 20px;
}

.main-header .header_btn_add {
    background: -webkit-linear-gradient(285deg, #7638ff 2%, #282460 100%);
    background: linear-gradient(165deg, #7638ff 2%, #282460 100%);
    width: 19px;
    height: 19px;
    display: block;
    border: none;
    outline: none;
    border-radius: 50%;
    color: #fff;
    line-height: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 8px;
    margin: 15.5px 5px;
}

.main-header .header_btn_add:hover {
    box-shadow: 0 4px 8px rgba(75, 45, 168, 0.5);
}

.main-header .header-search-bar {
    float: right;
}

.rtl .main-header .header-search-bar {
    float: left;
}

.main-header .header-search-bar .search_opener {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 16px;
    color: #7638ff;
    line-height: 1;
    margin: 17px 5px;
}

.main-header .header-search-bar .search_opener i {
    display: block;
}

.main-header .header-search-bar .header-search-form {
    position: absolute;
}

.main-header .header-search-bar .search-input-wrap {
    position: relative;
}

.main-header .header-search-bar .form-control {
    height: 32px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 3px;
    font-weight: 300;
    font-size: 14px;
    line-height: 20px;
    color: #000;
    padding: 5px 11px;
}

.main-header .header-search-bar .form-control::-webkit-input-placeholder {
    color: rgba(0, 0, 0, 0.5);
}

.main-header .header-search-bar .form-control::-moz-placeholder {
    opacity: 1;
    color: rgba(0, 0, 0, 0.5);
}

.main-header .header-search-bar .form-control:-moz-placeholder {
    color: rgba(0, 0, 0, 0.5);
}

.main-header .header-search-bar .form-control:-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.5);
}

.main-header .header-search-bar .form-control.placeholder {
    color: rgba(0, 0, 0, 0.5);
}

.main-header .header-search-bar .btn_search {
    position: absolute;
    top: 16px;
    right: 11px;
    border: none;
    outline: none;
    padding: 0;
    margin: 0;
    background: none;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}

.rtl .main-header .header-search-bar .btn_search {
    right: auto;
    left: 11px;
}

.main-header .header-search-bar .btn_search i {
    display: block;
}

.main-header .search-dropdown.search_result_shown .search-recomendation {
    display: none;
}

.main-header .search-dropdown.search_result_shown .header-search-result {
    display: block;
}

.main-header .search-dropdown .search-recomendation {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 18px 5px 14px;
}

.main-header .search-dropdown .search-recomendation ul li {
    font-size: 12px;
    line-height: 1.5;
    font-weight: 300;
    padding: 6px 0;
}

.main-header .search-dropdown .search-recomendation ul li > a {
    color: #000;
}

.main-header .search-dropdown .search-title {
    display: block;
    font-weight: 700;
    font-size: 11px;
    color: #362d7b;
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0 9px;
}

.main-header .search-dropdown .header-search-result {
    display: none;
}

.main-header .search-dropdown .result-item {
    padding: 12px 0;
}

.main-header .search-dropdown .result-item + .result-item {
    border-top: 1px solid #efe8ff;
}

.main-header .search-dropdown .result-item > a {
    display: block;
    font-size: 12px;
    line-height: 1.5;
    color: #000;
    font-weight: 300;
}

.main-header .search-dropdown .result-item .result-title,
.main-header .search-dropdown .result-item .customer-name {
    display: block;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
}

.main-header .search-dropdown .result-item .result-title {
    color: #362d7b;
    margin-bottom: 7px;
}

.main-header .search-dropdown .result-item .search-invoice-no {
    margin-bottom: 2px;
}

.main-header .search-dropdown .result-item .customer-name {
    color: #000;
}

.main-header .matat-header-btn,
.btn-white-bg {
    margin: 10px;
}

.main-header .matat-header-btn,
.pos-btns-row .matat-header-btn,
.btn-white-bg {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    outline: none;
    border: none;
    padding: 3px 8px;
    min-width: 30px;
    height: 30px;
    background: #fff;
    color: #7638ff;
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.15);
    border-radius: 6px;
    font-size: 12px;
    line-height: 1;
}

.main-header .matat-header-btn > strong,
.pos-btns-row .matat-header-btn > strong {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.main-header .matat-header-btn [class^='mti-'],
.main-header .matat-header-btn [class*=' mti-'],
.pos-btns-row .matat-header-btn [class^='mti-'],
.pos-btns-row .matat-header-btn [class*=' mti-'] {
    font-size: 15px;
}

.main-header .matat-header-btn [class^='mti-'].mti-grid,
.main-header .matat-header-btn [class*=' mti-'].mti-grid,
.pos-btns-row .matat-header-btn [class^='mti-'].mti-grid,
.pos-btns-row .matat-header-btn [class*=' mti-'].mti-grid {
    font-size: 13px;
}

.pos-btns-row .matat-header-btn,
.btn-white-bg {
    margin: 5px;
}

.content-header {
    padding: 24px 15px 10px;
}

.home-dashboard .content-header {
    display: block;
}

.content-header h1 {
    font-weight: 300;
    font-size: 17px;
}

.content-header .btn-group {
    margin-left: -4px;
    margin-right: -4px;
}

.content {
    clear: both;
}

.box {
    border: none;
    box-shadow: 0 5px 10px 0 rgba(118, 56, 255, 0.04);
    border-radius: 8px;
}

.box.has_topbar {
    overflow: hidden;
}

.box.has_topbar:before {
    content: '';
    display: block;
    background: -webkit-linear-gradient(273deg, #7638ff 0%, #282460 100%);
    background: linear-gradient(177deg, #7638ff 0%, #282460 100%);
    height: 3px;
}

.box-header {
    padding-left: 16px;
    padding-right: 16px;
    padding-top: 15px;
}

.box-body {
    padding: 14px 16px;
}

.form-group {
    margin-bottom: 29px;
}

.form-group .input-date{
    width:100%;
}

.input-group-addon {
    padding: 7px 12px;
}

.input-group .input-group-addon {
    color: #7638ff;
}

.input-group-btn > .btn {
    padding: 7px 12px;
}

label {
    font-size: 13px;
    vertical-align: top;
    color: #2e286d;
    line-height: 1.46153846;
    margin-bottom: 12px;
}

button.add_new_customer {
    border: none;
    outline: none;
    padding: 0;
    margin: 11px 0 0 0;
    background: none;
    color: #7638ff;
    font-size: 13px;
    display: table;
    font-weight: 700;
    line-height: 1.46153846;
}

button.add_new_customer .mti-add-user {
    font-size: 10px;
}

.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group > .btn,
.input-group-btn:first-child > .dropdown-toggle {
    border-radius: 8px;
}

.rtl .input-group .form-control:first-child,
.rtl .input-group-addon:first-child,
.rtl .input-group-btn:first-child > .btn,
.rtl .input-group-btn:first-child > .btn-group > .btn,
.rtl .input-group-btn:first-child > .dropdown-toggle {
    border-radius: 8px;
}

.input-group .form-control:last-child,
.input-group-addon:last-child,
.input-group-btn:last-child > .btn,
.input-group-btn:last-child > .btn-group > .btn,
.input-group-btn:last-child > .dropdown-toggle {
    border-radius: 8px;
}

.rtl .input-group .form-control:last-child,
.rtl .input-group-addon:last-child,
.rtl .input-group-btn:last-child > .btn,
.rtl .input-group-btn:last-child > .btn-group > .btn,
.rtl .input-group-btn:last-child > .dropdown-toggle {
    border-radius: 8px !important;
}

.select2-container {
    display: block;
    min-width: 100%;
    max-width: 100%;
}

.date-input.select2_hide > span + span {
    display: none;
}

body:not(.auth-container) .input-group .select2-container {
    display: table-cell;
    min-width: 0;
}

.form-control {
    height: 38px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.form-control.product_description {
    border-radius: 0;
    border: none;
    outline: none;
}

.select2-container--default .select2-selection--single,
.select2-selection .select2-selection--single {
    height: 38px;
}

.select2-container--default .select2-selection--single,
.select2-selection .select2-selection--single,
.form-control {
    border-radius: 8px;
    border-color: #ccc;
}

.input-group .select2-container--default .select2-selection--single,
.input-group .select2-selection .select2-selection--single,
.input-group .form-control {
    border-radius: 0;
}

.select2-container--default .select2-selection--single {
    padding-top: 0;
    padding-bottom: 0;
}

.lang-wrapper .select2-container--default .select2-selection--single {
    padding-top: 2px;
}

.lang-wrapper .select2-container--default .select2-selection--single .select2-selection__arrow b {
    margin-top: -2px;
}

.search_appearance
    ~ .select2-container--default
    .select2-selection--single
    .select2-selection__arrow {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 32px;
}

.search_appearance
    ~ .select2-container--default
    .select2-selection--single
    .select2-selection__arrow:before {
    content: '\e920';
    font: 16px/1 'matat_icon';
}

.search_appearance
    ~ .select2-container--default
    .select2-selection--single
    .select2-selection__arrow
    b {
    display: none;
}

.rtl .bootstrap-datetimepicker-widget table thead tr th .glyphicon-chevron-left,
.rtl .bootstrap-datetimepicker-widget table thead tr th .glyphicon-chevron-right,
.rtl .bootstrap-datetimepicker-widget table thead tr td .glyphicon-chevron-left,
.rtl .bootstrap-datetimepicker-widget table thead tr td .glyphicon-chevron-right {
    display: block;
    text-align: center;
}

.rtl .bootstrap-datetimepicker-widget table thead tr th .glyphicon-chevron-left:before,
.rtl .bootstrap-datetimepicker-widget table thead tr td .glyphicon-chevron-left:before {
    content: '\e079';
}

.rtl .bootstrap-datetimepicker-widget table thead tr th .glyphicon-chevron-right:before,
.rtl .bootstrap-datetimepicker-widget table thead tr td .glyphicon-chevron-right:before {
    content: '\e080';
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 38px;
    margin-top: 0;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 30px;
}

.modal .payment-option-row {
    padding: 0;
    margin-left: -5px;
    margin-right: -5px;
}

.modal .payment-option-row .option-item {
    padding-left: 5px;
    padding-right: 5px;
}

.payment-option-row .option-item.active label .payment-name {
    background: -webkit-linear-gradient(285deg, #7638ff 2%, #282460 100%);
    background: linear-gradient(165deg, #7638ff 2%, #282460 100%);
    border-color: transparent;
    color: #fff !important;
}

.option-item label {
    font-weight: 400;
    margin-bottom: 0;
}

.payment_modal .modal-content {
    background: #f9f9f9;
}

.payment-option-row .option-item label .payment-name {
    cursor: pointer;
    line-height: 1.25;
    padding: 0 5px;
    border-color: #e0e0e0;
    background: #fff;
}

.payment-option-row .option-item label .payment-name:hover {
    background: -webkit-linear-gradient(285deg, #7638ff 2%, #282460 100%);
    background: linear-gradient(165deg, #7638ff 2%, #282460 100%);
    border-color: transparent;
    color: #fff !important;
}

.payment-option-row .option-item label .payment-name [class^='mti-'],
.payment-option-row .option-item label .payment-name [class*=' mti-'] {
    font-size: 18px;
    margin: 2px 0 1px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 20px;
}

.payment-option-row .option-item label .payment-name [class^='mti-'].mti-cash:before,
.payment-option-row .option-item label .payment-name [class^='mti-'].mti-other:before,
.payment-option-row .option-item label .payment-name [class*=' mti-'].mti-cash:before,
.payment-option-row .option-item label .payment-name [class*=' mti-'].mti-other:before {
    font-size: 0.9091em;
}

.payment-option-row .option-item label .payment-name [class^='mti-'].mti-cheque:before,
.payment-option-row .option-item label .payment-name [class^='mti-'].mti-ern_cheques:before,
.payment-option-row .option-item label .payment-name [class^='mti-'].mti-super_pharm:before,
.payment-option-row .option-item label .payment-name [class^='mti-'].mti-pay_box:before,
.payment-option-row .option-item label .payment-name [class*=' mti-'].mti-cheque:before {
    font-size: 0.9545em;
}

.payment-option-row .option-item label .payment-name [class^='mti-'].mti-bank_transfer:before,
.payment-option-row .option-item label .payment-name [class*=' mti-'].mti-bank_transfer:before {
    font-size: 1.0909em;
}

.payment-option-row .option-item label .payment-name [class^='mti-'].mti-paypal:before,
.payment-option-row .option-item label .payment-name [class*=' mti-'].mti-paypal:before {
    font-size: 0.6818em;
}

.box-title {
    margin: 0;
    color: #2e286d;
    font-size: 13px;
    line-height: 18px;
    font-weight: 700;
}

.btn-outline {
    border-color: #7638ff;
    color: #7638ff;
}

.btn-outline:hover,
.btn-outline.active {
    background: #7638ff;
    border-color: #7638ff;
    color: #fff;
}

.skin-black-light .wrapper {
    background: #F8F7F9;
}

.skin-black-light .main-sidebar,
.skin-black-light .left-side {
    background: #fff;
}

.main-sidebar,
.left-side {
    min-height: 0;
    bottom: 0;
}

.btn-group > .btn.btn-matat:first-child:not(:last-child):not(.dropdown-toggle),
.btn-group > .btn.btn-matat:not(:first-child):not(:last-child):not(.dropdown-toggle),
.btn-group > .btn.btn-matat:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
    border-radius: 4px;
    margin: 0 4px 10px;
    outline: none;
    outline-offset: 0;
}

.btn.btn-primary, .btn.btn-secondary, .btn.btn-danger, .btn.btn-default, .btn.btn-info, .btn.btn-success, .btn.btn-warning, .btn.btn-link  {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    outline: none;
    margin: 5px;
    padding: 3px 8px;
    height: 32px;
    min-width: 32px;
    border-radius: 7px;
    box-shadow: 0 0 5px 0 rgb(0 0 0 / 15%);
}

.btn.btn-matat.no-margin, .btn.btn-primary.no-margin{
    margin:0;
    min-height: 38px;
} 

.btn.btn-matat, .btn.btn-primary, .btn.btn-secondary, .btn.btn-danger, .btn.btn-default, .btn.btn-info, .btn.btn-success, .btn.btn-warning, .btn.btn-link  {
    font-size: 13px;
    line-height: 16px;
    background: #fff;
    border: 1px solid #efe8ff;
    font-weight: 400;
    color: #813eff;
    -webkit-transition: 0.25s ease background, 0.25s ease border, 0.25s ease color,
        0.25s ease box-shadow;
    transition: 0.25s ease background, 0.25s ease border, 0.25s ease color, 0.25s ease box-shadow;
}

.btn.btn-danger{
    color:#dd4b39;
}

.btn.btn-default, .btn.btn-secondary{
    color: #444;
}

.btn.btn-info{
    color:#00c0ef;
}

.btn.btn-success{
    color:#00a65a;
}

.btn.btn-warning{
    color:#f39c12;
}

.btn.btn-link{
    color:#9B5C8F;
    box-shadow: 0 0 5px 0 rgb(155 92 143 / 50%);
}


.btn.btn-primary:hover,
.btn.btn-primary.active, 
.btn.btn-matat:hover,
.btn.btn-matat.active
{
    background: #fff;
    color: #813eff;
    box-shadow: 0 0 5px 0 rgba(118, 56, 255, 0.32);
    border-color: #813eff;
}

.btn.btn-danger:hover,
.btn.btn-danger.active,
.btn.btn-danger:active:hover{
    color:#dd4b39;
    border-color:#dd4b39;
    background: transparent;
}

.btn.btn-default:hover,
.btn.btn-default.active,
.btn.btn-secondary:hover,
.btn.btn-secondary.active,
.btn.btn-secondary:active:hover{
    color:#444;
    border-color:#444;
    background: transparent;
}

.btn.btn-info:hover,
.btn.btn-info.active,
.btn.btn-info:active:hover{
    color:#00c0ef;
    border-color:#00c0ef;
    background: transparent;
}

.btn.btn-success:hover,
.btn.btn-success.active,
.btn-success:active:hover{
    color:#00a65a;
    border-color:#00a65a;
    background: transparent;
}

.btn.btn-warning:hover,
.btn.btn-warning.active,
.btn.btn-warning:active:hover{
    color:#f39c12;
    border-color:#f39c12;
    background: transparent;
}

.btn.btn-link:hover,
.btn.btn-link.active,
.btn.btn-link:active:hover{
    text-decoration:none;
    color:#9B5C8F;
    border-color:#9B5C8F;
    background: transparent;
}

.btn.thead-filter-button{
    box-shadow: none;
    border: none;
    padding: 0;
    margin: 0;
    height: auto;
    color: #333333;
}

.btn.thead-filter-button:hover{
    box-shadow:none;
    color:#550fc8;
}

.table .btn.btn-primary {
    height: auto;
    display: inline-block;
}

.table .range-btns-box .date-range-btn{
    width:100%;
    height: 32px;
    display: block;
}
.mflow-active {
    background: #813eff !important;
    color: #fff !important;
    font-weight: 700 !important;
}
.btn.btn-matat.mflow-btn-orange{
    border:1px solid #f39c12;
    color:#f39c12;
}

.btn.btn-matat.mflow-btn-orange:hover{
    background:#f39c12;
    color:#FFF;
}

.btn.btn-matat.mflow-btn-primary{
    border:1px solid #7638ff;
    color:#7638ff;
}

.btn.btn-matat.mflow-btn-primary:hover{
    background:#7638ff;
    color:#FFF;
}

.btn.btn-matat.mflow-btn-green{
    border:1px solid #00a65a;
    color:#00a65a;
}

.btn.btn-matat.mflow-btn-green:hover{
    background:#00a65a;
    color:#FFF;
}

.btn.btn-matat.mflow-btn-danger{
    border:1px solid #dd4b39;
    color:#dd4b39;
}

.btn.btn-matat.mflow-btn-danger:hover{
    background:#dd4b39;
    color:#FFF;
}

.btn.btn-matat.active {
    font-weight: 700;
}

.btn > i{
    padding-left:4px;
    padding-right:4px;
}

.info-box.custom_matat {
    background: #fff;
    border: 1px solid #efe8ff;
    box-shadow: 0 5px 10px rgba(118, 56, 255, 0.04);
    border-radius: 6px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 15px;
    min-height: 100px;
}

.info-box.custom_matat .info-title {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
    color: #282460;
    margin-bottom: 15px;
}

.info-box.custom_matat .inner-row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: auto;
}

.info-box.custom_matat .ico-wrap {
    line-height: 1;
    font-size: 36px;
    color: #282460;
    -ms-flex-preferred-size: 42px;
    flex-basis: 42px;
    max-width: 42px;
}

.info-box.custom_matat .ico-wrap i {
    display: block;
}

.info-box.custom_matat .info-box-content {
    margin: 0;
    padding: 0;
    -ms-flex-preferred-size: calc(100% - 42px);
    flex-basis: calc(100% - 42px);
    max-width: calc(100% - 42px);
    line-height: 1.2;
}

.info-box.custom_matat .info-box-number {
    text-align: right;
    font-weight: 700;
    color: #7638ff;
}

.rtl .info-box.custom_matat .info-box-number {
    text-align: left;
}

.main-sidebar {
    background: #fff;
    box-shadow: 0 0 20px 6px rgba(0, 0, 0, 0.05);
    margin-top: 62px;
    padding-top: 7px;
    border-radius: 25px 0 0 0;
    overflow: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.main-sidebar .sidebar {
    max-height: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

.main-sidebar .sidebar::-webkit-scrollbar {
    width: 3px;
}

.main-sidebar .sidebar-logo {
    margin: auto auto 0;
    width: 165px;
    padding: 13px 10px;
    max-width: 100%;
}

.main-sidebar .sidebar-logo a {
    display: block;
}

.main-sidebar .sidebar-logo img {
    display: block;
    width: 100%;
    height: auto;
}

.modal.datePickerOpened .modal-content {
    overflow: visible;
}

.modal .modal-content {
    background: #f9f9f9;
    overflow: hidden;
    border-radius: 6px;
}

#modal_payment .payment_totals_text,
.modal.payment_modal .btn#pos-save {
    max-width: 422px;
    margin: 0 auto;
    color: #fff;
    border-radius: 3px;
    line-height: 1.25;
    font-size: 18px;
    text-align: center;
    padding: 11px;
}

#modal_payment .payment_totals_text .balance_due,
.modal.payment_modal .btn#pos-save .balance_due {
    color: #fff;
}

#modal_payment .payment_totals_text {
    background: #9c81e3;
}

#modal_payment .payment_totals_text .green {
    color: #000 !important;
}

#modal_payment .payment_totals_text .text-danger {
    color: #222;
}

.modal.payment_modal .btn#pos-save {
    background: -webkit-linear-gradient(285deg, #7638ff 2%, #282460 100%);
    background: linear-gradient(165deg, #7638ff 2%, #282460 100%);
    display: block;
}

.widget-header .form-group {
    position: relative;
    margin-bottom: 10px;
}

.widget-header .select-wrap {
    margin-bottom: 10px;
}

.btn.btn-order-list {
    font-size: 12px;
    line-height: 1.5;
    color: #fff;
    font-weight: 700;
    background: #7638ff;
    border-color: #7638ff;
    border-radius: 8px;
    width: 100%;
    padding: 7px 6px;
    margin-bottom: 20px;
}

.widget-header .select2-container.select2-container--default.select2-container--open ~ .btn-add {
    border-bottom-right-radius: 0;
}

.rtl
    .widget-header
    .select2-container.select2-container--default.select2-container--open
    ~ .btn-add {
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 0;
}

.widget-header .form-group .btn-add {
    width: 34px;
    height: 34px;
    position: absolute;
    top: 0;
    right: 0;
    margin: 0;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #e0e0e0;
    box-shadow: 0 5px 10px rgba(118, 56, 255, 0.04);
    font-size: 16px;
    line-height: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #000;
}

.widget-header .form-group .btn-add.add_new_customer {
    margin: 0;
}

.rtl .widget-header .form-group .btn-add {
    right: auto;
    left: 0;
}

.widget-header .product_search .form-control {
    padding-right: 40px;
}

.rtl .widget-header .product_search .form-control {
    padding-right: 15px;
    padding-left: 40px;
}

.pos_left_part .box > .box-header {
    background: #efe8ff;
    border-radius: 8px 8px 0 0;
    padding-top: 14px;
    padding-bottom: 15px;
    border-bottom: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.pos_left_part .box > .box-header .pos-actions-wrap {
    margin-left: auto;
}

.rtl .pos_left_part .box > .box-header .pos-actions-wrap {
    margin-left: 0;
    margin-right: auto;
}

.pos_left_part .box .box-title {
    font-size: 14px;
    font-weight: 700;
    color: #282460;
    line-height: 1.5;
}

.pos_left_part .box .box-title .invoice_number,
.pos_left_part .box .box-title .text-success {
    color: #7638ff;
}

.pos-actions-wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.pos-actions-wrap .btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    outline: none;
    border: none;
    padding: 3px 8px;
    min-width: 30px;
    height: 30px;
    background: #fff;
    color: #7638ff;
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.15);
    border-radius: 6px;
    font-size: 12px;
    line-height: 1;
    margin: 0 0 0 10px;
}

.rtl .pos-actions-wrap .btn {
    margin: 0 10px 0 0;
}

.pos-actions-wrap .btn .mti-close-alt {
    color: #f20000;
}

.pos-actions-wrap .btn [class^='mti-'],
.pos-actions-wrap .btn [class*=' mti-'] {
    font-size: 15px;
}

.pos-actions-wrap .btn [class^='mti-'].mti-grid,
.pos-actions-wrap .btn [class*=' mti-'].mti-grid {
    font-size: 13px;
}

.pos_cart_table#pos_table thead tr th,
.pos_cart_table#pos_table thead tr td {
    border: none;
    color: #7638ff;
    font-weight: 700;
    text-align: center;
}

.pos_cart_table#pos_table thead tr th.product-title,
.pos_cart_table#pos_table thead tr td.product-title {
    max-width: 163px;
}

.pos_cart_table#pos_table tbody tr {
    border: 1px solid #e0e0e0;
}

.pos_cart_table#pos_table tbody tr th,
.pos_cart_table#pos_table tbody tr td {
    border: 1px solid #cecece;
    border-width: 1px 0;
}

.pos_panner_footer .table-wrap {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.pos_panner_footer .table-wrap table {
    width: 100%;
}

form#add_cash_register_form .box {
    max-width: 780px;
}

.register_input_row {
    padding: 10px 0;
}

.register_input_row.form-group {
    margin-bottom: 0;
}

.register_input_row input.input_number,
.register_input_row .btn {
    border-radius: 3px;
}

.register_input_row input.input_number {
    border-color: #e0e0e0;
}

.create-bottom-icon {
    position: absolute;
    bottom: -0.4531em;
    right: -0.4531em;
    width: 2.4219em;
    height: 2.4219em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-shadow: 0 0 20px #d2c6f0;
    font-size: 48px;
    line-height: 1;
    color: #fff;
    background: #f1eaff;
    border-radius: 50%;
}

.rtl .create-bottom-icon {
    right: auto;
    left: -0.4531em;
}

.new-calculator-wrap {
    position: absolute;
    top: 60%;
    left: 50%;
    -webkit-transform: translate(-60%, -50%);
    -ms-transform: translate(-60%, -50%);
    transform: translate(-60%, -50%);
    width: 260px;
}

.rtl .new-calculator-wrap {
    left: auto;
    right: 50%;
    -webkit-transform: translate(60%, -50%);
    -ms-transform: translate(60%, -50%);
    transform: translate(60%, -50%);
}

.new-calculator-wrap .calc-frame {
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 5px 20px rgba(118, 56, 255, 0.2);
}

.new-calculator-wrap .calc-header {
    background: #7638ff;
    border-radius: 6px 6px 0 0;
    position: relative;
    padding: 10px 15px;
}

.new-calculator-wrap .calc-header .input-wrap {
    max-width: 193px;
    margin: 0 auto;
}

.new-calculator-wrap .calc-header .form-control {
    border-radius: 0;
    background: none;
    border-width: 0 0 1px;
    border-color: #fff;
    height: 43px;
    font-size: 24px;
    line-height: 1.25;
    padding: 6px;
    text-align: center;
    font-weight: 700;
    color: #fff;
}

.new-calculator-wrap .calc-close {
    position: absolute;
    top: 0;
    right: 0;
    border: 1px solid #9c81e3;
    outline: none;
    padding: 0;
    margin: 0;
    line-height: 1;
    width: 24px;
    height: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 9px;
    color: #7638ff;
    background: #fff;
    border-radius: 50%;
    -webkit-transform: translate(20%, -20%);
    -ms-transform: translate(20%, -20%);
    transform: translate(20%, -20%);
    -webkit-transition: 0.25s ease color, 0.25s ease background;
    transition: 0.25s ease color, 0.25s ease background;
}

.rtl .new-calculator-wrap .calc-close {
    right: auto;
    left: 0;
    -webkit-transform: translate(-20%, -20%);
    -ms-transform: translate(-20%, -20%);
    transform: translate(-20%, -20%);
}

.new-calculator-wrap .calc-close:hover {
    color: #fff;
    background: #9c81e3;
}

.new-calculator-wrap .calc-body {
    padding: 15px 12px;
}

.new-calculator-wrap .calc-buttons {
    max-width: 180px;
    margin: 0 auto;
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: (1fr) [3];
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 15px;
}

.new-calculator-wrap .calc-buttons .zero,
.new-calculator-wrap .calc-buttons .enter {
    -ms-grid-column: span 2;
    grid-column: span 2;
}

.new-calculator-wrap .calc-buttons .calc-num {
    border: none;
    background: #fff;
    outline: none;
    border-radius: 8px;
    color: #9c81e3;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 700;
    box-shadow: 0 5px 10px rgba(118, 56, 255, 0.3);
    padding: 13px;
    -webkit-transition: 0.25s ease box-shadow;
    transition: 0.25s ease box-shadow;
}

.new-calculator-wrap .calc-buttons .calc-num:hover {
    box-shadow: 0 3px 8px rgba(118, 56, 255, 0.1);
}

.new-calculator-wrap .calc-buttons .calc-num.enter {
    background: #7638ff;
    text-transform: uppercase;
    color: #fff;
}

.ui-widget.ui-widget-content {
    z-index: 9999;
}

#pos_table input.pos_unit_price_inc_tax {
    max-width: 200px;
    margin-left: auto;
    margin-right: auto;
}

#pos_table .pos-row-action {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.pos-btns-row .has_addon-select {
    position: relative;
}

.pos-btns-row .has_addon-select .addon-ico {
    position: absolute;
    top: 20px;
    left: 10px;
    z-index: 6;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    line-height: 1;
}

.rtl .pos-btns-row .has_addon-select .addon-ico {
    left: auto;
    right: 10px;
}

.pos-btns-row .select2-container .select2-selection--single {
    border-radius: 8px;
    background: #fff;
    border: 1px solid #e0e0e0;
    padding-left: 30px;
    padding-right: 25px;
}

.rtl .pos-btns-row .select2-container .select2-selection--single {
    padding-right: 30px;
    padding-left: 25px;
}


@media (min-width: 576px) {
    .new-calculator-wrap {
        width: 330px;
    }

    .new-calculator-wrap .calc-body {
        padding: 26px 20px;
    }

    .new-calculator-wrap .calc-buttons {
        grid-gap: 22px;
        max-width: 224px;
    }

    .new-calculator-wrap .calc-buttons .calc-num {
        padding: 10px 18px;
    }
}

@media (min-width: 768px) {
    .nav > li > a {
        padding-left: 11px;
        padding-right: 11px;
    }

    .push-notification-item {
        border-radius: 10px;
    }

    .main-header .sidebar-toggle {
        margin: 0;
        width: 61px;
    }

    .main-header .sidebar-toggle .toggle-bar {
        height: 3px;
        background: #d8d8d8;
        width: 19px;
    }

    .red-bg .main-header .sidebar-toggle .toggle-bar {
        background: #fff;
    }

    .main-header .sidebar-toggle .toggle-bar:before,
    .main-header .sidebar-toggle .toggle-bar:after {
        height: 3px;
        background: #d8d8d8;
    }

    .red-bg .main-header .sidebar-toggle .toggle-bar:before,
    .red-bg .main-header .sidebar-toggle .toggle-bar:after {
        background: #fff;
    }

    .main-header .navbar .navbar-nav > li.notifications-menu .dropdown-menu > li .menu > li {
        font-size: 14px;
    }

    .main-header
        .navbar
        .navbar-nav
        > li.notifications-menu
        .dropdown-menu
        > li
        .menu
        > li
        .notify-time {
        font-size: 10px;
    }

    .main-header .navbar .navbar-nav > li.notifications-menu .notification-header {
        font-size: 14px;
    }

    .main-header
        .navbar
        .navbar-nav
        > li.notifications-menu
        .notification-header
        .clear-notification {
        font-size: 12px;
    }

    .main-header .navbar .navbar-nav > li.user-menu > a {
        padding-left: 10px;
        padding-right: 15px;
    }

    .rtl .main-header .navbar .navbar-nav > li.user-menu > a {
        padding-right: 10px;
        padding-left: 15px;
    }

    .main-header .navbar .header_btn_business {
        font-size: 14px;
        line-height: 20px;
        margin: 9px 5.5px 9px 14.5px;
    }

    .rtl .main-header .navbar .header_btn_business {
        margin-left: 5.5px;
        margin-right: 14.5px;
    }

    .main-header .header-add-wrap .drop-title {
        font-size: 14px;
        padding: 5px 12px;
        margin-bottom: 7px;
    }

    .main-header .header-add-wrap .dropdown-menu {
        background: #fff;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
        border-radius: 8px;
        min-width: 0;
        width: 205px;
        margin: 5px 0 0 1px;
        padding: 2px 0 8px;
    }

    .rtl .main-header .header-add-wrap .dropdown-menu {
        margin-right: 0;
    }

    .main-header .header-add-wrap .dropdown-menu > li > button {
        padding-left: 12px;
        padding-right: 12px;
    }

    .main-header .header-add-wrap .dropdown-menu > li > a {
        font-size: 14px;
        padding: 4px 12px 3px;
    }

    .main-header .header_btn_add {
        width: 33px;
        height: 33px;
        font-size: 13px;
        margin: 8.5px 10px;
    }

    .main-header .header-search-bar {
        float: left;
    }

    .rtl .main-header .header-search-bar {
        float: right;
    }

    .main-header .search-dropdown .search-recomendation .top-search {
        -ms-flex-preferred-size: 43.5%;
        flex-basis: 43.5%;
        max-width: 43.5%;
    }

    .main-header .search-dropdown .search-recomendation .search-quick-action {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .main-header .search-dropdown .search-recomendation ul li {
        font-size: 14px;
        padding: 3px 0 4px;
    }

    .main-header .search-dropdown .search-title {
        font-size: 14px;
        margin-bottom: 10px;
    }

    .main-header .search-dropdown .header-search-result {
        padding-bottom: 8px;
    }

    .main-header .search-dropdown .result-item {
        padding: 9px 0;
    }

    .main-header .search-dropdown .result-item > a {
        font-size: 14px;
    }

    .main-header .search-dropdown .result-item .result-title {
        font-size: 14px;
        margin-bottom: 5px;
    }

    .main-header .search-dropdown .result-item .customer-name {
        font-size: 12px;
    }

    .main-header .matat-header-btn,
    .btn-white-bg {
        margin: 9px 5px;
    }

    .main-header .matat-header-btn,
    .pos-btns-row .matat-header-btn,
    .btn-white-bg {
        height: 32px;
        min-width: 32px;
        border-radius: 7px;
        font-size: 12px;
    }

    .main-header .matat-header-btn [class^='mti-'],
    .main-header .matat-header-btn [class*=' mti-'],
    .pos-btns-row .matat-header-btn [class^='mti-'],
    .pos-btns-row .matat-header-btn [class*=' mti-'] {
        font-size: 16px;
    }

    .main-header .matat-header-btn [class^='mti-'].mti-grid,
    .main-header .matat-header-btn [class*=' mti-'].mti-grid,
    .pos-btns-row .matat-header-btn [class^='mti-'].mti-grid,
    .pos-btns-row .matat-header-btn [class*=' mti-'].mti-grid {
        font-size: 14px;
    }

    .content-header {
        padding-top: 30px;
        padding-bottom: 12px;
    }

    .content-header h1 {
        font-size: 20px;
    }

    .box-header {
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 20px;
    }

    .box-body {
        padding-left: 20px;
        padding-right: 20px;
    }

    .box-body.sell-box-body {
        padding: 8px;
    }

    .form-group.shipping_cost_group {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        padding-top: 33px;
    }

    .form-group.shipping_cost_group label {
        margin: 0 14px 0 0;
    }

    .rtl .form-group.shipping_cost_group label {
        margin: 0 0 0 14px;
    }

    .form-group.shipping_cost_group .form-control {
        -ms-flex-preferred-size: 71px;
        flex-basis: 71px;
        max-width: 71px;
        padding-left: 3px;
        padding-right: 3px;
        text-align: center;
    }

    .mb-sm-0 {
        margin-bottom: 0 !important;
    }

    label {
        font-size: 14px;
        line-height: 1.5;
    }

    button.add_new_customer {
        font-size: 14px;
        line-height: 1.5;
        margin-top: 13px;
    }

    button.add_new_customer .mti-add-user {
        font-size: 11px;
    }

    .row.inner_same_height {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .row.inner_same_height:before,
    .row.inner_same_height:after {
        display: none;
    }

    .row.inner_same_height > [class^='col-'],
    .row.inner_same_height > [class*=' col-'] {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .row.inner_same_height > [class^='col-'] > .box,
    .row.inner_same_height > [class*=' col-'] > .box {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        max-width: 100%;
    }

    .payment-option-row .option-item label .payment-name {
        font-size: 16px;
        height: 80px;
        color:#353535;
    }

    .modal .payment-option-row .option-item {
        flex-basis: 20%;
        max-width: 20%;
    }

    .modal .payment-option-row .option-item label .payment-name {
        font-size: 14px;
    }

    .payment-option-row .option-item label .payment-name [class^='mti-'],
    .payment-option-row .option-item label .payment-name [class*=' mti-'] {
        font-size: 22px;
        margin: 3px 0 2px;
        min-height: 24px;
    }

    .box-title {
        font-size: 14px;
    }

    .btn-group > .btn.btn-matat:first-child:not(:last-child):not(.dropdown-toggle),
    .btn-group > .btn.btn-matat:not(:first-child):not(:last-child):not(.dropdown-toggle),
    .btn-group > .btn.btn-matat:last-child:not(:first-child),
    .btn-group > .dropdown-toggle:not(:first-child) {
        border-radius: 7px;
        margin: 0 0 0 10px;
    }

    .rtl .btn-group > .btn.btn-matat:first-child:not(:last-child):not(.dropdown-toggle),
    .rtl .btn-group > .btn.btn-matat:not(:first-child):not(:last-child):not(.dropdown-toggle),
    .rtl .btn-group > .btn.btn-matat:last-child:not(:first-child),
    .rtl .btn-group > .dropdown-toggle:not(:first-child) {
        margin-left: 0;
        margin-right: 10px;
    }

    .btn.btn-matat {
        font-size: 14px;
        line-height: 18px;
    }

    .info-box.custom_matat {
        border-radius: 8px;
        min-height: 125px;
        padding: 16px 24px;
    }

    .info-box.custom_matat .info-title {
        font-size: 14px;
    }

    .info-box.custom_matat .ico-wrap {
        -ms-flex-preferred-size: 52px;
        flex-basis: 52px;
        max-width: 52px;
        font-size: 42px;
    }

    .info-box.custom_matat .info-box-content {
        -ms-flex-preferred-size: calc(100% - 52px);
        flex-basis: calc(100% - 52px);
        max-width: calc(100% - 52px);
    }

    .info-box.custom_matat .info-box-number {
        font-size: 22px;
    }

    .main-sidebar {
        border-radius: 0 45px 0 0;
        margin-top: 68px;
    }

    .rtl .main-sidebar {
        border-radius: 45px 0 0 0;
    }

    #modal_payment .payment_totals_text,
    .modal.payment_modal .btn#pos-save {
        font-size: 21px;
        padding: 13px;
    }

    .widget-header .form-group {
        margin-bottom: 20px;
    }

    .widget-header .select-wrap {
        margin-bottom: 20px;
    }

    .btn.btn-order-list {
        padding-top: 8px;
        padding-bottom: 9px;
    }

    .widget-header .form-group .btn-add {
        height: 40px;
        width: 40px;
        font-size: 18px;
    }

    .widget-header .product_search .form-control {
        padding-right: 45px;
    }

    .rtl .widget-header .product_search .form-control {
        padding-left: 45px;
    }

    .pos-actions-wrap .btn {
        height: 32px;
        min-width: 32px;
        border-radius: 7px;
        font-size: 12px;
    }

    .pos-actions-wrap .btn [class^='mti-'],
    .pos-actions-wrap .btn [class*=' mti-'] {
        font-size: 16px;
    }

    .pos-actions-wrap .btn [class^='mti-'].mti-grid,
    .pos-actions-wrap .btn [class*=' mti-'].mti-grid {
        font-size: 14px;
    }

    .pos_panner_footer {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .register_input_row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 20px 0;
    }

    .register_input_row .label-wrap {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        max-width: 100%;
    }

    .register_input_row input.input_number,
    .register_input_row .btn {
        margin: 0 8px 0 0;
        height: 40px;
    }

    .register_input_row input.input_number {
        -ms-flex-preferred-size: 250px;
        flex-basis: 250px;
        max-width: 250px;
    }

    .register_input_row .btn {
        -ms-flex-preferred-size: 170px;
        flex-basis: 170px;
        max-width: 170px;
    }

    .create-bottom-icon {
        font-size: 68px;
    }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    .main-header .logo {
        display: none;
    }

    .rtl .register_input_row input.input_number,
    .rtl .register_input_row .btn {
        margin-right: 0;
        margin-left: 8px;
    }
}

@media (min-width: 992px) {
    .main-header .navbar .navbar-nav > li.user-menu > a {
        padding-left: 11px;
        padding-right: 22px;
    }

    .rtl .main-header .navbar .navbar-nav > li.user-menu > a {
        padding-right: 11px;
        padding-left: 22px;
    }

    .main-header .navbar .header_btn_business {
        margin: 9px 5px 9px 9px;
    }

    .rtl .main-header .navbar .header_btn_business {
        margin-left: 5px;
        margin-right: 9px;
    }

    .main-header .header_btn_add {
        margin-left: 18px;
        margin-right: 10px;
    }

    .rtl .main-header .header_btn_add {
        margin-right: 18px;
        margin-left: 10px;
    }

    .main-header .header-search-bar {
        position: relative;
    }

    .main-header .header-search-bar .search_opener {
        display: none;
    }

    .main-header .header-search-bar .header-search-form {
        margin: 9px 0;
        position: relative;
    }

    .main-header .header-search-bar .form-control {
        width: 184px;
    }

    .main-header .search_drop_active .search-dropdown {
        opacity: 1;
        visibility: visible;
    }

    .main-header .search-dropdown {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: #fff;
        box-shadow: 0 5px 10px 0 rgba(118, 56, 255, 0.14);
        border-radius: 0 0 8px 8px;
        padding: 0 15px;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: 0.3s ease opacity, 0.3s ease visibility;
        transition: 0.3s ease opacity, 0.3s ease visibility;
        min-width: 350px;
    }

    .content-header h1 {
        font-size: 22px;
    }

    .mb-lg-0 {
        margin-bottom: 0 !important;
    }

    #modal_payment .payment_totals_text,
    .modal.payment_modal .btn#pos-save {
        font-size: 21px;
        padding: 15px;
    }

    .register_input_row .label-wrap {
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        max-width: calc(100% - 472px);
        -ms-flex-item-align: center;
        -ms-grid-row-align: center;
        align-self: center;
        padding: 0 8px;
    }

    .register_input_row label {
        margin-bottom: 0;
    }

    .register_input_row input.input_number,
    .register_input_row .btn {
        margin: 0 8px;
    }

    .register_input_row input.input_number {
        -ms-flex-preferred-size: 260px;
        flex-basis: 260px;
        max-width: 260px;
    }

    .register_input_row .btn {
        -ms-flex-preferred-size: 180px;
        flex-basis: 180px;
        max-width: 180px;
    }

    .create-bottom-icon {
        font-size: 88px;
    }
}

@media (min-width: 1200px) {
    .main-header .navbar .header_btn_business {
        margin: 9px 5.5px 9px 14.5px;
    }

    .rtl .main-header .navbar .header_btn_business {
        margin-left: 5.5px;
        margin-right: 14.5px;
    }

    .main-header .header_btn_add {
        margin-left: 35px;
        margin-right: 15px;
    }

    .rtl .main-header .header_btn_add {
        margin-right: 35px;
        margin-left: 15px;
    }

    .main-header .header-search-bar .form-control {
        -webkit-transition: 0.4s ease width;
        transition: 0.4s ease width;
    }

    .main-header .header-search-bar .form-control:focus {
        width: 320px;
    }

    .main-header .search-dropdown {
        padding: 0 20px;
        min-width: 320px;
    }

    .sticky-datatable-upper-area-fixed.sticky-datatable-upper-area {
        right: 20px;
    }

    .rtl .sticky-datatable-upper-area-fixed.sticky-datatable-upper-area {
        left: 20px;
    }

    .content-header {
        padding-top: 34px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .content-header h1 {
        font-size: 24px;
    }

    .content {
        padding-left: 20px;
        padding-right: 20px;
    }

    .box-header {
        padding-left: 27px;
        padding-right: 27px;
    }

    .box-body {
        padding-left: 27px;
        padding-right: 27px;
    }

    .mb-xl-0 {
        margin-bottom: 0 !important;
    }

    .btn.btn-order-list {
        padding-top: 11px;
        padding-bottom: 12px;
        font-size: 14px;
    }

    .widget-header .form-group .btn-add {
        height: 46px;
        width: 46px;
        font-size: 20px;
    }

    .widget-header .product_search .form-control {
        padding-right: 50px;
    }

    .rtl .widget-header .product_search .form-control {
        padding-left: 50px;
    }

    .register_input_row {
        padding: 28px 0;
    }

    .register_input_row .label-wrap {
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        max-width: calc(100% - 519px);
    }

    .register_input_row input.input_number,
    .register_input_row .btn {
        margin: 0 12px;
        height: 40px;
    }

    .register_input_row input.input_number {
        -ms-flex-preferred-size: 274px;
        flex-basis: 274px;
        max-width: 274px;
    }

    .register_input_row .btn {
        -ms-flex-preferred-size: 197px;
        flex-basis: 197px;
        max-width: 197px;
    }

    .create-bottom-icon {
        font-size: 108px;
    }
}

@media (min-width: 1400px) {
    .main-header .header_btn_add {
        margin-left: 51px;
        margin-right: 20px;
    }

    .rtl .main-header .header_btn_add {
        margin-right: 51px;
        margin-left: 20px;
    }

    .main-header .header-search-bar .form-control:focus {
        width: 450px;
    }

    .main-header .search-dropdown {
        padding: 0 24px;
        min-width: 450px;
    }

    .sticky-datatable-upper-area-fixed.sticky-datatable-upper-area {
        right: 26px;
    }

    .rtl .sticky-datatable-upper-area-fixed.sticky-datatable-upper-area {
        left: 26px;
    }

    .content-header {
        padding-top: 46px;
        padding-left: 26px;
        padding-right: 26px;
    }

    .content {
        padding-left: 27px;
        padding-right: 27px;
    }

    .btn.btn-order-list {
        padding-top: 14px;
        padding-bottom: 15px;
    }

    .widget-header .form-group .btn-add {
        width: 50px;
        height: 50px;
        font-size: 22px;
    }

    .widget-header .product_search .form-control {
        padding-right: 55px;
    }

    .rtl .widget-header .product_search .form-control {
        padding-left: 55px;
    }

    .create-bottom-icon {
        font-size: 128px;
    }
}

@media (min-width: 1440px) {
    .main-header .header-search-bar .form-control:focus {
        width: 505px;
    }

    .main-header .search-dropdown {
        min-width: 505px;
    }
}

@media (max-width: 1399.98px) {
    body:not(.auth-container) {
        zoom: 80%;
    }

    #pos_table thead tr th:nth-child(2):not(.dummy-attr-box),
#pos_table tbody tr td:nth-child(2):not(.dummy-attr-box) {
    width: 340px;
}
    .main-header .search-dropdown .search-recomendation {
        padding-top: 35px;
        padding-bottom: 27px;
    }
}

@media (max-width: 1280px) {

    #AnnouncementModal .modal-dialog{
        width: auto!important;
    }

}

@media (max-width: 991.98px) {
    .main-header .header-search-bar .header-search-form {
        top: 100%;
        left: 0;
        right: 0;
        z-index: 99;
        background: #fff;
        padding: 8px 10px;
        opacity: 0;
        visibility: hidden;
        border-top: 1px solid #e0e0e0;
        box-shadow: 0 3px 5px rgba(118, 56, 255, 0.14);
        border-radius: 0 0 7px 7px;
    }

    .main-header .search-dropdown .search-recomendation {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 28px 7px 20px;
    }

    .main-header .search-dropdown .search-recomendation .top-search,
    .main-header .search-dropdown .search-recomendation .search-quick-action {
        -ms-flex-preferred-size: 41.2%;
        flex-basis: 41.2%;
        max-width: 41.2%;
    }

    #announcementAssignForm.wizard > .steps > ul > li {
        width: auto;
    }

    .navbar-custom-menu>.navbar-nav>li>.dropdown-menu{
        min-width:200px;
    }
}

@media (max-width: 767.98px) {

    .main-header .logo {
        position: absolute;
        top: 25px;
        right: auto;
        left: 50%;
        -webkit-transform: translate(-88%, -50%);
        -ms-transform: translate(-88%, -50%);
        transform: translate(-88%, -50%);
        width: 112px;
    }

    .rtl .main-header .logo {
        -webkit-transform: translate(-8%, -50%);
        -ms-transform: translate(-8%, -50%);
        transform: translate(-8%, -50%);
    }

    .table-responsive{
        border:none;
        overflow-y:auto;
    }

    .main-header .navbar .header_btn_business {
        display: none;
    }

    .content-header {
        text-align: center;
    }

    .home-dashboard .content-header {
        padding-bottom: 0;
    }

    .box [class^='col-']:last-of-type .form-group,
    .box [class*=' col-']:last-of-type .form-group {
        margin-bottom: 0;
    }

    .xs-mb-0 {
        margin-bottom: 0 !important;
    }

    .register_input_row input.input_number {
        margin-bottom: 15px;
    }

    .main-footer {
        display: block;
        position: relative;
        text-align: center;
        width: 100%;
    }

    .main-footer .btn-group.static-text {
        float: none!important;
        width: 100%;
        display: flex;
        justify-content: center;
        margin-top: 8px;
    }
}

/* custom css */

input[type=checkbox] {
      position: relative;
      border: 2px solid #D3CFC8;
      border-radius: 6px;
      background: #FFF;
      cursor: pointer;
      line-height: 0;
      outline: 0;
      height: 22px;
      width: 22px;
      margin: 0;
      margin-left: 10px;
      margin-right: 10px;
      -webkit-appearance: none;
  }
  
  input[type=checkbox]:hover {
    border: 3px solid #6A5A8C;
  }
  
  input[type=checkbox]:checked {
    background-color: #6A5A8C;
    border: none;
  }

  input[type=checkbox]:disabled{
    background-color: #E4E2DE;
    border: none;
  }
  
  input[type=checkbox]:before {
    content: '';
    position: absolute;
    right: 50%;
    top: 50%;
    width: 8px;
    height: 12px;
    border: solid #FFF;
    border-width: 0 3px 3px 0;
    margin: -2px 0 0;
    transform: translate(50%, -50%) rotate(45deg);
    z-index: 2;
}

.multiselect-wrapper div .multiselect-container .checkbox input[type=checkbox] {
    margin-inline-start: -22px;
    margin-bottom: 1px;
}

.multiselect-container>li .checkbox,
.form-inline .multiselect-container label.checkbox,
.form-inline .multiselect-container label.radio {
    display: flex;
    align-items: center;
    padding: 3px 0 3px 22px;
}

.rtl .multiselect-container>li .checkbox,
.rtl .form-inline .multiselect-container label.checkbox,
.rtl .form-inline .multiselect-container label.radio {
    padding: 3px 22px 3px 0;
}

.multiselect-container input[type=checkbox] {
    width: 16px;
    height: 16px;
    border-radius: 3px;
    border-width: 1px;
}

.multiselect-container input[type=checkbox]:hover {
    border-width: 1px;
}

.multiselect-container input[type=checkbox]:before {
    width: 5px;
    height: 9px;
    border-width: 0 2px 2px 0;
    margin-top: -1px;
}

  .multiselect-container > li .checkbox span.label {
    margin-left: 6px;
    margin-right: 6px;
    margin-bottom: 5px;
}

.loginbg_wrapper .aos-animate svg #mobile {
    -webkit-animation: float 6s ease-in-out infinite 0.8s;
    animation: float 6s ease-in-out infinite 0.8s;
}

.loginbg_wrapper .aos-animate svg #wordpress,
.loginbg_wrapper .aos-animate svg #cart {
    -webkit-animation: floatall 6s ease-in-out infinite 0.5s;
    animation: floatall 6s ease-in-out infinite 0.5s;
}

.loginbg_wrapper .aos-animate svg #woocommerce,
.loginbg_wrapper .aos-animate svg #paypal {
    -webkit-animation: floatall 6s ease-in-out infinite;
    animation: floatall 6s ease-in-out infinite;
}

.loginbg_wrapper .aos-animate svg #mailchimp {
    -webkit-animation: floatall 6s ease-in-out infinite 0.2s;
    animation: floatall 6s ease-in-out infinite 0.2s;
}

.loginbg_wrapper .aos-animate svg #wix {
    -webkit-animation: floatall 6s ease-in-out infinite 0.6s;
    animation: floatall 6s ease-in-out infinite 0.6s;
}

.loginbg_wrapper .aos-animate svg #magento {
    -webkit-animation: floatall 6s ease-in-out infinite 0.7s;
    animation: floatall 6s ease-in-out infinite 0.7s;
}

.loginbg_wrapper .aos-animate svg #shopify,
.loginbg_wrapper .aos-animate svg #Oval_anim {
    -webkit-animation: floatall 6s ease-in-out infinite 0.3s;
    animation: floatall 6s ease-in-out infinite 0.3s;
}

.loginbg_wrapper .aos-animate svg #Oval2_anim {
    -webkit-animation: floatall 6s ease-in-out infinite 0.1s;
    animation: floatall 6s ease-in-out infinite 0.1s;
}

.loginbg_wrapper .aos-animate svg #Oval3_anim {
    -webkit-animation: floatall 6s ease-in-out infinite 0.2s;
    animation: floatall 6s ease-in-out infinite 0.2s;
}



.animate__animated{
    animation-duration: 0.2s;
    animation-fill-mode: both;
    -webkit-animation-duration: 0.2s;
    -webkit-animation-fill-mode: both;
}

.animate__animated.animate__fadeOutLeft{
    animation-duration: 0.5s;
    animation-fill-mode: both;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
}

.animate__animated.animate__zoomOutUp{
    animation-duration: 0.5s;
    animation-fill-mode: both;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
}

.animate__animated.animate__slideInDown{
    animation-duration: 1s;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: both;
}

.dataTable.animate__animated.animate__slideInDown{
    animation-duration: 1.5s;
    animation-fill-mode: both;
    -webkit-animation-duration: 1.5s;
    -webkit-animation-fill-mode: both;
}


@keyframes zoomOutUp {
    40% {
      opacity: 1;
      -webkit-transform: scale3d(0.75, 0.75, 0.75) translate3d(0, 60px, 0);
      transform: scale3d(0.75, 0.75, 0.75) translate3d(0, 60px, 0);
      -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
      animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }
  
    to {
      opacity: 0;
      -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -100px, 0);
      transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -100px, 0);
      -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
      animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    }
  }
  .animate__zoomOutUp {
    -webkit-animation-name: zoomOutUp;
    animation-name: zoomOutUp;
    -webkit-transform-origin: center top;
    transform-origin: center top;
  }

  @-webkit-keyframes fadeOutBorder {
    from {
      opacity: 1;
      box-shadow: rgb(118 56 254 / 42%) 0px 0px 10px 3px;
    }
  
    to {
      opacity: 0;
      box-shadow: rgb(118 56 254 / 42%) 0px 0px 0px 0px;
    }
  }
  @keyframes fadeOut {
    from {
      opacity: 1;
    }
  
    to {
      opacity: 0;
    }
  }
  .animate__fadeOutBordered {
    -webkit-animation-name: fadeOutBorder;
    animation-name: fadeOutBorder;
  }
  

  @-webkit-keyframes slideInDownDataTable {
    0% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
        opacity: 1;
      }

      20% {
        -webkit-transform: translateY(20%);
                transform: translateY(20%);
        opacity: 1;
      }

      40% {
        -webkit-transform: translateY(40%);
                transform: translateY(40%);
        opacity: 1;
      }

      60% {
        -webkit-transform: translateY(60%);
                transform: translateY(60%);
        opacity: 1;
      }

      80% {
        -webkit-transform: translateY(80%);
                transform: translateY(80%);
        opacity: 1;
      }
      100% {
        -webkit-transform: translateY(100%);
                transform: translateY(100%);
        opacity: 0;
      }
  }
  @keyframes slideInDownDataTable {
    0% {
        -webkit-transform: translateY(0);
                transform: translateY(0);
        opacity: 1;
      }

      20% {
        -webkit-transform: translateY(20%);
                transform: translateY(20%);
        opacity: 1;
      }

      40% {
        -webkit-transform: translateY(40%);
                transform: translateY(40%);
        opacity: 1;
      }

      60% {
        -webkit-transform: translateY(60%);
                transform: translateY(60%);
        opacity: 1;
      }

      80% {
        -webkit-transform: translateY(80%);
                transform: translateY(80%);
        opacity: 1;
      }
      100% {
        -webkit-transform: translateY(100%);
                transform: translateY(100%);
        opacity: 0;
      }
  }

  .animate__slideInDownDataTable:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #FFFFFF;
    height:100vh;
    overflow:hidden;
    -webkit-animation: slideInDownDataTable 0.6s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
    animation: slideInDownDataTable 0.6s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
  } 

  .noboxanim .animate__slideInDownDataTable:after, .fixedHeader-floating.animate__slideInDownDataTable:after{
    display:none;
  }

  .slide-in-blurred-left {
	-webkit-animation: slide-in-blurred-left 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);
	        animation: slide-in-blurred-left 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);
}

@-webkit-keyframes slide-in-blurred-left {
    0% {
      -webkit-transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
              transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
      -webkit-transform-origin: 100% 50%;
              transform-origin: 100% 50%;
      -webkit-filter: blur(40px);
              filter: blur(40px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0) scaleY(1) scaleX(1);
              transform: translateX(0) scaleY(1) scaleX(1);
      -webkit-transform-origin: 50% 50%;
              transform-origin: 50% 50%;
      -webkit-filter: blur(0);
              filter: blur(0);
      opacity: 1;
    }
  }
  @keyframes slide-in-blurred-left {
    0% {
      -webkit-transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
              transform: translateX(-1000px) scaleX(2.5) scaleY(0.2);
      -webkit-transform-origin: 100% 50%;
              transform-origin: 100% 50%;
      -webkit-filter: blur(40px);
              filter: blur(40px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0) scaleY(1) scaleX(1);
              transform: translateX(0) scaleY(1) scaleX(1);
      -webkit-transform-origin: 50% 50%;
              transform-origin: 50% 50%;
      -webkit-filter: blur(0);
              filter: blur(0);
      opacity: 1;
    }
  }

  .slide-in-blurred-right {
	-webkit-animation: slide-in-blurred-right 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000);
	        animation: slide-in-blurred-right 0.6s cubic-bezier(0.230, 1.000, 0.320, 1.000)
}

@-webkit-keyframes slide-in-blurred-right {
    0% {
      -webkit-transform: translateX(1000px) scaleX(2.5) scaleY(0.2);
              transform: translateX(1000px) scaleX(2.5) scaleY(0.2);
      -webkit-transform-origin: 0% 50%;
              transform-origin: 0% 50%;
      -webkit-filter: blur(40px);
              filter: blur(40px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0) scaleY(1) scaleX(1);
              transform: translateX(0) scaleY(1) scaleX(1);
      -webkit-transform-origin: 50% 50%;
              transform-origin: 50% 50%;
      -webkit-filter: blur(0);
              filter: blur(0);
      opacity: 1;
    }
  }
  @keyframes slide-in-blurred-right {
    0% {
      -webkit-transform: translateX(1000px) scaleX(2.5) scaleY(0.2);
              transform: translateX(1000px) scaleX(2.5) scaleY(0.2);
      -webkit-transform-origin: 0% 50%;
              transform-origin: 0% 50%;
      -webkit-filter: blur(40px);
              filter: blur(40px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateX(0) scaleY(1) scaleX(1);
              transform: translateX(0) scaleY(1) scaleX(1);
      -webkit-transform-origin: 50% 50%;
              transform-origin: 50% 50%;
      -webkit-filter: blur(0);
              filter: blur(0);
      opacity: 1;
    }
  }
  

  .bounce-in-fwd {
	-webkit-animation: bounce-in-fwd 1.1s linear both;
	        animation: bounce-in-fwd 1.1s linear both;
}

@-webkit-keyframes bounce-in-fwd {
    0% {
      -webkit-transform: scale(0);
              transform: scale(0);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
      opacity: 0;
    }
    38% {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
      opacity: 1;
    }
    55% {
      -webkit-transform: scale(0.7);
              transform: scale(0.7);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    72% {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    81% {
      -webkit-transform: scale(0.84);
              transform: scale(0.84);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    89% {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    95% {
      -webkit-transform: scale(0.95);
              transform: scale(0.95);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    100% {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
  }
  @keyframes bounce-in-fwd {
    0% {
      -webkit-transform: scale(0);
              transform: scale(0);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
      opacity: 0;
    }
    38% {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
      opacity: 1;
    }
    55% {
      -webkit-transform: scale(0.7);
              transform: scale(0.7);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    72% {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    81% {
      -webkit-transform: scale(0.84);
              transform: scale(0.84);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    89% {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
    95% {
      -webkit-transform: scale(0.95);
              transform: scale(0.95);
      -webkit-animation-timing-function: ease-in;
              animation-timing-function: ease-in;
    }
    100% {
      -webkit-transform: scale(1);
              transform: scale(1);
      -webkit-animation-timing-function: ease-out;
              animation-timing-function: ease-out;
    }
  }

  .fade-in-fwd {
	-webkit-animation: fade-in-fwd 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);
	        animation: fade-in-fwd 0.5s cubic-bezier(0.550, 0.055, 0.675, 0.190);
}

@-webkit-keyframes fade-in-fwd {
    0% {
      -webkit-transform: translateZ(-80px);
              transform: translateZ(-80px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      opacity: 1;
    }
  }
  @keyframes fade-in-fwd {
    0% {
      -webkit-transform: translateZ(-80px);
              transform: translateZ(-80px);
      opacity: 0;
    }
    100% {
      -webkit-transform: translateZ(0);
              transform: translateZ(0);
      opacity: 1;
    }
  }

  /* Home Dashboard */

 .home-dashboard-section {
    display: flex;
    flex-wrap: wrap;
}

.home-dashboard-section > div {
    margin-bottom:16px;
}

.home-dashboard-section > div .box {
    height: 100%;
}

.homebox-wrapper .box-header{
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.homebox-wrapper .box-header > div:first-child {
    flex: 1 1 0%;
}

.homebox-wrapper .box-header .box-tab .btn{
    min-width:60px;
}

.totalagentlist_wrapper{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    margin: 0 0 10px;
}

.totalagentlist_wrapper strong{
    margin-right:8px;
}

.rtl .totalagentlist_wrapper strong{
    margin-right:0;
    margin-left:8px;
}

/* end of Home Dashboard */

  .fade-in-fwd .accrodion-top-static-border,   .fade-in-fwd .accrodion-bottom-static-border {
    opacity:0;
    visibility: hidden;
  }

 .box_wrapper .sticky-datatable-upper-area{
    border-color:transparent;
 }
  
.dflexbetween_mflow{
    display: flex;
    justify-content: space-between;
    align-items:center;
}

.mflow-choose-file .file-upload .mflowfile-upload-select {
	display: flex;
    align-items:center;
    cursor: pointer;
    overflow: hidden;
    position: relative;
    border-radius: 8px;
    border: 1px solid #ccc;
}

.mflow-choose-file .file-upload .mflowfile-upload-select .btn {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    margin: 0;
    color:#333;
    border-color: transparent;
    padding-left: 15px;
    padding-right: 20px;
}

.mflow-choose-file .file-upload .mflowfile-upload-select:hover, .mflow-choose-file .file-upload .mflowfile-upload-select:hover .btn{
    color: #4b04b8;
    font-weight:bold;
}

.mflow-choose-file .file-upload .mflowfile-upload-select .mflowfile-select-name {
	width: 100%;
    display: inline-block;
    padding: 0px 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.mflow-choose-file .file-upload .mflowfile-upload-select input[type="file"] {
	display: none;
}


/* header */

.skin-black-light .main-header .navbar .sidebar-toggle:hover {
    background: transparent;
}

.skin-black-light .main-header .navbar .sidebar-toggle:hover span.toggle-bar,
.skin-black-light .main-header .navbar .sidebar-toggle:hover span.toggle-bar:before,
.skin-black-light .main-header .navbar .sidebar-toggle:hover span.toggle-bar:after {
    background: #282460;
}

.dropdown-lang{
    display:none;
}

.dropdown-lang .select2 .select2-selection{
    border:none;
    height:auto;
    padding: 5px 15px 5px 25px;
    line-height: 20px;

}

.dropdown-lang.dropdown-lang-mobile .select2 .select2-selection{
    padding: 0;
    display: flex;
    background: transparent;
}

.dropdown-lang .select2 .select2-selection .select2-selection__rendered{
    line-height:20px;
}

.dropdown-lang .select2 .select2-selection .select2-selection__arrow{
    height: 15px;
    left: 18px;
}

.form-group {
    margin-bottom: 20px;
}

.btn.btn-lg.btn-white-bg {
    height: auto;
    padding: 1rem 2rem;
    line-height: 1.5;
}

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th {
    vertical-align: middle;
}

.show-actions-modal-tr-section{
    position: relative;
    box-shadow: rgb(118 56 254 / 42%) 0px 0px 20px 5px;
    transition: all linear 0.5s;
}

.show-actions-modal-tr-section.no-shadow{
    box-shadow: rgb(118 56 254 / 42%) 0px 0px 0px 0px;;
}



.skin-black-light .sidebar-menu > li.active > a {
    border-inline-start-color: #5915ce;
}

.rtl .delete_brand_button {
    margin: 0px 10px 0 0px !important;
}

.auth-container.login_wrapper {
    min-width: 100%;
    min-height: 100%;
    background: url(/images/login-bg.png) no-repeat center top fixed;
    background-size: cover;
}

.login_wrapper select.form-control:not([size]):not([multiple]) {
    height: 32px;
}

.auth-container {
    background: #f9f9f9;
}

.form-body .auth-form-row {
    justify-content: space-between;
}

.loginbg_wrapper {
    position: relative;
    flex-basis: 52.71%;
    max-width: 52.71%;
}

.loginbg_wrapper .bg-image {
    position: absolute;
    top: -20px;
    right: -10px;
    max-width: 774px;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 2;
}

.ltr .loginbg_wrapper .bg-image{
    right:inherit;
    left:-10px;
}

.loginbg_wrapper .img-holder-wrapper {
    position: relative;
    display: flex;
    align-items: flex-start;
    z-index: 12;
    height: 100%;
    padding-top: 110px;
    padding-right: 28px;
}

.ltr .loginbg_wrapper .img-holder-wrapper{
    padding-right: 0;
    padding-left:28px;
}

.loginbg_wrapper .img-holder-wrapper svg {
    width: 100%;
    max-width: 712px;
    overflow: visible;
}

.form-body .checkbox label {
    font-size: 14px;
    padding-right: 0px;
}

.form-body.rtl .auth-form-row .form-group label .icheckbox_square-purple{
    margin-right:0;
    margin-left:10px;
}

.form-body .form-content {
    max-width: 400px;
    margin: 0 auto;
}

.form-body .form-holder {
    display: flex;
    align-items: center;
    padding-top: 17px;
}
.form-body .website-logo {
    width: 100%;
    padding-top: 0px;
    margin-bottom: 40px;
}

.form-body .website-logo .logo img {
    height: 56px;
}

.form-body .website-logo > p {
    margin-top: 25px;
    margin-bottom: 0px;
    text-align: center;
    font-size: 22px;
    color: #7638ff;
    font-weight: bold;
}

.form-body .form-items h3,
.form-body .form-items > p {
    text-align: center;
    color: #000000;
}

.form-body .form-items h3 {
    font-size: 30px;
    line-height: 44px;
    margin-bottom: 15px;
}

.form-body .form-items > p {
    margin-bottom: 40px;
    font-size: 16px;
}

.form-body .form-control::placeholder {
    color: #000000;
}

.form-body .form-control {
    height: 45px;
    color: #000000;
    border: 2px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: none;
    font-size: 14px;
}

.form-body .form-control:focus {
    border-color: #611fdd;
}

.form-body .checkbox label .icheckbox_square-blue {
    width: 20px;
    height: 20px;
    border-color: #e0e0e0;
}

.form-body .form-control-feedback {
    left: 15px;
    top: 50%;
    width: auto;
    font-size: 14px;
    opacity: 0.5;
    text-decoration: underline;
    pointer-events: visible;
    cursor: pointer;
    transform: translateY(-50%);
}

.form-body.ltr .form-control-feedback{
    left:inherit;
    right:15px;
}

.form-body .ibtn {
    background-image: linear-gradient(to right, #6534dc 0%, #4e2eae 70%, #2e266d 100%);
    width: 80%;
    margin-left: 0;
    margin: 0 auto;
    padding: 11px 12px 12px;
    line-height: 1.5;
    border-radius: 30px;
}

.form-body .ibtn:hover {
    background: linear-gradient(to left, #6534dc 0%, #4e2eae 70%, #2e266d 100%);
    color: #fff;
}

.form-body .form-holder .text-divider {
    margin-top: 40px;
    margin-bottom: 40px;
}

.form-body .form-holder .text-divider span {
    background-color: #f9f9f9;
}

.form-body .form-group.account_wrap {
    display: flex;
    justify-content: center;
    margin-top: 40px;
    font-size: 16px;
    color: #000;
}

.form-body .form-group.account_wrap a {
    color: #5d32cb;
    font-weight: bold;
    text-decoration: underline;
    padding-left: 10px;
    padding-right: 10px;
}

.form-body .form-group.account_wrap a:hover {
    color: #282460;
}

#collapseFilter .form-group label {
    color: #2e286d;
}

.text-info {
    color: #5f1bd8;
}

.form-control,
.select2-container--default .select2-selection--single,
.select2-selection .select2-selection--single {
    padding-left: 6px;
    padding-right: 6px;
}

.select2-container--default .select2-selection--multiple {
    border-radius: 8px;
    min-height: 38px;
}

.select2-dropdown,
.ui-menu.ui-widget.ui-widget-content {
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

.select2-dropdown,
.ui-menu.ui-widget.ui-widget-content {
    border: none;
    box-shadow: 0px 0px 30px 5px rgb(0 0 0 / 13%);
    padding: 8px;
}

.ui-menu-item .ui-menu-item-wrapper.ui-state-active {
    background: transparent;
    border: 1px solid #5f1dda;
    border-radius: 8px;
    color: #5f1dda !important;
    font-weight: bold;
    padding: 10px;
}

.ui-menu .ui-menu-item {
    padding: 7px 10px;
}

.select2-search--dropdown {
    margin-bottom: 8px;
}

.select2-container--default .select2-results__option[aria-selected='true'] {
    background-color: rgb(78 7 188 / 16%);
    border-radius: 8px;
    margin-top: 6px;
    margin-bottom: 6px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: #ffffff;
    color: #601dda;
    border-radius: 8px;
    border: 1px solid #601dda;
    font-weight: bold;
}

.select2-container--default .select2-results__option--highlighted[aria-selected]:hover {
    color: #601dda;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 65vh;
}

.select2-search--dropdown .select2-search__field {
    border-radius: 8px;
}

.lang-wrapper .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100%;
}

.form-group label {
    color: #000;
}

.checkbox label span.checkbox_labeltext{
    padding-left:10px;
    padding-right:10px;
}

.flex-center-align, .form-group-multiple-wrapper .form-group-inline, .form-group-multiple-wrapper .form-group-inline .input-date{
    display: flex;
    align-items: center;
}

.form-group-multiple-wrapper .form-group-inline label{
    min-width:150px;
}

.form-group-multiple-wrapper .form-group-inline .input-date, .form-group-multiple-wrapper .form-group-inline .form-control{
    width:200px;
}

.form-group-multiple-wrapper .form-group-inline .input-date .input-group-btn{
    margin:0 8px;
}

.form-control:focus {
    border-color: #611fdc;
    box-shadow: none;
}

.input-group,
.wizard .input-group {
    width: 100%;
}

.wizard > .steps > ul > li {
    width: auto;
}

.wizard > .content > .body input {
    border-radius: 8px;
}

.wizard > .content > .body input[type=checkbox] {
    border-radius: 6px;
}

.wizard > .content > .body label.error {
    margin-left: 8px;
}

.rtl .wizard > .content > .body label.error {
    margin-left: 0;
    margin-right: 8px;
}

.sticky-content-wrapper {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
    padding: 6px 0px;
}

.sticky-content-wrapper .leftdivsticky .dataTables_filter > label .form-control{
    min-width:300px;
}

.rightdivsticky {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    flex: 1 1 0%;
}

.rightdivsticky .pull-rightA .dt-buttons.btn-group .btn.btn-matat{
    min-width:38px;
    height:38px;
    line-height:38px;
}

.leftdivsticky .dataTables_filter label, .rightdivsticky .pull-rightB label{
    margin-bottom:0;
}

.rightdivsticky .pull-rightB label{
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width:72px;
}

.rightdivsticky .pull-rightB label .select2 {
    margin-left:4px;
    margin-right:4px;
}

.mflowdataTableSection.table-responsive {
    margin-top: 0!important;
    margin-bottom: 0;
    min-height:auto;
}

.box.boxanim.box_wrapper .box-body .mflowdataTableSection.table-responsive  {
    overflow-x: auto !important;
}

.mflowdataTablepagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.mflowdataTablepagination .dataTables_paginate {
    padding-top:8px;
    flex: 1 1 0%;
}

.input-group .form-control,
.modal .wizard .input-group .form-control,
.dataTables_length .form-control {
    height: 38px;
    border-radius: 8px;
}

.input-group .form-control:focus,
.modal .wizard .input-group .form-control:focus,
.dataTables_length .form-control:focus {
    border-color: #5f1dda;
}

.box .box-body .form-group > label {
    color: #2e286d;
}

.modal button.close, .modal button.close span{
    font-size:28px!important;
}

.modal .wizard {
    padding-left: 10px;
    padding-right: 10px;
}

.modal .wizard .steps ul,
body .box .wizard .steps ul {
    display: flex;
    border-bottom: 2px solid #f4f4f4;
}
.modal .wizard .steps ul > li,
body .box .wizard .steps ul > li {
    white-space: nowrap;
}

.modal .wizard .steps ul > li a,
body .box .wizard .steps ul > li a {
    text-align: center;
    margin: 0;
    color: #aaa;
}

body .box .wizard > .steps .done a,
body .box .wizard > .steps .done a:hover,
body .box .wizard > .steps .done a:active {
    background: #ffffff;
    border-radius: 0px;
    color: #6c2cef;
    font-weight: bold;
}

.modal .wizard .steps ul > li.disabled a,
body .box .wizard .steps ul > li.disabled a,
.wizard > .steps .done a {
    background: transparent!important;
}

.modal .wizard .steps ul > li.current a,
.modal .wizard .steps ul > li.active a,
.modal .wizard .steps ul > li:hover a,
body .box .wizard .steps ul > li.current a,
body .box .wizard .steps ul > li a:hover {
    background: transparent;
    color: #5e1bd8;
    border-bottom: 2px solid #5e1bd8;
    border-radius: 0px;
    font-weight: 600;
    margin-bottom: -2px;
    cursor: pointer;
}

.modal .wizard .content,
body .box .wizard .content {
    background: transparent;
    border-radius: 0px;
    margin: 0;
}

.modal .wizard .content fieldset legend,
body .box .wizard .content fieldset legend {
    border-bottom: none;
    font-weight: bold;
    margin-bottom: 0;
}
.modal .wizard .actions,
body .box .wizard .actions {
    padding-top: 10px;
    border-top: 1px solid gainsboro;
}

.modal .wizard .actions ul > li a,
body .box .wizard .actions ul > li a {
    font-size: 14px;
    line-height: 18px;
    background: #fff;
    border: 1px solid #efe8ff;
    font-weight: 400;
    color: #813eff;
    -webkit-transition: 0.25s ease background, 0.25s ease border, 0.25s ease color,
        0.25s ease box-shadow;
    transition: 0.25s ease background, 0.25s ease border, 0.25s ease color, 0.25s ease box-shadow;
}

.modal .wizard .actions ul > li a:hover,
body .box .wizard .actions ul > li a:hover {
    background: #fff;
    box-shadow: 0 0 5px 0 rgb(118 56 255 / 32%);
    border-color: transparent;
}

.modal .wizard .actions ul > li.disabled a,
body .box .wizard .actions ul > li.disabled a {
    background: #eee;
    color: #aaa;
    cursor: not-allowed;
}

.modal-footer, .modal-footer > div {
    display: flex;
    align-items: center;
    justify-content: right;
    flex-direction: row-reverse;
}

.modal-footer > [class*="col-"] {
    padding-left: 0;
    padding-right: 0;
}

.rtl .modal-footer, .rtl .modal-footer > div {
    justify-content: left;
}

.modal-footer .btn+.btn{
    margin:5px;
}

.wizard > .actions {
    position: fixed;
    left: 0;
    bottom: 0;
    padding-right: 30px;
    display: block;
    text-align: right;
    width: 100%;
    background: #ffffff;
    z-index: 99;
}

.user_register.wizard > .content{
    min-height: auto;
}

.register_lang {
    position: fixed;
    right: 0;
}

.rtl .register_lang{
    right:inherit;
    left:0;
}

.user_register.wizard .actions {
    position: unset;
}

.doc_btn {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.doc_btn.custom_box_radio_button .btn {
    width: 100px;
    margin: 0 8px;
}

.multiselect-wrapper {
    position: relative;
}

.multiselect-container.dropdown-menu>li>a{
    white-space: normal;
}

.multiselect-wrapper .open .multiselect.dropdown-toggle {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.multiselect-wrapper .multiselect.dropdown-toggle {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #FFFFFF;
    border-radius: 8px;
    border-color: #ccc;
    height: 38px;
}

.multiselect-wrapper .btn-default.active.focus,
.multiselect-wrapper .btn-default.active:focus,
.multiselect-wrapper .btn-default.active:hover,
.multiselect-wrapper .btn-default:active.focus,
.multiselect-wrapper .btn-default:active:focus,
.multiselect-wrapper .btn-default:active:hover,
.multiselect-wrapper .open > .dropdown-toggle.btn-default.focus,
.multiselect-wrapper .open > .dropdown-toggle.btn-default:focus,
.multiselect-wrapper .open > .dropdown-toggle.btn-default:hover {
    background-color: transparent;
    border-color: #ccc;
}

.multiselect-wrapper .multiselect-container {
    width: 100%;
    border-color: transparent;
    padding: 8px;
    box-shadow: 0px 0px 30px 5px rgb(0 0 0 / 13%);
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
}

.multiselect-wrapper.multiselect-wrapper-auto .multiselect-container {
    width:auto;
}

.multiselect-wrapper.multiselect-curved .multiselect-container{
    border-radius:8px;
}

.multiselect-wrapper .multiselect-container li.active a label {
    color: #5c18d4 !important;
}

.multiselect-wrapper .multiselect-container>li{
    margin-bottom:5px;
}

/* .form-inline .multiselect-wrapper .multiselect-container label.checkbox, .form-inline .multiselect-wrapper .multiselect-container label.radio {
    padding: 0;
} */

.form-group .input-group.dflex-group, .input-group.dflex-group-multi-select {
    display: flex;
    align-items: center;
}
.form-group .input-group.dflex-group input.form-control {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    width: 100px;
}

.rtl .form-group .input-group.dflex-group input.form-control {
    border-radius: 8px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
    width: 100px;
}

.form-group .input-group.dflex-group .select2 {
    width: 100% !important;
}

.form-group .input-group.dflex-group .select2 .select2-selection {
    border-left: 0;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.rtl .form-group .input-group.dflex-group .select2 .select2-selection {
    border-right: 0;
    border-left: 1px solid #ccc;
    border-radius: 0px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

.form-group .input-group.dflex-group-multi-select .form-control,
.form-group .input-group.dflex-group-multi-select .select2 .select2-selection {
    border-radius: 8px;
}

.form-group .input-group.dflex-group-multi .input-group-addon:first-child,
.form-group .input-group.dflex-group-multi .form-control:first-child,
.form-group .input-group.file-caption-main .form-control:first-child,
.form-group .input-group.dflex-group-multi-select .select2 .select2-selection {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;

}

.form-group .input-group.dflex-group-multi-select .select2 .select2-selection{
    border-right:0;
}

.rtl .form-group .input-group.dflex-group-multi-select .select2 .select2-selection{
    border-left:0;
}

.rtl .form-group .input-group.dflex-group-multi .input-group-addon:first-child,
.rtl .form-group .input-group.dflex-group-multi .form-control:first-child,
.rtl .form-group .input-group.file-caption-main .form-control:first-child,
.rtl .form-group .input-group.dflex-group-multi-select .select2 .select2-selection {
    border-radius: 0;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.form-group .input-group.dflex-group-multi .select2 .select2-selection {
    border-radius: 8px;
}

.input-group.dflex-group-multi-rtl span.jq-dte{
    display: block;
    width: 100%;
    height: 38px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 6px;
    padding-right: 6px;
    margin:0;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    border-radius:8px;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.input-group.dflex-group-multi-rtl span.jq-dte-inner {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0px;
    margin: 0px;
}

.input-group.dflex-group-multi-rtl span.jq-dte {
    border-top-right-radius:0px;
    border-bottom-right-radius:0px;
}

.rtl .input-group.dflex-group-multi-rtl span.jq-dte {
    border-radius:8px;
    border-top-right-radius:0px;
    border-bottom-right-radius:0px;
}

.input-group.dflex-group-multi-rtl .input-group-addon {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.rtl .input-group.dflex-group-multi-rtl .input-group-addon {
    border-left:0;
    border-radius:8px;
    border-top-left-radius: 0px!important;
    border-bottom-left-radius: 0px!important;
    border-right:1px solid #d2d6de;
}

.dflex-group-multi-rtl .jq-dte-inner .jq-dte-year{
    width: 36px!important;
}

.input-group.dflex-group-multi .form-control:last-child,
.input-group.dflex-group-multi .select2 .select2-selection:last-child,
.form-group .input-group.dflex-group-multi-select input.form-control,
.input-group.dflex-group-multi span.jq-dte:last-child{
    border-radius: 8px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.rtl .input-group.dflex-group-multi .form-control:last-child,
.rtl .input-group.dflex-group-multi .select2 .select2-selection:last-child,
.rtl .form-group .input-group.dflex-group-multi-select input.form-control,
.rtl .input-group.dflex-group-multi span.jq-dte:last-child {
    border-radius: 8px !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.form-group .input-group.dflex-group-multi-select .form-control-new {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-right: 0;
}

.rtl .form-group .input-group.dflex-group-multi-select .form-control-new {
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
    border-radius: 0;
    border-left: 0;
    border-right: 1px solid #ccc;
}

.form-group .input-group.dflex-group-multi .input-group-btn .btn.btn-primary,
.form-group .input-group.file-caption-main .input-group-btn .btn.btn-primary,
.form-group .input-group.dflex-group-multi-select .input-group-btn .btn.btn-default {
    padding: 8px 12px;
    border-radius: 0px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.rtl .form-group .input-group.dflex-group-multi .input-group-btn .btn.btn-primary,
.rtl .form-group .input-group.file-caption-main .input-group-btn .btn.btn-primary,
.rtl .form-group .input-group.dflex-group-multi-select .input-group-btn .btn.btn-default {
    border-radius: 8px !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}

.form-group .input-group.dflex-group-multi .input-group-btn .btn.btn-primary i {
    color: #ffffff;
}

.qty_group .input-group-btn:first-child .btn {
    border-right: 0 !important;
    border-radius: 0;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
}

.qty_group .input-group-btn:last-child .btn {
    border-radius: 0 !important;
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}

.rtl .qty_group .input-group-btn:first-child .btn {
    border-right: 1px solid #ccc !important;
    border-radius: 0 !important;
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}

.rtl .qty_group .input-group-btn:last-child .btn {
    border-radius: 0 !important;
    border-top-left-radius: 8px !important;
    border-bottom-left-radius: 8px !important;
}

.clone_wrapper{
    position: relative;
    display: inline-block;
    margin-top: 5px;
}

.clone_wrapper > .form-control{
    padding-right: 40px;
}

.clone_wrapper > .input-group-btn {
    position: absolute;
    right: 0px;
    width: auto;
    display: block;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9;
}

.clone_wrapper > .input-group-btn .btn{
    height: 38px;
    margin: 0;
}

.rtl .clone_wrapper > .form-control{
    padding-right: 6px;
    padding-left: 40px;
}

.rtl .clone_wrapper > .input-group-btn{
    right: inherit;
    left:0;
}

.daterangepicker table {
    border-collapse: separate;
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
    background-color: #530dc5;
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
    background-color: transparent;
    border: 1px solid #530dc5;
    color: #530dc5;
    border-radius: 4px;
}

.ranges li {
    color: #530dc5;
}

.daterangepicker .input-mini.active {
    border-color: #530dc5;
}

.ranges li.active {
    font-size: 13px;
    line-height: 16px;
    background: #fff;
    border: 1px solid #efe8ff;
    font-weight: 400;
    color: #813eff;
    box-shadow: 0 0 5px 0 rgb(118 56 255 / 32%);
    border-color: transparent;
    -webkit-transition: 0.25s ease background, 0.25s ease border, 0.25s ease color,
        0.25s ease box-shadow;
    transition: 0.25s ease background, 0.25s ease border, 0.25s ease color, 0.25s ease box-shadow;
}

.ranges li:hover {
    background: #fff;
    box-shadow: 0 0 5px 0 rgb(118 56 255 / 32%);
    border-color: transparent;
    color: #530dc5;
}

.rtl .daterangepicker.dropdown-menu {
    left: inherit !important;
    right: 298px !important;
}

.rtl .daterangepicker.opensright:before {
    left: inherit;
    right: 9px;
}

.rtl .daterangepicker.opensright:after {
    left: inherit;
    right: 10px;
}

.rtl .daterangepicker .ranges,
.rtl .daterangepicker .calendar {
    float: right;
}

.rtl .ranges li {
    text-align: right;
}

.rtl .calendar .calendar-table table th.next i,
.rtl .calendar .calendar-table table th.prev i {
    transform: rotate(180deg);
}

/* message */

.msg-post {
    border: 1px solid #f3f4f5;
    padding-top: 10px;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 5px 10px 0 rgb(118 56 255 / 4%);
}

.msg-data{
    margin-bottom: 16px;
}

.msg-data .msg-username{
    font-weight:bold;
    color:#611fdd;
}

.msg-data .msg-date{
    color: #434651;
    padding-left: 6px;
    padding-right:6px;
}

.msg-post .msg-description{
    padding: 18px 20px;
    line-height: 26px;
    border-radius: 8px;
    width: 90%;
    position: relative;
    background: #f3f4f5;
}

.msg-post .msg-description:after{
    bottom: 100%;
    left: 2%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-bottom-color: #f3f4f5;
    border-width: 10px;
    margin-left: -10px;
}

.rtl .msg-post .msg-description:after{
    left: inherit;
    right: 2%;
}

/* table */

table thead th {
    color: #2e286d;
}

.tableDiv {
    border: 1px solid #ccc;
    border-radius: 8px;
}

.tableDiv #pos_table, .tableDiv #matrix_sell_table {
    margin-bottom: 0;
}

.tableDiv #pos_table thead tr th,
.tableDiv #pos_table thead tr td,
.tableDiv #matrix_sell_table thead tr td {
    border: none;
    border-bottom: 1px solid #ccc;
}

div.dataTables_wrapper div.dataTables_length select {
    min-width: 70px;
    width: auto;
}

table.dataTable.fixedHeader-floating th {
    white-space: nowrap;
    z-index: 9;
}

table.dataTable.fixedHeader-floating, table.dataTable.fixedHeader-locked{
    margin-top: 3px !important;
}

.box.boxanim{
    display: none;
}

/* table.dataTable thead{
    position: sticky!important;
  }

table.dataTable thead {
    inset-block-start: 0!important; 
  } */

.dataTableBordered.dataTable thead>tr>th.sorting_asc, 
.dataTableBordered.dataTable thead>tr>th.sorting_desc,
.dataTableBordered.dataTable thead>tr>th.sorting, 
.dataTableBordered.dataTable thead>tr>td.sorting_asc, 
.dataTableBordered.dataTable thead>tr>td.sorting_desc, 
.dataTableBordered.dataTable thead>tr>td.sorting{
    padding-right:0;
 }

 .dataTableBordered.dataTable thead .sorting:after, 
 .dataTableBordered.dataTable thead .sorting_asc:after, 
 .dataTableBordered.dataTable thead .sorting_desc:after, 
 .dataTableBordered.dataTable thead .sorting_asc_disabled:after, 
 .dataTableBordered.dataTable thead .sorting_desc_disabled:after{
    bottom: unset;
    top: 50%;
    transform: translateY(-50%);
 }

 .sortable-width{
    min-width:150px;
 }

 td.whitespace-nowrap {
    white-space: nowrap;
}

td.product-categorytd > div{
    width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
}

 .td-row-bg{
    padding: 8px;
    line-height: 1.42857143;
    border-radius: 8px;
 }

 .td-padd-btn{
    width:3%;
 }

 .action-tds-btn{
    min-height:24px;
 }

.th-payment-sm, .td-payment-sm{
    width: 140px;
}

 .td-padd-btn  .td-row-bg{
    padding: 6px;
 }

 .td-padd-btn  .td-row-bg .btn{
    display:flex;
    height: 32px;
    margin-top:0;
    margin-bottom:0;
 }

 .tblflex .td-row-bg, .btnflextbl{
    display:flex;
    align-items:center;
 }

 .btnflextbl .btn{
    height:auto;
    display: inline-block;
 }

 .td-null-data{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: auto;
    border-radius: 8px;
    text-align: center;
 }

 .td-null-data .icheckbox_square-purple, .dataTableBordered th .icheckbox_square-purple {
    margin-left:10px;
 }

 .dataTableBordered tr:nth-child(odd) .td-row-bg,  .dataTableBordered tr:nth-child(odd) .td-null-data  {
    background: #f9f9f9;
}

.dataTableBordered tr:nth-child(odd) .selectable_td .td-row-bg, .dataTableBordered tr:nth-child(odd) .selectable_td .td-null-data,  #product_list_popup_table tbody td:first-child .td-row-bg{
    background: transparent;
}

td.td-spacebetween .td-row-bg {
    display: flex;
    justify-content: space-between;
    align-items:center;
}

td.td-spacebetween .td-row-bg i.fa-album-collection, td.td-spacebetween .td-row-bg i.fa-truck-fast{
    font-size:18px;
}

.movement_row_wrap td, table.dataTableBordered td{
    text-align:center;
}

.width_padding.ouline-matat select[multiple]{
   display:none;
}

.form-group select[multiple] {
    height: 38px;
    overflow: hidden;
}

.form-group select[multiple] option {
    background: transparent;
    height: 100%;
    padding-top: 3px;
}

.form-group.form-group-inline {
    display: flex;
    flex-wrap: wrap;
    margin-bottom:0px;
}

.form-group.form-group-inline textarea{
    flex: 1 1 0%;
}

.form-group.form-group-inline .input-group-btn-secondary .btn{
    border-top-left-radius: 0!important;
    border-bottom-left-radius: 0!important;
}

.rtl .form-group.form-group-inline .input-group-btn-secondary .btn{
    border-top-left-radius: 8px!important;
    border-bottom-left-radius: 8px!important;
    border-top-right-radius: 0!important;
    border-bottom-right-radius: 0!important;
}

.td-text-left .td-row-bg{
    text-align: left;
}
.rtl .td-text-left .td-row-bg{
    text-align: right;
}

#pos_table .doc_currency_conversion_rate_wrap {
    display: flex;
    width: 150px;
    margin: 0 auto;
}

.nav-tabs-custom .nav.nav-tabs > li.tbl_mainbutton {
    display: flex;
    flex: 1;
    justify-content: flex-end;
}

.nav-tabs-custom .nav.nav-tabs {
    align-items: center;
}

.nav-tabs-custom .nav.nav-tabs > li.tbl_mainbutton .btn-white-bg,
.footer-total .btn-white-bg {
    display: inline-block;
    margin-top: 0;
    margin-bottom: 0;
    height: auto;
}

.pull-specific-priduct-btn_wrapper {
    position: relative;
    display: flex;
    flex: 1 1 0%;
}

.pull-specific-priduct-btn {
    position: absolute;
    bottom: 0px;
    right: 0;
    z-index: 99;
}

.rtl .pull-specific-priduct-btn {
    right: inherit;
    left: 0;
}

.centerlize-tbl {
    display: flex;
    align-items: center;
}

.centerlize-tbl p {
    margin: 0;
    padding-right: 8px;
    margin-right: 8px;
    border-right: 1px solid #dbdbdb;
}

.centerlize-tbl p:last-child {
    border-right: 0;
    padding: 0;
    margin: 0;
}

.rtl .centerlize-tbl p {
    margin: 0;
    padding: 0;
    padding-left: 8px;
    margin-left: 8px;
    border-right: 0;
    border-left: 1px solid #dbdbdb;
}

.rtl .centerlize-tbl p:last-child {
    border-left: 0;
}

.status-open {
    border: 1px solid #f39c12;
    color: #f39c12;
}

.status-closed {
    border: 1px solid #00a65a;
    color: #00a65a;
}

/* pagination */
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
    background-color: #ffffff;
    border-color: #5c19d4;
    color: #5c19d4;
    font-weight: 400;
}

/* Buttons */

.input-group-btn-wrapper .form-group .input-group.file-caption-main .form-control.file-caption{
    height:32px;
    border-radius: 8px;
}

.input-group-btn-wrapper .input-group.file-caption-main{
    display: flex;
    align-items: center;
}

.input-group-btn-wrapper .input-group-btn{
    display: flex;
    width: auto;
    align-items: center;
}

.input-group-btn-wrapper .input-group-btn .btn{
    min-width:auto;
    margin:0;
    cursor:pointer;
}

.input-group-btn-wrapper .input-group-btn .btn.btn-file{
    min-width:100px;
}

/* POS */

.product_box .product_desc_wrap .product-name,
.product_box .product-price {
    font-size: 12px;
}

/* product listing */

.file-input .file-preview {
    padding: 12px;
}

.file-input .file-preview .fileinput-remove {
    top: 6px;
    right: 6px;
}

.invoice-col-wrapper{
    display:flex;
    flex-wrap:wrap;
    margin-bottom: 20px;
}

.invoice-col-wrapper .invoice-col .thumbnail.invoice-thumbnail{
    margin-top:10px;
    margin-bottom:0px;
}

.invoice-col .box{
    height:100%;
    margin-bottom:0px;
}

.invoice-col-wrapper .invoice-col:first-child .box {
    height:auto;
}


/* delete alert */

.swal-modal {
    padding: 12px;
}

.swal-button {
    padding: 6px 18px;
}

.swal-title,
.swal-text {
    color: #000;
}

.swal-button--cancel {
    border: 1px solid #611fdc;
    color: #611fdc;
    background-color: transparent;
}

.swal-button--cancel:hover {
    background: #611fdc;
    color: #fff;
}

.swal-button--danger {
    background: transparent;
    color: #e64942;
    border: 1px solid #e64942;
}

.swal-button--warning {
    background: transparent;
    color: #f39c12;
    border: 1px solid #f39c12;
}

.swal-button--warning:hover, .swal-button--warning:active {
    background: #f39c12;
    color: #ffffff;
}

.swal-button--warning:focus {
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgba(240, 119, 21, 0.397);
}

.swal-button--danger:hover {
    background: #e64942;
    color: #ffffff;
}

.swal-button--success {
    background: transparent;
    color: #3c763d;
    border: 1px solid #3c763d;
}

.swal-button--success:hover, .swal-button--success:active {
    background: #3c763d;
    color: #ffffff;
}

.swal-button--success:focus {
    box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgba(24, 201, 39, 0.397);
}

.rtl .swal-footer {
    text-align: left;
}

.swal-modal.register_dialog .swal-title{
    font-size: 22px;
}

.swal-modal.register_dialog .swal-footer .swal-button-container .swal-button--cancel{
    background: transparent;
    color: #e64942;
    border: 1px solid #e64942;
}

.swal-modal.register_dialog .swal-footer .swal-button-container .swal-button--confirm{
    border: 1px solid #611fdc;
    color: #611fdc;
    background-color: transparent;
}

#actions-modal .modal-body .popupSection,
#actions-modal .modal-body > .dropdown-menu,
#sell_actions_modal .modal-body .popupSection,
#sell_actions_modal .modal-body > .dropdown-menu {
    padding: 14px 16px;
    border: none;
    box-shadow: 0 5px 10px 0 rgb(118 56 255 / 4%);
    border-radius: 8px;
}

#actions-modal .modal-body .popupSection > a, #sell_actions_modal .modal-body .popupSection > a {
    color: #2e286d;
    font-weight: bold;
}

#actions-modal .modal-body .popupSection > ul, #sell_actions_modal .modal-body .popupSection  > ul {
    border: none;
    box-shadow: none;
}

#actions-modal .modal-body .popupSection ul > li > a,
#actions-modal .modal-body .popupSection ul > li button,
#actions-modal .modal-body .popupSection > a,
#actions-modal .modal-body > .dropdown-menu > li > a,
#actions-modal .modal-body > .dropdown-menu > li > button,
#sell_actions_modal .modal-body .popupSection ul > li > a,
#sell_actions_modal .modal-body .popupSection > a,
#sell_actions_modal .modal-body > .dropdown-menu > li > a {
    background: #fff;
    box-shadow: 0 0 5px 0 rgb(118 56 255 / 32%);
    border-color: transparent;
    border-radius: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
}

#actions-modal .modal-body .popupSection ul > li > a,
#actions-modal .modal-body .popupSection ul > li > button,
#actions-modal .modal-body > .dropdown-menu > li > a,
#actions-modal .modal-body > .dropdown-menu > li > button,
#sell_actions_modal .modal-body .popupSection ul > li > a,
#sell_actions_modal .modal-body > .dropdown-menu > li > a  {
    color: #5c18d4;
    margin-bottom: 10px;
}

#actions-modal .modal-body .popupSection > a, #sell_actions_modal .modal-body .popupSection > a {
    background: transparent;
    color: #2e286d;
    box-shadow: none;
}

#actions-modal .modal-body .popupSection > a:hover,
#actions-modal .modal-body > .dropdown-menu > li a:hover,
#sell_actions_modal .modal-body .popupSection > a:hover,
#sell_actions_modal .modal-body > .dropdown-menu > li a:hover {
    color: #5c18d4;
}

#actions-modal .modal-body .popupSection ul > li > a:hover,
#actions-modal .modal-body .popupSection ul > li > button:hover,
#actions-modal .modal-body > .dropdown-menu > li > a:hover,
#actions-modal .modal-body > .dropdown-menu > li > button:hover,
#sell_actions_modal .modal-body .popupSection ul > li > a:hover,
#sell_actions_modal .modal-body > .dropdown-menu > li > a:hover {
    background: none;
    border-color: #5c18d4;
    color: #5c18d4;
}

.variation-modal, 
.variation_type_wrap, 
.variation_attr_wrap, 
.variation_attr_value_wrap,
.group_variations_wrap,
.group_variation_attr_wrap,
.group_variation_attr_value_wrap,
.fetch_variation_wizard_summary_wrap {
    min-width: 160px;
    margin: 2px 0 0;
    padding: 14px 16px;
    background-color: #fff;
    border: none;
    box-shadow: 0 5px 10px 0 rgb(118 56 255 / 4%);
    border-radius: 8px;
}

.variation-modal .btn.btn-primary, 
.variation_type_wrap .custom_box_radio_button .block, 
.variation_attr_wrap .custom_box_radio_button .block, 
.variation_attr_value_wrap .custom_box_radio_button .block,
.group_variations_wrap .custom_box_radio_button .block,
.group_variation_attr_wrap .custom_box_radio_button .block,
.group_variation_attr_value_wrap .custom_box_radio_button .block{
    width:100%;
    height:auto;
    padding: 15px 20px;
    color: #5c18d4;
    margin-bottom: 10px;
    background: #fff;
    box-shadow: 0 0 5px 0 rgb(118 56 255 / 32%);
    border-color: transparent;
    border-radius: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.variation_type_wrap .custom_box_radio_button .block, 
.variation_attr_wrap .custom_box_radio_button .block, 
.variation_attr_value_wrap .custom_box_radio_button .block,
.group_variations_wrap .custom_box_radio_button .block,
.group_variation_attr_wrap .custom_box_radio_button .block,
.group_variation_attr_value_wrap .custom_box_radio_button .block{
    border-width: 1px;
}

.variation-modal .btn.btn-primary:hover, 
.variation_type_wrap .custom_box_radio_button .block:hover, 
.variation_attr_wrap .custom_box_radio_button .block:hover, 
.variation_attr_value_wrap .custom_box_radio_button .block:hover,
.group_variations_wrap .custom_box_radio_button .block:hover,
.group_variation_attr_wrap .custom_box_radio_button .block:hover,
.group_variation_attr_value_wrap .custom_box_radio_button .block:hover{
    background: none;
    border-color: #5c18d4;
    color: #5c18d4;
}

/* button */

.box-header > .box-tools {
    right: 30px;
    top: 3px;
}

.rtl .box-header > .box-tools {
    right: auto;
    left: 30px;
}

.box-tools .btn.btn-primary,
.option-right-part-wrap .btn.btn-primary,  {
    display: flex;
    justify-content: center;
    align-items: center;
    color: #7638ff;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background: #fff;
    border: 1px solid #efe8ff;
    box-shadow: 0 0 5px 0 #7638ff;
}

.box-tools .btn.btn-primary:hover,
.box-tools .btn.btn-primary:active,
.option-right-part-wrap .btn.btn-primary:hover,
.option-right-part-wrap .btn.btn-primary:active {
    background: #fff;
    box-shadow: 0 0 5px 0 rgb(118 56 255 / 32%);
    border-color: #7638ff;
}

.box-tools .btn.btn-primary i,
.option-right-part-wrap .btn.btn-primary i {
    font-size: 20px;
}

/* pos tab */

div.pos-tab-container {
    display: flex;
    flex-flow: row-wrap;
    z-index: 10;
    background-color: #fff;
    margin-bottom: 28px;
}

.pos-tab-container .pos-tab-menu {
    width: 220px;
}

.pos-tab-container .pos-tab-menu .list-group .list-group-item {
    position: relative;
    display: block;
    padding: 1em 1em;
    color: #000;
    font-weight: bolder;
    margin-bottom: 8px;
    text-align: left;
    background-color: #fff;
    border: none;
    border-left: 4px solid transparent;
}

.pos-tab-container .pos-tab-menu .list-group .list-group-item:first-child {
    border-radius: 0;
}

.pos-tab-container .pos-tab-menu .list-group .list-group-item.active,
.pos-tab-container .pos-tab-menu .list-group .list-group-item.active:focus,
.pos-tab-container .pos-tab-menu .list-group .list-group-item:hover,
.pos-tab-container .pos-tab-menu .list-group .list-group-item.active:hover {
    position: relative;
    color: #5e1bd8;
    border-color: #5e1bd8;
    border-radius: 0px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: -5px 0px 5px 5px #d7d7d7;
}

.pos-tab-container .pos-tab-menu .list-group .list-group-item.active:after {
    position: absolute;
    content: '';
    width: 20px;
    height: 100%;
    background: white;
    top: 50%;
    right: -10px;
    z-index: 99;
    transform: translateY(-50%);
}

.rtl .pos-tab-container .pos-tab-menu .list-group .list-group-item.active:after {
    border-right: none;
}

.rtl .pos-tab-container .pos-tab {
    box-shadow: 5px 0px 5px 5px #d7d7d7;
}

.rtl .pos-tab-container .pos-tab-menu .list-group .list-group-item.active,
.rtl .pos-tab-container .pos-tab-menu .list-group .list-group-item.active:focus,
.rtl .pos-tab-container .pos-tab-menu .list-group .list-group-item:hover,
.rtl .pos-tab-container .pos-tab-menu .list-group .list-group-item.active:hover {
    color: #5e1bd8;
    border-color: #5e1bd8;
    box-shadow: 5px 0px 5px 5px #d7d7d7;
}

.rtl .pos-tab-container .pos-tab-menu .list-group .list-group-item {
    text-align: right;
    border-left: 0;
    border-right: 4px solid transparent;
}

.rtl .pos-tab-container .pos-tab-menu .list-group .list-group-item.active:after {
    right: unset;
    left: -10px;
}

.pos-tab-container .pos-tab {
    padding: 30px;
    box-shadow: -5px 0px 5px 5px #d7d7d7;
    border-radius: 8px;
}

div.pos-tab div.pos-tab-content:not(.active) {
    display: none;
}

.shippingWrapper.box{
    padding-top:20px;
}

.rtl .ui-menu .ui-menu-item{
    width:300px;
}

input.enable_collection[type='checkbox'], input.track_collectors[type='checkbox'], .enable_shipping[type='checkbox']{
  display: none;
}

.input-icheck[type='checkbox']{
    opacity:0;
}



/* nav tab custom */

.nav-tabs-custom {
    position: relative;
    border-radius: 8px;
    margin-bottom: 0;
    box-shadow: none;
}

.nav-tabs-custom .nav.nav-tabs {
    display: flex;
    border: none;
    border-bottom: 2px solid #f4f4f4;
    border-radius: 0px;
    overflow-x: auto;
    overflow-y: hidden;
}

.nav-tabs-custom .nav.nav-tabs > li {
    width: auto;
    white-space: nowrap;
    margin: 0;
    border: none;
}

.nav-tabs-custom .nav.nav-tabs > li a {
    display: block;
    width: auto;
    padding: 1em 1em;
    text-decoration: none;
    text-align: center;
    margin: 0;
    color: #aaa;
    font-size: 14px;
}

.nav-tabs-custom .nav.nav-tabs > li.active a,
.nav-tabs-custom .nav.nav-tabs > li a:hover {
    background: transparent;
    color: #5e1bd8;
    border: none;
    border-bottom: 2px solid #5e1bd8;
    border-radius: 0px;
    font-weight: 600;
    margin-bottom: -2px;
    cursor: pointer;
}

#product_table_wrapper table thead th {
    white-space: nowrap;
}

#product_table_wrapper table.dataTable, table.productlist_tbl.dataTable.fixedHeader-floating, table.productlist_tbl.dataTable.fixedHeader-locked{
    margin-top: 6px !important;
    margin-bottom: 6px !important;
}

.dataTables_wrapper {
    position: relative;
}

.dataTables_wrapper .col-sm-12 {
    position: unset;
}

div.dataTables_wrapper div.dataTables_processing {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    left: 50%;
    right: 0;
    bottom: 0;
    width: 100%;
    text-align: center;
    padding: 0;
    z-index: 9999;
    /* background: rgb(255 255 255 / 67%); */
    background: #FFF;
    margin: 0;
    height:200vh;
    width:100%;
    box-shadow: none;
    border: none;
    transform: translate(-50%, -50%);
    overflow: hidden;
}

.rtl div.dataTables_wrapper div.dataTables_processing {
    left: 0;
    right: -50%;
}

.dataTables_wrapper .buttons-collection{
    margin: 4px 0px;
}

#overlay, #pdf_preview_loading{
    padding-top:0;
}

.loader-line-spinner {
    position: relative;
    width: 100%;
    height: 100%;
}

.loader-line-spinner .loader-line-wrap {
    left: 48.7%;
    top: 50%;
    transform: translate(-48.7%,-50%);
}

.loader-line-spinner > p{
    position: absolute;
    left: 50%;
    top: 60%;
    transform: translate(-50%, -65%);
    width: 100%;
    text-align: center;
}

.ajax-loading.tbl-loader-line-wrap{
    position: relative;
    height: 50px;
}

.tbl-loader-line-wrap .loader-line-wrap{
    left:50%;
    transform: translateX(-50%);
}

#dataTableLoader {
    bottom: 0;
    height: 30px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
}

.loader-line-wrap {
    animation: spin 2000ms cubic-bezier(0.175, 0.885, 0.32, 1.275) infinite;
    box-sizing: border-box;
    height: 25px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    transform-origin: 50% 100%;
    width: 50px;
}
.loader-line {
    border: 4px solid transparent;
    border-radius: 100%;
    box-sizing: border-box;
    height: 50px;
    left: 0;
    margin: 0 auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
}
.loader-line-wrap:nth-child(1) {
    animation-delay: -50ms;
}
.loader-line-wrap:nth-child(2) {
    animation-delay: -100ms;
}
.loader-line-wrap:nth-child(3) {
    animation-delay: -150ms;
}

.loader-line-wrap:nth-child(1) .loader-line {
    border-color: #7638ff;
    height: 40px;
    width: 40px;
    top: 7px;
}
.loader-line-wrap:nth-child(2) .loader-line {
    border-color: #777777;
    height: 26px;
    width: 26px;
    top: 14px;
}
.loader-line-wrap:nth-child(3) .loader-line {
    border-color: #7638ff;
    height: 12px;
    width: 12px;
    top: 21px;
}

@keyframes spin {
    0%,
    15% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}

.theme-krajee-svg.rating-md .krajee-icon,
.theme-krajee-svg.rating-md .krajee-icon-clear {
    width: 16px;
    height: 16px;
}

.sell-number-wrapper{
    display:flex;
    flex-wrap:wrap;
    min-height: 150px;
}

.sell-number-wrapper .box{
    height: 100%;
    margin-bottom:0;
}

.percentage_price_wrap .toggle.btn {
    width: 100%!important;
    margin:0;
    height:38px!important;
}

.percentage_price_wrap .toggle.btn .toggle-group .btn{
    display: inline-block;
    margin: 0;
    height: 36px!important;
    padding: 0;
    line-height: 34px;
}

.percentage_price_wrap .toggle.btn .toggle-group .btn.btn-warning{
    background: #f39c12;
    color: #FFF;
}

.percentage_price_wrap .toggle.btn .toggle-group .btn.btn-success{
    background: #00a65a;
    color: #FFF;
}

/* Responsive */

.main-header .navbar.navbar-mobile {
    display: block;
}

.main-header .navbar.navbar-desktop {
    display: none;
}

.main-header .navbar .navbar-nav > li.user-menu > a .user_text {
    padding-left: 5px;
    padding-right: 5px;
}

@media (max-width: 1400px) {
    .loginbg_wrapper,
    .form-holder.form-holder-main {
        flex-basis: 50%;
        max-width: 50%;
    }

    .loginbg_wrapper .bg-image img,
    .loginbg_wrapper .img-holder-wrapper > svg {
        width: 100%;
    }
}

@media (max-width: 1023px) {
    .loginbg_wrapper {
        display: none;
    }

    .form-body .form-holder.form-holder-main {
        display: block;
        position: relative;
        height: auto;
        padding: 2.8125rem 1rem 4.5625rem;
    }

    .form-holder.form-holder-main {
        flex-basis: 100%;
        max-width: 100%;
        background: url('/images/mobile_bg.svg') no-repeat center bottom;
        background-position-y: 45vh;
    }

    .form-holder.form-holder-main:after {
        content: '';
        position: absolute;
        bottom: 0;
        right: 0;
        background: url('/images/leaf-right.svg') no-repeat;
        height: 222px;
        width: 200px;
        z-index: 9;
    }
    .form-holder.form-holder-main .form-items {
        background: #ffffff;
        padding: 1.25rem 0.9375rem;
        border-radius: 12px;
        min-height: 300px;
    }

    .homebox-wrapper .box-header .box-tab .btn{
        min-width:auto;
    }
    
}

@media (max-width: 960px) {
    .sell-number-wrapper{
        display:block;
    }

    .sell-number-wrapper .box{
        height: auto;
        margin-bottom:20px;
    }
}

@media (max-width: 768px) {
    .modal .wizard .actions ul > li a,
    body .box .wizard .actions ul > li a {
        font-size: 13px;
        line-height: 16px;
    }

    .modal .wizard .steps ul,
    body .box .wizard .steps ul {
        overflow: auto;
        overflow-y: hidden;
    }
}

@media (max-width: 767.98px) {
    .login_wrapper {
        position: relative;
    }

    /* .main-header .logo {
        position: absolute;
        top: 25px;
        right: auto;
        left: 50%;
        -webkit-transform: translate(-88%, -50%);
        -ms-transform: translate(-88%, -50%);
        transform: translate(-88%, -50%);
        width: 112px;
    }

    .rtl .main-header .logo {
        -webkit-transform: translate(-8%, -50%);
        -ms-transform: translate(-8%, -50%);
        transform: translate(-8%, -50%);
    } */

    .main-header .logo,  .nav li.change-lang-header {
        display: none;
    }

    .dropdown-lang{
        display:block;
    }

    /* .main-header .navbar .header_btn_business {
        display: none;
    } */

    .content-header {
        text-align: center;
    }

    .home-dashboard .content-header {
        padding-bottom: 0;
    }

    .box [class^='col-']:last-of-type .form-group,
    .box [class*=' col-']:last-of-type .form-group {
        margin-bottom: 0;
    }

    .box .user_register[class^='col-']:last-of-type .form-group, .box [class*=' col-']:last-of-type .form-group {
        margin-bottom: 1.25rem;
    }

    .xs-mb-0 {
        margin-bottom: 0 !important;
    }

    .register_input_row input.input_number {
        margin-bottom: 15px;
    }

    .user-super-admin .navbar-custom-menu > .navbar-nav > li.super-admin-info-item {
        position: inherit;
        left: unset;
        top: unset;
        right: unset;
        z-index: 9;
        width: auto;
    }

    div.dataTables_wrapper div.dataTables_length label span.lengthtext{
        display:none;
    }

    .rightdivsticky .pull-rightB label span.select2 {
        margin-left:0;
        margin-right:0;
    }

    .sticky-content-wrapper .leftdivsticky .dataTables_filter > label .form-control{
        min-width:70vw;
        max-width: 380px;
    }

    .sticky-content-wrapper .rightdivsticky .pull-rightA .dt-buttons.btn-group {
        display: inline-flex;
        margin-bottom: 0;
    }

    .sticky-content-wrapper .rightdivsticky .pull-rightA .dt-buttons.btn-group .btn {
        margin-bottom: 0;
    }
    
    .mflowdataTablepagination .dataTables_info, .mflowdataTablepagination .dataTables_paginate{
        width:100%;
    }

    .home-dashboard-section > div{
        width:100%;
    }

    .box-header > .box-tools.box-tools-lg{
        position: unset;
        margin-top: 10px;
    }

    .box-header > .box-tools {
        right: 15px;
    }

    .content-wrapper{
        margin-bottom:0;
    }

    .hour-report-section .report-table tr td, .hour-report-section .report-table tr th{
        width:auto!important;
    }

    .invoice-col-wrapper .invoice-col{
        width:100%;
        margin-bottom:10px;
    }

}

@media (max-width: 640px) {
    .form-group {
        margin-bottom: 1.25rem;
    }

    .form-body .form-content {
        max-width: 100%;
    }

    .form-body .form-items p {
        font-size: 0.75rem;
        margin-bottom: 1.25rem;
    }

    .form-body .website-logo .logo img {
        height: 2.5625rem;
    }
    .form-body .form-control {
        height: 2.1875rem;
        font-size: 0.75rem;
    }

    .form-body .form-items h3,
    .form-body .form-items > p {
        padding-left: 1.5625rem;
        padding-right: 1.5625rem;
    }

    .form-body .form-control-feedback {
        font-size: 0.75rem;
    }
    .form-body .website-logo > p {
        margin-top: 0.9375rem;
    }

    .form-body .website-logo {
        margin-bottom: 1.875rem;
    }
    .form-holder.form-holder-main {
        background-position-y: 46vh;
    }

    .form-body .website-logo > p {
        font-size: 0.875rem;
    }

    .form-body .checkbox label {
        font-size: 0.75rem;
    }

    .form-body .form-items h3 {
        font-size: 1.25rem;
        line-height: 1.84375rem;
        margin-bottom: 0.625rem;
    }

    .form-body .form-items > p {
        line-height: 1.09375rem;
    }

    .form-body .form-group.account_wrap {
        font-size: 0.8125rem;
        margin-top: 1.25rem;
    }

    .form-body .ibtn {
        height: 2rem;
        font-size: 0.8125rem;
        line-height: 1;
    }

    .form-holder.form-holder-main:after {
        background-size: 6.25rem;
        height: 6.25rem;
        width: 6.25rem;
        right: -0.9375rem;
    }

    .form-body .form-holder .text-divider {
        margin-top: 2rem;
        margin-bottom: 2rem;
    }

    .form-body .form-holder .text-divider span {
        background: #fff;
        padding: 0.5rem;
        margin: 2rem 0;
    }

    .g-signin2 .abcRioButton {
        width: 10rem !important;
        height: 2.1875rem !important;
    }

    .form-body .checkbox label .icheckbox_square-blue {
        width: 0.9375rem;
        height: 0.9375rem;
        border-radius: 5px;
    }

    .abcRioButtonBlue {
        background-color: #f5f5f5 !important;
    }

    .g-signin2 .abcRioButtonBlue .abcRioButtonIcon {
        display: flex;
        align-items: center;
        padding: 0.8rem !important;
    }

    .g-signin2 .abcRioButtonContents {
        line-height: 2.1875rem !important;
        font-size: 0.75rem !important;
    }

    /* table {
        display: block;
        overflow: auto;
    } */

    .modal .wizard .content,
    body .box .wizard .content {
        min-height: 450px;
        max-height: 67vh;
        overflow-y: auto;
    }

    .modal .wizard.wizard_full .content{
        max-height: 100vh;
    } 

    body .box .user_register.wizard .content{
        min-height: auto;
    }

    .wizard > .content > .body {
        width: 100%;
        height: 100%;
        padding-left: 0;
        padding-right: 0px;
    }

    #collapseFilter .form-group,  #collapseFilter .form-group .multiselect-wrapper{
        display: flex;
        align-items: center;
        width: 100%;
    }

    #collapseFilter .form-group > label,  #collapseFilter .form-group .multiselect-wrapper > label {
        min-width: 120px;
    }

    #collapseFilter .form-group .select2-container, #collapseFilter .form-group .multiselect-wrapper .multiselect{
        min-width:auto;
    }

    #collapseFilter .form-group .multiselect-wrapper > div{
    display: block;
    width: 100%;
    }


    .invoice-temp-wrapper table{
        display:block;
        overflow-x:auto;
        zoom:0.8;
    }
}

@media (max-width: 480px) {
    .dropdown .dropdown-toggle span.static-text {
        white-space: nowrap;
        width: 100px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .rtl .dropdown .dropdown-toggle span.static-text {
        direction: ltr;
    }

    .form-holder.form-holder-main {
        background-position-y: 35vh;
    }

    .g-signin2 .abcRioButton {
        width: 13rem !important;
    }

    .box-header.with-border .filter-left-part-wrap  span.tippy-tooltip {
        position: absolute;
        right: 10px;
        display: flex;
        align-items: center;
        gap: 10px;
        top: 20px;
    }

    .box-header.with-border .option-right-part-wrap .hide_dataTables_length.active {
        display: flex;
        padding-top: 50px;
    }

    .col-mob-full{
        width: 100%;
    }
}

@media screen and ( max-height: 699px ) {

    body.login_wrapper .box .wizard .content{
        min-height: auto;
    }
    
}

.multiselect.dropdown-toggle {
    background-color: #fff;
    border: 1px solid #d2d6de;
    border-radius: 8px;
    height: 38px;
    box-shadow: none;
    margin: 0;
}
.currency_exchange_msg_box {
    color: #f39c12;
    font-weight: 700;
    border-radius: 8px;
    padding: 15px;
    border: 1px solid #e08e0b;
    text-align: center;
    box-shadow: 0 5px 10px 0px #d7d7d7;
    visibility: visible;
    background-color: #F8F7F9;
}
.currency_exchange_info_box i {
    color: #f39c12;
    font-weight: 700;
    font-size: 16px;
    text-align: center;
    cursor: help;
}
.currency_exchange_msg_box_area {
    position: absolute;
    bottom: -15px;
    display: flex;
    justify-content: center;
    z-index: 2000;
}

@-webkit-keyframes float {
    0% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }

    50% {
        -webkit-transform: translatey(-20px);
        transform: translatey(-20px);
    }

    100% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }
}

@keyframes float {
    0% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }

    50% {
        -webkit-transform: translatey(-20px);
        transform: translatey(-20px);
    }

    100% {
        -webkit-transform: translatey(0px);
        transform: translatey(0px);
    }
}

@-webkit-keyframes floatall {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }

    25% {
        -webkit-transform: translate(-5px, 5px);
        transform: translate(-5px, 5px);
    }

    50% {
        -webkit-transform: translate(0, 5px);
        transform: translate(0, 5px);
    }

    75% {
        -webkit-transform: translate(5px, 5px);
        transform: translate(5px, 5px);
    }

    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

@keyframes floatall {
    0% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }

    25% {
        -webkit-transform: translate(-5px, 5px);
        transform: translate(-5px, 5px);
    }

    50% {
        -webkit-transform: translate(0, 5px);
        transform: translate(0, 5px);
    }

    75% {
        -webkit-transform: translate(5px, 5px);
        transform: translate(5px, 5px);
    }

    100% {
        -webkit-transform: translate(0, 0);
        transform: translate(0, 0);
    }
}

.ui-autocomplete.ui-widget-content {
    max-height:500px !important;
    overflow-y: scroll;
}

.checkbox-solid-border {
    border: 1px solid #000;
    border-radius: 8px;
}

/* iframe section */

.payment_details_div .credits-iframe {
    height: 800px!important;
}
.payment-option-row .option-item label .payment-name.on_return_mode_payments:hover,
.payment-option-row .option-item.active label .payment-name.on_return_mode_payments {
    background: -webkit-linear-gradient(285deg, #00a65a 2%, #282460 100%) !important;
    background: linear-gradient(165deg, #00a65a 2%, #282460 100%) !important;
    border-color: 1px solid #00a65a !important;
    color: #fff !important;
}
.payment-name-return-mode {
    border:1px solid #00a65a !important;
    color:#00a65a !important;
} 

/* Highlight Note Button POS Line Start */
        
table#pos_table tr.product_row div.pos-row-action span.add-comment.has_note i{
    font-weight:500 !important;
    color: #7638ff !important;
}

/* Highlight Note Button POS Line End */

.main-header .navbar .navbar-nav > li > a i.yellow-blink{
    animation:yellowBlink 0.1s cubic-bezier(.68,-0.55,.27,1.55) infinite alternate, zoomIcon 1.5s ease 0s infinite;
}
.main-header .navbar .navbar-nav > li > a i.red-blink{
    animation: redBlink 0.1s cubic-bezier(.68,-0.55,.27,1.55) infinite alternate, zoomIcon 1.5s ease 0s infinite;
}
.grace-period--swal{
    width: 500px;
}
@keyframes zoomIcon {
    0%, 50%, 100% { transform: scale(1.3); }
    30%, 80% { transform: scale(0.92, 0.95); }
}
@keyframes yellowBlink {
    0% { color: #f09407;text-shadow: 0px 0px 10px rgba(240, 148, 7, 0.2); }
    50% { color: #f09407;text-shadow: 0px 0px 20px rgba(240, 148, 7, 1); }
    51% { color: #333333; }
    100% { color: #333333; }
}
@keyframes redBlink {
    0% {
        color: red;
        text-shadow: 0px 0px 10px rgba(255, 0, 0, 0.2);
    }
    100% {
        color: red;
        text-shadow: 0px 0px 20px rgba(255, 0, 0, 1);
    }
    51% {
        color: #333333;
    }
    100% {
        color: #333333;
    }
}
/* resposive table */
@media only screen and (max-width: 767px) {
    .sell_page_matrix_view #pos_table,
    .sell_page_matrix_view #pos_table tr,
    .sell_page_matrix_view #pos_table tbody,
    .sell_page_matrix_view #pos_table tfoot {
        display: block;
    }

    .sell_page_matrix_view #pos_table thead {
        display: none;
    }

    .sell_page_matrix_view #pos_table tbody tr td {
        display: flex !important;
        width: 100% !important;
        min-width: 100% !important;
        text-align: left !important;
        padding: 10px !important;
    }

    .rtl .sell_page_matrix_view #pos_table tbody tr td {
        text-align: right !important;
    }

    .sell_page_matrix_view #pos_table tbody tr td:before {
        content: attr(data-label);
        content: attr(data-label);
        max-width: 110px;
        min-width: 110px;
        text-align: inherit;
        display: flex;
        align-items: center;
    }

    .sell_page_matrix_view #pos_table .doc_currency_conversion_rate_wrap,
    .sell_page_matrix_view #pos_table tbody .input-group.input-number,
    .sell_page_matrix_view #pos_table input.pos_unit_price_inc_tax {
        margin: 0;
    }

    .S9gUrf-YoZ4jf iframe {
        margin-left: auto !important;
        margin-right: auto !important;
    }
}


.matat-new-custom-modal .modal-dialog {
    max-width: 320px;
}
.matat-new-custom-modal .modal-content {
    background: #fff;
}
.matat-new-custom-modal .modal-close {
    position: absolute;
    top: 7px;
    right: 10px;
    line-height: 1;
    color: #000;
    background: none;
    padding: 0;
    margin: 0;
    outline: none;
    border: none;
    font-size: 16px;
}

.rtl .matat-new-custom-modal .modal-close {
    right: auto;
    left: 10px;
}

.matat-new-custom-modal .modal-close [class^="fa-"] {
    display: flex;
}

.matat-new-custom-modal .new-modal-title {
    text-align: center;
    font-weight: 500;
    font-size: 16px;
    color: #000;
    margin: 0 0 20px;
}

.matat-new-custom-modal .modal-body {
    padding: 20px 39px;
}

.matat-new-custom-modal .modal-footer {
    border: none;
}

.matat-new-custom-modal .form-control {
    border-radius: 4px;
    padding: 12px 9px;
}

.matat-new-custom-modal textarea.form-control {
    min-height: 80px;
    resize: vertical;
}

.matat-new-custom-modal .modal-footer,
.rtl .matat-new-custom-modal .modal-footer {
    justify-content: center;
}

.matat-new-custom-modal .modal-content .btn {
    font-size: 16px;
    line-height: 1.3125;
    height: auto;
    box-shadow: none;
    padding: 11px;
    min-width: 100px;
    margin: 0 10px;
}

.matat-new-custom-modal .modal-content .btn.btn-primary {
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
}

.matat-new-custom-modal .modal-content .btn.btn-default {
    background: #F7F8F9;
    border-color: #F7F8F9;
    color: rgba(0,0,0,0.5);
}

.matat-new-custom-modal .qty_group {
    width: 97px;
    margin: 0 auto;
}

.matat-new-custom-modal .input-group-btn .btn {
    margin: 0;
}

.matat-new-custom-modal .modal-content .qty_group .btn.btn-default {
    border: 1px solid #E0E0E0 !important;
    background: #fff;
    width: 30px;
    height: 35px;
    min-width: 0;
    position: relative;
    z-index: 5;
    font-size: 13px;
    color: #353535;
}

.rtl .matat-new-custom-modal .qty_group .input-group-btn:first-child .btn,
.matat-new-custom-modal .qty_group .input-group-btn:last-child .btn {
    border-radius: 0 !important;
    border-top-right-radius: 3px !important;
    border-bottom-right-radius: 3px !important;
}

.matat-new-custom-modal .qty_group .input-group-btn:first-child .btn,
.rtl .matat-new-custom-modal .qty_group .input-group-btn:last-child .btn{
    border-radius: 0 !important;
    border-top-left-radius: 3px !important;
    border-bottom-left-radius: 3px !important;
}

.matat-new-custom-modal .modal-content .qty_group .form-control {
    height: 35px;
    font-size: 22px;
    text-align: center;
    border-width: 1px 0;
    border-color: #E0E0E0;
    color: #000;
    background: #fff;
    padding: 0;
    line-height: 33px;
}

.matat-new-custom-modal .modal-content label.error {
    margin: 10px 0 0;
}

.main-content-title {
    margin: 0;
    font-size: 24px;
    font-weight: 500;
}

.new-matat-table .top_heading_row th {
    background: none;
    border: none;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.5);
    border-bottom: 1px solid #E0E0E0;
}

.new-matat-table td,
.new-matat-table th {
    background: #fff;
    border: 1px solid #E0E0E0;
    font-size: 14px;
}

.new-matat-table .invoice-ref-no {
    border-radius: 100px;
    background: #7F54B3;
    color: #fff;
    padding: 1px 14px;
}

.new-matat-table .doc-type,
.new-matat-table .paid-amount-note {
    display: block;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.5);
}

.new-matat-table .order-status {
    display: inline-flex;
    align-items: center;
}

.new-matat-table .order-status:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    border-radius: 50%;
    width: 10px;
    height: 10px;
    margin-right: 5px;
}

.rtl .new-matat-table .order-status:before {
    margin-right: 0;
    margin-left: 5px;
}

.new-matat-table .paid:before {
    background: #00B53F;
}

.new-matat-table .due:before {
    background: #DD0000;
}

.new-matat-table .partially:before {
    background: #FFB339;
}

.new-matat-table tbody tr:hover td {
    background: #F9F7FF;
}

.new-matat-table tbody tr:hover .invoice-no,
.new-matat-table tbody tr:hover .doc-no,
.new-matat-table tbody tr:hover .customer-name {
    color: #7638FF;
}

.mh-262{
    min-height: 262px;
}

.rectangle {
    width: 100%;
    height: 40px;
    background-color: green;
    position: relative;
    overflow: hidden;
    border-radius: 5px;
}
.rectangle::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.triangle {
    position: absolute;
    width: 100%;
    height: 100%;
    clip-path: polygon(0 0, 100% 0, 0 100%);
}
.triangle.bottom {
    clip-path: polygon(0 100%, 100% 0, 100% 100%);
}
/* Options Container skeleton loader */
.options-container {
    margin-top: 2px;
}

.option.skeleton-loader {
    display: flex;
    align-items: center;
    padding-left: 10px;
    margin-bottom: 5px;
    background-color: #f2f2f2;
    border-radius: 5px;
    animation: loading 1s infinite linear;
}

.option .checkbox,
.option .label {
    width: 20px;
    height: 20px;
    background-color: #ccc;
    border-radius: 3px;
    margin-right: 10px;
}

.option .label {
    flex-grow: 1;
}
.flex-container {
    display: flex;
    gap: 10px;
    align-items: baseline;
}
.rapid-actions {
    list-style-type: none;
    padding: 0;
    display: flex;
    text-align: left;
    margin: 5px 0;
    white-space: nowrap;
}

.rapid-actions li {
    display: flex;
    align-items: center; /
    justify-content: center;
    margin: 0 2px;
}

.rapid-actions li:first-child {
    margin-left: 10px;
}

.rapid-actions li:last-child {
    margin-right: 10px;
}

.rtl .rapid-actions li:first-child {
    margin-left: 10px;
    margin-right: 10px;
}

.rtl .rapid-actions li:last-child {
    margin-left: 10px;
    margin-right: 0;
}

.rapid-actions li a {
    text-decoration: none;
    color: #7638ff;
    background-color: #ebebeb;
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 17px;
    min-width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* Loading Animation */
@keyframes loading {
    0% {
        background-color: #f2f2f2;
    }
    50% {
        background-color: #e6e6e6;
    }
    100% {
        background-color: #f2f2f2;
    }
}

/*disable sidebar menu*/
.sidebar-menu.disabled .treeview-menu li {
    cursor: not-allowed;
}
.sidebar-menu.disabled .treeview-menu li a {
    pointer-events: none;
}
.open_price_calc{
    cursor: pointer;
}

/* new customer page styles start */
.clients-main-container {
    padding-inline: 16px;
    padding-block: 20px;
    position: relative;
}

.btn.btn-client-action-opener {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0;
    background: #EBE2FF;
    border-radius: 4px;
    width: 30px;
    height: 30px;
    inset-block-start: 20px;
    inset-inline-end: 16px;
    padding: 0;
}

.clients-main-container h1 {
    margin-block: 0 23px;
    font-weight: 500;
    font-size: 24px;
}

.client-content-actions {
    display: flex;
    margin-bottom: 31px;
    gap: 10px;
}

.main-search-form {
    position: relative;
    flex-basis: calc(100% - 55px);
    max-width: calc(100% - 55px);
}

.main-search-form .ico-search {
    position: absolute;
    inset-block-start: 23px;
    transform: translate(0,-50%);
    display: flex;
    inset-inline-start: 15px;
}

.main-search-form .form-control {
    border-color: #E0E0E0;
    border-radius: 4px;
    height: 45px;
    font-size: 14px;
    line-height: 1.5;
    padding: 11px 41px;
}

@media screen and (min-width: 768px) {
    .clients-main-container {
        padding-inline: 40px;
    }

    .main-search-form {
        max-width: 250px;
        margin-inline-end: auto;
    }

    .btn.btn-client-action-opener {
        display: none;
    }
}

.tools-left-box .mobile-header {
    border-bottom: 1px solid #E0E0E0;
    position: relative;
    font-size: 20px;
    line-height: 1.5;
    font-weight: 500;
    text-align: center;
    padding: 20px;
}
.tools-left-box  .btn-close-tools {
    border: none;
    padding: 0;
    margin: 0;
    background: none;
    position: absolute;
    inset: 50% 30px auto auto;
    transform: translate(0,-50%);
    display: flex;
}

.actions-button-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.btn-action {
    display: flex;
    align-items: center;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font-size: 16px;
    line-height: 1.5;
    gap: 10px;
}

.btn-action .action-ico {
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-action svg {
    overflow: visible;
}

.btn.btn-add-content,
.client-details-container .btn.btn-primary,
.btn.btn-add-customer {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 45px;
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
    border-radius: 4px;
    font-weight: 500;
    margin: 0;
}

.btn.btn-add-content:not(:disabled):not(.disabled),
.client-details-container .btn.btn-primary:not(:disabled):not(.disabled),
.btn.btn-add-customer:not(:disabled):not(.disabled) {
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
}

.btn-add-customer .btn-text {
    display: none;
}

.actions-button-list .dropdown-menu {
    box-shadow: none;
    border-radius: 0;
}

.actions-button-list .dropdown-item {
    font-weight: 400;
    color: #000;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.actions-button-list input[type=checkbox] {
    border-radius: 0;
    border: 1px solid #E2E2E2;
    width: 20px;
    height: 20px;
    background: #fff;
    margin-block: 0;
    margin-inline: 0;
}

.actions-button-list input[type=checkbox]:checked {
    background: #fff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 11.971 9.167"><path fill="%237638ff" d="M11.908 1.073 10.93.067A.21.21 0 0 0 10.774 0a.2.2 0 0 0-.156.067L3.836 6.899l-2.47-2.468a.215.215 0 0 0-.311 0l-.99.99a.221.221 0 0 0 0 .317l3.113 3.113a.985.985 0 0 0 .65.317 1.032 1.032 0 0 0 .645-.306h.006l7.434-7.468a.238.238 0 0 0-.005-.321Z" data-name="Icon ionic-ios-checkmark"/></svg>') 50% 50%/60% auto no-repeat;
}

.actions-button-list input[type=checkbox]:before {
    display: none;
}

#custom_overlay {
    position: fixed;
    z-index: 1031;
    background: rgba(0,0,0,0.5);
    inset: 0;
    transition: 0.3s ease opacity .05s, 0.3s ease visibility .05s;
    opacity: 0;
    visibility: hidden;
    display: none;
}

.client-details-container .submit-btns-wrap {
    padding-top: 15px;
}

@media screen and (min-width: 768px) {
    .tools-left-box .mobile-header,
    .actions-button-list .dropdown-menu .dropdown-menu-header {
        display: none;
    }

    .tools-left-box-wrapper {
        display: flex;
        align-items: flex-start;
        gap: 19.5px;
        align-items: center;
    }

    .actions-button-list {
        display: flex;
        align-items: center;
        gap: 19.3px;
    }

    .btn-action > span {
        display: none;
    }

    .btn-add-customer {
        width: 140px;
    }

    .btn-add-customer svg {
        display: none;
    }

    .btn-add-customer .btn-text {
        display: block;
    }

    .btn-action {
        justify-content: center;
    }

    .actions-button-list .dropdown-menu {
        left: 50%;
        transform: translateX(-50%);
        padding: 25px 19px 10px;
        min-width: 150px;
        border-radius: 4px 4px 0 0;
        border-color: #E0E0E0;
        margin-top: 10px;
        filter: drop-shadow(0px 0px 6px rgba(0, 0, 0, 0.1));
    }

    .actions-button-list .dropdown-menu:before,
    .actions-button-list .dropdown-menu:after {
        content: '';
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%, -100%);
        border: 6px solid transparent;
        border-width: 0 6px 6px;
    }

    .actions-button-list .dropdown-menu:before {
        border-bottom-color: #E0E0E0;
    }

    .actions-button-list .dropdown-menu:after {
        border-bottom-color: #fff;
        margin-top: 1px;
    }

    .mobile-detailes-menu {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .btn-add-customer {
        position: fixed;
        inset-block-end: 20px;
        inset-inline-start: 20px;
        width: 45px;
        height: 45px;
        z-index: 870;
    }

    #custom_overlay {
        display: block;
    }

    #custom_overlay.active {
        opacity: 1;
        visibility: visible;
    }

    .tools-left-box {
        position: fixed;
        z-index: 1032;
        inset: auto 0 0;
        background: #fff;
        border-radius: 10px 10px 0 0;
        opacity: 0;
        visibility: hidden;
        transition: 0.3s ease opacity, 0.3s ease visibility;
        min-height: 360px;
    }

    .tools-left-box.active {
        opacity: 1;
        visibility: visible;
    }

    .actions-button-list {
        padding-inline: 20px;
    }

    .actions-button-list li {
        padding-block: 20px;
    }

    .actions-button-list li + li {
        border-top: 1px solid #E0E0E0;
    }

    .btn-action {
        width: 100%;
    }

    .btn-action .action-ico {
        width: 25px;
    }

    .actions-button-list li.dropdown {
        position: static;
    }

    .actions-button-list .dropdown-backdrop {
        display: none;
    }

    .actions-button-list .dropdown-menu {
        inset: 0;
        margin: 0;
        padding: 0;
        border-radius: 10px 10px 0;
    }

    .dropdown-menu .dropdown-menu-header {
        border-radius: 10px 10px 0 0;
        border-bottom: 1px solid #E0E0E0;
        display: flex;
        align-items: center;
        font-size: 20px;
        line-height: 1.5;
        font-weight: 500;
        padding: 20px;
        gap: 10px;
    }

    .dropdown-menu-header .close-dropdown-menu {
        padding: 0;
        background: none;
        border-radius: 0;
        display: flex;
    }

    .dropdown-menu-content {
        padding: 10px 30px;
        max-height: 289px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .actions-button-list .dropdown-item:not(:last-child) {
        margin-bottom: 20px;
    }

    .details-checkbox-wrap {
        padding-top: 5px;
    }
}

.clients-table-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    max-width: 100%;
}

.new-table-style {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

.new-table-style.main_client_table {
    min-width: 1141px;
}

.clients-table-wrap.cards_index_wrapper {
    max-width: max-content;
}

.cards_index_wrapper,
.details_address_wrap,
.customer_clubs_wrapper,
.detail_contacts_wrapper {
    position: relative;
    max-width: max-content;
}

.cards_index_wrapper {
    min-width: 1055px;
}

.cards_index_wrapper .cards_table_action,
.customer_clubs_wrapper .cards_table_action,
.details_address_wrap .cards_table_action,
.detail_contacts_wrapper .cards_table_action {
    display: flex;
    align-items: center;
    position: absolute;
    inset-block-start: 42px;
    inset-inline-end: 0;
    gap: 20px;
}

.new-table-style.cards_index {
    min-width: 955px;
    max-width: 955px;
    margin-inline-end: 100px;
}

.new-table-style.detail_contacts_table {
    min-width: 811px;
    max-width: 811px;
}

.new-table-style.main_client_table.details_address {
    min-width: 612px;
    max-width: 612px;
}

.new-table-style.customer_clubs_table {
    min-width: 686px;
    max-width: 686px;
}

.new-table-style .table-filter-row td,
.new-table-style .data-row td{
    color: #000;
    font-size: 14px;
    line-height: 1.5;
    border: 1px solid #e0e0e0;
    border-block-width: 1px 0;
    border-inline-width: 1px 0;
    background: #fff;
    transition: 0.25s ease background;
}

.new-table-style .data-row td:last-child,
.new-table-style .table-filter-row td:last-child {
    border-inline-end-width: 1px;
}

.new-table-style .data-row td {
    height: 61px;
}

.new-table-style thead th {
    font-weight: 500;
    font-size: 16px;
    color: rgba(0,0,0,0.5);
    text-align: center;
    padding-block: 13px;
}

.new-table-style.main_client_table thead th.mobile-col {
    width: 46px;
}

.new-table-style.main_client_table thead th:nth-child(2) {
    width: 15.337423312883436%;
}

.new-table-style.main_client_table.details_address thead th:nth-child(2),
.new-table-style.main_client_table.details_address thead th:nth-child(4),
.new-table-style.main_client_table.details_address thead th:nth-child(5) {
    width: 24.50980392156863%;
}

.new-table-style.main_client_table thead th:nth-child(3) {
    width: 13.75985977212971%;
}

.new-table-style.main_client_table.details_address thead th:nth-child(3) {
    width: 11.764705882352942%;
}

.new-table-style.main_client_table thead th:nth-child(4) {
    width: 15.950920245398773%;
}

.new-table-style.main_client_table thead th:nth-child(5) {
    width: 14.46099912357581%;
}

.new-table-style.main_client_table thead th:nth-child(6) {
    width: 17.879053461875547%;
}

.new-table-style.main_client_table.details_address thead th:nth-child(6) {
    width: auto;
}

.new-table-style.main_client_table thead th:nth-child(7) {
    width: 11.568799298860649%;
}

.new-table-style.main_client_table thead th:nth-child(8) {
    width: 14.899211218229624%;
}

.new-table-style.cards_index thead th {
    width: 13.821989528795811%;
}

.new-table-style.cards_index thead th.ref_no_col {
    width: 16.544502617801047%;
}

.new-table-style.cards_index thead th:last-child {
    width: 14.24083769633508%;
}

.new-table-style.detail_contacts_table thead th {
    width: 18.49568434032059%;
}

.new-table-style.detail_contacts_table thead th:last-child {
    width: 26.01726263871764%;
}

.new-table-style.customer_clubs_table thead th {
    width: 19.24%;
}

.new-table-style.customer_clubs_table thead th.ref_no_col {
    width: 23.04%;
}

.table-data-search-wrap {
    position: relative;
    padding-block: 9px;
}

.table-data-search-wrap input,
.table-data-search-wrap select {
    width: 100%;
    padding: 5px 10px;
    margin: 0;
    background: none;
    border: none;
    font: 400 14px/1.5 'Heebo', sans-serif;
    height: 31px;
}

.table-data-search-wrap select {
    color: rgba(0,0,0,0.5);
    appearance: none;
}

.table_data_filter + .select2-container--default .select2-selection--single {
    height: 31px;
    border: none;
}

.table_data_filter + .select2-container--default .select2-selection--single .select2-selection__rendered {
    font: 400 14px/31px 'Heebo', sans-serif;
}

.table_data_filter + .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: rgba(0,0,0,0.5);
}

.table_data_filter + .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-width: 7.5px 7.5px 0;
    border-top-color: #000;
    transform: translateY(-50%);
}

.table-data-search-wrap svg {
    position: absolute;
    inset-block-start: 50%;
    inset-inline-end: 10px;
    transform: translate(0,-50%);
}

.new-table-style tbody tr:last-child td {
    border-bottom: 1px solid #e0e0e0;
}

.new-table-style .data-row:hover td {
    background: #F9F7FF;
}

.new-table-style tbody tr:last-child td:first-child:not(.mobile-col) {
    border-end-start-radius: 4px;
}

.new-table-style tbody tr:last-child td:last-child {
    border-end-end-radius: 4px;
}

.new-table-style .link_download {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    color: #7638FF;
}

.new-table-style .link_download:hover span {
    text-decoration: none;
}

.new-table-style .link_download span {
    text-decoration: underline;
}

.new-table-style .points-info {
    direction: ltr;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.new-table-style .points-info .indicator {
    width: 10px;
    height: 10px;
    border-radius: 10px;
}

.new-table-style .points-info .indicator.up {
    background: #5EDD60;
}

.new-table-style .points-info .indicator.down {
    background: #DD0000;
}

.data-row-action [class^="btn-"] {
    padding: 0;
    margin: 0;
    border: none;
    background: none;
    outline: none;
    display: flex;
    align-items: center;
}

.tooltip-inner {
    background: #fff;
    border: 1px solid #E0E0E0;
    font-size: 12px;
    color: #000;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
}

.tooltip.top .tooltip-arrow {
    border-top-color: #E0E0E0;
}

.tooltip.top .tooltip-arrow:before {
    content: '';
    border-style: solid;
    border-color: transparent;
    border-width: 5px 5px 0;
    border-top-color: #fff;
    position: absolute;
    bottom: 1px;
    margin-left: -5px;
    left: 50%;
}

.data-row-action .ico-wrap {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #EBE2FF;
    border-radius: 4px;
}

.data-row-action .ico-wrap svg {
    overflow: visible;
}

.inner-data-info {
    display: block;
    font-size: 12px;
    color: rgba(0,0,0,0.5);
    padding-top: 3px;
}

.new-table-style tbody td {
    text-align: center;
}

.mobile-row-action-header {
    position: relative;
    border-bottom: 1px solid #E0E0E0;
    font-size: 20px;
    font-weight: 500;
    padding: 20px;
}
.mobile-row-action-header .heading-text span {
    color: #7638FF;
}
.mobile-row-action-header .btn_row_action_close {
    border: none;
    padding: 0;
    margin: 0;
    background: none;
    position: absolute;
    inset: 50% 30px auto auto;
    transform: translate(0,-50%);
    display: flex;
}

.mobile-row-action-header .btn_row_action_close svg {
    overflow: visible;
}

.btn-mobile-row-action-opener {
    border: none;
    padding: 0;
    margin: 0 20px;
    background: none;
    display: flex;
}

.btn-data-filter-opener {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border: 1px solid #E0E0E0;
    border-radius: 4px;
    background: #fff;
}

@media screen and (min-width: 768px) {
    .new-table-style .mobile-col {
        display: none;
    }

    .new-table-style thead th {
        padding-block: 10px;
    }

    .new-table-style tbody tr:last-child td:first-child.mobile-col + td,
    .new-table-style tbody tr:last-child td:first-child:not(.mobile-col) {
        border-end-start-radius: 4px;
    }

    .new-table-style tr.table-filter-row td:first-child.mobile-col + td,
    .new-table-style tr.table-filter-row td:first-child:not(.mobile-col) {
        border-start-start-radius: 4px;
    }

    .new-table-style tr.table-filter-row td:last-child {
        border-start-end-radius: 4px;
    }

    .new-table-style .data-row:hover .data-row-action {
        opacity: 1;
        visibility: visible;
    }

    .data-row-action {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding-inline: 10px;
        opacity: 0;
        transition: 0.25s ease opacity, 0.25s ease visibility;
    }

    .data-row-action [class^="btn-"] .button-label {
        display: none;
    }

    .data-row-action .mobile-row-action-header {
        display: none;
    }

    .btn-data-filter-opener {
        display: none;
    }

    .detail_contacts_wrapper {
        min-width: 991px;
    }

    .details_address_wrap {
        min-width: 792px;
    }

    .customer_clubs_wrapper {
        min-width: 866px;
    }

    .cards_table_action .btn-add-customer {
        width: 150px;
    }

    .new-table-style.detail_contacts_table,
    .new-table-style.customer_clubs_table,
    .new-table-style.details_address {
        margin-inline-end: 180px;
    }
}

@media screen and (max-width: 767px) {
    .clients-table-wrap {
        margin-inline-end: -16px;
        padding-inline-end: 16px;
        max-width: calc(100% + 16px);
    }

    .table-header-row th {
        border-top: 1px solid #e0e0e0;
        border-inline-start: 1px solid #e0e0e0;
        background: #fff;
    }

    .new-table-style tr.table-header-row th:first-child {
        border-start-start-radius: 4px;
    }

    .new-table-style.main_client_table thead th:nth-last-child(2),
    .new-table-style:not(.main_client_table) thead th:last-child {
        border-inline-end: 1px solid #e0e0e0;
        border-start-end-radius: 4px;
    }

    .new-table-style .table-header-row th.blank_data_cell {
        font-size: 0;
        border: none;
    }

    .new-table-style .table-filter-row  {
        display: none;
    }

    .new-table-style.main_client_table tbody tr.data-row td:last-child {
        border: none;
    }

    .new-table-style.main_client_table tbody tr.data-row td:nth-last-child(2) {
        border-inline-end: 1px solid #e0e0e0;
    }

    .new-table-style.main_client_table tbody tr:last-child td:nth-last-child(2) {
        border-end-end-radius: 4px;
    }

    .new-table-style tbody tr:last-child td:first-child {
        border-end-start-radius: 4px;
    }

    .new-table-style.main_client_table.details_address thead th:nth-child(6) {
        width: 0;
    }

    .new-table-style.main_client_table .data-row.action_active .data-row-action {
        opacity: 1;
        visibility: visible;
    }

    .main_client_table .data-row-action {
        position: fixed;
        inset: auto 0 0;
        z-index: 1032;
        background: #fff;
        border-radius: 10px 10px 0 0;
        opacity: 0;
        visibility: hidden;
    }

    .main_client_table .action-btn-wrap {
        margin-inline: 30px;
        padding-block: 20px;
    }
    .main_client_table .action-btn-wrap + .action-btn-wrap {
        border-top: 1px solid #E0E0E0;
    }

    .main_client_table .data-row-action [class^="btn-"] {
        gap: 10px;
    }

    .new-table-style:not(.main_client_table) .data-row-action {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }
}

.client-delete-modal.modal .modal-content,
.add-client-modal.modal .modal-content,
.client-details-modal.modal .modal-content {
    background: #fff;
}

.client-delete-modal .modal-header,
.add-client-modal .modal-header,
.client-details-modal .modal-header {
    border: none;
}

.client-delete-modal .close,
.add-client-modal .close,
.client-details-modal .close {
    opacity: 1;
    display: flex;
}

.client-delete-modal .modal-confirm-text {
    font-size: 16px;
    line-height: 30px;
    color: #000;
    margin-bottom: 17px;
}

.client-delete-modal .btn {
    font-size: 18px;
    font-weight: 500;
    box-shadow: none;
    border-radius: 4px;
    border: none;
    margin: 0;
    line-height: 1.5;
    padding: 9px;
    height: auto;
}

.client-delete-modal .btn-danger {
    color: #fff;
    background: #DD0000;
}

.client-delete-modal .btn.btn-danger:hover,
.client-delete-modal .btn.btn-danger.active,
.client-delete-modal .btn.btn-danger:active:hover {
    background: #DD0000;
    color: #fff;
}

.client-delete-modal .btn-default {
    background: #F7F8F9;
    border-color: #F7F8F9;
    color: rgba(0,0,0,0.5);
}

.client-delete-modal .btn.btn-default:hover,
.client-delete-modal .btn.btn-default.active,
.client-delete-modal .btn.btn-default:active:hover {
    background: #F7F8F9;
    border-color: #F7F8F9;
    color: #000;
}

.client-delete-modal .modal-heading,
.add-client-modal .modal-heading,
.client-details-modal .modal-heading {
    margin: 0;
    font-size: 20px;
    font-weight: 500;
}

.client-delete-modal .modal-heading,
.add-client-modal .modal-heading {
    text-align: center;
}

.client-delete-modal .modal-heading span,
.client-details-modal .modal-heading span {
    color: #7638FF;
}

.client-details-modal .btn-switch-card {
    background: none;
    border-radius: 0;
    margin: 12px 0 0;
    padding: 0;
    border: none;
    color: #7638FF;
    font-size: 14px;
    line-height: 1.5;
    display: flex;
    align-items: center;
    gap: 9px;
}

.client-details-modal .btn-switch-card:hover span {
    text-decoration: none;
}

.client-details-modal .btn-switch-card svg {
    overflow: visible;
}

.client-details-modal .btn-switch-card span {
    text-decoration: underline;
}

.client-details-modal .close,
.add-client-modal .close {
    position: absolute;
    margin: 0;
}

@media screen and (min-width: 768px) {
    .client-delete-modal .modal-dialog {
        width: 450px;
        min-height: calc(100% - 60px);
        display: flex;
        align-items: center;
    }

    .client-delete-modal.modal .modal-content {
        width: 100%;
    }

    .client-delete-modal .modal-header {
        padding: 17px 15px 0;
    }

    .client-delete-modal .modal-body {
        padding-block: 10px 40px;
    }

    .client-delete-modal .modal-confirm-text {
        font-size: 18px;
        margin-block-end: 17px;
    }

    .client-delete-modal .modal-action-btns-wrap {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 20px;
    }

    .client-delete-modal .btn {
        font-size: 14px;
        padding: 12px 13.5px;
        min-width: 125px;
    }

    .client-delete-modal .modal-heading {
        display: none;
    }

    .client-details-modal .modal-dialog {
        margin-block: 0;
        margin-inline: auto 0;
        height: 100%;
        width: 380px;
    }

    .client-details-modal.modal .modal-content {
        border-radius: 0;
        min-height: 100%;
    }

    .client-details-modal .modal-header {
        background: #F7F8F9;
        padding: 24px 30px 20px;
    }

    .add-client-modal .modal-header {
        background: #F7F8F9;
        padding: 24px;
    }

    .add-client-modal .close {
        inset-block-start: 20px;
        inset-inline-end: 20px;
    }

    .client-details-modal .btn-switch-card {
        margin-block-start: 13px;
    }

    .client-details-modal .close {
        inset-block-start: 27px;
        inset-inline-end: 30px;
    }
}

.client-details-modal.modal.fade .modal-dialog {
    transform: none;
}

@media screen and (max-width: 767px) {
    .client-delete-modal .modal-dialog,
    .add-client-modal .modal-dialog,
    .client-details-modal .modal-dialog {
        margin: 0;
        height: 100%;
        display: flex;
        align-items: flex-end;
    }

    .client-delete-modal.modal .modal-content,
    .add-client-modal.modal .modal-content,
    .client-details-modal.modal .modal-content {
        border-radius: 10px 10px 0 0;
        width: 100%;
    }

    .client-delete-modal .modal-header,
    .add-client-modal .modal-header,
    .client-details-modal .modal-header {
        position: relative;
    }

    .client-delete-modal .modal-header {
        border-bottom: 1px solid #E0E0E0;
        padding: 23px;
    }

    .client-delete-modal .close {
        position: absolute;
        inset-block-start: 50%;
        inset-inline-start: 16px;
        transform: translate(0,-50%);
    }

    .client-delete-modal .modal-body {
        padding: 17px 30px 30px;
    }

    .client-delete-modal .btn-default {
        display: none;
    }

    .client-delete-modal .btn-danger {
        width: 100%;
    }

    .add-client-modal .modal-header {
        border-bottom: 1px solid #E0E0E0;
        background: #FAFAFA;
        padding: 23px;
    }

    .add-client-modal .close {
        inset: 50% 29px auto auto;
        transform: translateY(-50%);
    }

    .add-client-modal .modal-body {
        background: #FAFAFA;
    }

    .client-details-modal .modal-header {
        background: #FAFAFA;
        padding: 22px 30px;
        border-bottom: 1px solid #E0E0E0;
    }

    .client-details-modal .modal-heading {
        text-align: center;
    }

    .client-details-modal .close {
        inset: 28px 30px auto auto;
    }

    .client-details-modal .modal-body {
        min-height: calc(100dvh - 160px);
        background: #FAFAFA;
    }

    .client-delete-modal.modal:not(.in) .modal-dialog {
        transform: translate(0, 25%);
    }
}

.popup-tabs {
    list-style: none;
    padding: 0;
    margin: 0;
    border-bottom: 2px solid #E2E2E2;
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    line-height: 1.5;
}

.popup-tabs a {
    color: rgba(0,0,0,0.5);
    display: block;
    font-weight: 500;
    position: relative;
    padding-block: 15px;
}

.popup-tabs a:after {
    content: '';
    position: absolute;
    bottom: -2px;
    height: 2px;
    left: 0;
    right: 0;
    background: #7638FF;
    z-index: 2;
    opacity: 0;
    transition: 0.15s ease opacity;
}

.popup-tabs a:hover,
.popup-tabs .active > a {
    color: #000;
}

.popup-tabs a:hover:after,
.popup-tabs .active > a:after {
    opacity: 1;
}

.client-contacts-content {
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: auto;
    scrollbar-color: auto;
    max-height: calc(100dvh - 222px);
    padding-block-start: 10px;
}

.client-details-modal ::-webkit-scrollbar {
    width: 5px;
    border-radius: 0;
}

.client-details-modal ::-webkit-scrollbar-track {
    background: #E2E2E2;
    border-radius: 0;
}

.client-details-modal ::-webkit-scrollbar-thumb {
    background: #7638FF;
    border-radius: 0;
}

.client-contacts-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
}

.client-contacts-content ul li {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-block: 10px;
}

.client-contacts-content ul li:not(:last-child) {
    border-bottom: 1px solid #E2E2E2;
}

.contact-list .contact-info-row {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.contact-list .contact-icon-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.contact-list .contact-icon-row a {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    width: 30px;
    height: 30px;
    background: #EBE2FF;
}

.contact-list .contact-icon-row a svg {
    overflow: visible;
}

.client-address-modal {
    padding-top: 20px;
}

.client-address-modal dl {
    font-size: 14px;
    line-height: 1.5;
    margin-block: 0;
}

.client-address-modal dl + dl {
    border-top: 1px solid #E2E2E2;
    padding-top: 10px;
}

.client-address-modal dt {
    font-weight: 500;
    color: rgba(0,0,0,0.5);
    float: left;
    clear: left;
}

.client-address-modal dt,
.client-address-modal dd {
    padding-bottom: 10px;
    line-height: 1.5;
}

.rtl .client-address-modal dt {
    float: right;
    clear: right;
}

.client-address-modal dd {
    overflow: hidden;
    text-align: end;
}

.client-details-modal .modal-body {
    padding: 6px 0 0;
}

.client-contacts-content ul,
.client-address-modal dl {
    margin-inline: 30px;
}

@media screen and (min-width: 768px) {
    .client-details-modal .modal-body {
        padding-top: 0;
    }

    .popup-tabs {
        padding-inline: 29px;
    }

    .client-contacts-content {
        max-height: calc(100dvh - 156px);
    }
}

@media screen and (max-width: 767px) {
    .popup-tabs {
        margin-inline: 30px;
    }
}

.add-client-modal label {
    font-weight: 400;
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 4px;
}

.form-control.new_style_45 {
    height: 45px;
    border-color: #E0E0E0;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.5;
    padding: 11px 14px;
    color: #000;
}

.form-control.new_style_45.club_points {
    max-width: 110px;
}

textarea.form-control.new_style_45 {
    min-height: 80px;
}

.radios_wrap {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.radios_wrap label {
    font-size: 14px;
    line-height: 1.5;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

input[type="radio"].new_custom_radio {
    appearance: none;
    padding: 0;
    margin: 0;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    border: 1px solid #7638FF;
    background: #fff;
    outline: none;
}

input[type="radio"].new_custom_radio:checked {
    background: #fff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g transform="translate(-202)"><rect width="24" height="24" fill="%23fff" data-name="Rectangle 3113" rx="12" transform="translate(202)"/><rect width="16" height="16" fill="%237638ff" data-name="Rectangle 3115" rx="8" transform="translate(206 4)"/></g></svg>') 50% 50%/100% auto no-repeat;
}

.radios_wrap label .label_text {
    padding-block-start: 3px;
}

.new_style_45 + .select2-container--default .select2-selection--single {
    border-color: #E0E0E0;
    border-radius: 4px;
    height: 45px;
    padding-inline: 8px;
}

.new_style_45 + .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-size: 14px;
    line-height: 43px;
}

.new_style_45 + .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 43px;
    width: 36px;
}

.new_style_45 + .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-width: 7.5px 7.5px 0;
    border-top-color: rgba(0,0,0,0.5);
    transform: translateY(-50%);
}

.add-client-modal .btn-primary {
    height: 45px;
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
    border-radius: 4px;
    font-weight: 500;
    box-shadow: none;
    width: 100%;
    margin: 0;
}

.add-client-modal .btn-primary:not(:disabled):not(.disabled) {
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
}

.rtl input[type="tel"],
[dir="rtl"] input[type="tel"] {
    text-align: start;
    direction: rtl;
}

.add-client-modal .inputs-row {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.add-client-modal .new_street {
    flex: 1 1 0;
}

.add-client-modal .modal-body {
    padding: 20px 30px 30px;
}

.add-client-modal .new_house {
    flex-basis: 95px;
}

.add-client-modal .form-group {
    margin-bottom: 15px;
}
.add-client-modal .btns-wrap {
    padding-top: 15px;
}

@media screen and (min-width: 768px) {
    .add-client-modal .modal-dialog {
        width: 450px;
    }

    .add-client-modal.add_contact .modal-dialog {
        width: 370px;
    }

    .add-client-modal .modal-body {
        padding: 20px 35px 30px;
    }

    .add-client-modal.add_contact .modal-body {
        padding-block-end: 40px;
    }

    .add-client-modal fieldset {
        min-height: 425px;
    }
    .step_address,
    .add-client-modal form:not(.address_step_active) .btn.btn_final_submit {
        display: none;
    }
    .add-client-modal .btn-primary {
        max-width: 220px;
        margin-inline: auto;
    }

    .address_step_active .step_personal_info {
        display: none;
    }

    .address_step_active .step_address {
        display: block;
    }

    .address_step_active #step_next_address {
        display: none;
    }

    .address_step_active .btn_final_submit {
        display: block;
    }

    .radios_wrap label .label_text {
        padding-block: 2px;
    }
}

@media screen and (max-width: 767px) {
    .add-client-modal #step_next_address {
        display: none;
    }

    .add-client-modal.modal:not(.in) .modal-dialog {
        transform: translate(0, 25%);
    }
}

.client-details-container {
    padding-inline: 16px;
    padding-block: 25px 40px;
    position: relative;
}

.client-details-container h1 {
    margin-block: 0 23px;
    font-weight: 500;
    font-size: 24px;
}

.client-details-container h1 span {
    color: #7638FF;
}

.mobile-details-menu {
    margin-bottom: 21px;
    position: relative;
}

.mobile-details-menu.drop_active {
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));
    z-index: 99;
}

.mobile-details-menu .select2-container--default .select2-selection--single {
    display: flex;
    align-items: center;
    justify-content: center;
}

.mobile-details-menu .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-size: 16px;
    font-weight: 700;
    color: #7638FF;
}

.mobile-details-menu .select2-container--default .select2-selection--single .select2-selection__arrow {
    position: relative;
    width: auto;
}

.mobile-details-menu .select2-dropdown {
    max-width: 100%;
    box-shadow: none;
    padding: 0;
    border: 1px solid #E0E0E0;
    border-width: 0 1px 1px;
    margin-top: -1px;
}

.mobile-details-menu .select2-container--default .select2-results__option {
    border: none;
    border-radius: 0;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;
    margin: 0;
    padding-block: 19px;
    position: relative;
}

.mobile-details-menu .select2-container--default .select2-results__option:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 15px;
    right: 15px;
    border-bottom: 1px solid #E0E0E0;
}

.mobile-details-menu .select2-container--default .select2-results__option:last-child:after {
    display: none;
}

.mobile-details-menu .select2-container--default .select2-results__option--highlighted[aria-selected] {
    font-weight: 700;
    background: #EBE2FF;
}

@media screen and (min-width: 768px) {
    .mobile-details-menu {
        display: none;
    }
}

.client-contact-details-box {
    border-radius: 4px;
    border: 1px solid #E0E0E0;
    background: #fff;
    font-size: 14px;
    line-height: 1.5;
    display: flex;
    flex-wrap: wrap;
    padding: 19px;
    margin-bottom: 20px;
    column-gap: 30px;
}

.client-contact-info-box,
.client-personal-info-box,
.client-subscription-info-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.client-contact-info-box a {
    display: flex;
    align-items: center;
    color: #000;
    gap: 10px;
}

.client-subscription-info-box a {
    color: #7638FF;
    text-decoration: underline;
}

.client-subscription-info-box a:hover {
    text-decoration: none;
}

.client-contact-info-box .ico-wrap {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #EBE2FF;
}

.inputs-group-wrap {
    display: flex;
}

.inputs-group-wrap .form-control.new_style_45 {
    border-start-end-radius: 0;
    border-end-end-radius: 0;
    border-inline-end: 0;
}

.inputs-group-wrap .select2-container {
    width: 110px;
    min-width: 110px;
}

.inputs-group-wrap .select2-container--default .select2-selection--single {
    border-start-start-radius: 0;
    border-end-start-radius: 0;
}

.client-details-wrapper .client-details-tabs {
    display: none;
    list-style: none;
    padding: 21px 0;
    margin: 0;
    border-inline-end: 1px solid #E2E2E2;
}

.client-details-wrapper .btn-add-foreign-account {
    padding: 0;
    background: none;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
    color: #7638FF;
    border: none;
}

.client-details-tabs li {
    margin-bottom: 11.7px;
}

.client-details-tabs a {
    display: block;
    font-size: 18px;
    line-height: 1.5;
    padding: 9px 19px;
    font-weight: 500;
    color: #000;
    position: relative;
}

.client-details-tabs a:before {
    content: '';
    position: absolute;
    inset: 0 0 0 auto;
    width: 3px;
    background: #7638FF;
    opacity: 0;
}

.client-details-tabs .active a {
    background: #EBE2FF;
}

.client-details-tabs .active a:before {
    opacity: 1;
}

.client-details-wrapper label {
    font-size: 14px;
    font-weight: 400;
    color: #000;
    line-height: 1.5;
    margin-bottom: 4px;
}

.details-checkbox-wrap label {
    display: flex;
    align-items: center;
    gap: 10px;
}

.details-checkbox-wrap input[type=checkbox] {
    width: 24px;
    height: 24px;
    border: 1px solid #7638FF;
    margin: 0;
    border-radius: 4px;
}

.client-details-wrapper .input-info {
    font-size: 12px;
    padding-top: 4px;
}

.client-details-container .submit-btns-wrap .btn {
    width: 100%;
}

@media screen and (min-width: 768px) {
    .client-details-container {
        padding-inline: 40px;
    }

    .client-details-container h1 {
        margin-block-end: 34px;
    }

    .client-contact-details-box {
        gap: 60px;
        margin-bottom: 30px;
    }
}

@media screen and (min-width: 1024px) {
    .client-details-wrapper {
        border-radius: 4px;
        background: #fff;
        border: 1px solid #E0E0E0;
        display: flex;
    }

    .client-details-wrapper .client-details-tabs {
        flex-basis: 180px;
        max-width: 180px;
        display: block;
    }

    .client-details-wrapper .tab-content {
        padding: 30px;
        flex: 1 1 0;
        max-width: calc(100% - 180px);
        min-height: 558px;
    }

    .client-details-wrapper .details-inputs-wrap {
        max-width: 940px;
        display: grid;
        column-gap: 20px;
        grid-template-columns: repeat(3, 1fr);
    }

    .client-details-wrapper .form-group {
        margin-bottom: 20px;
    }

    .client-details-wrapper .details-checkbox-wrap {
        grid-column: auto / span 3;
        margin-bottom: 0;
    }

    .client-details-wrapper .submit-btns-wrap {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .details-checkbox-wrap {
        margin-bottom: 15px;
    }
}

#closeAlert{
    position: absolute;
    top: 10px;
    right: 22px;
    cursor: pointer;
}


.dashboard-package-notice,
.packages-details-text {
    font-size: 16px;
    line-height: 1.5;
    color: #000;
}

.dashboard-package-notice {
    padding-block: 5px 25px;
}

.dashboard-package-notice a,
.packages-details-text a{
    text-decoration: underline;
    color: #7638FF;
}

.dashboard-package-notice a:hover,
.packages-details-text a:hover {
    text-decoration: none;
}

@media screen and (max-width: 767px) {
    .dashboard-package-notice,
    .packages-details-text {
        display: flex;
        flex-direction: column;
    }

    .dashboard-package-notice {
        padding-block: 5px 18px;
        gap: 7px;
    }

    .packages-details-text {
        gap: 10px;
    }
}

@media (max-width: 1399.98px) {
    .packages-main-container {
        zoom: 125%;
    }
}

.packages-main-container {
    padding-inline: 16px;
    padding-block: 25px;
    color: #000;
}

.packages-main-container h1 {
    margin-block: 0;
    font-size: 24px;
    font-weight: 500;
}

.packages-details-text {
    padding-block: 14px 5px;
}

@media screen and (min-width: 768px) {
    .packages-main-container {
        padding-inline: 40px;
    }

    .packages-details-text {
        padding-block: 25px 4px;
    }
}

.packages-select-row {
    display: flex;
    gap: 20px;
    overflow-y: hidden;
    overflow: auto;
    padding-block-end: 30px;
}

@media screen and (max-width: 767px) {
    .packages-select-row {
        margin-inline: -16px;
        padding-inline: 16px;
    }
}

.packages-select-row::-webkit-scrollbar {
    width: 0;
    display: none;
}

.package-item {
    min-width: 215px;
    max-width: 215px;
    border-radius: 4px;
    background: #fff;
    border: 1px solid #bcbcbc;
    text-align: center;
    padding: 15px;
    font-size: 16px;
    line-height: 1.5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 286px;
    transition: 0.2s ease border;
    margin-block-start: 15px;
}

.package-item.selected,
.package-item.actived,
.package-item:hover {
    border-color: #7638FF;
}

.package-item.selected {
    position: relative;
}

.package-item .selected-label {
    position: absolute;
    inset: -14px 18px auto;
    font-size: 14px;
    background: #EBE2FF;
    font-weight: 500;
    border-radius: 4px;
    padding: 4px;
}

.package-item .package-name {
    font-size: 20px;
    font-weight: 500;
}

.package-item .package-price {
    font-weight: 700;
    line-height: 1.45;
    margin-top: 10px;
}

.package-item .package-price .amount {
    font-size: 20px;
    color: #7638FF;
}

.package-item .package-price .per-unit-name {
    color: rgba(0,0,0,0.5);
}

.package-item .btn-select-package {
    min-width: 125px;
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
    border-radius: 4px;
    font-size: 16px;
    line-height: 1.3125;
    padding: 11px;
    margin-block: 20px;
    align-self: center;
}

.package-item p {
    margin: 0;
    padding-block: 2.5px;
}

@media screen and (min-width: 1200px) {
    .packages-select-row {
        gap: 30px;
    }
}

.addons-section {
    border-top: 1px solid #E0E0E0;
    padding-block: 33px;
}

.addons-section h2 {
    font-size: 20px;
    font-weight: 500;
    margin: 0 0 11px;
}

.addons-header-text {
    font-size: 16px;
    line-height: 1.625;
    padding: 0 0 8px;
}

.addons-row {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: 20px;
}

.addon-item {
    border-radius: 4px;
    background: #fff;
    border: 1px solid #bcbcbc;
    padding: 15px;
    line-height: 1.5;
}

.addon-item .addon-header {
    display: flex;
    gap: 10px;
}

.addon-item .ico-wrap {
    border: 1px solid #BCBCBC;
    width: 50px;
    height: 50px;
    border-radius: 4px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.addon-item .ico-wrap svg {
    overflow: visible;
    max-width: 100%;
    height: auto;
}

.addon-item .addon-header-text {
    flex-basis: calc(100% -  131px);
    max-width: calc(100% -  131px);
    font-weight: 700;
    font-size: 16px;
}

.addon-item .addon-price {
    color: #7638FF;
    padding-top: 2px;
}

.addon-item input[type=checkbox].matat_package_switch {
    appearance: none;
    border: 1px solid #E0E0E0;
    width: 61px;
    height: 36px;
    border-radius: 100px;
    background: #EBE2FF;
    margin: 0;
    padding: 0;
    transition: 0.25s ease background;
}

.addon-item input[type=checkbox].matat_package_switch:checked {
    background: #7638FF;
}

.addon-item input[type=checkbox].matat_package_switch:before {
    transform: translate(0,-50%);
    margin: 0;
    border: none;
    width: 26px;
    height: 26px;
    background: #fff;
    border-radius: 50%;
    right: calc(100% - 31px);
    transition: 0.25s ease right;
}

.addon-item input[type=checkbox].matat_package_switch:checked:before {
    right: 5px;
}

.addon-item .addon-body {
    color: rgba(0,0,0, 0.5);
    padding-top: 10px;
}

.addon-item .addon-link {
    text-decoration: underline;
    color: #7638FF;
}

.addon-item .addon-link:hover {
    text-decoration: none;
}

@media screen and (min-width: 768px) {
    .addons-row {
        grid-template-columns: repeat(2, 1fr);
        column-gap: 18px;
    }

    .addons-section h2 {
        margin-bottom: 22px;
    }
}

@media screen and (min-width: 1200px) {
    .addons-row {
        grid-template-columns: repeat(3 , 1fr);
    }
}

.package-popup {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: rgba(0,0,0,0.1);
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    opacity: 0;
    visibility: hidden;
    transition: 0.25s ease opacity, 0.25s ease visibility;
}

.package-popup.active {
    opacity: 1;
    visibility: visible;
}

.package-popup-container {
    background: #fff;
    border-radius: 4px 4px 0 0;
    border: 1px solid #e0e0e0;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
    position: relative;
    text-align: center;
    color: #000;
}

.package-popup .btn-close-popup {
    padding: 0;
    margin: 0;
    background: none;
    border: none;
    outline: none;
    position: absolute;
    inset: 28px 16px auto auto;
}

.package-popup .btn-close-popup svg {
    display: block;
    width: 14px;
    height: auto;
}

.package-popup-header {
    font-size: 20px;
    line-height: 1.45;
    padding: 1em;
    font-weight: 500;
    border-bottom: 1px solid #E0E0E0;
}

.package-popup-body {
    padding: 20px 30px 30px;
}

.package-popup-body .modal-text {
    line-height: 30px;
    font-size: 16px;
}

.package-popup-btns  {
    display: flex;
    gap: 20px;
    justify-content: center;
    padding-top: 20px;
}

.package-popup-btns .btn {
    border-radius: 4px;
    font-size: 16px;
    line-height: 1.3125;
    padding: 11px;
    flex: 1 1 0;
}

.package-popup-btns .btn-select-package {
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
}

@media screen and (min-width: 768px) {
    .package-popup {
        justify-content: center;
        align-items: center;
    }

    .package-popup-container {
        border-radius: 4px;
        max-width: 450px;
        margin: auto;
        padding: 40px;
    }

    .package-popup .btn-close-popup {
        inset: 15px auto auto 15px;
    }

    .package-popup-header {
        display: none;
    }

    .package-popup-body {
        padding: 0;
    }

    .package-popup-body .modal-text {
        font-size: 18px;
    }

    .package-popup-btns .btn {
        flex: 0;
        min-width: 125px;
    }
}
.form-control.flatpickr-input[readonly] {
    background-color: #fff;
}

/* new customer page styles start */
.clients-main-container {
    padding-inline: 16px;
    padding-block: 20px;
    position: relative;
}

.btn.btn-client-action-opener {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0;
    background: #EBE2FF;
    border-radius: 4px;
    width: 30px;
    height: 30px;
    inset-block-start: 20px;
    inset-inline-end: 16px;
    padding: 0;
}

.clients-main-container h1 {
    margin-block: 0 23px;
    font-weight: 500;
    font-size: 24px;
}

.client-content-actions {
    display: flex;
    margin-bottom: 31px;
    gap: 10px;
}

.main-search-form {
    position: relative;
    flex-basis: calc(100% - 55px);
    max-width: calc(100% - 55px);
}

.main-search-form .ico-search {
    position: absolute;
    inset-block-start: 23px;
    transform: translate(0,-50%);
    display: flex;
    inset-inline-start: 15px;
}

.main-search-form .form-control {
    border-color: #E0E0E0;
    border-radius: 4px;
    height: 45px;
    font-size: 14px;
    line-height: 1.5;
    padding: 11px 41px;
}

@media screen and (min-width: 768px) {
    .clients-main-container {
        padding-inline: 40px;
    }

    .main-search-form {
        max-width: 250px;
        margin-inline-end: auto;
    }

    .btn.btn-client-action-opener {
        display: none;
    }
}

.tools-left-box .mobile-header {
    border-bottom: 1px solid #E0E0E0;
    position: relative;
    font-size: 20px;
    line-height: 1.5;
    font-weight: 500;
    text-align: center;
    padding: 20px;
}
.tools-left-box  .btn-close-tools {
    border: none;
    padding: 0;
    margin: 0;
    background: none;
    position: absolute;
    inset: 50% 30px auto auto;
    transform: translate(0,-50%);
    display: flex;
}

.actions-button-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.btn-action {
    display: flex;
    align-items: center;
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font-size: 16px;
    line-height: 1.5;
    gap: 10px;
}

.btn-action .action-ico {
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-action svg {
    overflow: visible;
}

.btn.btn-add-content,
.client-details-container .btn.btn-primary,
.btn.btn-add-customer {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 45px;
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
    border-radius: 4px;
    font-weight: 500;
    margin: 0;
}

.btn.btn-add-content:not(:disabled):not(.disabled),
.client-details-container .btn.btn-primary:not(:disabled):not(.disabled),
.btn.btn-add-customer:not(:disabled):not(.disabled) {
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
}

.btn-add-customer .btn-text {
    display: none;
}

.actions-button-list .dropdown-menu {
    box-shadow: none;
    border-radius: 0;
}

.actions-button-list .dropdown-item {
    font-weight: 400;
    color: #000;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.actions-button-list input[type=checkbox] {
    border-radius: 0;
    border: 1px solid #E2E2E2;
    width: 20px;
    height: 20px;
    background: #fff;
    margin-block: 0;
    margin-inline: 0;
}

.actions-button-list input[type=checkbox]:checked {
    background: #fff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 11.971 9.167"><path fill="%237638ff" d="M11.908 1.073 10.93.067A.21.21 0 0 0 10.774 0a.2.2 0 0 0-.156.067L3.836 6.899l-2.47-2.468a.215.215 0 0 0-.311 0l-.99.99a.221.221 0 0 0 0 .317l3.113 3.113a.985.985 0 0 0 .65.317 1.032 1.032 0 0 0 .645-.306h.006l7.434-7.468a.238.238 0 0 0-.005-.321Z" data-name="Icon ionic-ios-checkmark"/></svg>') 50% 50%/60% auto no-repeat;
}

.actions-button-list input[type=checkbox]:before {
    display: none;
}

#custom_overlay {
    position: fixed;
    z-index: 1031;
    background: rgba(0,0,0,0.5);
    inset: 0;
    transition: 0.3s ease opacity .05s, 0.3s ease visibility .05s;
    opacity: 0;
    visibility: hidden;
    display: none;
}

.client-details-container .submit-btns-wrap {
    padding-top: 15px;
}

@media screen and (min-width: 768px) {
    .tools-left-box .mobile-header,
    .actions-button-list .dropdown-menu .dropdown-menu-header {
        display: none;
    }

    .tools-left-box-wrapper {
        display: flex;
        align-items: flex-start;
        gap: 19.5px;
        align-items: center;
    }

    .actions-button-list {
        display: flex;
        align-items: center;
        gap: 19.3px;
    }

    .btn-action > span {
        display: none;
    }

    .btn-add-customer {
        width: 140px;
    }

    .btn-add-customer svg {
        display: none;
    }

    .btn-add-customer .btn-text {
        display: block;
    }

    .btn-action {
        justify-content: center;
    }

    .actions-button-list .dropdown-menu {
        left: 50%;
        transform: translateX(-50%);
        padding: 25px 19px 10px;
        min-width: 150px;
        border-radius: 4px 4px 0 0;
        border-color: #E0E0E0;
        margin-top: 10px;
        filter: drop-shadow(0px 0px 6px rgba(0, 0, 0, 0.1));
    }

    .actions-button-list .dropdown-menu:before,
    .actions-button-list .dropdown-menu:after {
        content: '';
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%, -100%);
        border: 6px solid transparent;
        border-width: 0 6px 6px;
    }

    .actions-button-list .dropdown-menu:before {
        border-bottom-color: #E0E0E0;
    }

    .actions-button-list .dropdown-menu:after {
        border-bottom-color: #fff;
        margin-top: 1px;
    }

    .mobile-detailes-menu {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .btn-add-customer {
        position: fixed;
        inset-block-end: 20px;
        inset-inline-start: 20px;
        width: 45px;
        height: 45px;
        z-index: 870;
    }

    #custom_overlay {
        display: block;
    }

    #custom_overlay.active {
        opacity: 1;
        visibility: visible;
    }

    .tools-left-box {
        position: fixed;
        z-index: 1032;
        inset: auto 0 0;
        background: #fff;
        border-radius: 10px 10px 0 0;
        opacity: 0;
        visibility: hidden;
        transition: 0.3s ease opacity, 0.3s ease visibility;
        min-height: 360px;
    }

    .tools-left-box.active {
        opacity: 1;
        visibility: visible;
    }

    .actions-button-list {
        padding-inline: 20px;
    }

    .actions-button-list li {
        padding-block: 20px;
    }

    .actions-button-list li + li {
        border-top: 1px solid #E0E0E0;
    }

    .btn-action {
        width: 100%;
    }

    .btn-action .action-ico {
        width: 25px;
    }

    .actions-button-list li.dropdown {
        position: static;
    }

    .actions-button-list .dropdown-backdrop {
        display: none;
    }

    .actions-button-list .dropdown-menu {
        inset: 0;
        margin: 0;
        padding: 0;
        border-radius: 10px 10px 0;
    }

    .dropdown-menu .dropdown-menu-header {
        border-radius: 10px 10px 0 0;
        border-bottom: 1px solid #E0E0E0;
        display: flex;
        align-items: center;
        font-size: 20px;
        line-height: 1.5;
        font-weight: 500;
        padding: 20px;
        gap: 10px;
    }

    .dropdown-menu-header .close-dropdown-menu {
        padding: 0;
        background: none;
        border-radius: 0;
        display: flex;
    }

    .dropdown-menu-content {
        padding: 10px 30px;
        max-height: 289px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .actions-button-list .dropdown-item:not(:last-child) {
        margin-bottom: 20px;
    }

    .details-checkbox-wrap {
        padding-top: 5px;
    }
}

.clients-table-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    max-width: 100%;
}

.new-table-style {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

.new-table-style.main_client_table {
    min-width: 1141px;
}

.clients-table-wrap.cards_index_wrapper {
    max-width: max-content;
}

.cards_index_wrapper,
.details_address_wrap,
.customer_clubs_wrapper,
.detail_contacts_wrapper {
    position: relative;
    max-width: max-content;
}

.cards_index_wrapper {
    min-width: 1055px;
}

.cards_index_wrapper .cards_table_action,
.customer_clubs_wrapper .cards_table_action,
.details_address_wrap .cards_table_action,
.detail_contacts_wrapper .cards_table_action {
    display: flex;
    align-items: center;
    position: absolute;
    inset-block-start: 42px;
    inset-inline-end: 0;
    gap: 20px;
}

.new-table-style.cards_index {
    min-width: 955px;
    max-width: 955px;
    margin-inline-end: 100px;
}

.new-table-style.detail_contacts_table {
    min-width: 811px;
    max-width: 811px;
}

.new-table-style.main_client_table.details_address {
    min-width: 612px;
    max-width: 612px;
}

.new-table-style.customer_clubs_table {
    min-width: 686px;
    max-width: 686px;
}

.new-table-style .table-filter-row td,
.new-table-style .data-row td{
    color: #000;
    font-size: 14px;
    line-height: 1.5;
    border: 1px solid #e0e0e0;
    border-block-width: 1px 0;
    border-inline-width: 1px 0;
    background: #fff;
    transition: 0.25s ease background;
}

.new-table-style .data-row td:last-child,
.new-table-style .table-filter-row td:last-child {
    border-inline-end-width: 1px;
}

.new-table-style .data-row td {
    height: 61px;
}

.new-table-style thead th {
    font-weight: 500;
    font-size: 16px;
    color: rgba(0,0,0,0.5);
    text-align: center;
    padding-block: 13px;
}

.new-table-style.main_client_table thead th.mobile-col {
    width: 46px;
}

.new-table-style.main_client_table thead th:nth-child(2) {
    width: 15.337423312883436%;
}

.new-table-style.main_client_table.details_address thead th:nth-child(2),
.new-table-style.main_client_table.details_address thead th:nth-child(4),
.new-table-style.main_client_table.details_address thead th:nth-child(5) {
    width: 24.50980392156863%;
}

.new-table-style.main_client_table thead th:nth-child(3) {
    width: 13.75985977212971%;
}

.new-table-style.main_client_table.details_address thead th:nth-child(3) {
    width: 11.764705882352942%;
}

.new-table-style.main_client_table thead th:nth-child(4) {
    width: 15.950920245398773%;
}

.new-table-style.main_client_table thead th:nth-child(5) {
    width: 14.46099912357581%;
}

.new-table-style.main_client_table thead th:nth-child(6) {
    width: 17.879053461875547%;
}

.new-table-style.main_client_table.details_address thead th:nth-child(6) {
    width: auto;
}

.new-table-style.main_client_table thead th:nth-child(7) {
    width: 11.568799298860649%;
}

.new-table-style.main_client_table thead th:nth-child(8) {
    width: 14.899211218229624%;
}

.new-table-style.cards_index thead th {
    width: 13.821989528795811%;
}

.new-table-style.cards_index thead th.ref_no_col {
    width: 16.544502617801047%;
}

.new-table-style.cards_index thead th:last-child {
    width: 14.24083769633508%;
}

.new-table-style.detail_contacts_table thead th {
    width: 18.49568434032059%;
}

.new-table-style.detail_contacts_table thead th:last-child {
    width: 26.01726263871764%;
}

.new-table-style.customer_clubs_table thead th {
    width: 19.24%;
}

.new-table-style.customer_clubs_table thead th.ref_no_col {
    width: 23.04%;
}

.table-data-search-wrap {
    position: relative;
    padding-block: 9px;
}

.table-data-search-wrap input,
.table-data-search-wrap select {
    width: 100%;
    padding: 5px 10px;
    margin: 0;
    background: none;
    border: none;
    font: 400 14px/1.5 'Heebo', sans-serif;
    height: 31px;
}

.table-data-search-wrap select {
    color: rgba(0,0,0,0.5);
    appearance: none;
}

.table_data_filter + .select2-container--default .select2-selection--single {
    height: 31px;
    border: none;
}

.table_data_filter + .select2-container--default .select2-selection--single .select2-selection__rendered {
    font: 400 14px/31px 'Heebo', sans-serif;
}

.table_data_filter + .select2-container--default .select2-selection--single .select2-selection__placeholder {
    color: rgba(0,0,0,0.5);
}

.table_data_filter + .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-width: 7.5px 7.5px 0;
    border-top-color: #000;
    transform: translateY(-50%);
}

.table-data-search-wrap svg {
    position: absolute;
    inset-block-start: 50%;
    inset-inline-end: 10px;
    transform: translate(0,-50%);
}

.new-table-style tbody tr:last-child td {
    border-bottom: 1px solid #e0e0e0;
}

.new-table-style .data-row:hover td {
    background: #F9F7FF;
}

.new-table-style tbody tr:last-child td:first-child:not(.mobile-col) {
    border-end-start-radius: 4px;
}

.new-table-style tbody tr:last-child td:last-child {
    border-end-end-radius: 4px;
}

.new-table-style .link_download {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    color: #7638FF;
}

.new-table-style .link_download:hover span {
    text-decoration: none;
}

.new-table-style .link_download span {
    text-decoration: underline;
}

.new-table-style .points-info {
    direction: ltr;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.new-table-style .points-info .indicator {
    width: 10px;
    height: 10px;
    border-radius: 10px;
}

.new-table-style .points-info .indicator.up {
    background: #5EDD60;
}

.new-table-style .points-info .indicator.down {
    background: #DD0000;
}

.data-row-action [class^="btn-"] {
    padding: 0;
    margin: 0;
    border: none;
    background: none;
    outline: none;
    display: flex;
    align-items: center;
}

.tooltip-inner {
    background: #fff;
    border: 1px solid #E0E0E0;
    font-size: 12px;
    color: #000;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
}

.tooltip.top .tooltip-arrow {
    border-top-color: #E0E0E0;
}

.tooltip.top .tooltip-arrow:before {
    content: '';
    border-style: solid;
    border-color: transparent;
    border-width: 5px 5px 0;
    border-top-color: #fff;
    position: absolute;
    bottom: 1px;
    margin-left: -5px;
    left: 50%;
}

.data-row-action .ico-wrap {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #EBE2FF;
    border-radius: 4px;
}

.data-row-action .ico-wrap svg {
    overflow: visible;
}

.inner-data-info {
    display: block;
    font-size: 12px;
    color: rgba(0,0,0,0.5);
    padding-top: 3px;
}

.new-table-style tbody td {
    text-align: center;
}

.mobile-row-action-header {
    position: relative;
    border-bottom: 1px solid #E0E0E0;
    font-size: 20px;
    font-weight: 500;
    padding: 20px;
}
.mobile-row-action-header .heading-text span {
    color: #7638FF;
}
.mobile-row-action-header .btn_row_action_close {
    border: none;
    padding: 0;
    margin: 0;
    background: none;
    position: absolute;
    inset: 50% 30px auto auto;
    transform: translate(0,-50%);
    display: flex;
}

.mobile-row-action-header .btn_row_action_close svg {
    overflow: visible;
}

.btn-mobile-row-action-opener {
    border: none;
    padding: 0;
    margin: 0 20px;
    background: none;
    display: flex;
}

.btn-data-filter-opener {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border: 1px solid #E0E0E0;
    border-radius: 4px;
    background: #fff;
}

@media screen and (min-width: 768px) {
    .new-table-style .mobile-col {
        display: none;
    }

    .new-table-style thead th {
        padding-block: 10px;
    }

    .new-table-style tbody tr:last-child td:first-child.mobile-col + td,
    .new-table-style tbody tr:last-child td:first-child:not(.mobile-col) {
        border-end-start-radius: 4px;
    }

    .new-table-style tr.table-filter-row td:first-child.mobile-col + td,
    .new-table-style tr.table-filter-row td:first-child:not(.mobile-col) {
        border-start-start-radius: 4px;
    }

    .new-table-style tr.table-filter-row td:last-child {
        border-start-end-radius: 4px;
    }

    .new-table-style .data-row:hover .data-row-action {
        opacity: 1;
        visibility: visible;
    }

    .data-row-action {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
        padding-inline: 10px;
        opacity: 0;
        transition: 0.25s ease opacity, 0.25s ease visibility;
    }

    .data-row-action [class^="btn-"] .button-label {
        display: none;
    }

    .data-row-action .mobile-row-action-header {
        display: none;
    }

    .btn-data-filter-opener {
        display: none;
    }

    .detail_contacts_wrapper {
        min-width: 991px;
    }

    .details_address_wrap {
        min-width: 792px;
    }

    .customer_clubs_wrapper {
        min-width: 866px;
    }

    .cards_table_action .btn-add-customer {
        width: 150px;
    }

    .new-table-style.detail_contacts_table,
    .new-table-style.customer_clubs_table,
    .new-table-style.details_address {
        margin-inline-end: 180px;
    }
}

@media screen and (max-width: 767px) {
    .clients-table-wrap {
        margin-inline-end: -16px;
        padding-inline-end: 16px;
        max-width: calc(100% + 16px);
    }

    .table-header-row th {
        border-top: 1px solid #e0e0e0;
        border-inline-start: 1px solid #e0e0e0;
        background: #fff;
    }

    .new-table-style tr.table-header-row th:first-child {
        border-start-start-radius: 4px;
    }

    .new-table-style.main_client_table thead th:nth-last-child(2),
    .new-table-style:not(.main_client_table) thead th:last-child {
        border-inline-end: 1px solid #e0e0e0;
        border-start-end-radius: 4px;
    }

    .new-table-style .table-header-row th.blank_data_cell {
        font-size: 0;
        border: none;
    }

    .new-table-style .table-filter-row  {
        display: none;
    }

    .new-table-style.main_client_table tbody tr.data-row td:last-child {
        border: none;
    }

    .new-table-style.main_client_table tbody tr.data-row td:nth-last-child(2) {
        border-inline-end: 1px solid #e0e0e0;
    }

    .new-table-style.main_client_table tbody tr:last-child td:nth-last-child(2) {
        border-end-end-radius: 4px;
    }

    .new-table-style tbody tr:last-child td:first-child {
        border-end-start-radius: 4px;
    }

    .new-table-style.main_client_table.details_address thead th:nth-child(6) {
        width: 0;
    }

    .new-table-style.main_client_table .data-row.action_active .data-row-action {
        opacity: 1;
        visibility: visible;
    }

    .main_client_table .data-row-action {
        position: fixed;
        inset: auto 0 0;
        z-index: 1032;
        background: #fff;
        border-radius: 10px 10px 0 0;
        opacity: 0;
        visibility: hidden;
    }

    .main_client_table .action-btn-wrap {
        margin-inline: 30px;
        padding-block: 20px;
    }
    .main_client_table .action-btn-wrap + .action-btn-wrap {
        border-top: 1px solid #E0E0E0;
    }

    .main_client_table .data-row-action [class^="btn-"] {
        gap: 10px;
    }

    .new-table-style:not(.main_client_table) .data-row-action {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 10px;
    }
}

.client-delete-modal.modal .modal-content,
.add-client-modal.modal .modal-content,
.client-details-modal.modal .modal-content {
    background: #fff;
}

.client-delete-modal .modal-header,
.add-client-modal .modal-header,
.client-details-modal .modal-header {
    border: none;
}

.client-delete-modal .close,
.add-client-modal .close,
.client-details-modal .close {
    opacity: 1;
    display: flex;
}

.client-delete-modal .modal-confirm-text {
    font-size: 16px;
    line-height: 30px;
    color: #000;
    margin-bottom: 17px;
}

.client-delete-modal .btn {
    font-size: 18px;
    font-weight: 500;
    box-shadow: none;
    border-radius: 4px;
    border: none;
    margin: 0;
    line-height: 1.5;
    padding: 9px;
    height: auto;
}

.client-delete-modal .btn-danger {
    color: #fff;
    background: #DD0000;
}

.client-delete-modal .btn.btn-danger:hover,
.client-delete-modal .btn.btn-danger.active,
.client-delete-modal .btn.btn-danger:active:hover {
    background: #DD0000;
    color: #fff;
}

.client-delete-modal .btn-default {
    background: #F7F8F9;
    border-color: #F7F8F9;
    color: rgba(0,0,0,0.5);
}

.client-delete-modal .btn.btn-default:hover,
.client-delete-modal .btn.btn-default.active,
.client-delete-modal .btn.btn-default:active:hover {
    background: #F7F8F9;
    border-color: #F7F8F9;
    color: #000;
}

.client-delete-modal .modal-heading,
.add-client-modal .modal-heading,
.client-details-modal .modal-heading {
    margin: 0;
    font-size: 20px;
    font-weight: 500;
}

.client-delete-modal .modal-heading,
.add-client-modal .modal-heading {
    text-align: center;
}

.client-delete-modal .modal-heading span,
.client-details-modal .modal-heading span {
    color: #7638FF;
}

.client-details-modal .btn-switch-card {
    background: none;
    border-radius: 0;
    margin: 12px 0 0;
    padding: 0;
    border: none;
    color: #7638FF;
    font-size: 14px;
    line-height: 1.5;
    display: flex;
    align-items: center;
    gap: 9px;
}

.client-details-modal .btn-switch-card:hover span {
    text-decoration: none;
}

.client-details-modal .btn-switch-card svg {
    overflow: visible;
}

.client-details-modal .btn-switch-card span {
    text-decoration: underline;
}

.client-details-modal .close,
.add-client-modal .close {
    position: absolute;
    margin: 0;
}

@media screen and (min-width: 768px) {
    .client-delete-modal .modal-dialog {
        width: 450px;
        min-height: calc(100% - 60px);
        display: flex;
        align-items: center;
    }

    .client-delete-modal.modal .modal-content {
        width: 100%;
    }

    .client-delete-modal .modal-header {
        padding: 17px 15px 0;
    }

    .client-delete-modal .modal-body {
        padding-block: 10px 40px;
    }

    .client-delete-modal .modal-confirm-text {
        font-size: 18px;
        margin-block-end: 17px;
    }

    .client-delete-modal .modal-action-btns-wrap {
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 20px;
    }

    .client-delete-modal .btn {
        font-size: 14px;
        padding: 12px 13.5px;
        min-width: 125px;
    }

    .client-delete-modal .modal-heading {
        display: none;
    }

    .client-details-modal .modal-dialog {
        margin-block: 0;
        margin-inline: auto 0;
        height: 100%;
        width: 380px;
    }

    .client-details-modal.modal .modal-content {
        border-radius: 0;
        min-height: 100%;
    }

    .client-details-modal .modal-header {
        background: #F7F8F9;
        padding: 24px 30px 20px;
    }

    .add-client-modal .modal-header {
        background: #F7F8F9;
        padding: 24px;
    }

    .add-client-modal .close {
        inset-block-start: 20px;
        inset-inline-end: 20px;
    }

    .client-details-modal .btn-switch-card {
        margin-block-start: 13px;
    }

    .client-details-modal .close {
        inset-block-start: 27px;
        inset-inline-end: 30px;
    }
}

.client-details-modal.modal.fade .modal-dialog {
    transform: none;
}

@media screen and (max-width: 767px) {
    .client-delete-modal .modal-dialog,
    .add-client-modal .modal-dialog,
    .client-details-modal .modal-dialog {
        margin: 0;
        height: 100%;
        display: flex;
        align-items: flex-end;
    }

    .client-delete-modal.modal .modal-content,
    .add-client-modal.modal .modal-content,
    .client-details-modal.modal .modal-content {
        border-radius: 10px 10px 0 0;
        width: 100%;
    }

    .client-delete-modal .modal-header,
    .add-client-modal .modal-header,
    .client-details-modal .modal-header {
        position: relative;
    }

    .client-delete-modal .modal-header {
        border-bottom: 1px solid #E0E0E0;
        padding: 23px;
    }

    .client-delete-modal .close {
        position: absolute;
        inset-block-start: 50%;
        inset-inline-start: 16px;
        transform: translate(0,-50%);
    }

    .client-delete-modal .modal-body {
        padding: 17px 30px 30px;
    }

    .client-delete-modal .btn-default {
        display: none;
    }

    .client-delete-modal .btn-danger {
        width: 100%;
    }

    .add-client-modal .modal-header {
        border-bottom: 1px solid #E0E0E0;
        background: #FAFAFA;
        padding: 23px;
    }

    .add-client-modal .close {
        inset: 50% 29px auto auto;
        transform: translateY(-50%);
    }

    .add-client-modal .modal-body {
        background: #FAFAFA;
    }

    .client-details-modal .modal-header {
        background: #FAFAFA;
        padding: 22px 30px;
        border-bottom: 1px solid #E0E0E0;
    }

    .client-details-modal .modal-heading {
        text-align: center;
    }

    .client-details-modal .close {
        inset: 28px 30px auto auto;
    }

    .client-details-modal .modal-body {
        min-height: calc(100dvh - 160px);
        background: #FAFAFA;
    }

    .client-delete-modal.modal:not(.in) .modal-dialog {
        transform: translate(0, 25%);
    }
}

.popup-tabs {
    list-style: none;
    padding: 0;
    margin: 0;
    border-bottom: 2px solid #E2E2E2;
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    line-height: 1.5;
}

.popup-tabs a {
    color: rgba(0,0,0,0.5);
    display: block;
    font-weight: 500;
    position: relative;
    padding-block: 15px;
}

.popup-tabs a:after {
    content: '';
    position: absolute;
    bottom: -2px;
    height: 2px;
    left: 0;
    right: 0;
    background: #7638FF;
    z-index: 2;
    opacity: 0;
    transition: 0.15s ease opacity;
}

.popup-tabs a:hover,
.popup-tabs .active > a {
    color: #000;
}

.popup-tabs a:hover:after,
.popup-tabs .active > a:after {
    opacity: 1;
}

.client-contacts-content {
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: auto;
    scrollbar-color: auto;
    max-height: calc(100dvh - 222px);
    padding-block-start: 10px;
}

.client-details-modal ::-webkit-scrollbar {
    width: 5px;
    border-radius: 0;
}

.client-details-modal ::-webkit-scrollbar-track {
    background: #E2E2E2;
    border-radius: 0;
}

.client-details-modal ::-webkit-scrollbar-thumb {
    background: #7638FF;
    border-radius: 0;
}

.client-contacts-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
}

.client-contacts-content ul li {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-block: 10px;
}

.client-contacts-content ul li:not(:last-child) {
    border-bottom: 1px solid #E2E2E2;
}

.contact-list .contact-info-row {
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.contact-list .contact-icon-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.contact-list .contact-icon-row a {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    width: 30px;
    height: 30px;
    background: #EBE2FF;
}

.contact-list .contact-icon-row a svg {
    overflow: visible;
}

.client-address-modal {
    padding-top: 20px;
}

.client-address-modal dl {
    font-size: 14px;
    line-height: 1.5;
    margin-block: 0;
}

.client-address-modal dl + dl {
    border-top: 1px solid #E2E2E2;
    padding-top: 10px;
}

.client-address-modal dt {
    font-weight: 500;
    color: rgba(0,0,0,0.5);
    float: left;
    clear: left;
}

.client-address-modal dt,
.client-address-modal dd {
    padding-bottom: 10px;
    line-height: 1.5;
}

.rtl .client-address-modal dt {
    float: right;
    clear: right;
}

.client-address-modal dd {
    overflow: hidden;
    text-align: end;
}

.client-details-modal .modal-body {
    padding: 6px 0 0;
}

.client-contacts-content ul,
.client-address-modal dl {
    margin-inline: 30px;
}

@media screen and (min-width: 768px) {
    .client-details-modal .modal-body {
        padding-top: 0;
    }

    .popup-tabs {
        padding-inline: 29px;
    }

    .client-contacts-content {
        max-height: calc(100dvh - 156px);
    }
}

@media screen and (max-width: 767px) {
    .popup-tabs {
        margin-inline: 30px;
    }
}

.add-client-modal label {
    font-weight: 400;
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 4px;
}

.form-control.new_style_45 {
    height: 45px;
    border-color: #E0E0E0;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.5;
    padding: 11px 14px;
    color: #000;
}

.form-control.new_style_45.club_points {
    max-width: 110px;
}

textarea.form-control.new_style_45 {
    min-height: 80px;
}

.radios_wrap {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.radios_wrap label {
    font-size: 14px;
    line-height: 1.5;
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

input[type="radio"].new_custom_radio {
    appearance: none;
    padding: 0;
    margin: 0;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    border: 1px solid #7638FF;
    background: #fff;
    outline: none;
}

input[type="radio"].new_custom_radio:checked {
    background: #fff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><g transform="translate(-202)"><rect width="24" height="24" fill="%23fff" data-name="Rectangle 3113" rx="12" transform="translate(202)"/><rect width="16" height="16" fill="%237638ff" data-name="Rectangle 3115" rx="8" transform="translate(206 4)"/></g></svg>') 50% 50%/100% auto no-repeat;
}

.radios_wrap label .label_text {
    padding-block-start: 3px;
}

.new_style_45 + .select2-container--default .select2-selection--single {
    border-color: #E0E0E0;
    border-radius: 4px;
    height: 45px;
    padding-inline: 8px;
}

.new_style_45 + .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-size: 14px;
    line-height: 43px;
}

.new_style_45 + .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 43px;
    width: 36px;
}

.new_style_45 + .select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-width: 7.5px 7.5px 0;
    border-top-color: rgba(0,0,0,0.5);
    transform: translateY(-50%);
}

.add-client-modal .btn-primary {
    height: 45px;
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
    border-radius: 4px;
    font-weight: 500;
    box-shadow: none;
    width: 100%;
    margin: 0;
}

.add-client-modal .btn-primary:not(:disabled):not(.disabled) {
    background: #7638FF;
    border-color: #7638FF;
    color: #fff;
}

.rtl input[type="tel"],
[dir="rtl"] input[type="tel"] {
    text-align: start;
    direction: rtl;
}

.add-client-modal .inputs-row {
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.add-client-modal .new_street {
    flex: 1 1 0;
}

.add-client-modal .modal-body {
    padding: 20px 30px 30px;
}

.add-client-modal .new_house {
    flex-basis: 95px;
}

.add-client-modal .form-group {
    margin-bottom: 15px;
}
.add-client-modal .btns-wrap {
    padding-top: 15px;
}

@media screen and (min-width: 768px) {
    .add-client-modal .modal-dialog {
        width: 450px;
    }
.add-client-modal.add_contact .modal-dialog {
        width: 370px;
    }

    .add-client-modal .modal-body {
        padding: 20px 35px 30px;
    }

    .add-client-modal.add_contact .modal-body {
        padding-block-end: 40px;
    }

    .add-client-modal fieldset {
        min-height: 425px;
    }
    .step_address,
    .add-client-modal form:not(.address_step_active) .btn.btn_final_submit {
        display: none;
    }
    .add-client-modal .btn-primary {
        max-width: 220px;
        margin-inline: auto;
    }

    .address_step_active .step_personal_info {
        display: none;
    }

    .address_step_active .step_address {
        display: block;
    }

    .address_step_active #step_next_address {
        display: none;
    }

    .address_step_active .btn_final_submit {
        display: block;
    }

    .radios_wrap label .label_text {
        padding-block: 2px;
    }
}

@media screen and (max-width: 767px) {
    .add-client-modal #step_next_address {
        display: none;
    }

    .add-client-modal.modal:not(.in) .modal-dialog {
        transform: translate(0, 25%);
    }
}

.client-details-container {
    padding-inline: 16px;
    padding-block: 25px 40px;
    position: relative;
}

.client-details-container h1 {
    margin-block: 0 23px;
    font-weight: 500;
    font-size: 24px;
}

.client-details-container h1 span {
    color: #7638FF;
}

.mobile-details-menu {
    margin-bottom: 21px;
    position: relative;
}

.mobile-details-menu.drop_active {
    filter: drop-shadow(0 3px 6px rgba(0, 0, 0, 0.16));
    z-index: 99;
}

.mobile-details-menu .select2-container--default .select2-selection--single {
    display: flex;
    align-items: center;
    justify-content: center;
}

.mobile-details-menu .select2-container--default .select2-selection--single .select2-selection__rendered {
    font-size: 16px;
    font-weight: 700;
    color: #7638FF;
}

.mobile-details-menu .select2-container--default .select2-selection--single .select2-selection__arrow {
    position: relative;
    width: auto;
}

.mobile-details-menu .select2-dropdown {
    max-width: 100%;
    box-shadow: none;
    padding: 0;
    border: 1px solid #E0E0E0;
    border-width: 0 1px 1px;
    margin-top: -1px;
}

.mobile-details-menu .select2-container--default .select2-results__option {
    border: none;
    border-radius: 0;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.5;
    text-align: center;
    margin: 0;
    padding-block: 19px;
    position: relative;
}

.mobile-details-menu .select2-container--default .select2-results__option:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 15px;
    right: 15px;
    border-bottom: 1px solid #E0E0E0;
}

.mobile-details-menu .select2-container--default .select2-results__option:last-child:after {
    display: none;
}

.mobile-details-menu .select2-container--default .select2-results__option--highlighted[aria-selected] {
    font-weight: 700;
    background: #EBE2FF;
}

@media screen and (min-width: 768px) {
    .mobile-details-menu {
        display: none;
    }
}

.client-contact-details-box {
    border-radius: 4px;
    border: 1px solid #E0E0E0;
    background: #fff;
    font-size: 14px;
    line-height: 1.5;
    display: flex;
    flex-wrap: wrap;
    padding: 19px;
    margin-bottom: 20px;
    column-gap: 30px;
}

.client-contact-info-box,
.client-personal-info-box,
.client-subscription-info-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.client-contact-info-box a {
    display: flex;
    align-items: center;
    color: #000;
    gap: 10px;
}

.client-subscription-info-box a {
    color: #7638FF;
    text-decoration: underline;
}

.client-subscription-info-box a:hover {
    text-decoration: none;
}

.client-contact-info-box .ico-wrap {
    width: 30px;
    height: 30px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #EBE2FF;
}

.inputs-group-wrap {
    display: flex;
}

.inputs-group-wrap .form-control.new_style_45 {
    border-start-end-radius: 0;
    border-end-end-radius: 0;
    border-inline-end: 0;
}

.inputs-group-wrap .select2-container {
    width: 110px;
    min-width: 110px;
}

.inputs-group-wrap .select2-container--default .select2-selection--single {
    border-start-start-radius: 0;
    border-end-start-radius: 0;
}

.client-details-wrapper .client-details-tabs {
    display: none;
    list-style: none;
    padding: 21px 0;
    margin: 0;
    border-inline-end: 1px solid #E2E2E2;
}

.client-details-wrapper .btn-add-foreign-account {
    padding: 0;
    background: none;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
    color: #7638FF;
    border: none;
}

.client-details-tabs li {
    margin-bottom: 11.7px;
}

.client-details-tabs a {
    display: block;
    font-size: 18px;
    line-height: 1.5;
    padding: 9px 19px;
    font-weight: 500;
    color: #000;
    position: relative;
}

.client-details-tabs a:before {
    content: '';
    position: absolute;
    inset: 0 0 0 auto;
    width: 3px;
    background: #7638FF;
    opacity: 0;
}

.client-details-tabs .active a {
    background: #EBE2FF;
}

.client-details-tabs .active a:before {
    opacity: 1;
}

.client-details-wrapper label {
    font-size: 14px;
    font-weight: 400;
    color: #000;
    line-height: 1.5;
    margin-bottom: 4px;
}

.details-checkbox-wrap label {
    display: flex;
    align-items: center;
    gap: 10px;
}

.details-checkbox-wrap input[type=checkbox] {
    width: 24px;
    height: 24px;
    border: 1px solid #7638FF;
    margin: 0;
    border-radius: 4px;
}

.client-details-wrapper .input-info {
    font-size: 12px;
    padding-top: 4px;
}

.client-details-container .submit-btns-wrap .btn {
    width: 100%;
}

@media screen and (min-width: 768px) {
    .client-details-container {
        padding-inline: 40px;
    }

    .client-details-container h1 {
        margin-block-end: 34px;
    }

    .client-contact-details-box {
        gap: 60px;
        margin-bottom: 30px;
    }
}

@media screen and (min-width: 1024px) {
    .client-details-wrapper {
        border-radius: 4px;
        background: #fff;
        border: 1px solid #E0E0E0;
        display: flex;
    }

    .client-details-wrapper .client-details-tabs {
        flex-basis: 180px;
        max-width: 180px;
        display: block;
    }

    .client-details-wrapper .tab-content {
        padding: 30px;
        flex: 1 1 0;
        max-width: calc(100% - 180px);
        min-height: 558px;
    }

    .client-details-wrapper .details-inputs-wrap {
        max-width: 940px;
        display: grid;
        column-gap: 20px;
        grid-template-columns: repeat(3, 1fr);
    }

    .client-details-wrapper .form-group {
        margin-bottom: 20px;
    }

    .client-details-wrapper .details-checkbox-wrap {
        grid-column: auto / span 3;
        margin-bottom: 0;
    }

    .client-details-wrapper .submit-btns-wrap {
        display: none;
    }
}

@media screen and (max-width: 767px) {
    .details-checkbox-wrap {
        margin-bottom: 15px;
    }
}

.modal-header .close {
    opacity: 1;
    display: flex;
}

.modal-header .close svg {
    overflow: visible;
}