/* @font-face {
    font-family: "SF-Arabic";
    src: url("../admin/fonts/SF-Arabic.ttf");
} */

/* @import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap'); */

@font-face {
    font-family: "Ping AR + LT";
    src: url("../fonts/PingARLT-Regular.woff2") format("woff2"),
        url("../fonts/PingARLT-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Ping AR + LT";
    src: url("../fonts/PingARLT-Medium.woff2") format("woff2"),
        url("../fonts/PingARLT-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Ping AR + LT";
    src: url("../fonts/PingARLT-Bold.woff2") format("woff2"),
        url("../fonts/PingARLT-Bold.woff") format("woff");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Ping AR + LT";
    src: url("../fonts/PingARLT-Light.woff2") format("woff2"),
        url("../fonts/PingARLT-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Ping AR + LT";
    src: url("../fonts/PingARLT-Black.woff2") format("woff2"),
        url("../fonts/PingARLT-Black.woff") format("woff");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "icomoon";
    src: url("../fonts/icomoon.eot?v=2.0");
    src: url("../fonts/icomoon.eot?v=2.0#iefix") format("embedded-opentype"),
        url("../fonts/icomoon.ttf?v=2.0") format("truetype"),
        url("../fonts/icomoon.woff?v=2.0") format("woff"),
        url("../fonts/icomoon.svg?v=2.0#icomoon") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

[class^="icon-currency-"],
[class*=" icon-currency-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: "icomoon" !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;
}

.icon-currency-sar:before {
    content: "\e901";
}

:root {
    --backColor: #000;
    --backColorHover: #142348;
    --backColorTran: rgba(25, 112, 138, 0.4);
    --sideColorHover: #142348;
    --forColor: #fff;
    --globalColor: #000;
    --globalColorHover: #41c7d1;
    --globalColorRGB: rgba(15, 188, 200, 0.09);

    /* Sidebar palette */
    --sidebar-accent: #2fb5ff;
    --side-bg-top: #0d0d10;
    --side-bg-mid: #141419;
    --side-bg-bottom: #0a0a0c;
    --side-background: linear-gradient(
        180deg,
        var(--side-bg-top) 0%,
        var(--side-bg-mid) 45%,
        var(--side-bg-bottom) 100%
    );
    --side-font-color: #f1f1f1;
    --side-icon-color: #f1f1f1;
    --side-active-bg-second: rgba(255, 255, 255, 0.05);
    --side-active-bg-third: #f2f3f4;
    --side-active-bg: rgba(255, 255, 255, 0.05);
    --side-font-color-active: #ffffff;
    --side-icon-color-active: #ffffff;

    --icon-circle-bg: rgba(255, 255, 255, 0.08);
}

/* Page scrollbar hidden (demo request) — page scrolls, no visible black bar. */
body::-webkit-scrollbar,
html::-webkit-scrollbar {
    width: 0 !important;
    height: 0 !important;
    display: none !important;
}
body,
html {
    scrollbar-width: none !important;      /* Firefox */
    -ms-overflow-style: none !important;   /* IE/old Edge */
}

.logo-dark {
    display: none;
}

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

.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12,
.col,
.col-auto,
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12,
.col-sm,
.col-sm-auto,
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12,
.col-md,
.col-md-auto,
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12,
.col-lg,
.col-lg-auto,
.col-xl-1,
.col-xl-2,
.col-xl-3,
.col-xl-4,
.col-xl-5,
.col-xl-6,
.col-xl-7,
.col-xl-8,
.col-xl-9,
.col-xl-10,
.col-xl-11,
.col-xl-12,
.col-xl,
.col-xl-auto {
    padding-left: 7px;
    padding-right: 7px;
}

.visibility-hidden {
    visibility: hidden;
    pointer-events: none;
}

.form-group {
    margin-bottom: 1.5rem;
}

.form-group label {
    font-weight: 500;
}

label {
    font-weight: 500;
}

.modal .modal-content .modal-header .close {
    font-family: uicons-regular-rounded !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    vertical-align: bottom;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.modal .modal-content .modal-header .close:before {
    content: "\f186";
}

@media (max-width: 576px) {
    .flex-wrap-mb {
        flex-wrap: wrap;
        justify-content: flex-start !important;
    }

    .flex-wrap-mb > * {
        flex: 40%;
        max-width: 50%;
    }

    .flex-wrap-mb > button {
        margin-right: 0 !important;
        max-width: 48%;
    }
}

.kt-content {
    padding: 14px;
}

/* .kt-content > .kt-portlet  {
    margin-top: 14px;
} */
.table-responsive {
    position: relative;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    /* Smooth scrolling on iOS */
}

/* Hide scrollbar in WebKit browsers like Safari & Chrome */
.table-responsive::-webkit-scrollbar {
    width: 0px;
    height: 0px;
    display: none;
}

/* Ensure the track is also hidden */
.table-responsive::-webkit-scrollbar-track {
    background: transparent;
    display: none;
}

/* Hide the scrollbar thumb */
.table-responsive::-webkit-scrollbar-thumb {
    background: transparent;
    display: none;
}

.table tbody .kt-checkbox {
    position: relative;
    top: 7px;
}

.tables_loading {
    position: absolute;
    top: 25%;
    left: 50%;
    transform: translateX(-50%);
}

@media (max-width: 576px) {
    .table .hide {
        display: none;
    }
}

@media (max-width: 768px) {
    .table th:not(:nth-child(-n + 3)):not(:last-child),
    .table td:not(:nth-child(-n + 3)):not(:last-child) {
        display: none;
    }

    .table tbody td:not(:nth-child(-n + 3)):not(:last-child),
    .table tbody td:not(:nth-child(-n + 3)):not(:last-child) {
        display: none;
    }
}

body {
    font-family: "Ping AR + LT", sans-serif;
    background: #f9f9f9;
    color: #000;
}

a {
    color: #0d6efd;
}

html,
body {
    font-weight: 500;
    font-size: 14px;
}

[class^="fe-"] {
    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;
}

.card,
.card-box {
    background-color: #fff;
    border: 1px solid #f0f2f5;
    border-radius: 18px;
    box-shadow: none;
}

.kt-header.kt-header--fixed {
    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
}

.form-control {
    height: calc(2.1em + 1.3rem + 2px);
    border-radius: 10px;
    -webkit-appearance: none;
}

input[type="tel"] {
    direction: rtl;
}

.form-control.focus,
.form-control:focus {
    border-color: #ebedf3;
}

.btn-change-password {
    display: flex;
    align-items: center;
    justify-content: center;
    height: calc(2.1em + 1.3rem + 2px);
    border: 1px solid var(--globalColor);
    background-color: #fff;
    border-radius: 10px;
}

.btn-change-password:hover {
    background-color: var(--globalColor);
    color: #fff;
}

.btn-change-password i {
    line-height: 0;
}

.opacity-5 {
    opacity: 0.5;
}

.not-allowed-cursor {
    cursor: not-allowed;
}

i[class^="fi-rr-"]:before,
i[class*=" fi-rr-"]:before,
span[class^="fi-rr-"]:before,
span[class*="fi-rr-"]:before {
    vertical-align: top;
}

table td a {
    color: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-weight: 500;
    font-size: 1.5em;
}

.img-radius {
    border-radius: 10px;
    -moz-box-shadow: 10px 10px 50px #fcfcfc;
    -webkit-box-shadow: 10px 10px 50px #fcfcfc;
    box-shadow: 10px 10px 50px #fcfcfc;
}

.border-15 {
    border-radius: 15px;
}

.datepicker {
    text-align: right;
}

.gap-05 {
    gap: 0.5rem;
}

.gap-01 {
    gap: 1rem;
}

.gap-105 {
    gap: 1.5rem;
}

.flag-image {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    justify-content: center;
}

.flag-image.start {
    justify-content: flex-start;
}

.kt-footer .kt-footer__copyright {
    color: #000;
}

.kt-portlet.transparent {
    background: transparent;
    border: 0;
    box-shadow: none;
}

.kt-portlet.transparent .kt-portlet__head {
    background: #fff;
    border-radius: 17px;
}

.kt-portlet.transparent .kt-portlet__body {
    padding: 17px 0;
}

.kt-portlet .kt-portlet__head {
    min-height: 75px;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}

.kt-portlet .kt-portlet__body {
    padding: 17px 15px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.kt-portlet .kt-portlet__head {
    padding: 0 15px;
}

/* .kt-portlet__head-actions {
    overflow: hidden;
} */

.kt-checkbox.kt-checkbox--success > input:disabled ~ span:after {
    border-color: #fff;
}

.kt-checkbox.kt-checkbox--success > input:disabled ~ span {
    opacity: 1;
}

@media (max-width: 576px) {
    .no-gutters.gap-05 {
        gap: unset;
    }

    .no-gutters.gap-05 {
        margin-left: 10px;
        margin-right: 10px;
    }

    .no-gutters.gap-05 > .col,
    .no-gutters.gap-05 > [class*="col-"] {
        padding-left: 10px;
        padding-right: 10px;
    }

    .kt-portlet .kt-portlet__head {
        /* flex-flow: column; */
        /* flex-wrap: wrap; */
        gap: 0.5rem;
        padding: 17px 15px;
    }

    .kt-portlet .kt-portlet__head .kt-portlet__head-toolbar > div {
        flex: 1;
        max-width: 50%;
    }

    .kt-portlet .kt-portlet__head .kt-portlet__head-toolbar > div:only-child {
        max-width: 100%;
    }

    .kt-portlet .kt-portlet__head .kt-portlet__head-toolbar > div .btn-group {
        flex: 1;
    }
}

.user-image-circle {
    width: 100px;
    height: 100px;
    border-radius: 50px;
    object-fit: cover;
}

.user-image-circle.mini {
    width: 65px;
    height: 65px;
    border-radius: 50px;
    object-fit: cover;
}

.user-image-circle.mini-40 {
    width: 40px;
    height: 40px;
    border-radius: 50px;
    object-fit: cover;
}

.user-image-circle.mini-30 {
    min-width: 30px;
    width: 30px;
    height: 30px;
    border-radius: 50px;
    object-fit: cover;
}

.user-image-circle.mini-20 {
    min-width: 20px;
    width: 20px;
    height: 20px;
    border-radius: 50px;
    object-fit: cover;
}

.item-round {
    width: 100px;
    height: 100px;
    border-radius: 50px;
    object-fit: cover;
}

.item-round.mini {
    width: 65px;
    height: 65px;
    border-radius: 50px;
    object-fit: cover;
}

.item-round.mini-40 {
    width: 40px;
    height: 40px;
    border-radius: 50px;
    object-fit: cover;
}

.item-round.mini-30 {
    width: 30px;
    height: 30px;
    border-radius: 50px;
    object-fit: cover;
}

.user-image-circle.with-shadow {
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.07);
}

.user-wrapper {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0.8rem;
    color: #000;
}

.user-wrapper.place a {
    color: #0d6efd;
}

.user-wrapper .user-image-circle {
    border-radius: 50px;
}

.user-wrapper.place .user-image-circle {
    border-radius: 11px;
}

.user-wrapper.place .item-round.mini-30,
.user-wrapper.place .item-round.mini-40,
.custom-user-select.place .user-image-circle.mini-30 {
    border-radius: 8px;
}

.text-link,
.text-link:hover,
.text-link:focus {
    color: #0d6efd;
    text-decoration: none;
    cursor: pointer;
}

.radius-10 {
    border-radius: 10px !important;
}

.dropdown-menu-notification {
    transform: translate3d(-0, 64px, 0px) !important;
}

.kt-aside-menu .kt-menu__nav {
    padding: 25px 10px 15px;
}

.kt-custom-notification {
    position: relative;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    padding-bottom: 0 !important;
}

.dropdown-notification-wrapper {
    border: 1px solid #eaebf2;
    border-radius: 15px;
    -webkit-box-shadow: 0 10px 30px rgba(134, 134, 134, 0.16);
    box-shadow: 0 10px 30px rgba(134, 134, 134, 0.16);
}

.dropdown-menu-notification {
    border-radius: 15px !important;
}

.more-notificatons {
    display: block;
    background-color: #fff;
    padding: 1rem;
    text-align: center;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    color: var(--globalColor);
    border-top: 1px solid #e9e9e9;
}

.more-notificatons:hover {
    color: var(--globalColor);
}

.kt-custom-notification .spinner-border {
    position: absolute;
    bottom: 10px;
    left: 46%;
    width: 1.3rem;
    height: 1.3rem;
    border: 0.15em solid currentColor;
    border-left-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border 0.75s linear infinite;
    animation: spinner-border 0.75s linear infinite;
}

.kt-custom-notification::after {
    position: absolute;
    top: -12px;
    left: 10px;
    display: inline-block;
    border-right: 15px solid transparent;
    border-bottom: 15px solid #ffffff;
    border-left: 15px solid transparent;
    content: "";
}

.kt-aside--minimize .kt-aside__brand-logo a > span {
    display: none;
}

.kt-aside--minimize .kt-aside__brand .kt-aside__brand-logo img {
    display: block;
}

.kt-aside--minimize .kt-aside__brand .place-side-icon .place-info {
    display: none;
}

.kt-aside--minimize .kt-aside__brand.user {
    height: auto !important;
}

.kt-aside--minimize .kt-aside__brand .main-points-logo {
    display: none;
}

.kt-notification .kt-notification__item:after {
    transform: rotate(180deg);
}

@media (min-width: 1025px) {
    .kt-aside--minimize .kt-aside-menu .kt-menu__nav {
        padding: 15px 8px;
    }
}

.kt-portlet {
    /* border: 1px solid #F0F2F5;
    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
    border-radius: 15px; */
    border-radius: 15px;
    background-color: #fff;
    border: 1px solid #f0f2f5;
    box-shadow: none;
}

.place-side-icon {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.place-side-icon .icon {
    position: relative;
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: #fff;
    box-shadow: rgba(67, 71, 85, 0.2) 0px 0px 0.25em,
        rgba(90, 125, 188, 0.02) 0px 0.25em 1em;
}

.place-side-icon .icon img {
    left: 0;
    object-fit: cover;
    width: 58px;
    height: 58px;
    border-radius: 14px;
}

.place-side-icon .package-crown {
    width: 20px;
    height: 20px;
    color: #000;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: -7px;
    font-size: 12px;
    left: 50%;
    transform: translateX(-50%);
}

.place-side-icon .package-crown.free {
    background-color: #eeeef2;
}

.place-side-icon .package-crown.gold {
    background-color: #f5c244;
}

.place-side-icon .place-info {
    font-weight: 500;
    font-size: 14px;
}

.place-side-icon .place-info .points-display {
    font-size: 12px;
    max-width: max-content;
    text-align: center;
}

.place-side-icon .place-info p {
    margin-bottom: 2px;
    font-weight: 800;
    color: #fff;
}

@media (max-width: 576px) {
    .place-side-icon .place-info p {
        font-size: 12px;
    }
}

.place-side-icon .place-info i {
    vertical-align: middle;
    margin: 0 5px;
}

.place-side-icon .place-info a,
.place-side-icon .place-info a:hover,
.place-side-icon .place-info a:focus {
    color: #656567;
    font-size: 12px;
    white-space: nowrap;
}

/* kt-portlet-custom */

.kt-portlet-custom {
    border: 0;
    box-shadow: none;
    background-color: transparent;
}

.kt-portlet-custom .kt-portlet__head {
    background-color: #fff;
    border-radius: 17px;
}

.kt-menu__nav > .kt-menu__item > .kt-menu__link .kt-menu__link-text {
    font-weight: 600 !important;
}

.kt-menu__nav .kt-menu__item .kt-menu__link-text.custom {
    display: flex;
    flex-direction: column;
    align-items: flex-start !important;
    gap: 5px;
}

.kt-menu__nav .kt-menu__item .kt-menu__link-text.custom .badge {
    font-size: 10px;
}

.kt-subheader .kt-subheader__main .kt-subheader__title {
    display: none;
}

.kt-subheader
    .kt-subheader__main
    .kt-subheader__breadcrumbs
    .kt-subheader__breadcrumbs-separator {
    padding: 0 0 2px 0.5rem;
}

.kt-subheader
    .kt-subheader__main
    .kt-subheader__breadcrumbs
    .kt-subheader__breadcrumbs-separator:after {
    color: #000;
    width: auto;
    height: auto;
    border-radius: 0;
    content: "\f10e";
    font-family: uicons-regular-rounded !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    /* line-height: 1; */
    vertical-align: bottom;
    font-size: 8px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: transparent;
}

.kt-bg-primary-custom {
    background-color: var(--globalColor);
    border-radius: 15px;
}

.card-box .inner {
    padding: 1rem;
}

.kt-bg-warning-custom,
.kt-bg-primary-custom {
    height: calc(100% - 15px);
}

@media (max-width: 767px) {
    .kt-bg-primary-custom {
        margin-bottom: 25px;
        height: calc(100% - 25px);
    }
}

.kt-bg-custom-1 {
    background-color: #000;
    border-radius: 15px;
}

.kt-bg-custom-2 {
    background-color: #000;
    border-radius: 15px;
}

.kt-bg-custom-3 {
    background-color: #fef201;
    border-radius: 15px;
}

.kt-bg-warning-custom {
    background-color: #000;
    border-radius: 15px;
}

.card-box .icon {
    top: 50%;
    transform: translateY(-60%);
    bottom: auto;
    font-size: 33px;
    left: 12px;
}

.card-box .icon img {
    filter: invert(1);
    width: 36px;
}

.card-box .card-box-footer {
    padding: 5px 0;
}

.card-box h3 {
    font-size: 1.5rem;
}

.kt-aside {
    background-color: #000;
}

.kt-aside .kt-aside-menu {
    margin-top: 0;
}

.kt-aside-menu {
    background-color: #000;
}

.kt-aside__brand {
    position: relative;
    background-color: #000;
    justify-content: center;
    height: auto;
}

.kt-aside__brand.user {
    justify-content: flex-start;
    align-items: center;
    padding: 0 0;
}

.kt-aside__brand img {
    position: relative;
    left: 10px;
}

.kt-aside__brand .kt-aside__brand-tools {
    position: absolute;
    left: 20px;
}

.kt-aside__brand .kt-aside__brand-tools .kt-aside__brand-aside-toggler {
    font-size: 1.6rem;
    position: relative;
    top: 7px;
    background: transparent;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
}

.kt-aside__brand-aside-toggler {
    font-size: 1.6rem;
    position: relative;
    top: 16px;
    right: 20px;
    background: transparent;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: center;
    border: 0;
}

.kt-aside__brand-logo a > span {
    height: 55px;
    vertical-align: middle;
    font-size: 14px;
    color: #fff;
    margin-right: 10px;
    display: flex;
    align-items: center;
    white-space: pre-line;
    margin-bottom: 15px;
    font-weight: 400;
}

.kt-aside-menu::-webkit-scrollbar-thumb {
    background: transparent;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__section .kt-menu__section-text {
    color: #aeaeae;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__section .kt-menu__section-icon {
    color: #fff;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__link {
    background-color: #282822;
    border-radius: 20px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-text,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-text {
    color: #fff !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link {
    background-color: #282822;
    border-radius: 20px;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item .kt-menu__link-icon img {
    filter: invert(1) brightness(100);
    max-width: 20px;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item > .kt-menu__link {
    margin-bottom: 5px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__link {
    margin-bottom: 0;
}

.kt-user-card__badge .btn-success {
    background-color: var(--globalColor);
    border-color: var(--globalColor);
}

.kt-user-card {
    background-image: none !important;
    background-color: var(--globalColor);
}

.kt-user-card__avatar .kt-badge {
    color: #fff !important;
}

.btn-outline-primary {
    color: #fff;
    border-color: var(--globalColor);
    background-color: var(--globalColor) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus {
    background-color: var(--globalColor) !important;
    border-color: var(--globalColor) !important;
    color: #fff;
}

.btn-outline-info:hover {
    background-color: var(--globalColor) !important;
    color: #fff;
}

.btn-outline-info:not(:disabled):not(.disabled):active {
    background-color: var(--globalColor);
    border-color: var(--globalColor);
}

a.disabled-btn {
    cursor: not-allowed;
}

.times-items-wrapper {
    padding: 10px 0;
}

.time-body {
    background-color: #fff;
    padding: 15px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.time-body .selected-time {
    background-color: #f5f7f9;
    border: 1px solid #ebedf2;
    padding: 10px;
    border-radius: 8px;
    height: 44px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.time-body .selected-time .clear {
    margin-left: 10px;
}

.time-body .selected-time .clear button {
    background: rgba(253, 100, 96, 0.1);
    color: #eb6460;
    border: 0;
    border-radius: 50px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

.time-body .selected-time .clear button i {
    position: relative;
    top: 1px;
    line-height: 1.6;
}

.time-body .selected-time .clear a {
    background: rgba(253, 100, 96, 0.1);
    color: #eb6460;
    border: 0;
    border-radius: 50px;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

.time-body .moreTimesBtn {
    margin: 0 0 10px 10px;
    display: flex;
}

.time-body .moreTimesBtn button {
    font-size: 16px;
    color: #fff;
    display: inline-block;
    padding: 7px 10px;
    min-width: 100px;
    text-align: center;
    border-radius: 50px;
    background-color: #4c5d4a;
    border-color: #4c5d4a;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}

.modal_time {
    padding-right: 1rem;
}

.modal_time .selected-time {
    flex: auto;
    max-width: calc(20% - 1rem);
    height: auto;
}

.modal_time .selected-time.hour {
    max-width: calc(33.33% - 1rem);
}

@media (max-width: 576px) {
    .modal_time .selected-time {
        max-width: calc(100% - 1rem);
        flex: unset;
    }
}

.nav-tabs.nav-tabs-line.nav-tabs-line-danger.nav.nav-tabs .nav-link:hover,
.nav-tabs.nav-tabs-line.nav-tabs-line-danger.nav.nav-tabs .nav-link.active,
.nav-tabs.nav-tabs-line.nav-tabs-line-danger a.nav-link:hover,
.nav-tabs.nav-tabs-line.nav-tabs-line-danger a.nav-link.active {
    color: var(--globalColor);
    border-bottom: 1px solid var(--globalColor);
}

.btn-success,
.btn-success:hover {
    background-color: var(--globalColor);
    border-color: var(--globalColor);
}

.btn-outline-info {
    color: #000;
    border-color: #ebedf2;
}

.btn-outline-info:hover {
    color: #fff;
    background-color: #fff;
    border-color: #ebedf2;
}

.btn-outline-danger {
    background: rgba(253, 100, 96, 0.1);
    color: #eb6460;
    border-color: transparent;
}

.btn-outline-danger:hover {
    color: #ff0038 !important;
    border-color: transparent;
    background: rgba(253, 100, 96, 0.1) !important;
}

.btn-outline-danger:not(:disabled):not(.disabled):active,
.btn-outline-danger:not(:disabled):not(.disabled).active,
.show > .btn-outline-danger.dropdown-toggle {
    background-color: rgba(253, 100, 96, 0.1);
    border-color: transparent;
    color: #ff0038 !important;
}

.kt-checkbox.kt-checkbox--success > span {
    border: 1px solid #000;
}

.kt-checkbox {
    padding-right: 18px;
    margin-bottom: 15px;
}

.kt-checkbox > span {
    top: -4px;
}

.kt-radio > span {
    top: -5px;
}

.kt-radio.kt-radio--success > input:checked ~ span {
    background-color: #000;
}

.kt-radio.kt-radio--success > span:after {
    border: solid #fff;
    background: #fff;
}

.page-item.active .page-link {
    background-color: var(--globalColor) !important;
    border-color: var(--globalColor) !important;
}

@media only screen and (max-width: 600px) {
    .kt-header-mobile__logo_img {
        height: auto !important;
        margin-top: 0;
    }
}

.kt-header__topbar .kt-header__topbar-item {
    align-items: center;
}

.kt-header__topbar .kt-header__topbar-item .kt-header__topbar-icon {
    background: #fff;
    border-radius: 50px;
    border: 1px solid #ebedf2;
    width: 44px;
    height: 44px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__heading
    .kt-menu__link-icon
    svg
    g
    [fill],
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__link
    .kt-menu__link-icon
    svg
    g
    [fill] {
    fill: var(--side-font-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-icon
    svg
    g
    [fill],
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-icon
    svg
    g
    [fill] {
    fill: none !important;
}

.kt-header__topbar .kt-header__topbar-item .dropdown-toggle::after {
    display: none;
}

.list-mb-custom li {
    margin-bottom: 10px;
}

.nav-tabs .nav-item .nav-link {
    font-weight: 500;
}

.setup-content .nextBtn {
    float: left;
    padding: 12px 35px;
}

.setup-content .preBtn {
    float: right;
    padding: 12px 35px;
}

.ServiceProviderProfile .kt-card-profile__details {
    padding: 10px 30px;
    display: inline-block;
    width: 32.33%;
}

@media (max-width: 767px) {
    .ServiceProviderProfile .kt-card-profile__details {
        width: 100%;
    }
}

#show .modal-content {
    border: 0;
}

#show .modal-header {
    background-color: var(--globalColor);
    color: #fff;
}

#show .modal-header h4 {
    color: #fff;
}

#show .modal-header .close {
    color: #fff;
}

#show .modal-body h4 {
    font-size: 14px;
    white-space: nowrap;
    color: #333;
}

#show .modal-footer button {
    background-color: var(--globalColor);
    color: #fff;
}

@media (max-width: 767px) {
    #show .modal-body #store_image {
        display: block;
        margin: 0 auto;
    }
}

.kt-aside-menu .kt-menu__nav > .kt-menu__section {
        margin-top: 0;
    height: auto;
    margin-bottom: 10px;
}

@media only screen and (min-width: 1200px) {
    .kt-aside-menu {
        overflow-y: auto !important;
        height: 95vh !important;
    }
}

.kt-badge.kt-badge--unified-success {
    background: #efefef;
}

.kt-header__topbar
    .kt-header__topbar-item.kt-header__topbar-item--user
    .kt-header__topbar-user
    .kt-header__topbar-username {
    font-size: 14px;
}

.kt-header
    .kt-header__topbar
    .kt-header__topbar-item:hover.kt-header__topbar-item--user
    .kt-header__topbar-user,
.kt-header
    .kt-header__topbar
    .kt-header__topbar-item.show.kt-header__topbar-item--user
    .kt-header__topbar-user {
    background-color: transparent;
}

.kt-header
    .kt-header__topbar
    .kt-header__topbar-item.kt-header__topbar-item--user
    .kt-header__topbar-user
    .kt-badge.kt-badge--username {
    width: 40px;
    height: 40px;
}

.kt-user-card.kt-user-card--skin-dark .kt-user-card__avatar .kt-badge {
    background: #f5f7f9;
    color: #111 !important;
}

.notificationCountNumbers {
    border-radius: 50%;
    width: 23px;
    height: 23px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 1px;
    right: -3px;
}

.NotificationCount {
    background: #f60000;
    margin: 0;
    position: absolute;
    top: -4px;
    right: -1px;
    z-index: 2;
    font-weight: 400;
    font-size: 11px;
    max-width: max-content;
    padding: 8px 5px 5px 5px;
    border-radius: 50px;
    height: 20px;
}

.NotificationCount:hover,
.NotificationCount:active {
    background-color: #f60000;
    border-color: #f60000;
    color: #fff;
}

.kt-portlet.kt-portlet--head-overlay.kt-portlet--head-lg .kt-portlet__body {
    margin-top: 0;
}

.kt-portlet.kt-portlet--head-overlay .kt-portlet__body {
    margin-top: 0;
}

.kt-widget17 .kt-widget17__stats {
    width: 100%;
}

.kt-widget17 .kt-widget17__stats {
    margin: 1rem auto 1rem;
}

.kt-widget17
    .kt-widget17__stats
    .kt-widget17__items
    .kt-widget17__item
    .kt-widget17__icon
    > i {
    color: #111;
}

.kt-widget17
    .kt-widget17__stats
    .kt-widget17__items
    .kt-widget17__item
    .kt-widget17__subtitle {
    color: #111;
}

.kt-widget17
    .kt-widget17__stats
    .kt-widget17__items
    .kt-widget17__item
    .kt-widget17__desc {
    color: #111;
    font-size: 14px;
}

.kt-widget17 .kt-widget17__stats .kt-widget17__items .kt-widget17__item {
    margin: 0 1rem;
    pointer-events: none;
}

@media (max-width: 576px) {
    .kt-widget17 .kt-widget17__stats .kt-widget17__items {
        flex-flow: column;
    }

    .kt-widget17 .kt-widget17__stats .kt-widget17__items .kt-widget17__item {
        margin: 1rem auto;
        width: 100%;
        padding: 20px;
    }
}

.kt-footer .kt-footer__copyright .kt-link {
    color: var(--globalColor);
}

.kt-checkbox.kt-checkbox--success > span:after {
    border: solid #ffffff;
}

.kt-checkbox.kt-checkbox--success > input:checked ~ span {
    border: 1px solid var(--globalColor);
    background: var(--globalColor);
}

.custom-time-item .kt-checkbox.kt-checkbox--success > span:after {
    border: 0;
    width: 10px;
    height: 10px;
    background: var(--globalColor);
    border: 0;
    border-radius: 50px;
    margin-right: -5px;
    margin-top: -5px;
}

.custom-time-item .kt-checkbox.kt-checkbox--success > input:checked ~ span {
    background: #fff;
}

.btn-outline-info .badge {
    padding: 0.2em 0.45em;
}

.btn-outline-info:hover .badge {
    color: #000;
}

/* Quick Store Customize */

.userImage {
    position: relative;
    min-width: 130px;
    /* max-width: max-content; */
    height: 130px;
    border-radius: 50%;
    margin: 0 0 20px auto;
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='20' ry='20' stroke='%238D8F9CFF' stroke-width='1' stroke-dasharray='6%2c 14' stroke-dashoffset='40' stroke-linecap='round'/%3e%3c/svg%3e");
    border: 0;
    padding: 10px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.userImage .text {
    position: relative;
}

.userImage.shipping_item {
    min-width: 80px;
    width: 80px;
    height: 80px;
}

.userImage .has-spinner-link {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='20' ry='20' stroke='%238D8F9CFF' stroke-width='1' stroke-dasharray='6%2c 14' stroke-dashoffset='40' stroke-linecap='round'/%3e%3c/svg%3e");
    width: 100%;
    height: 100%;
    border-radius: 20px;
}

.userImage .has-spinner-link.loading::before {
    filter: invert(1);
}

.userImage .loader-dots-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    width: 100%;
    height: 100%;
    border-radius: 20px;
}

.userImage .loader-dots-wrap .loader-dots {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.userImage.newUploading.file {
    height: 80px;
}

.userImage.newUploading.file .text {
    font-size: 12px;
}

.userImage.newUploading.file img {
    width: 100%;
    height: 65px;
    max-height: 100px !important;
    max-width: 100% !important;
    object-fit: cover;
    border-radius: 5px !important;
}

.userImage.newUploading.file img[src*="uploadIcon.svg"] {
    max-width: 25px !important;
    height: auto;
    border-radius: 0;
}

.userImage .remove-icon {
    width: 16px;
    height: 16px;
    background: red;
    color: #fff;
    border-radius: 50px;
    position: absolute;
    top: -6px;
    left: -6px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 11px;
    z-index: 22;
}

/* .mini-chart-item .has-spinner-link {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    width: 100%;
    height: 100%;
    border-radius: 20px;
} */

/* .mini-chart-item .has-spinner-link.loading::before {

    filter: invert(1);

} */

.userImage.favIcon {
    min-width: 90px;
    width: max-content;
    height: 90px;
    padding: 9px;
    border-radius: 15px;
}

.userImage img {
    max-width: 100%;
    max-height: 100%;
    border: 0 !important;
    padding: 0 !important;
    border-radius: 20px !important;
    display: block;
    margin: 0 auto;
}

.userImage.favIcon img {
    max-width: 100%;
}

.userImage img[src$="default_shipping.png"] {
    width: 50px;
    border-radius: 0;
}

.userImage img[src*="uploadIcon.svg"] {
    max-width: 35px !important;
    border-radius: 0;
    height: auto;
}

.userImage img[src*="excel.png"] {
    max-width: 35px !important;
    height: auto;
    border-radius: 0;
}

.upload-btn-wrapper {
    overflow: hidden;
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    cursor: pointer;
    right: 0;
    bottom: 0;
}

.upload-btn-wrapper .btn {
    cursor: pointer;
    border: 1px solid #e1ab39;
    color: #fff;
    border-radius: 50px;
    font-size: 14px;
    width: 40px;
    height: 40px;
    padding: 0;
    text-align: center;
    line-height: 35px;
    background-color: #000;
    border-color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
}

.userImage.shipping_item .upload-btn-wrapper .btn {
    width: 30px;
    height: 30px;
    font-size: 14px;
}

.upload-btn-wrapper input[type="file"] {
    font-size: 100px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    cursor: pointer;
}

.userImage.userPage {
    background: transparent;
    width: 130px;
    height: 130px;
    min-width: auto;
}

.userImage.userPage img {
    width: 100%;
    height: 100%;
    border-radius: 50% !important;
    margin: 0;
    object-fit: cover;
}

.userImage.userPage .imageContainer label {
    align-items: flex-start;
    justify-content: flex-start;
    min-width: 100px;
    width: max-content;
    height: 100px;
}

.userImage.userPage .has-spinner-link {
    background: transparent;
}

.userImage.loading {
    background-image: none;
}

.userImage.loading::before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgb(185 185 185 / 30%);
    z-index: 222;
    border-radius: 20px;
}

.kt-widget17
    .kt-widget17__stats
    .kt-widget17__items
    .kt-widget17__item
    .kt-widget17__subtitle {
    font-weight: 500;
}

.card-box .card-box-footer i {
    vertical-align: middle;
    line-height: 0;
}

.btn-outline-danger.disabled,
.btn-outline-danger:disabled {
    color: #de3333;
    opacity: 1;
}

.btn-outline-danger:hover {
    color: #fff;
    cursor: pointer;
}

.datepicker.datepicker-orient-top {
    z-index: 99999 !important;
}

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

.select2-container--default
    .select2-selection--single
    .select2-selection__rendered {
    padding: 0.78rem 1rem;
    font-size: 14px;
    color: #000000;
}

.select2-container--default
    .select2-selection--single
    .select2-selection__arrow,
.select2-container--default
    .select2-selection--multiple
    .select2-selection__arrow {
    left: 0;
}

.select2-container--default.select2-container--focus
    .select2-selection--multiple,
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open
    .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: #ebedf3;
}

.search-r-button {
    border-color: #e9edf3;
}

.input-daterange .item {
    position: relative;
}

.input-daterange .item i {
    position: absolute;
    left: 10px;
    top: 50%;
    font-size: 9px;
    transform: translateY(-50%);
}

.couponFilters .select2-container {
    width: 100% !important;
}

.block-line {
    width: 20px;
    height: 2px;
    background-color: #fff;
    display: block !important;
    margin-bottom: 4.4px;
    border-radius: 5px;
}

.block-line:first-child {
    width: 11px;
    position: relative;
    right: -4px;
}

.block-line:last-child {
    margin-bottom: 0;
}

.block-line:nth-child(3) {
    width: 15px;
    position: relative;
    right: -2px;
}

.table thead {
    background: #f5f7f9;
}

.table thead .kt-checkbox {
    margin-bottom: 10px;
}

.table thead th {
    /* padding: 1.7rem 1rem; */
    padding: 1rem 1rem;
}

.table-bordered th,
.table-bordered td {
    border: 1px solid #f0f0f0;
    border-right: 0;
    border-left: 0;
}

.table thead th {
    border-bottom: 1px solid transparent;
}

/* .table tbody td .kt-checkbox {
    position: relative;
    top: -5px;
} */

.btn-outline-metal {
    border: 1px solid #d4d4d4;
}

.theme_tail_circle,
.blockui {
    border-radius: 15px !important;
}

.theme_tail_circle img {
    width: 40px;
    height: 40px;
    object-fit: cover;
}

@media (max-width: 1024px) {
    .kt-header-mobile {
        background-color: #fff;
        height: 76px;
    }

    .kt-header-mobile--fixed .kt-wrapper {
        padding-top: 115px;
    }

    .kt-header-mobile .kt-header-mobile__toolbar .kt-header-mobile__toggler {
        margin: 0 0.5rem 0 0;
    }

    .kt-header-mobile
        .kt-header-mobile__toolbar
        .kt-header-mobile__toggler
        span {
        background: #000;
        height: 2px;
        min-height: auto;
        width: 20px;
    }

    .place-side-icon .icon {
        width: 56px;
        height: 56px;
    }

    .place-side-icon .icon img {
        width: 56px;
        height: 56px;
    }

    .place-side-icon .package-crown {
        width: 20px;
        height: 20px;
        bottom: -7px;
    }

    #kt_header_mobile_toggler {
        display: none;
    }

    .kt-header-mobile
        .kt-header-mobile__toolbar
        .kt-header-mobile__toggler
        span::before,
    .kt-header-mobile
        .kt-header-mobile__toolbar
        .kt-header-mobile__toggler
        span::after {
        background: #000;
        height: 2px;
        min-height: auto;
    }

    .kt-header-mobile
        .kt-header-mobile__toolbar
        .kt-header-mobile__toggler.kt-header-mobile__toggler--left
        span:after {
        width: 15px;
    }

    .kt-header-mobile
        .kt-header-mobile__toolbar
        .kt-header-mobile__topbar-toggler
        i {
        color: #000;
    }

    .kt-aside-overlay {
        background: rgba(6, 23, 51, 0.4);
    }
}

@media (max-width: 1024px) {
    .kt-aside.kt-aside--on {
        -webkit-transition: all 0.3s ease;
        transition: all 0.3s ease;
        left: auto;
        right: 0;
    }

    .kt-aside {
        left: auto;
        right: -295px;
    }

    .kt-aside--on .kt-aside-close {
        left: auto;
        right: 275px;
        top: 0;
    }
}

@media (max-width: 767px) {
    .kt-header-mobile--fixed .kt-wrapper {
        padding-top: 75px;
    }
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__link {
    background: #282822;
    border-radius: 20px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-text,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-text {
    color: #fff !important;
    white-space: nowrap;
}

.btn.btn-label-brand {
    background-color: var(--globalColor);
    color: #fff;
}

a.btn.btn-label-brand:focus,
a.btn.btn-label-brand:hover,
a.btn.btn-label-brand.active,
button.btn.btn-label-brand:focus,
button.btn.btn-label-brand:hover,
button.btn.btn-label-brand.active,
input.btn.btn-label-brand:focus,
input.btn.btn-label-brand:hover,
input.btn.btn-label-brand.active {
    background-color: var(--globalColor);
    color: #fff;
}

.btn i {
    line-height: 1;
    vertical-align: middle;
}

.kt-notification .kt-notification__custom {
    padding: 15px 10px;
}

.kt-notification .kt-notification__item {
    font-size: 14px;
    font-weight: 500;
    padding: 16px 15px 16px 15px;
    border-bottom: 1px solid #f5f5f5;
    color: #000;
    border-radius: 0px;
}

.kt-notification .kt-notification__item.log_out {
    color: #ff0000;
}

.kt-notification
    .kt-notification__item.log_out
    .kt-notification__item-details
    .kt-notification__item-title {
    color: #ff0000;
}

.kt-notification
    .kt-notification__item
    .kt-notification__item-details
    .kt-notification__item-title {
    color: #000;
}

.kt-notification
    .kt-notification__item
    .kt-notification__item-details
    .kt-notification__item-title
    span {
    display: inline-flex;
}

.kt-notification .kt-notification__item .kt-notification__item-icon {
    flex: 0 0 30px;
}

.dropdown-notification-wrapper
    .kt-notification
    .kt-notification__item
    .kt-notification__item-icon {
    flex: 0 0 55px;
}

.dropdown-notification-wrapper
    .kt-notification
    .kt-notification__item
    .kt-notification__item-icon
    .notifi_icon {
    display: flex;
    width: 40px;
    height: 40px;
    border-radius: 50px;
    align-items: center;
    justify-content: center;
    background: #f4f6f9;
    color: var(--globalColor);
}

.dropdown-notification-wrapper
    .kt-notification
    .kt-notification__item
    .kt-notification__item-icon
    .notifi_icon
    i {
    color: var(--globalColor);
}

.kt-notification
    .kt-notification__item
    .kt-notification__item-icon
    .notifi_icon
    img {
    width: 20px;
    height: 20px;
}

/* .dropdown-notification-wrapper .kt-notification .kt-notification__item .kt-notification__item-icon i {
    color: var(--side-font-color-active);
} */

.kt-notification .kt-notification__item:after {
    display: none;
}

.kt-notification .kt-notification__item .kt-notification__item-icon svg {
    width: 20px;
    height: 20px;
    margin-right: 0;
}

.kt-notification
    .kt-notification__item
    .kt-notification__item-icon
    i.icon-logout {
    color: inherit;
}

.kt-notification .kt-notification__item:hover {
    background-color: #f5f7f9;
}

.input-group .btn i {
    padding-left: 0;
    color: inherit;
}

.btn-main {
    background-color: var(--globalColor);
    color: #fff;
}

.btn-main:hover {
    color: #fff;
}

.btn-gray {
    background-color: #f5f7f9;
    color: #000;
    border: 1px solid #ebedf3;
    border-radius: 10px;
}

.btn-gray i {
    vertical-align: middle;
}

.btn-gray:hover {
    color: #000;
}

.btn-refund {
    height: 50px !important;
    background-color: #f5f7f9;
    color: #000;
    border: 1px solid #ebedf3;
    border-radius: 10px;
}

.kt-subheader-title h3 {
    color: #000;
    font-size: 1.3em;
    font-weight: 500;
}

.kt-subheader .kt-subheader__main .kt-subheader__title {
    color: #000;
    font-weight: 400;
}

.kt-subheader
    .kt-subheader__main
    .kt-subheader__breadcrumbs
    .kt-subheader__breadcrumbs-link {
    color: #000;
    font-weight: 400;
}

.kt-subheader .kt-subheader__main .kt-subheader__title {
    font-size: 1rem;
}

.kt-subheader
    .kt-subheader__main
    .kt-subheader__breadcrumbs
    .kt-subheader__breadcrumbs-home {
    color: #000;
    padding: 0px 0px 0px 0.5rem;
}

.kt-subheader
    .kt-subheader__main
    .kt-subheader__breadcrumbs
    .kt-subheader__breadcrumbs-home
    > i {
    vertical-align: middle;
}

.kt-subheader
    .kt-subheader__main
    .kt-subheader__breadcrumbs
    .kt-subheader__breadcrumbs-home:hover {
    font-size: 1rem;
    color: #000;
}

.kt-subheader
    .kt-subheader__main
    .kt-subheader__breadcrumbs
    .kt-subheader__breadcrumbs-home
    .icon-home {
    position: relative;
    bottom: 1.2px;
    padding-left: 0.2rem;
}

.kt-subheader
    .kt-subheader__main
    .kt-subheader__breadcrumbs
    .kt-subheader__breadcrumbs-home
    > i {
    color: #000;
}

.btn-excel {
    background-color: #3d804e14;
    border: 1px solid transparent;
    color: #3d804e;
    border-radius: 10px;
}

.btn-excel svg {
    padding-left: 0.5rem;
    vertical-align: middle;
}

.files-dropdown button {
    border-radius: 10px !important;
}

@media (max-width: 567px) {
    .dashboard-home .kt-bg-custom-1 {
        margin-bottom: 20px;
    }
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link {
    background-color: #282822 !important;
    color: #fff !important;
    border-radius: 20px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading
    .kt-menu__link-text,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link
    .kt-menu__link-text {
    color: #fff !important;
}

.kt-menu__item.kt-menu__item--submenu.active .kt-menu__link.kt-menu__toggle {
    background-color: transparent !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading
    .kt-menu__ver-arrow,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link
    .kt-menu__ver-arrow {
    color: #ffffff !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__heading
    .kt-menu__ver-arrow,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__link
    .kt-menu__ver-arrow {
    color: #fff;
    font-size: 17px;
}

.kt-aside-menu
    .kt-menu__nav
    .kt-menu__item.kt-menu__item--open
    > .kt-menu__heading
    > .kt-menu__ver-arrow:before,
.kt-aside-menu
    .kt-menu__nav
    .kt-menu__item.kt-menu__item--open
    > .kt-menu__link
    > .kt-menu__ver-arrow:before {
    -webkit-transform: rotateZ(270deg);
    transform: rotateZ(270deg);
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__subnav {
    padding-bottom: 5px !important;
}

.kt-checkbox.kt-checkbox--success > span {
    border: 1px solid #bdbbbb;
}

.kt-scrolltop {
    background: var(--globalColor);
    opacity: 1 !important;
    display: none !important;
}

/* Delete Modal */

.default_modal_wrapper .modal-content {
    box-shadow: 20px 20px 60px rgb(255 255 255 / 13%),
        -20px -20px 60px rgb(255 255 255 / 13%);
}

.default_modal_wrapper .modal-content {
    border-radius: 20px !important;
}

.modal .modal-content {
    box-shadow: 20px 20px 60px rgb(255 255 255 / 13%),
        -20px -20px 60px rgb(255 255 255 / 13%);
}

.modal .modal-content {
    border-radius: 20px !important;
}

.modal .modal-footer .btn-main {
    min-width: 75px;
}

.default_modal_wrapper .msg {
    margin-bottom: 1rem;
}

.swal2-icon.swal2-warning {
    border-color: #facea8;
    color: #f8bb86;
}

.swal2-icon {
    position: relative;
    justify-content: center;
    width: 5em;
    height: 5em;
    margin: 1.25em auto 1.875em;
    border: 0.25em solid transparent;
    border-radius: 50%;
    line-height: 5em;
    cursor: default;
    box-sizing: content-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    zoom: normal;
}

.modal .msg {
    text-align: center;
}

.modal .msg h3 {
    font-size: 16px;
    color: #000;
    font-weight: 500;
    margin-bottom: 10px;
}

.modal .msg p {
    font-size: 14px;
    color: #000;
    margin-bottom: 20px;
}

.swal2-styled {
    min-width: 80px;
    box-shadow: none !important;
    opacity: 1 !important;
    padding: 12px 16px;
    border-width: 0px;
    border-style: initial;
    border-color: initial;
    border-image: initial;
    border: 0;
    border-radius: 10px !important;
    outline: none !important;
    color: #fff;
    margin-left: 10px;
}

.swal2-styled.swal2-confirm {
    background-color: var(--globalColor) !important;
    font-size: 14px !important;
}

.swal2-styled.swal2-cancel {
    background-color: #e6e8f0 !important;
    font-size: 14px !important;
    color: #000 !important;
}

.swal2-styled:last-child {
    margin-left: 0;
}

.modal-backdrop {
    background-color: rgba(0, 0, 0, 0.1) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    opacity: 1 !important;
    transition: opacity 0.5s cubic-bezier(0.4, 0, 0.6, 1) 80ms,
        visibility 0.32s step-end 80ms;
}

.toast-success {
    background-color: #00886a !important;
    box-shadow: none !important;
    opacity: 1 !important;
    white-space: nowrap;
}

.toast-error {
    background-color: #de3333 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    white-space: nowrap;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__link {
    background-color: #282822;
    color: #fff !important;
    border-radius: 20px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--open
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--open
    > .kt-menu__link {
    background-color: #282822;
    border-radius: 20px;
}

.kt-aside__brand.user {
    height: auto;
}

.main-points-logo {
    padding: 20px 0 25px;
    display: block;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    height: 75px;
    margin-bottom: 20px;
}

.main-points-logo img {
    position: relative;
    left: 0;
    max-width: 70px;
}

.kt-aside .kt-aside-menu .main-points-logo {
    padding: 20px 0 10px;
}

@media (min-width: 1025px) {
    .kt-aside .kt-aside-menu .main-points-logo {
        display: none;
    }
}

.kt-header--fixed.kt-subheader--fixed .kt-subheader {
    box-shadow: none;
    border-bottom: 1px solid #eff0f6;
}

@media (min-width: 1025px) {
    .kt-header {
        height: 75px;
    }

    .kt-header--fixed.kt-subheader--fixed .kt-subheader {
        height: 45px;
        top: 75px;
    }
}

.dropdown-menu {
    padding: 0;
}

.dropdown-menu > li > a,
.dropdown-menu > .dropdown-item {
    padding: 1.2rem 1.2rem;
    border-radius: 10px;
    color: #000;
}

.dropdown-menu > li > a > i,
.dropdown-menu > .dropdown-item > i {
    color: #000;
    font-size: 14px;
}

.dropdown-menu > li > a > svg,
.dropdown-menu > .dropdown-item > svg {
    width: 20px;
    margin-left: 0.75rem;
}

.dropdown-overlay-btn svg {
    max-width: 15px;
}

.itemOptinos .dropdown-menu > li > a,
.itemOptinos .dropdown-menu > .dropdown-item {
    padding: 1.3rem 1.2rem;
}

.text-danger {
    color: red !important;
}

.form-group .text-danger,
.tabs-error {
    display: block;
    margin-top: 10px;
}

.input-group + .text-danger {
    display: block;
    margin-top: 10px;
}

.rolesWrapper {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(33%, 4fr));
    width: 100%;
}

.rolesWrapper .checkbox-custom-primary {
    padding: 10px 15px;
}

.rolesWrapper .checkbox-custom-primary .form-check-label {
    font-size: 14px;
}

@media (max-width: 567px) {
    .rolesWrapper {
        grid-template-columns: repeat(auto-fill, minmax(50%, 4fr));
    }
}

.checkbox-custom-primary {
    margin-bottom: 1.5rem;
    cursor: pointer;
}

.checkbox-custom-primary input[type="checkbox"] {
    position: absolute;
}

.checkbox input[type="checkbox"] {
    cursor: pointer;
    opacity: 0;
    z-index: 1;
    outline: none !important;
}

.checkbox label {
    display: inline-block;
    padding-right: 30px;
    position: relative;
    font-weight: normal;
    margin-bottom: 0;
    cursor: pointer;
}

.checkbox label::before {
    -o-transition: 0.3s ease-in-out;
    -webkit-transition: 0.3s ease-in-out;
    background-color: #fff;
    border-radius: 3px;
    border: 2px solid #98a6ad;
    content: "";
    display: inline-block;
    height: 18px;
    right: 0;
    margin-left: -18px;
    position: absolute;
    transition: 0.3s ease-in-out;
    width: 18px;
    outline: none !important;
    top: 2px;
}

.checkbox label::after {
    color: #6c757d;
    display: inline-block;
    font-size: 14px;
    height: 18px;
    left: 0;
    margin-left: -18px;
    padding-left: 3px;
    padding-top: 2px;
    position: absolute;
    top: 0;
    width: 18px;
}

.checkbox input[type="checkbox"] {
    cursor: pointer;
    opacity: 0;
    z-index: 1;
    outline: none !important;
}

.checkbox input[type="checkbox"]:disabled + label {
    opacity: 0.65;
}

.checkbox input[type="checkbox"]:focus + label::before {
    outline-offset: -2px;
    outline: none;
}

.checkbox input[type="checkbox"]:checked + label::after {
    content: "";
    position: absolute;
    top: 6px;
    right: 7px;
    display: table;
    width: 4px;
    height: 8px;
    border: 2px solid #fff;
    border-top-width: 0;
    border-left-width: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.checkbox input[type="checkbox"]:checked + label::before {
    background-color: var(--globalColor);
    border-color: var(--globalColor);
}

.checkbox input[type="checkbox"]:disabled + label::before {
    background-color: #f1f5f7;
    cursor: not-allowed;
}

.checkbox.checkbox-circle label::before {
    border-radius: 50%;
}

.checkbox.checkbox-inline {
    margin-top: 0;
}

.checkbox.checkbox-single input {
    height: 18px;
    width: 18px;
    position: absolute;
}

.checkbox.checkbox-single label {
    height: 18px;
    width: 18px;
}

.checkbox.checkbox-single label:before {
    margin-left: 0;
}

.checkbox.checkbox-single label:after {
    margin-left: 0;
}

.checkbox-primary input[type="checkbox"]:checked + label::before {
    background-color: var(--globalColor);
    border-color: var(--globalColor);
}

.checkbox-primary input[type="checkbox"]:checked + label::after {
    border-color: #fff;
}

.checkbox-secondary input[type="checkbox"]:checked + label::before {
    background-color: #6c757d;
    border-color: #6c757d;
}

.checkbox-secondary input[type="checkbox"]:checked + label::after {
    border-color: #fff;
}

.checkbox-success input[type="checkbox"]:checked + label::before {
    background-color: #1abc9c;
    border-color: #1abc9c;
}

.checkbox-success input[type="checkbox"]:checked + label::after {
    border-color: #fff;
}

.checkbox-info input[type="checkbox"]:checked + label::before {
    background-color: #4fc6e1;
    border-color: #4fc6e1;
}

.checkbox-info input[type="checkbox"]:checked + label::after {
    border-color: #fff;
}

.checkbox-warning input[type="checkbox"]:checked + label::before {
    background-color: #f7b84b;
    border-color: #f7b84b;
}

.checkbox-warning input[type="checkbox"]:checked + label::after {
    border-color: #fff;
}

.checkbox-danger input[type="checkbox"]:checked + label::before {
    background-color: #f1556c;
    border-color: #f1556c;
}

.checkbox-danger input[type="checkbox"]:checked + label::after {
    border-color: #fff;
}

.checkbox-light input[type="checkbox"]:checked + label::before {
    background-color: #f1f5f7;
    border-color: #f1f5f7;
}

.checkbox-light input[type="checkbox"]:checked + label::after {
    border-color: #fff;
}

.checkbox-dark input[type="checkbox"]:checked + label::before {
    background-color: #323a46;
    border-color: #323a46;
}

.checkbox-dark input[type="checkbox"]:checked + label::after {
    border-color: #fff;
}

.checkbox-pink input[type="checkbox"]:checked + label::before {
    background-color: #f672a7;
    border-color: #f672a7;
}

.checkbox-pink input[type="checkbox"]:checked + label::after {
    border-color: #fff;
}

.checkbox-blue input[type="checkbox"]:checked + label::before {
    background-color: #4a81d4;
    border-color: #4a81d4;
}

.checkbox-blue input[type="checkbox"]:checked + label::after {
    border-color: #fff;
}

.theme_tail_circle {
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--globalColor);
    border-radius: 2px;
}

.theme_tail_circle .pace_activity {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    border: 3px solid rgba(0, 0, 0, 0.1);
    border-right-color: #fff;
    -webkit-animation: rotation 1.1s infinite linear;
    -o-animation: rotation 1.1s infinite linear;
    animation: rotation 1.1s infinite linear;
}

/* Per-card loader inside the report pages — no coloured box, the spinner ring
   itself is black. Scoped to .rep-card-loading so the global square loader used
   elsewhere on the dashboard stays untouched. */
/* Anchor the absolute spinner to the card body and keep the body tall enough
   while loading so the ring sits in the exact centre (top/bottom + left/right)
   of the whole card — not pushed below the title. */
.rep-card .card-body { position: relative; }
.rep-card .card-body:has(> .rep-card-loading) { min-height: 260px; }
.rep-card-loading {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
}
/* The square brand box collapses to its content so only the ring shows,
   perfectly centred by the flex wrapper above. */
.rep-card-loading .theme_tail_circle {
    background: transparent;
    border-radius: 0;
    width: auto;
    height: auto;
    margin: 0;
}
.rep-card-loading .theme_tail_circle .pace_activity {
    width: 30px;
    height: 30px;
    border-width: 3px;
    border-color: rgba(0, 0, 0, 0.12);
    border-right-color: #000;
}
body.dark-theme .rep-card-loading .theme_tail_circle .pace_activity {
    border-color: rgba(255, 255, 255, 0.18);
    border-right-color: #fff;
}

@-webkit-keyframes rotation {
    0% {
        -webkit-transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@-moz-keyframes rotation {
    0% {
        -moz-transform: rotate(0);
    }

    100% {
        -moz-transform: rotate(360deg);
    }
}

@-ms-keyframes rotation {
    0% {
        -ms-transform: rotate(0);
    }

    100% {
        -ms-transform: rotate(360deg);
    }
}

@-o-keyframes rotation {
    0% {
        -o-transform: rotate(0);
    }

    100% {
        -o-transform: rotate(360deg);
    }
}

@keyframes rotation {
    0% {
        transform: rotate(0);
    }

    100% {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes rotation_reverse {
    0% {
        -webkit-transform: rotate(0);
    }

    100% {
        -webkit-transform: rotate(-360deg);
    }
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-icon
    svg,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-icon
    svg {
    height: 16px;
    width: 16px;
}

.badge-danger {
    background-color: red;
}

.increase-badge,
.decrease-badge {
    padding: 5px 5px;
    font-size: 14px;
    font-weight: 700 !important;
    vertical-align: text-bottom;
    margin-right: 2px;
    border-radius: 7px;
}

.line-chart {
    animation: fadeIn 600ms cubic-bezier(0.57, 0.25, 0.65, 1) 1 forwards;
    opacity: 0;
    width: 100%;
}

.aspect-ratio {
    height: 0;
    padding-bottom: 50%;
}

@keyframes fadeIn {
    to {
        opacity: 1;
    }
}

.btn-danger {
    background-color: #de3333;
    border-color: #de3333;
}

.btn-danger:hover {
    background-color: #de3333;
    border-color: #de3333;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__subnav {
    background: rgba(255, 255, 255, 0.05);
    /* #F5F7F9;*/
    border-radius: 10px;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    padding: 0px 0;
    /* background: #293445; */
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item.kt-menu__item--open {
    border-radius: 10px;
    border: 1px solid transparent;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover {
    border-radius: 20px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-icon {
    color: #fff !important;
    line-height: 40px;
}

input.dateCustom {
    position: relative;
    overflow: hidden;
}

input.dateCustom::-webkit-calendar-picker-indicator {
    display: block;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    position: absolute;
    cursor: pointer;
    transform: scale(12);
}

input.timeCustom {
    position: relative;
    overflow: hidden;
}

input.timeCustom::-webkit-calendar-picker-indicator {
    display: block;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    position: absolute;
    cursor: pointer;
    transform: scale(12);
}

.badge-success {
    background-color: rgba(16, 171, 123, 0.1) !important;
    /* background-color: rgba(57, 213, 173, .1) !important; */
    /* color: #39d5ad !important; */
    color: #10ab7b !important;
    border-radius: 5px;
    font-weight: 600;
}

.badge.badge-success::before {
    background-color: #39d5ad;
}

.badge-success-two {
    background-color: rgba(3, 148, 116, 0.1) !important;
    border-radius: 5px;
    color: #039474;
    font-weight: 600;
}

.badge.badge-success-two::before {
    background-color: #039474;
}

.check-icon {
    width: 15px;
    height: 15px;
    background-color: #039474;
    color: #fff;
    border-radius: 50px;
    display: inline-block;
    line-height: 15px;
    text-align: center;
    font-size: 9px;
    margin-left: 3px;
    vertical-align: middle;
}

.table .badge.badge {
    position: relative;
}

.badge {
    font-weight: 600;
    border-radius: 8px;
    padding: 8px;
    line-height: 17px;
}

.table .badge.badge::before {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50px;
    vertical-align: middle;
    margin-left: 4px;
    display: none;
}

.badge-danger {
    background-color: #ffebef !important;
    color: #ff0038;
    border-radius: 5px;
    font-weight: 600;
}

.badge.badge-danger::before {
    background-color: #ff0038;
}

.badge-info {
    background-color: rgba(64, 129, 255, 0.1) !important;
    color: #4081ff;
    font-weight: 600;
}

.badge.badge-info::before {
    background-color: #4081ff;
}

.badge-warning {
    background-color: rgba(237, 187, 111, 0.1) !important;
    color: #fcc739;
    font-weight: 600;
}

.badge.badge-warning::before {
    background-color: #fcc739;
}

.badge-warning-2 {
    background-color: rgba(255, 184, 34, 0.3) !important;
    color: #ffb822;
    font-weight: 600;
}

.badge.badge-warning-2::before {
    background-color: #ffb822;
}

/* .badge-warning-3 {
    background-color: #fff6c7 !important;
    color: #e3771e;
    font-weight: 600;
} */

.badge-warning-3 {
    background-color: rgb(255, 73, 1, 0.1) !important;
    color: #ff4901;
    font-weight: 600;
}

.badge.badge-warning-3::before {
    background-color: #ff4901;
}

.badge-warning-4 {
    background-color: rgba(255, 157, 70, 0.1) !important;
    color: #ff9d46;
    font-weight: 600;
    border-radius: 0.35rem;
}

.badge.badge-warning-4::before {
    background-color: #ff9d46;
}

.badge-warning.deliver {
    color: #28a3c1;
    background-color: rgba(40, 163, 193, 0.1) !important;
    font-weight: 600;
}

.badge.warning.deliver::before {
    background-color: #28a3c1;
}

.badge-primary {
    /* background-color: rgba(74, 76, 164, .1) !important;
    color: #4a4ca4; */
    font-weight: 600;
    background-color: rgba(138, 95, 230, 0.1) !important;
    color: #6654ea;
}

.badge.badge-primary::before {
    /* background-color: #4a4ca4; */
    background-color: #6654ea;
}

.badge-primary-new {
    background-color: rgba(64, 129, 255, 0.1) !important;
    color: #4081ff;
    font-weight: 600;
}

.badge.badge-primary-new::before {
    background-color: #4081ff;
}

.badge-warning-dark {
    background-color: rgba(242, 153, 55, 0.1) !important;
    color: #f29937;
    font-weight: 600;
}

.badge.badge-warning-dark::before {
    background-color: #f29937;
}

.badge-primary-dark {
    background-color: rgba(163, 91, 216, 0.1) !important;
    color: rgb(163 91 216);
    font-weight: 600;
}

.badge.badge-primary-dark::before {
    background-color: rgb(163 91 216);
}

.badge-blacked {
    background-color: rgba(17, 17, 17, 0.1) !important;
    color: #000;
    font-weight: 600;
}

.badge.badge-blacked::before {
    background-color: #000;
}

.badge-gray {
    background-color: rgb(245 247 249) !important;
    color: #000;
    font-weight: 600;
}

.badge-blue {
    background-color: rgba(64, 129, 255, 0.1);
    color: #4081ff;
    font-weight: 600;
}

.badge-danger-dark {
    background-color: rgba(246, 0, 0, 0.1) !important;
    color: #f60000;
    font-weight: 600;
}

.badge.badge-danger-dark::before {
    background-color: #f60000;
}

.badge-oranged {
    background-color: rgb(62, 51, 40) !important;
    color: #ff8c00;
    font-weight: 700;
}

.badge.badge-oranged::before {
    background-color: #ff8c00;
}

/* Order Status Badge Classes */
.badge-state-1 {
    background-color: rgba(64, 129, 255, 0.1) !important;
    color: rgb(64, 129, 255);
    border-radius: 5px;
    font-weight: 600;
}

.badge-state-2 {
    background-color: rgba(74, 76, 164, 0.1) !important;
    color: #4a4ca4;
    border-radius: 5px;
    font-weight: 600;
}

.badge-state-3 {
    background-color: rgba(255, 194, 51, 0.1) !important;
    color: #ffc233;
    border-radius: 5px;
    font-weight: 600;
}

.badge-state-4 {
    background-color: rgb(40 163 193 / 10%) !important;
    color: #28a3c1;
    border-radius: 5px;
    font-weight: 600;
}

.badge-state-5 {
    background-color: rgba(245, 61, 107, 0.1) !important;
    color: #f53d6b;
    border-radius: 5px;
    font-weight: 600;
}

.badge-state-6 {
    background-color: rgba(80, 116, 140, 0.1) !important;
    color: #50748c;
    border-radius: 5px;
    font-weight: 600;
}

.badge-state-7 {
    background-color: rgba(40, 163, 193, 0.1) !important;
    color: #28a3c1;
    border-radius: 5px;
    font-weight: 600;
}

.badge-state-8 {
    background-color: rgba(57, 213, 173, 0.1) !important;
    color: #39d5ad;
    border-radius: 5px;
    font-weight: 600;
}

.badge-state-9 {
    background-color: rgba(1, 148, 116, 0.1) !important;
    color: #019474;
    border-radius: 5px;
    font-weight: 600;
}

.badge-state-10 {
    background-color: rgba(255, 157, 70, 0.1) !important;
    color: #ff9d46;
    border-radius: 5px;
    font-weight: 600;
}

.tag-primary {
    background-color: rgb(255, 73, 1, 0.1);
    color: #ff4901;
    border-radius: 8px;
    padding: 8px;
}

.tag-primary-2 {
    background-color: rgba(138, 95, 230, 0.1);
    color: #6654ea;
    border-radius: 8px;
    padding: 8px;
}

.tag-primary-3 {
    background-color: rgba(64, 129, 255, 0.1);
    color: #4081ff;
    border-radius: 8px;
    padding: 8px;
}

.tag-primary-4 {
    background-color: rgb(118, 188, 199, 0.1);
    color: #76bcc7;
    border-radius: 8px;
    padding: 8px;
}

.user-tags-content {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.user-tags-content .badge {
    font-size: 12px;
}

.tags_wrapper > .search-query {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.tags_wrapper .tagsSelectWrap {
    height: 150px;
    overflow: scroll;
    overflow-x: hidden;
    padding: 15px 10px;
    border: 1px solid #ebedf2;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    -webkit-overflow-scrolling: touch;
}

.tags_wrapper .tags_wrapper_input {
    position: relative;
}

.tags_wrapper .tags_wrapper_input input {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.tags_wrapper .tags_wrapper_input a {
    position: absolute;
    top: 50%;
    left: 20px;
    transform: translateY(-50%);
    color: #000;
    text-decoration: underline !important;
}

.dropify-wrapper,
.dropify-wrapper .dropify-clear {
    font-family: "Ping AR + LT";
}

.multi-image-upload {
    width: 100%;
    height: 250px;
}

.multi-image-upload .images-wrapper-items {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
    max-width: 100%;
    padding: 0 10px;
}

.multi-image-upload .images-wrapper-items .image-item img {
    max-width: 100px;
}

.multi-image-upload .images-wrapper-items .image-item {
    position: relative;
}

.multi-image-upload .images-wrapper-items .image-item .removeIcon {
    display: block;
    width: 20px;
    height: 20px;
    background-color: #eb6460;
    line-height: 22px;
    border-radius: 50px;
    margin-right: auto;
    padding: 0;
    color: #fff;
    text-align: center;
    border: 0;
    position: absolute;
    top: -15px;
    right: -10px;
    z-index: 222;
    cursor: pointer;
}

.action-list li {
    margin-bottom: 5px;
}

.action-logout {
    color: #ff0000 !important;
}

.action-logout > i {
    color: #ff0000 !important;
}

.paid-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-color: #39d5ad;
    line-height: 22px;
    border-radius: 50px;
    margin: 0 5px;
    padding: 0;
    color: #fff;
    text-align: center;
    border: 0;
    cursor: pointer;
}

.kt-notification .kt-notification__item {
    cursor: pointer !important;
}

.action-list {
    white-space: nowrap;
}

.table th,
.table td {
    padding: 1rem 1rem;
    font-weight: 500;
    font-size: 14px;
}

.table th,
.table thead th {
    font-weight: 600;
}

.clientsTable td {
    padding: 1rem 1rem;
}

@media (max-width: 576px) {
    .table td {
        padding: 1rem 0.5rem;
        font-size: 13px;
        white-space: nowrap;
    }

    .IdNumWrapper {
        overflow: hidden;
    }
}

.btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all).btn-sm {
    font-size: 14px;
}

.has-spinner-link {
    position: relative;
}

.has-spinner-link.loading .button_text {
    opacity: 0;
}

.has-spinner-link.loading::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 30px;
    height: 30px;
    margin-top: -15px;
    margin-left: -15px;
    background-image: url(../images/loading.gif);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 2;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.loader-dots {
    display: block;
    width: 40px;
    aspect-ratio: 4;
    --_g: no-repeat
        radial-gradient(circle closest-side, var(--globalColor) 90%, #0000);
    background: var(--_g) 0% 50%, var(--_g) 50% 50%, var(--_g) 100% 50%;
    background-size: calc(100% / 3) 100%;
    animation: l7 1s infinite linear;
}

@keyframes l7 {
    33% {
        background-size: calc(100% / 3) 0%, calc(100% / 3) 100%,
            calc(100% / 3) 100%;
    }

    50% {
        background-size: calc(100% / 3) 100%, calc(100% / 3) 0%,
            calc(100% / 3) 100%;
    }

    66% {
        background-size: calc(100% / 3) 100%, calc(100% / 3) 100%,
            calc(100% / 3) 0%;
    }
}

.loader-dots.center {
    margin: 10px auto;
}

/* Login Cards  */
.login_card_item {
    position: relative;
    display: block;
    padding: 4rem 2rem;
    border-radius: 20px;
    text-align: center;
}

.login_card_item .user {
    position: absolute;
    top: 15px;
    left: 15px;
    font-size: 14px;
}

.login_card_item .icon {
    font-size: 30px;
}

.login_card_item .icon i {
    z-index: 2;
}

.login_card_item .icon i {
    color: #000 !important;
}

.login_card_item .icon::before {
    background: rgb(0 0 0 / 10%) !important;
}

.login_card_item .icon::before {
    left: 2px !important;
    bottom: 5px !important;
}

.login_card_item .title {
    display: block;
    font-size: 14px;
    margin-top: 1rem;
}

.login_card_item.icon_bg_1 .icon i {
    color: #a35bd8;
}

.login_card_item.icon_bg_1 .icon::before {
    background: rgb(163 91 216 / 10%);
}

.login_card_item.icon_bg_2 .icon i {
    color: #ff4901;
}

.login_card_item.icon_bg_2 .icon::before {
    background: rgb(255 73 1 / 10%);
}

.login_card_item.icon_bg_3 .icon i {
    color: #4081ff;
}

.login_card_item.icon_bg_3 .icon::before {
    background: rgb(64 129 255 / 10%);
}

.login_card_item.icon_bg_4 .icon i {
    color: #ec4e3d;
}

.login_card_item.icon_bg_4 .icon::before {
    background: rgb(236 78 61 / 10%);
}

.login_card_item.icon_bg_5 .icon i {
    color: #4081ff;
}

.login_card_item.icon_bg_5 .icon::before {
    background: rgb(64 129 255 / 10%);
}

.login_card_item.icon_bg_7 .icon i {
    color: #efad42;
}

.login_card_item.icon_bg_7 .icon::before {
    background-color: rgba(239, 173, 66, 0.1);
}

.login_card_item.icon_bg_8 .icon i {
    color: #6654ea;
}

.login_card_item.icon_bg_8 .icon::before {
    background-color: rgba(138, 95, 230, 0.1);
}

.login_card_item.icon_bg_9 .icon i {
    color: #4a4ca4;
}

.login_card_item.icon_bg_9 .icon::before {
    background-color: rgba(74, 76, 164, 0.1);
}

.login_card_item.icon_bg_10 .icon i {
    color: #8193ae;
}

.login_card_item.icon_bg_10 .icon::before {
    background: rgb(129 147 174 / 10%);
}

.login_card_item.icon_bg_11 .icon i {
    color: #6654ea;
}

.login_card_item.icon_bg_11 .icon::before {
    background: rgb(138 95 230 / 10%);
}

.login_card_item.bg_2 {
    border: 1px solid #f0f2f5;
    background-color: #fff;
    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
}

.login_card_item.soon-pointer {
    pointer-events: none;
}

.login_card_item .soon {
    width: 100%;
    height: 100%;
    background-color: rgba(136, 136, 136, 0.5);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 15px;
    pointer-events: none;
    cursor: none;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login_card_item .soon-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    font-size: 16px;
    z-index: 22;
}

.login_card_item .icon {
    position: relative;
    width: 60px;
    height: 60px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login_card_item .icon img {
    width: 48px;
    position: relative;
    z-index: 22;
}

.login_card_item .icon::before {
    content: " ";
    width: 35px;
    height: 35px;
    background-color: var(--globalColorRGB);
    border-radius: 50px;
    display: block;
    position: absolute;
    left: -2px;
    bottom: 2px;
}

.login_card_item.icon_bg_6 .icon i {
    color: #0fbcc8;
}

.login_card_item.horizontal {
    position: relative;
    z-index: 1;
}

.login_card_item.horizontal {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2.3rem 1rem;
}

.login_card_item.horizontal .icon {
    margin: 0;
}

.login_card_item.horizontal .inner h3 {
    font-size: 1.5rem;
    margin: 0 0 10px;
    text-align: right;
    font-weight: 800;
}

.login_card_item.horizontal .inner h4 {
    font-size: 14px;
    text-align: right;
    margin: 0;
    font-weight: 600;
    white-space: normal;
}

.login_card_item.horizontal .inner h4 > span {
    white-space: nowrap;
    margin-top: 0.2rem;
    display: inline-block;
}

@media (max-width: 576px) {
    .login_card_item.horizontal {
        padding: 2rem 1rem;
        flex-direction: column-reverse;
        margin-bottom: 20px;
        height: calc(100% - 20px) !important;
    }

    .login_card_item.horizontal .inner {
        text-align: center;
        margin-top: 0;
    }

    .login_card_item.horizontal .inner h3 {
        text-align: center;
    }

    .summery_card .more-arrow {
        margin-bottom: 0.6rem;
    }
}

/* User Address  */

.user-address {
    position: relative;
    margin-bottom: 1rem;
    background-color: #fff;
    border: 0.5px solid #e9e9e9;
    -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.03);
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.03);
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 100%;
    border-radius: 15px;
}

.user-address .card-body > p {
    font-size: 14px;
    color: #000;
    margin-bottom: 15px;
    white-space: normal;
}

.user-address .card-body > p span:first-child {
    font-weight: 600;
}

.user-address .card-body > p .location_link {
    color: #5867dd;
    -webkit-text-fill-color: #5867dd;
}

.user-address .card-body > p:last-child {
    margin-bottom: 0;
}

.user-address .selected {
    position: absolute;
    bottom: 10px;
    left: 10px;
}

.user-address .edits {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 22;
}

.user-address .edits a {
    display: inline-block;
    width: 38px;
    height: 38px;
    background-color: #f5f7f9;
    color: #000;
    text-align: center;
    line-height: 40px;
    border-radius: 50px;
    margin-left: 5px;
    cursor: pointer;
}

/* Custom Card Box */

.custom-card-box {
    position: relative;
    margin-bottom: 1rem;
    background-color: #fff;
    border: 0.5px solid #e9e9e9;
    -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.03);
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.03);
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    width: 100%;
    border-radius: 15px;
}

.custom-card-box.bg {
    background: #f5f7f9;
}

.custom-card-box h3 {
    padding: 0;
    margin-bottom: 20px;
    font-size: 1.2rem;
    font-weight: 500;
    color: #000;
}

.login-interactions {
    height: 100%;
    max-height: 580px;
    overflow: auto;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.login-interactions.empty-interactions {
    /* align-items: center; */

    justify-content: center;
}

.login-interactions.empty-interactions .empty-card-wrap {
    border: 0;
}

.global-title {
    padding: 0;
    margin-bottom: 20px;
    font-size: 1.2rem;
    font-weight: 500;
    color: #000;
}

@media (max-width: 767px) {
    .custom-card-box {
        height: auto !important;
    }
}

.custom-card-box .card-body > p {
    font-size: 14px;
    color: #000;
    margin-bottom: 25px;
    white-space: normal;
}

.custom-card-box .card-body > p span:first-child {
    font-weight: 600;
}

.custom-card-box .card-body > p:last-child {
    margin-bottom: 0;
}

.mini-chart-item .card-body > p,
.orderArrangeItems > p {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #000;
    margin-bottom: 25px;
    white-space: normal;
}

.mini-chart-item .card-body > p > span:first-child,
.orderArrangeItems > p span:first-child {
    font-weight: 600;
}

.mini-chart-item .card-body > p:last-child {
    margin-bottom: 0;
}

.tables_rows.half_table .table_card .table-card-item .table-item-title {
    font-weight: 600;
}

.sub_title {
    margin: 0;
    padding: 0;
    font-size: 1.2rem;
    font-weight: 500;
    color: #000;
}

/* .sub_title.interactions {
    margin-top: 2rem;
} */

/* Credit Card  */

.credit-card {
    position: relative;
    /* min-width: 520px; */
    max-width: 470px;
    margin: 0px auto;
    min-height: 260px;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    padding: 24px;
    box-sizing: border-box;
    background-repeat: no-repeat;
    background-size: cover;
    justify-content: space-between;
    overflow: hidden;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px,
        rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
}

.credit-card .white_filter {
    filter: brightness(100);
}

.credit-card.no-margin {
    margin: 0;
}

.credit-card .card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.credit-card .card-top .type {
    display: flex;
    align-items: center;
    font-size: 14px;
    gap: 15px;
    color: #fff;
}

.credit-card .card-top .type_name > span {
    margin-bottom: -6px;
    display: block;
}

.credit-card .card-top .type_name p {
    margin-bottom: 0;
    color: #fff;
    font-size: 18px;
}

.credit-card .logo {
    width: 72px;

    filter: invert(1);
    z-index: 1;
}

.credit-card .name-and-expiry {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    z-index: 1;
    color: #fff;
    font-size: 17px;
    text-transform: uppercase;
}

.credit-card .numbers {
    font-size: 36px;
    letter-spacing: 9px;
    text-align: center;
    color: #fff;
    z-index: 1;
}

@media (max-width: 576px) {
    .credit-card .card-top .type_name p {
        font-size: 16px;
    }

    .credit-card .card-top .type img {
        width: 40px;
    }

    .credit-card .logo {
        width: 50px;
    }
}

.note-info-wrapper {
    min-height: 250px;
    width: 100%;
}

.note-info h4 {
    text-align: center;
    margin-bottom: 0;
    margin-top: 1rem;
    color: #111;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    text-align: right;
    direction: rtl;
}

.no-notification {
    font-size: 16px;
    text-align: center;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.custom-dropdown-filter {
    position: relative;
}

.custom-dropdown-filter .dropdown-menu,
.custom-dropdown-filter .dropdown-menu:not(.daterangepicker) {
    margin: 0px 0px !important;
    position: absolute;
    top: 10%;
    left: 100% !important;
    width: 200px;
}

.custom-dropdown-filter.orders .dropdown-menu {
    top: 0;
}

.dropdown-submenu:hover > .dropdown-menu {
    display: block;
    transition: all 1s ease-in-out;
}

.custom-dropdown-filter .dropdown-menu > .dropdown-item {
    padding: 1rem 1rem;
}

.custom-dropdown-filter .dropdown-menu > .dropdown-item label {
    margin-bottom: 0;
}

/* Process Progress */

.process-progress {
    position: relative;
    padding: 12px 15px 12px 15px;
    display: flex;
    flex-flow: column;
    align-items: flex-end;
    color: #4081ff;
    background-color: rgba(64, 129, 255, 0.1);
    /* max-width: max-content; */
    /* box-shadow: 0 1px 2px 0 hsl(0deg 0% 89% / 50%); */
    margin: 0px 0 1rem 0;
    border-radius: 10px;
    /* border: 1px solid #edeff2;
    background: #f5f7f9; */
}

.process-progress .closeIcon {
    position: absolute;
    top: 5px;
    left: 9px;
    cursor: pointer;
    background-color: rgba(253, 100, 96, 0.1) !important;
    border-radius: 5px;
    color: #eb6460;
    width: 20px;
    height: 20px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.process-progress .closeIcon i {
    color: red;
    font-size: 14px;
    line-height: 0;
    display: inline-block;
}

.process-progress .process-head .icon {
    /* background-color: rgb(245 247 249) !important; */
    color: #4081ff;
    border-radius: 5px;
    display: inline-block;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 24px;
}

.process-progress .process-head .number {
    margin-right: 3px;
}

.process-progress .progress {
    width: 160px;
    height: 10px;
}

.process-progress .progress-wrap {
    background: var(--globalColor);
    margin: 5px 0 0;
    overflow: hidden;
    position: relative;
    border-radius: 50px;
}

.process-progress .progress-wrap .progress-bar {
    background: #f5f7f9;
    left: 0;
    right: 0;
    position: absolute;
    top: 0;
    border-radius: 0;
}

/* Save Buttons */

.save-wrapper {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    margin-top: 1.5rem;
}

.save-wrapper button,
.save-wrapper a {
    height: 40px;
    min-width: 75px;
    height: 40px;
    min-width: 75px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* .save-wrapper .button_text {
    height: 24px;
} */

.table-card {
    border: 1px solid #f0f2f5;
    background-color: #fff;
    border-radius: 15px;
}

.table-card .table-card-title {
    font-size: 1.2rem;
    font-weight: 500;
    color: #000;
    margin-bottom: 1rem;
}

@media (max-width: 1024px) {
    .kt-header__topbar-item
        .kt-header__topbar-wrapper
        .kt-badge.kt-badge--notify {
        top: 6px;
    }

    .kt-header__topbar-item .kt-header__topbar-icon {
        height: 34px;
        width: 34px;
    }

    .kt-header__topbar-item .kt-header__topbar-icon i {
        font-size: 1.3rem;
    }

    .kt-header__topbar-item.kt-header__topbar-item--user {
        margin-right: 2px;
        margin-left: 0;
        padding: 0;
    }

    .kt-header__topbar-item.kt-header__topbar-item--user
        .kt-header__topbar-user {
        padding: 0 2px;
        height: auto;
        display: flex;
        align-items: center;
    }

    .kt-header__topbar-item.kt-header__topbar-item--user
        .kt-header__topbar-user
        .kt-header__topbar-username
        > span:first-child {
        display: block;
    }

    .kt-header__topbar-item.kt-header__topbar-item--user
        .kt-header__topbar-user
        .kt-header__topbar-welcome {
        padding: 0 0 0 0.35rem;
        font-size: 0.9rem;
    }

    .kt-header__topbar-item.kt-header__topbar-item--user
        .kt-header__topbar-user
        .kt-header__topbar-username {
        padding: 0 0 0 0.55rem;
        font-size: 0.9rem;
    }

    .kt-header__topbar-item.kt-header__topbar-item--user
        .kt-header__topbar-user
        img {
        max-height: 36px;
        border-radius: 50px;
    }

    .kt-header__topbar-item.kt-header__topbar-item--user
        .kt-header__topbar-user
        .kt-badge.kt-badge--username {
        height: 30px;
        width: 30px;
    }

    .kt-header__topbar-user img {
        -ms-flex-item-align: center;
        align-self: center;
        max-height: 34px;
        border-radius: 4px;
    }

    .kt-header__topbar-user img {
        max-height: 30px;
    }

    .kt-header__topbar-item
        .kt-header__topbar-wrapper
        .kt-badge.kt-badge--notify {
        position: absolute;
        right: 50%;
        margin-right: -2px;
        top: 14px;
    }

    .kt-header__topbar-item .kt-header__topbar-icon {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-item-align: center;
        align-self: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        height: 38px;
        width: 38px;
        cursor: pointer;
        -webkit-transition: all 0.3s;
        transition: all 0.3s;
        border-radius: 4px;
    }

    .app-loyality-modal {
        height: 38px !important;
        width: 38px !important;
        margin: 0 !important;
    }

    .chat-mini-icon {
        height: 38px !important;
        width: 38px !important;
    }

    .kt-header__topbar-item .kt-header__topbar-icon {
        background: #fff;
        border-radius: 50px;
        border: 1px solid #ebedf2;
    }

    .kt-header__topbar-item .kt-header__topbar-icon i {
        -webkit-transition: all 0.3s;
        transition: all 0.3s;
        font-size: 1.4rem;
        color: #fff;
    }

    .kt-header__topbar-item .kt-header__topbar-icon svg {
        height: 24px;
        width: 24px;
    }

    .kt-header-mobile__toolbar .kt-header__topbar-item {
        margin: 0 0.5rem 0 0;
        cursor: pointer;
    }

    .kt-header__topbar-wrapper::after {
        display: none;
    }

    .kt-header__topbar-item.kt-header__topbar-item--user
        .kt-header__topbar-user
        .kt-header__topbar-username {
        color: #000;
    }

    .NotificationBill .kt-header__topbar-item .kt-header__topbar-icon > img {
        filter: invert(0.5);
    }

    .kt-header-mobile__toolbar
        .kt-header__topbar-item--user
        .dropdown-menu.dropdown-menu-anim {
        top: 25px !important;
        left: 0 !important;
    }

    .NotificationBill + .dropdown-menu.dropdown-menu-anim {
        left: -100% !important;
    }

    .kt-custom-notification::after {
        left: 28px;
    }

    .kt-custom-notification {
        overflow-y: auto !important;
    }
}

@media (max-width: 767px) {
    .kt-footer .kt-footer__copyright {
        flex-direction: column;
        align-items: center;
        gap: 0.3rem;
    }
}

/* New */

.image-holder-wrapper {
    position: relative;

    height: 160px;
    background: rgb(241 243 246);
    padding: 10px;
    border-radius: 20px;
    display: flex;
    align-items: center;
    margin-bottom: 1.5rem;
}

.image-holder-wrapper img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    margin: 0 auto;
    object-fit: contain;
}

.image-holder-wrapper a {
    display: block;
    max-width: 100%;
    height: 100%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.image-holder-wrapper iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
    pointer-events: none;
}

.image-holder-wrapper.mini {
    min-width: 200px;
    width: 250px;
    margin: 0 auto;
}

.image-holder-wrapper.mini img {
    border-radius: 8px;
    background: #fff;
    padding: 10px;
}

/* icon-pdf.svg - icon-doc.svg */

.image-holder-wrapper.mini img[src$="icon-pdf.svg"],
.image-holder-wrapper.mini img[src$="icon-doc.svg"],
.image-holder-wrapper.mini img[src$="icon-txt.svg"] {
    width: 70px;
}

.actions_buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    position: absolute;
    left: 15px;
    top: 15px;
}

.actions_buttons a {
    display: inline-block;
    width: 40px;
    height: 40px;
    background-color: #fff;
    color: #000;
    text-align: center;
    line-height: 40px;
    border-radius: 50px;
    background: rgb(220 224 231);
    color: #fff;
}

.actions_buttons a svg {
    pointer-events: none;
}

.itemOptinos .dropdown {
    position: relative;
}

.itemOptinos .dropdown-toggle {
    position: relative;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 0;
    background: #f5f7f9;
    border-radius: 50px;
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
}

.itemOptinos .dropdown-toggle i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.itemOptinos .dropdown .dropdown-menu {
    border-radius: 10px;
    top: 10px !important;
}

.itemOptinos .dropdown .dropdown-menu {
    left: 50% !important;
    right: auto !important;
}

.itemOptinos .dropdown-toggle::after {
    display: none;
}

.itemOptinos .dropdown-menu {
    left: 0 !important;
    right: auto !important;
}

/* .itemOptinos .dropdown .dropdown-menu {
    border-radius: 10px;
    top: 20px !important;
} */

.newUploading .text {
    margin: 0 auto;
    max-width: 100%;
    height: 100%;
    width: max-content;
}

.newUploading .text p {
    margin-bottom: 0;
    margin-top: 10px;
}

.newUploading .upload-btn-wrapper .btn {
    opacity: 0;
}

.newUploading .receipt_image_wrap {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.newUploading .receipt_image_wrap .btn {
    cursor: pointer;
    border: 1px solid #e1ab39;
    color: #fff;
    border-radius: 50px;
    font-size: 14px;
    width: 40px;
    height: 40px;
    padding: 0;
    text-align: center;
    line-height: 35px;
    background-color: var(--globalColor);
    border-color: var(--globalColor);
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: -10px;
    left: -10px;
}

.newUploading .receipt_image_wrap .btn i {
    padding: 0;
}

.copyBtn {
    position: relative;
    color: var(--globalColor);
    display: inline-block;
    /* color: #939ca9; */
}

.copyBtn.link {
    /* color: #0d6efd; */
    color: #000;
}

.copyBtn i {
    line-height: 1.8 !important;
    color: #000;
}

.copyBtn.copied::before {
    content: "تم النسخ";
    position: absolute;
    top: -100%;
    left: 50%;
    white-space: nowrap;
    transform: translateX(-50%);
}

.copyBtn:hover {
    color: inherit;
}

#membershipNumber::selection {
    background-color: transparent;
    background: transparent;
}

.membershipNumber::selection {
    background-color: transparent;
    background: transparent;
}

.select2-container--default .select2-results__option {
    white-space: nowrap;
    padding: 10px 1.3rem;
}

/* New Modal Style */
#active_modal .modal-body,
.activeModalStyle .modal-body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2.5rem 2.25rem;
}

#active_modal .modal-body .content,
.activeModalStyle .modal-body .content {
    display: flex;
    align-items: center;
    gap: 2rem;
}

#active_modal .modal-body .content .msg,
.activeModalStyle .modal-body .content .msg {
    text-align: right;
}

#active_modal .modal-body .content .msg p,
.activeModalStyle .modal-body .content .msg p {
    margin-bottom: 0;
}

#active_modal .modal-header,
.activeModalStyle .modal-header {
    border-bottom: 0;
    padding-bottom: 0;
}

#active_modal .modal-body .swal2-icon.swal2-warning,
.activeModalStyle .modal-body .swal2-icon.swal2-warning {
    border-color: transparent;
    color: inherit;
}

#active_modal .modal-body .swal2-styled,
.activeModalStyle .modal-body .swal2-styled {
    min-width: 100px;
    letter-spacing: -1px;
}

#active_modal .modal-body .swal2-styled.swal2-confirm,
.activeModalStyle .modal-body .swal2-styled.swal2-confirm {
    background-color: rgba(3, 148, 116, 0.1) !important;
    border-radius: 5px;
    color: #039474;
}

#active_modal .modal-body .swal2-styled.swal2-cancel,
.activeModalStyle .modal-body .swal2-styled.swal2-cancel {
    background-color: rgba(253, 100, 96, 0.1) !important;
    border-radius: 5px;
    color: #eb6460 !important;
}

#active_modal .modal-body .swal2-icon::before,
.activeModalStyle .modal-body .swal2-icon::before {
    display: none;
}

.swal2-icon::before {
    display: flex;
    align-items: center;
    height: auto;
    font-size: 3.75em;
    position: absolute;
    top: 60%;
    transform: translateY(-50%);
}

@media (max-width: 767px) {
    #active_modal .modal-body,
    .activeModalStyle .modal-body {
        flex-flow: column;
    }

    #active_modal .modal-body .content,
    .activeModalStyle .modal-body .content {
        flex-flow: column;
        gap: 0;
    }

    #active_modal .modal-body .content .msg,
    .activeModalStyle .modal-body .content .msg {
        text-align: center;
        margin-bottom: 1rem;
    }
}

.kt-header__dark__icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-item-align: center;
    align-self: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;

    margin: 0 10px;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    border-radius: 15px;
}

.kt-header__dark__icon .toggle-theme {
    height: 44px;
    width: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.kt-header__dark__icon i {
    color: #6c7293;
}

.switch-dark-theme {
    font-size: 17px;
    position: relative;
    display: inline-block;
    width: 60px;
    height: 31px;
    margin-top: 1.1rem;
    margin-left: 1rem;
}

.switch-dark-theme input {
    opacity: 0;
    width: 0;
    height: 0;
}

.switch-dark-theme .slider {
    position: absolute;
    cursor: pointer;
    inset: 0;
    background-color: #3a3a3a;
    transition: 0.4s;
    border-radius: 300px;
}

.switch-dark-theme .slider:before {
    position: absolute;
    content: "";
    height: 24px;
    width: 24px;
    border-radius: 20px;
    left: 3.5px;
    bottom: 3.5px;
    z-index: 2;
    background-color: #fff;
    transition: 0.4s;
}

.switch-dark-theme .sun svg {
    position: absolute;
    top: 6px;
    right: 6px;
    z-index: 1;
    color: #fff;
}

.switch-dark-theme .moon svg {
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 1;
    color: #fff;
}

.switch-dark-theme .input:checked + .slider {
    background-color: #cecece;
}

.switch-dark-theme .input:focus + .slider {
    box-shadow: 0 0 1px #cecece;
}

.switch-dark-theme .input:checked + .slider:before {
    transform: translate(29px);
}

.switch-dark-theme.light .slider {
    background-color: #ebeff2;
}

.switch-dark-theme.light svg {
    color: #bcc6d0;
}

.switch-dark-theme.light .slider::before {
    left: auto;
    right: 3.5px;
}

.switch-dark-theme.light .input:checked + .slider:before {
    transform: translate(-29px);
}

.switch-dark-theme.dark .slider::before {
    left: 4px;
    right: auto;
}

@media (max-width: 576px) {
    .switch-dark-theme {
        margin-top: 0;
    }

    .kt-grid__item.kt-grid__item--fluid.kt-grid.kt-grid--hor {
        margin-top: 0 !important;
    }
}

@media (max-width: 1024px) {
    .kt-header-mobile__toolbar .kt-header__topbar-item {
        margin: 0 0.5rem 0 0;
        cursor: pointer;
        display: flex;
    }
}

.final_total {
    background: #f5f7f9;
    padding: 15px 25px 15px;
    border-radius: 5px;
}

.storeModalBtn {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    padding: 0;
    width: 40px;
    height: 40px;
    border: 1px solid #ebedf2;
    border-radius: 50px;
    font-size: 20px;
    margin: 0 10px;
}

.storeModalBtn:hover {
    color: #000;
}

/* Dark theme */

.toggle-theme {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    padding: 0;
    width: 40px;
    height: 40px;
    border: 1px solid #ebedf2;
    border-radius: 50px;
}

.toggle-theme .icon-sun {
    display: none;
}

.toggle-theme .switchy {
    margin-bottom: 0;
}

.toggle-theme .icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    color: #000;
}

.toggle-theme .icon i {
    font-size: 1.4rem;
    margin-left: 0;
}

.toggle-theme .icon svg {
    width: 20px;
    height: 20px;
    margin-left: 10px;
}

.switchy {
    display: inline-flex;
    position: relative;
    white-space: nowrap;
    cursor: pointer;
    align-items: center;
    gap: 10px;
}

.switchy input:checked ~ span {
    background: #4cd964;
}

.switchy input:checked ~ span {
    border: 1px solid #4cd964;
}

.switchy span:before {
    background: #e9e9ea;
}

.switchy span {
    border: 1px solid #e9e9ea;
}

.switchy span:after {
    top: 1px;
    box-shadow: none;
}

.switchy-sm input:checked ~ span:after {
    transform: translate3d(12.5px, 0, 0);
}

.switchy-sm span {
    height: 23.5px;
}

/* .switchy span {
    margin-left: 10px;
} */

.toggle-theme:hover {
    background-color: transparent;
}

/* Statics */
.custom_card_item {
    display: block !important;
}

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

.gendar-progress-chart {
    max-width: 600px;
    margin: 1rem auto 0;
}

.gendarProgress {
    flex: 0.9;
    height: 2.2rem;
    border-radius: 50px;
    direction: ltr;
    background-color: #eff1f6;
}

.gendarProgress .progress-bar {
    background-color: #eff1f6;
}

.gendarProgress .mens {
    background-color: #9f5ad5;
}

.gendarProgress .womans {
    background-color: #89c5f1;
}

.gendarProgress .others {
    background-color: #d95a47;
}

.progress_labels {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 1rem;
}

.progress_labels .label_item {
    display: flex;
    align-items: center;
}

.progress_labels .label_item .circle {
    position: relative;
    display: inline-block;
    cursor: pointer;
    margin-right: 3px;
    height: 12px;
    width: 12px;
    border-radius: 12px;
    margin-left: 10px;
}

.progress_labels .label_item .circle.mens {
    background: #9f5ad5;
}

.progress_labels .label_item .circle.womans {
    background: #89c5f1;
}

.progress_labels .label_item .circle.others {
    background: #d95a47;
}

/* Graph Bar */

.mini-graph-bars {
    background: transparent;
    position: relative;
    height: 100px;
    width: 270px;
    margin: 0 auto 1rem;
}

.mini-graph-bars .bar {
    background-color: #eff1f5;
    width: 20px;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
}

.mini-graph-bars .number {
    position: absolute;
    top: -20px;
    font-size: 10px;
    left: 50%;
    transform: translateX(-50%);
}

.mini-graph-bars .text {
    position: absolute;
    bottom: -20px;
    font-size: 9px;
    left: 50%;
    transform: translateX(-50%);
}

.mini-graph-bars .bar:nth-of-type(2) {
    left: 49.5px;
}

.mini-graph-bars .bar:nth-of-type(3) {
    left: 99px;
}

.mini-graph-bars .bar:nth-of-type(4) {
    left: 148.5px;
}

.mini-graph-bars .bar:nth-of-type(5) {
    left: 198px;
}

.mini-graph-bars .bar:nth-of-type(6) {
    left: 247.5px;
}

.mini-graph-bars .bar:nth-of-type(7) {
    left: 297px;
}

.mini-graph-bars .bar:nth-of-type(8) {
    left: 346.5px;
}

.mini-graph-bars .bar:nth-of-type(9) {
    left: 396px;
}

.mini-graph-bars .bar-inner {
    background-color: #fde100;
}

.mini-graph-bars .bar {
    position: absolute;
    bottom: 0;
    left: 0;
}

.mens_tshirts_statics,
.womans_tshirts_statics {
    padding: 1rem 1rem;
}

.womans_tshirts_statics .mini-graph-bars .bar-inner {
    background-color: #3b3940;
}

.mens_tshirts_statics .info,
.womans_tshirts_statics .info {
    text-align: center;
    margin-top: 3rem;
}

.mens_tshirts_statics .info p,
.womans_tshirts_statics .info p {
    font-size: 14px;
}

.mens_tshirts_statics .info h3,
.womans_tshirts_statics .info h3 {
    background-color: #eff1f7;
    color: #000000;
    display: inline-block;
    width: 100%;
    border-radius: 50px;
    padding: 0.5rem 1.2rem;
    max-width: fit-content;
    margin: 0px 0 0;
    font-size: 17px;
}

/* Countries  */

.countries_wrapper {
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ebedf2;
    padding: 20px;
    border-radius: 8px;
}

.countriesSearchWrap {
    width: 100%;
}

.countriesSelectWrap {
    max-height: 180px;
    overflow-y: scroll;
    overflow-x: hidden;
    margin: 10px 0 0;
}

.countriesSelectWrap .checkbox label {
    width: 100%;
}

.countriesSelectWrap .checkbox {
    padding: 10px 10px;
}

.countriesSelectWrap .checkbox input[type="checkbox"] {
    position: absolute;
}

.countriesSelectWrap label img {
    margin-left: 5px;
    width: 25px;
    position: relative;
    box-shadow: 0 10px 30px rgb(0 0 0 / 5%);
}

.countriesSelectWrap::-webkit-scrollbar {
    width: 3px;
    height: 5px;
}

.countriesSelectWrap::-webkit-scrollbar-track {
    background: #ffffff;
    border-radius: 5px;
}

.countriesSelectWrap::-webkit-scrollbar-thumb {
    background-color: #f6f7fd;
    border-radius: 5px;
    height: 10px;
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}

.countriesSelectWrap::-webkit-scrollbar-thumb:hover {
    background-color: #f6f7fd;
}

.country_flag {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    white-space: nowrap;
}

/* ITI */
.iti {
    min-width: auto;
    width: 100%;
}

.iti__country-list {
    left: 0;
    border: 1px solid #f0f2f5;
    box-shadow: 3px 1px 15px 3px hsl(0deg 0% 93% / 80%);
    border-radius: 8px;
}

.iti__arrow {
    background-size: 47%;
}

/* Sa */

.iti__flag.iti__sa {
    height: 14px;
    background-position: center center;
    background-size: cover;
    background-image: url(https://flagpedia.net/data/flags/h120/sa.webp);
}

/* Image Loader */

.has-spinner-loader {
    position: relative;
}

.has-spinner-loader.loading .button_text {
    opacity: 0;
}

.has-spinner-loader.loading::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 18px;
    margin: -8px 0 0 -10px;
    border-radius: 50%;
    border: 2px solid #000;
    border-top-color: transparent;
    animation: spin 1s linear infinite;
    z-index: 2;
}

/* .has-spinner-loader.loading::after {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.6);
    z-index: 1;
} */

.has-spinner-loader.loading .upload-btn-wrapper .btn {
    display: none;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.less-padding > div {
    padding: 0 0 0 6px;
}

.time_wrap {
    white-space: nowrap;
}

.time_wrap p {
    font-size: 14px;
}

/* Radius Btns */

.btn-main,
.btn-outline-metal,
.btn-outline-info,
.btn-label-brand,
.btn.btn-label-brand,
.btn-secondary,
.btn-outline-danger,
.btn-danger {
    border-radius: 10px;
}

/* .btn-secondary {
    color: #000;
} */

.btn-main,
.btn-secondary,
.btn-danger {
    height: 40px;
    padding: 0.75rem 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
}

.btn-main .button_text,
.btn-secondary .button_text,
.btn-danger .button_text {
    height: 22px;
}

.btn-secondary.has-spinner-link.loading::before {
    filter: invert(1);
}

.width-max {
    max-width: max-content;
}

.action-list
    .btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all).btn-sm {
    padding: 9px 10px;
    font-size: 14px;
}

@media (max-width: 576px) {
    .btn-main,
    .btn-secondary,
    .btn-danger {
        white-space: nowrap;
    }

    .printerBtn {
        height: auto;
        font-size: 12px;
        padding: 0.75rem 15px;
    }

    .printerBtn i {
        padding-left: 5px;
    }
}

/*  Switch */

.switch {
    /* Adjust these values as needed */
    --button-width: 3.5em;
    --button-height: 2em;
    --toggle-diameter: 1.5em;
    --button-toggle-offset: calc((2em - 1.5em) / 2);
    /* Calculate the offset */
    --toggle-shadow-offset: 10px;
    --toggle-wider: 3em;
    --color-grey: #cccccc;
    --color-green: #000;
    margin-bottom: 0;
}

.slider {
    display: inline-block;
    width: 40px;
    height: 23px;
    background-color: #e7e8ef;
    /* Same as --color-grey */
    border-radius: 1em;
    /* Half of --button-height */
    position: relative;
    transition: 0.3s all ease-in-out;
    cursor: pointer;
}

.slider::after {
    content: "";
    display: inline-block;
    width: 1.25em;
    /* Same as --toggle-diameter */
    height: 1.25em;
    /* Same as --toggle-diameter */
    background-color: #fff;
    border-radius: 0.75em;
    /* Half of --toggle-diameter */
    position: absolute;
    top: 0.25em;
    /* Same as --button-toggle-offset */
    transform: translateX(17px);
    box-shadow: 10px 0 40px rgba(0, 0, 0, 0.1);
    /* Same as --toggle-shadow-offset */
    transition: 0.3s all ease-in-out;
    cursor: pointer;
}

.switch input[type="checkbox"]:checked + .slider {
    background-color: var(--globalColor);
    /* Same as --color-green */
}

.switch input[type="checkbox"]:checked + .slider::after {
    transform: translateX(0px);
    box-shadow: -10px 0 40px rgba(0, 0, 0, 0.1);
    /* Same as --toggle-shadow-offset */
}

.switch input[type="checkbox"] {
    display: none;
}

.switch input[type="checkbox"]:active + .slider::after {
    width: 3em;
    /* Same as --toggle-wider */
}

.switch input[type="checkbox"]:checked:active + .slider::after {
    transform: translateX(1.5em);
    /* Adjusted to move left */
}

/*  */

.card {
    border-radius: 15px;
}

.card-title {
    font-size: 15px;
    font-weight: 700;
    color: #000;
    margin-bottom: 1.3rem;
}

.card-title i {
    line-height: 1;
}

.mini-chart-item {
    margin-bottom: 14px;
    border-radius: 15px;
}

.mini-chart-item .card-body {
    padding: 14px;
}

@media (max-width: 576px) {
    .mini-chart-item {
        overflow: hidden;
    }
}

.card.height-same {
    margin-bottom: 14px;
}

.mini-chart-item.height,
.card.height-same {
    height: calc(100% - 14px);
}

.app-settings-mode .collapse.show .mini-chart-item.height,
.app-settings-mode .collapse.show .card.height-same,
.app-settings-mode .collapse .mini-chart-item.height,
.app-settings-mode .collapse .card.height-same {
    box-shadow: none !important;
    border: 0 !important;
    background-color: transparent !important;
}
.mini-chart-item.height p i {
    vertical-align: middle;
}

.latest-subscriptions {
    min-height: 456px;
    max-height: 469px;
    overflow: auto;
}

.latest-subscriptions tbody td {
    padding: 1.5rem 0.4rem;
}

.latest-subscriptions .top_sub_head {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.latest-subscriptions .more-arrow {
    font-size: 14px;
    color: #000;
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 1.5rem;
}

.latest-subscriptions .more-arrow i {
    font-size: 14px;
}

.mini-chart-item h3 {
    padding: 0;
    margin-bottom: 20px;
    font-size: 14px;
    font-weight: 700;
    color: #000;
    height: 37px;
    display: flex;
    align-items: center;
}

.app-settings-mode .info-field {
    display: flex;
    align-items: center;
    /* justify-content: space-between; */
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px solid #f1f2f6;
}

.app-settings-mode .info-field:last-child {
    border-bottom: 0;
}

.app-settings-mode .info-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-weight: 700;
    font-size: clamp(14px, 1.4vw, 15px);
    color: #0f172a;
    white-space: nowrap;
}

.app-settings-mode .info-value {
    /* flex: 1; */
    font-size: clamp(13px, 1.3vw, 14px);
    color: #0f172a;
    word-break: break-word;
    display: flex;
    align-items: center;
}

.app-settings-mode .info-value .copyBtn {
    margin-inline-start: 8px;
    margin-left: 8px;
    display: inline-flex;
    align-items: center;
}

@media (max-width: 576px) {
    .app-settings-mode .info-field {
        align-items: flex-start;
        gap: 10px;
    }

    .app-settings-mode .info-label {
        font-size: clamp(14px, 3vw, 15px);
    }

    .app-settings-mode .info-value {
        font-size: clamp(13px, 2.7vw, 14px);
    }
}

.circle-graph,
.circle-graph-2 {
    margin: 20px 15px 0;
    position: relative;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    display: flex;
    justify-content: center;
    align-items: center;
}

.circle-graph > p,
.circle-graph-2 > p {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    color: #111;
}

@media (max-width: 567px) {
    .kt-aside__brand {
        height: 70px !important;
    }
}

table td > a {
    color: #0d6efd;
}

.apexcharts-legend-text {
    padding-left: 0;
    margin-left: 0;
    padding-right: 10px;
    margin-right: 0;
}

.apexcharts-xaxistooltip,
.apexcharts-yaxistooltip {
    background: transparent !important;
    border: 1px solid #fff !important;
}

.apexcharts-xaxistooltip-bottom:before {
    border-bottom-color: #fff !important;
}

.apexcharts-xaxistooltip-text {
    display: none !important;
}

.apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title {
    display: none !important;
}

.apexcharts-tooltip-series-group {
    text-align: right !important;
    justify-content: start !important;
}

.apexcharts-tooltip-marker {
    margin-right: 0 !important;
    margin-left: 10px !important;
}

/* Rounded-square tooltip marker — matches the legend square markers exactly
   (16×16, border-radius 5px, series colour). ApexCharts 4 draws the marker as a
   unicode glyph via ::before and colours the element with an inline
   `color: <series>`, so a glyph can't take a border-radius. We drop the glyph
   and paint ::before as a real box (background = currentColor = the series
   colour) so it can have rounded corners. Global → every chart tooltip unified. */
.apexcharts-tooltip-marker::before {
    content: "" !important;
    display: block;
    width: 100%;
    height: 100%;
    background-color: currentColor;
    border-radius: 5px;
    transform: none;
}

.height_div .table-responsive {
    min-height: 300px;
    /* max-height: 500px; */
}

.select2-container .select2-selection--single {
    background-color: #fff;
    max-width: 100%;
    padding-left: 17px;
    height: 44px;
}

.pagination_wrap .select2-container .select2-selection--single {
    height: 33px;
}

.pagination_wrap .select2-container .select2-selection--single {
    max-width: 100%;
    padding-left: 0;
}

.pagination_wrap
    .select2-container--default
    .select2-selection--single
    .select2-selection__arrow,
.pagination_wrap
    .select2-container--default
    .select2-selection--multiple
    .select2-selection__arrow {
    left: -6px;
    top: 50%;
}

.pagination_wrap
    .select2-container--default
    .select2-selection--single
    .select2-selection__arrow,
.pagination_wrap
    .select2-container--default
    .select2-selection--multiple
    .select2-selection__arrow {
    font-size: 10px;
}

.pagination_wrap
    .select2-container
    .select2-selection--single
    .select2-selection__rendered {
    text-overflow: unset;
    padding-left: 22px;
    padding-right: 7px;
    text-align: center;
    padding-top: 7px;
}

form .select2-container .select2-selection--single {
    /* height: calc(2em + 1rem + 2px); */
    height: calc(2.1em + 1.3rem + 2px);
}

form
    .select2-container--default
    .select2-selection--single
    .select2-selection__rendered {
    padding: 1rem;
}

.select2-container--default
    .select2-selection--single
    .select2-selection__rendered
    .custom-user-select {
    position: relative;
    top: -4px;
}

.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border-radius: 10px;
}

.select2-dropdown {
    border-radius: 12px;
}

.select2-container--default
    .select2-results__option.select2-results__option--highlighted {
    background: #f7f8fa;
    border-radius: 10px;
    color: #000;
}

.input-group
    > .select2-hidden-accessible:first-child
    + .select2-container
    > .selection
    .select2-selection--single {
    border-top-left-radius: 7px;
    border-bottom-left-radius: 7px;
}

.select2-container--default
    .select2-selection--single
    .select2-selection__arrow {
    top: 53%;
}

.search-group input.form-control {
    height: 40px;
}

.search-group select.form-control {
    height: 40px;
}

.search-group button {
    display: flex;
    align-items: center;
    padding: 0 1rem;
}

.kt-user-card .kt-user-card__avatar .kt-badge,
.kt-user-card .kt-user-card__avatar img {
    border-radius: 50px;
}

.kt-header__topbar
    .kt-header__topbar-item.kt-header__topbar-item--user
    .kt-header__topbar-user
    img {
    border-radius: 50px;
    max-height: 44px;
}

.kt-header__topbar
    .kt-header__topbar-item.kt-header__topbar-item--user
    .kt-header__topbar-user {
    padding: 0 4px;
}

.btn.btn-sm svg,
.btn-group-sm > .btn svg {
    margin-left: 0.35rem;
    vertical-align: bottom;
}

.kt-aside__brand,
.kt-aside,
.kt-aside-menu {
    background: var(--side-background);
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-text,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-text {
    color: var(--side-font-color) !important;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item .kt-menu__link-icon img {
    filter: invert(0);
}

.kt-aside-menu .kt-menu__nav .kt-menu__item > .kt-menu__heading,
.kt-aside-menu .kt-menu__nav .kt-menu__item > .kt-menu__link {
    border: 0 !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__link {
    background: transparent;
    border: 0;
    background: var(--side-active-bg-second);
    /* #F5F7F9;*/
    border-radius: 10px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__heading
    .kt-menu__ver-arrow,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__link
    .kt-menu__ver-arrow {
    color: var(--side-font-color);
    position: relative;
    left: -5px;
    font-size: 10px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-icon::before,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-icon::before {
    content: "";
    width: 8px;
    height: 8px;
    background-color: transparent;
    display: block;
    border-radius: 50px;
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__heading
    .kt-menu__link-icon::before,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__link
    .kt-menu__link-icon::before {
    content: "";
    width: 8px;
    height: 8px;
    background-color: #fff;
    display: block;
    border-radius: 50px;
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-icon::before {
    content: "";
    width: 8px;
    height: 8px;
    background-color: transparent;
    display: block;
    border-radius: 50px;
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__link
    .kt-menu__link-icon::before {
    content: "";
    width: 8px;
    height: 8px;
    background-color: #fff;
    display: block;
    border-radius: 50px;
    position: absolute;
    top: 50%;
    right: -15px;
    transform: translateY(-50%);
}

.block-line {
    background-color: #000;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link {
    background: transparent;
    border: 0;
    background: var(--side-active-bg-second);
    /* #F5F7F9;*/
    border-radius: 10px;
    padding-right: 30px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link
    .kt-menu__link-icon {
    color: var(--side-icon-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__link {
    background: transparent;
    border: 0;
    background: var(--side-active-bg-second);
    /* #F5F7F9;*/
    border-radius: 10px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__heading
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__link
    .kt-menu__link-icon {
    color: var(--side-icon-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__link
    .kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__link
    .kt-menu__link-icon {
    color: #000 !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading
    .kt-menu__ver-arrow,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link
    .kt-menu__ver-arrow {
    color: var(--side-font-color) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__heading
    .kt-menu__ver-arrow,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    > .kt-menu__link
    .kt-menu__ver-arrow {
    color: var(--side-font-color) !important;
}

.kt-aside-menu .kt-menu__nav .kt-menu__item > .kt-menu__heading,
.kt-aside-menu .kt-menu__nav .kt-menu__item > .kt-menu__link {
    border: 1px solid transparent;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-text,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-text {
    color: var(--side-font-color) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link {
    border: 0 !important;
    background: var(--side-active-bg-second) !important;
    /* #F5F7F9;*/
    border-radius: 10px;
    padding-right: 35px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading
    .kt-menu__link-text,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link
    .kt-menu__link-text {
    color: var(--side-font-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading
    .kt-menu__link-icon
    svg
    g
    [fill],
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link
    .kt-menu__link-icon
    svg
    g
    [fill] {
    fill: var(--side-font-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__heading
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__link
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__link
    .kt-menu__link-icon
    svg
    g
    [fill] {
    fill: var(--side-font-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__link {
    background: transparent;
    border: 0;
    background: rgba(255, 255, 255, 0.05);
    margin: 0 5px;
    border-radius: 10px;
}

.kt-aside-menu .kt-menu__nav .kt-menu__link-icon {
    position: relative;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item > .kt-menu__heading,
.kt-aside-menu .kt-menu__nav > .kt-menu__item > .kt-menu__link {
    min-height: 50px;
    height: auto;
    padding: 0px 25px 0px 25px;
}

[dir="ltr"] .kt-aside-menu .kt-menu__nav > .kt-menu__item > .kt-menu__heading,
[dir="ltr"] .kt-aside-menu .kt-menu__nav > .kt-menu__item > .kt-menu__link {
    padding: 0px 15px 0px 15px;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item > .kt-menu__link,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__submenu
    .kt-menu__subnav
    > .kt-menu__item
    > .kt-menu__link {
    transition: all 300ms ease-in-out;
}

.kt-aside-menu .kt-menu__nav .kt-menu__item {
    height: 50px;
    margin-bottom: 0.3rem;
}

.kt-aside-menu .kt-menu__nav > .kt-menu__item .kt-menu__submenu .kt-menu__item {
    margin-top: 0.3rem;
}

.kt-aside-menu .kt-menu__nav .kt-menu__item.kt-menu__item--open {
    height: auto;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__heading,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link {
    min-height: 50px;
    height: auto;
    padding: 0px 25px 0px 10px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__submenu
    .kt-menu__subnav
    > .kt-menu__item
    > .kt-menu__link {
    padding-right: 30px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-text,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-text {
    font-size: 14px;
    white-space: nowrap;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-text,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-text {
    font-size: 14px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__link
    .kt-menu__link-text {
    color: var(--side-font-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-text,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-text {
    font-weight: 500;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading
    .kt-menu__link-text,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link
    .kt-menu__link-text {
    color: var(--side-font-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--open
    .kt-menu__link-text {
    color: var(--side-font-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    .kt-menu__link-icon {
    font-size: 19.5px;
    color: #000 !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-icon
    svg
    g
    [fill],
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-icon
    svg
    g
    [fill] {
    fill: var(--side-icon-color) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-icon {
    color: var(--side-icon-color) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-icon
    svg,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-icon
    svg {
    width: 24.5px;
    height: 14.5px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    .kt-menu__link-icon {
    color: var(--side-icon-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__heading
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(
        .kt-menu__item--here
    ):not(.kt-menu__item--active):hover
    > .kt-menu__link
    .kt-menu__link-icon {
    fill: var(--side-icon-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    .kt-menu__subnav
    .kt-menu__item.kt-menu__item--active
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    .kt-menu__subnav
    .kt-menu__item.kt-menu__item--active
    .kt-menu__link-text {
    color: var(--side-icon-color) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__heading
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__link
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item.kt-menu__item--active
    > .kt-menu__link
    .kt-menu__link-text {
    color: var(--side-font-color-active) !important;
}

@media (min-width: 1025px) {
    .kt-aside__brand
        .kt-aside__brand-tools
        .kt-aside__brand-aside-toggler
        svg
        g
        [fill] {
        -webkit-transition: fill 0.3s ease;
        transition: fill 0.3s ease;
        fill: #292d32;
    }
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-icon {
    font-size: 17.5px;
    color: var(--side-icon-color) !important;
    height: 45px;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__heading
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item.kt-menu__item--active
    > .kt-menu__link
    .kt-menu__link-icon {
    color: var(--side-icon-color-active) !important;
}

.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__heading
    .kt-menu__link-icon,
.kt-aside-menu
    .kt-menu__nav
    > .kt-menu__item
    .kt-menu__submenu
    .kt-menu__item
    > .kt-menu__link
    .kt-menu__link-icon {
    font-size: 17.5px;
}

.kt-header
    .kt-header__topbar
    .kt-header__topbar-item.kt-header__topbar-item--user
    .kt-header__topbar-user
    .kt-header__topbar-username {
    align-items: center;
    color: #000;
    letter-spacing: -0.6px;
}

.kt-header__topbar-username {
    position: relative;
    flex-direction: column;
    align-items: flex-start !important;
    padding: 0 0.55rem 0 1.5rem !important;
}

.user-text-arrow {
    font-size: 10px;
    position: absolute;
    left: 4px;
    bottom: 4px;
}

.select2 + .arrow-icon,
.select2-container + .arrow-icon {
    display: none;
}

.arrow-icon {
    position: absolute;
    top: 50%;
    left: 13px;
    transform: translateY(-50%);
    color: #000 !important;
    font-size: 12px !important;
    z-index: 22;
    pointer-events: none;
}

#toast-container > div {
    border-radius: 13px !important;
}

.toast .toast-message {
    font-size: 14px;
    font-weight: 500;
}

.profile-dropdown {
    border-radius: 18px;
    padding: 0px !important;
    width: 280px;
    left: 8px !important;
    top: 15px !important;
    box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.08);
    border: 1px solid #f4f4f4;
    background-color: #fff;
}

.profile-dropdown .kt-notification .kt-notification__item {
    padding: 16px 20px 16px 20px;
}

.dropdown-menu > li > a > i:before,
.dropdown-menu > .dropdown-item > i:before {
    line-height: 1.5;
}

.btn-group > .btn,
.btn-group-vertical > .btn {
    align-items: center;
    display: flex;
    line-height: normal;
}

.nav-link.dropdown-toggle:after,
.btn.dropdown-toggle:after {
    margin-right: 0.5rem;
    margin-left: 0;
    top: 1px;
}

#filterBtnGroup[aria-expanded="true"]::after {
    transform: rotate(180deg);
}

.dropdown-menu {
    border-radius: 10px;
}

@media (max-width: 576px) {
    .dropdown-menu {
        left: 0 !important;
    }
}

.dropdown-item:active {
    color: #6c7293;
    text-decoration: none;
    background-color: #f7f8fa;
    border-color: #f7f8fa;
}

.apexcharts-text tspan {
    font-weight: 600;
    /* font-size: 10px; */
}

.ck.ck-reset,
.ck.ck-reset_all,
.ck.ck-reset_all * {
    background: #f6f8fa;
}

.ck.ck-toolbar {
    border: 1px solid #ebedf2 !important;
}

.ck.ck-editor__main > .ck-editor__editable:not(.ck-focused) {
    border-color: #ebedf2 !important;
}

.ck.ck-editor__editable:not(.ck-editor__nested-editable).ck-focused {
    border: 1px solid #ebedf2 !important;
    box-shadow: none !important;
}

.ck.ck-toolbar {
    background: #f6f8fa !important;
}

.ck.ck-icon {
    font-size: 8px !important;
}

.ck.ck-button,
a.ck.ck-button {
    color: #000 !important;
}

.ck.ck-toolbar .ck.ck-toolbar__separator {
    background: #ebedf3 !important;
}

:root {
    --ck-border-radius: 5px !important;
    --ck-font-face: "Ping AR + LT", Arial, Tahoma, Verdana, Sans-Serif !important;
}

/*
    Table New Design
*/
.table_card_head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    padding: 30px 15px;
    color: #000;
    border-radius: 14px;
    margin-bottom: 10px;
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    background: #f5f7f9;

    border: 1px solid #f0f2f5;
    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
    -webkit-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}

.table_card .table-card-item.markIcon,
.table_card_head .table-card-item.markIcon {
    width: 10%;
}

.table_card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    padding: 10px 15px;
    color: #000;
    border-radius: 14px;
    margin-bottom: 10px;
    width: 100%;
    text-align: center;
    font-size: 14px;
    background: #fff;

    border: 1px solid #f0f2f5;
    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
    -webkit-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}

.table_card:last-child {
    margin-bottom: 0;
}

.table_card .table-card-item .checkbox label::before,
.table_card_head .table-card-item .checkbox label::before {
    border: 1px solid #bdbbbb;
}

.table_card .table-card-item,
.table_card_head .table-card-item {
    width: 20%;
    font-size: 14px;
}

.table_card .table-card-item.width-10,
.table_card_head .table-card-item.width-10 {
    width: 10%;
}

.table_card .table-card-item .table-item-title {
    display: none;
}

.table_card .table_more {
    display: none;
}

.table_card .table-card-item .itemOptinos .dropdown-toggle {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 0;
    background: #f5f7f9;
    border-radius: 50px;
    width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
}

.table_card .table-card-item .itemOptinos .dropdown-item {
    font-size: 14px;
    color: #98a6ad;
    display: flex;
    align-items: center;
}

.table_card .table-card-item .itemOptinos .dropdown-item > i {
    font-size: 16px;
    padding: 0 0.3rem;
    color: #98a6ad;
    position: relative;
    top: -1px;
}

.table_card .table-card-item .itemOptinos .btn-default,
.table_card .table-card-item .itemOptinos button {
    font-size: 16px;
    color: #98a6ad;
    display: block !important;
    width: 100%;
    text-align: right;
}

.table_card .table-card-item .itemOptinos .btn-default:hover,
.table_card .table-card-item .itemOptinos button:hover {
    background-color: #f7f7f7;
}

.table_card .table-card-item .itemOptinos .dropdown .dropdown-menu {
    border-radius: 0.4rem;
    top: 10px !important;
    right: auto !important;
    left: 75% !important;
}

.table_card .table-card-item .itemOptinos .dropdown .dropdown-menu::after {
    content: " ";
    position: absolute;
    left: 48%;
    top: -10px;
    transform: translateX(-50%);
    border-top: none;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
    border-bottom: 10px solid #fff;
}

.table_card .table-card-item .itemOptinos .dropdown .dropdown-menu::before {
    content: " ";
}

@media (max-width: 567px) {
    .table_card .table-card-item .itemOptinos .dropdown .dropdown-menu::after {
        left: 15px;
    }
}

.table_card .table-card-item .table-item-title,
.table_card_head .table-card-item .table-item-title {
    white-space: nowrap;
}

.table_card_head .table-card-item.hide {
    display: block !important;
}

.table_card .table-card-item.hide {
    display: block !important;
}

.expandButton {
    color: #98a6ad;
    line-height: 30px;
    margin-right: 10px;
    display: none !important;
}

@media (max-width: 855px) {
    .table_card_head {
        display: flex;
        padding: 10px 5px;
        align-items: center;
        font-size: 14px;
    }

    .table_card_head .table-card-item.hide {
        display: none !important;
    }

    .expandButton {
        display: inline-block !important;
    }

    .table_card .table-card-item,
    .table_card_head .table-card-item {
        width: 33%;
        font-size: 14px;
    }

    .table_card .table-card-item.hide {
        display: none !important;
    }

    .table_card .table-card-item .table-item-title {
        display: none;
    }

    .table_card {
        padding: 10px 5px;
        transition: max-height 200ms ease-out;
    }

    .table_card .table-card-item {
        text-align: center;
        font-size: 14px;
        padding: 17px 5px;
        display: flex;
        align-items: center;
        justify-content: center;
        word-break: break-word;
    }

    .table_card .table-card-item .table-item-content .checkbox-custom-primary {
        margin-bottom: 0.8rem;
    }

    .table_card
        .table-card-item
        .table-item-content
        .checkbox-custom-primary
        label,
    .table_card_head .table-card-item .checkbox-custom-primary label {
        padding-right: 5px;
    }

    .table_card .table-card-item:nth-last-child(2) {
        border-bottom: 0;
    }

    .table_card .table-card-item.markIcon {
        padding-top: 0;
    }

    .table_card .table-card-item.noMark {
        padding-top: 17px;
    }

    .table_card .table-card-item p {
        margin-bottom: 0;
    }

    .table_card .table_more {
        display: block;
        position: absolute;
        bottom: -10px;
        left: 50%;
        transform: translateX(-50%);
        width: 40px;
        height: 35px;
        background: #f5f5f5;
        border-radius: 0.4rem;
        text-align: center;
        z-index: 22222222;
        font-size: 14px;
        transition: all 200ms ease-in-out;
        display: flex;
        align-items: center;
        justify-content: center;
        display: none;
    }
}

.tables_rows.half_table .table_card {
    display: block;
    padding: 0;
}

.tables_rows.half_table .table_card .table-card-item {
    padding: 15px 0 17px;
    width: 100%;
    justify-content: space-between;
    border-bottom: 1px solid #f6f6f6;
    display: flex;
    align-items: center;
}

.tables_rows.half_table .table_card .table-card-item:last-child {
    border-bottom: 0;
}

.tables_rows.half_table .table_card .table-card-item .table-item-title {
    display: block;
}

.tables_rows.fifty_table .table_card {
    min-height: 60px;
    padding: 0 10px;
}

.tables_rows.fifty_table .table_card .table-card-item,
.tables_rows.fifty_table .table_card_head .table-card-item {
    width: 50%;
}

@media (max-width: 767px) {
    .tables_rows.half_table .table_card .table-card-item .table-item-title {
        white-space: normal;
        /* width: 50%; */
        text-align: right;
    }
}

.table_card.transparent {
    box-shadow: none;
    border: 0;
}

@media (max-width: 567px) {
    .tables_rows.half_table .table_card .table-card-item {
        padding: 12px 10px;
        white-space: nowrap;
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    .tables_rows.showAll .table_card_head {
        display: none;
    }

    .tables_rows.showAll .table_card {
        display: block;
        padding: 0;
    }

    .tables_rows.showAll .table_card .table-card-item {
        padding: 12px 15px;
        width: 100% !important;
        justify-content: space-between;
        border-bottom: 1px solid #f6f6f6;
    }

    .tables_rows.showAll .table_card .table-card-item:last-child {
        border-bottom: 0;
    }

    .tables_rows.showAll .table_card .table-card-item .table-item-title {
        display: block;
    }

    .tables_rows.showAll .table_attached_text .selection {
        font-size: 9px;
    }
}

.table_card.empty-card.centerd {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.table_card.empty-card {
    border: none;
    box-shadow: none;
}

.table_card.empty-card .icon {
    font-size: 70px;
    color: #eceeef;
}

.table_card.empty-card p {
    margin-top: 5px;
    margin-bottom: 0;
    color: #000;
}

.empty-card-wrap {
    border: none;
    box-shadow: none;
    display: flex;
    border-radius: 15px;
    align-items: center;
    justify-content: center;
    min-height: calc(100% - 45px);
    flex-direction: column;
    height: 100%;
}

.empty-card-wrap .icon {
    display: flex;
    text-align: center;
    width: 70px;
    height: 70px;
    background: #f4f6f9;
    border-radius: 50px;
    align-items: center;
    justify-content: center;
    color: #bec3c9;
    font-size: 37px;
    margin: 0 auto 1rem;
}

.empty-card-wrap .icon img {
    max-width: 100%;
}

.empty-card-wrap p {
    margin-bottom: 0;
}

/*
    Summernote style
  */
.note-editor.note-airframe,
.note-editor.note-frame {
    border: 1px solid #ebedf2 !important;
}

.note-toolbar.card-header {
    padding: 0.3rem;
    margin-bottom: 0;
    background-color: #f6f8fa;
    border-bottom: 1px solid #ebedf2;
}

.note-toolbar .note-popover .popover-content > .note-btn-group,
.note-toolbar > .note-btn-group {
    margin-top: 0 !important;
    margin-right: 0 !important;
    margin-left: 5px !important;
}

.note-editor .note-toolbar .note-btn-group .btn {
    background: transparent;
    border: 1px solid transparent;
}

.note-editor .note-toolbar .note-btn-group .btn i {
    color: #666666 !important;
}

.note-editor .note-toolbar > .note-btn-group:nth-child(1),
.note-editor .note-toolbar > .note-btn-group:nth-child(4),
.note-editor .note-toolbar > .note-btn-group:nth-child(6) {
    border-left: 1px solid #ebedf3;
}

.note-editor .note-toolbar > .note-btn-group:nth-child(4) {
    padding-left: 5px;
}

.note-editor
    .btn:not(.md-skip):not(.bs-select-all):not(.bs-deselect-all).btn-sm {
    font-size: 14px;
    padding: 6px 10px;
}

.note-editor .note-toolbar .note-btn-group .btn i {
    vertical-align: initial;
    line-height: initial;
    padding-left: 0;
    color: #000;
}

.note-toolbar > .note-btn-group {
    direction: rtl;
}

.note-toolbar .btn-group,
.note-toolbar .btn-group-vertical {
    direction: rtl;
}

.note-toolbar .note-color .dropdown-toggle::before {
    content: "\f10d";
    font-family: uicons-regular-rounded !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 9px;
    border: 0;
    color: #000;
}

div#driver-highlighted-element-stage {
    background-color: rgba(255, 255, 255, 0.4) !important;
}

div#driver-popover-item .driver-popover-description,
div#driver-popover-item .driver-popover-title {
    font: 14px / normal "Ping AR + LT";
}

.note-icon-video:before {
    font-family: uicons-regular-rounded !important;
    content: "\f2e8" !important;
}

.note-icon-picture:before {
    font-family: uicons-regular-rounded !important;
    content: "\f246" !important;
}

.note-icon-link:before {
    font-family: uicons-regular-rounded !important;
    content: "\f209" !important;
}

.note-icon-minus:before {
    font-family: uicons-regular-rounded !important;
    content: "\f227" !important;
}

.note-icon-table:before {
    font-family: uicons-regular-rounded !important;
    content: "\f1dd" !important;
}

.note-icon-unorderedlist:before {
    font-family: uicons-regular-rounded !important;
    content: "\f20c" !important;
}

.note-icon-orderedlist:before {
    font-family: uicons-regular-rounded !important;
    content: "\f20b" !important;
}

.note-icon-text-height:before {
    font-family: uicons-regular-rounded !important;
    content: "\f1f8" !important;
}

.note-icon-bold:before {
    content: "\f136" !important;
    font-family: uicons-regular-rounded !important;
}

.note-icon-italic:before {
    font-family: uicons-regular-rounded !important;
    content: "\f1fa" !important;
}

.note-icon-underline:before {
    font-family: uicons-regular-rounded !important;
    content: "\f2d7" !important;
}

.note-icon-align-left:before {
    font-family: uicons-regular-rounded !important;
    content: "\f106" !important;
}

.note-editor.note-airframe .note-statusbar,
.note-editor.note-frame .note-statusbar {
    opacity: 0;
}

.note-group-select-from-files .customInput {
    position: relative;
    width: 100%;
    height: 60px;
}

.note-group-select-from-files .customInput:after {
    content: attr(data-text);
    font-size: 14px;
    position: absolute;
    top: 0;
    left: 0;
    background: #fff;
    border: 1px solid #ced4da;
    padding: 10px 15px;
    display: block;
    width: 100%;
    pointer-events: none;
    z-index: 20;
    height: 40px;
    line-height: 16px;
    color: #999;
    border-radius: 0.2rem;

    font-weight: 300;
}

.note-group-select-from-files .customInput:before {
    content: "رفع";
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    height: 40px;
    background-color: #000;
    background: #000;
    border-color: #000;
    color: #fff !important;
    color: #fff;
    z-index: 25;
    font-size: 14px;
    line-height: 37px;
    padding: 0 25px;
    text-transform: uppercase;
    pointer-events: none;
    border-radius: 10px 0 0 7px;
}

.note-group-select-from-files .customInput img {
    width: 50px;
    position: absolute;
    left: 0;
    top: 34%;
    left: 16%;
    z-index: 22;
    transform: translateY(-50%);
    display: none;
}

.note-group-select-from-files input {
    opacity: 0;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 99;
    height: 40px;
    margin: 0;
    padding: 0;
    display: block;
    cursor: pointer;
    width: 100%;
}

.note-modal .modal-header {
    background-color: var(--globalColor);
    background: var(--globalColor);
    border-color: var(--globalColor);
}

.note-modal .modal-header .modal-title {
    color: #fff !important;
}

.note-modal .modal-header button {
    color: #fff !important;
}

.note-editor .modal .modal-header .close {
    opacity: 1;
}

.note-modal .modal-dialog {
    box-shadow: none;
}

.note-modal .modal-header {
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
}

.note-modal .modal-content {
    border: 0;
}

.note-modal .note-btn {
    height: 44px;
    min-width: 75px;
    padding: 0.75rem 1rem;
    border-radius: 10px;
    background-color: var(--globalColor);
    border-color: var(--globalColor);
    color: #fff;
}

.datepicker tbody tr > td.day.selected,
.datepicker tbody tr > td.day.selected:hover,
.datepicker tbody tr > td.day.active,
.datepicker tbody tr > td.day.active:hover,
.datepicker tbody tr > td span.year.focused,
.datepicker tbody tr > td span.year.focused:hover,
.datepicker tbody tr > td span.year.active:hover,
.datepicker tbody tr > td span.year.active.focused:hover,
.datepicker tbody tr > td span.year.active,
.datepicker tbody tr > td span.hour.focused,
.datepicker tbody tr > td span.hour.focused:hover,
.datepicker tbody tr > td span.hour.active:hover,
.datepicker tbody tr > td span.hour.active.focused:hover,
.datepicker tbody tr > td span.hour.active,
.datepicker tbody tr > td span.minute.focused,
.datepicker tbody tr > td span.minute.focused:hover,
.datepicker tbody tr > td span.minute.active:hover,
.datepicker tbody tr > td span.minute.active.focused:hover,
.datepicker tbody tr > td span.minute.active,
.datepicker tbody tr > td span.month.focused,
.datepicker tbody tr > td span.month.focused:hover,
.datepicker tbody tr > td span.month.active:hover,
.datepicker tbody tr > td span.month.active.focused:hover,
.datepicker tbody tr > td span.month.active {
    background: var(--globalColor) !important;
}

.datepicker tbody tr > td.day.today:before {
    display: none;
}

.datepicker tbody tr > td.day.today {
    background: var(--globalColor) !important;
}

.datepicker td,
.datepicker th {
    border-radius: 7px;
}

.user-image-rounded {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    object-fit: cover;
}

.user-image-rounded-circle {
    width: 80px;
    height: 80px;
    border-radius: 50px;
    object-fit: cover;
}

.user-image-rounded-normal {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    object-fit: cover;
}

.user-image-rounded-mini {
    width: 45px;
    height: 45px;
    border-radius: 10px;
    object-fit: cover;
}

.bank-image-rounded-mini {
    height: 55px;
    border-radius: 10px;
    object-fit: cover;
}

.user-image-rounded-mini-circle {
    width: 40px;
    height: 40px;
    border-radius: 50px;
    object-fit: cover;
}

.user-image-rounded.shipping-icon {
    width: 45px;
    height: 45px;
}

.user-image-rounded.categories {
    width: 45px;
    height: 45px;
    border-radius: 0;
}

.user-videos-rounded {
    width: 200px;
    height: 150px;
    border-radius: 10px;
    object-fit: cover;
}

.both_lang {
    border-top-left-radius: 0;
}

.user-videos-modal {
    width: 100%;
    height: 300px;
    border-radius: 10px;
}

@media only screen and (min-width: 992px) {
    .kt-aside-menu {
        padding-bottom: 100px;
    }
}

.input-group-text {
    border-radius: 10px;
    font-size: 16px;
}

.input-group > .input-group-prepend:last-child > .input-group-text {
    border-top-left-radius: 7px;
    border-bottom-left-radius: 7px;
}

.input-group > .input-group-prepend > .input-group-text {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.radius-7 {
    border-radius: 10px !important;
}

.radius-left-7 {
    border-top-left-radius: 7px !important;
    border-bottom-left-radius: 7px !important;
}

/* Table */

.table {
    color: #000;
}

.table thead th {
    white-space: nowrap;
}

.table thead th:first-child,
.table thead td:first-child {
    border-top-right-radius: 15px;
    border: 0;
}

.table thead th:last-child,
.table thead td:last-child {
    border: 0;
    border-top-left-radius: 15px;
}

/* .table tbody tr:last-child {
    background-color: red;
} */

.table tbody tr:last-child td:first-child,
.table tbody tr:last-child {
    border-bottom-right-radius: 15px;
}

.table tbody tr:last-child td:last-child,
.table tbody tr:last-child {
    border-bottom-left-radius: 15px;
}

.resetFilterBtn {
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Modal Fade Animation */

.modalFade {
    transform: scale(0.95);
    opacity: 0;
    transition: all 0.2s ease-in-out;
}

.modalFade.show {
    opacity: 1;
    transform: scale(1);
}

.acceptingBtn {
    letter-spacing: -0.7px;
}

.acceptingBtn .button_text {
    display: flex;
    align-items: center;
    justify-content: center;
}

/*  */

.pagination {
    gap: 0.5rem;
    padding-inline-start: 0;
    padding-inline-end: 0;
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 0;
    margin-inline-start: 0;
    margin-inline-end: 0;
}

.page-link {
    padding: 0.6rem 0.8rem 0.4rem;
    border-radius: 10px;
    font-size: 14px;
}

.page-item:first-child .page-link {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.page-item:last-child .page-link {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.pagination_wrap {
    display: flex;
    align-items: flex-start;
}

.pagination_wrap .page-view-items {
    margin-top: 0.4rem !important;
}

.pagination_wrap > nav {
    padding: 0;
    margin: 0;
}

.pagination_wrap > nav .pagination {
    padding-inline-start: 0;
    padding-inline-end: 0;
    margin: 0;
}

.back_wrapper {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.back_wrapper > span {
    font-weight: 600;
}

.backIcon {
    min-width: 35px;
    width: 35px;
    height: 35px;
    background: #f5f7f9;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    color: #000;
    border: 1px solid #ebedf2;
}

/* Contact msg modal */

.showContactMsg .modal-body h3 {
    font-size: 14px;
    color: #000;
    white-space: normal;
    font-weight: 400;
    line-height: 25px;
}

.showContactMsg .modal-body h3 span:first-child {
    font-weight: 600;
}

.showRatingModal .modal-body h3 {
    font-size: 14px;
    color: #000;
    white-space: normal;
    font-weight: 400;
}

.showRatingModal .modal-body h3 span:first-child {
    font-weight: 600;
}

.alert-danger.custom {
    padding: 0 5px;
    border-radius: 14px;
    color: #000000 !important;
    background-color: transparent !important;
    border: none !important;
}

.alert-danger-two.custom {
    padding: 18px 20px;
    border-radius: 14px;
    color: #eb6460 !important;
    background-color: rgba(253, 100, 96, 0.1) !important;
    border: none !important;
}

.alert-warning.custom {
    padding: 18px 20px;
    border-radius: 14px;
    color: #c89249 !important;
    background-color: #fcf0dd !important;
    border: none !important;
}

/* Alerts  */

.alert {
    padding: 12px 20px;
    border-radius: 14px;
    margin-bottom: 14px;
}

.alert-dismissible .close {
    position: absolute;
    top: 50%;
    left: 0;
    padding: 0.75rem 1.25rem;
    color: inherit;
    transform: translateY(-50%);
    opacity: 1;
    font-size: 14px;
    text-shadow: none;
}

.alert.alert-warning {
    border: 1px solid rgb(255, 73, 1, 0.1);
    color: #ff4901;
    background: rgb(255, 73, 1, 0.1);
}

.page-view-items {
    width: 55px;
}

.input-search-container {
    position: relative;
    display: flex;
    align-items: center;
}

.input-search-container .input {
    width: 40px;
    height: 44px;
    border-radius: 10px;
    border: none;
    outline: none;
    padding: 18px 16px;
    background-color: transparent;
    cursor: pointer;
    transition: all 0.5s ease-in-out;
}

.input-search-container .input::placeholder {
    color: transparent;
}

.input-search-container .input:focus::placeholder {
    color: rgb(131, 128, 128);
}

.input-search-container .input:focus,
.input:not(:placeholder-shown) {
    background-color: #fff;
    border: 1px solid #ebedf2;
    width: 290px;

    padding: 18px 16px 18px 40px;
}

.input-search-container .icon {
    position: absolute;
    left: 0;
    top: 0;
    height: 44px;
    width: 40px;
    background-color: #fff;
    border-radius: 10px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgb(167, 171, 195);
    border: 1px solid #ebedf2;
    pointer-events: none;
}

.input-search-container .input:hover + .icon {
    transition: 0.2s ease-in-out;
}

.input-search-container .input:focus + .icon,
.input-search-container .input:not(:placeholder-shown) + .icon {
    z-index: 0;
    background-color: transparent;
    border: none;
}

/* Iphone */

.iphone-height-wrapper {
    height: 370px;
    overflow: hidden;
}

.iphone-height-wrapper h3 {
    font-size: 1.2rem;
    font-weight: 500;
    color: #464457;
    margin-bottom: 1rem;
}

.iphone-x-wrapper {
    position: relative;
    margin: 50px auto;
    max-width: 310px;
    height: 780px;
    background-color: #f5f7f9;
    border-radius: 40px;
    box-shadow: 0px 0px 0px 2px #f5f7f9, 0px 0px 0px 15px #fff,
        0px 0px 0px 28px #f5f7f9;
}

.iphone-x-wrapper:before,
.iphone-x-wrapper:after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

.iphone-x-wrapper:after {
    bottom: 7px;
    width: 140px;
    height: 4px;
    background-color: #f2f2f2;
    border-radius: 10px;
}

.iphone-x-wrapper:before {
    top: -2px;
    width: 65%;
    height: 35px;
    background-color: #fff;
    border-radius: 0px 0px 30px 30px;
    border: 2px solid #f5f7f9;
    border-top: 0;
}

.iphone-x-wrapper > i,
.iphone-x-wrapper > b,
.iphone-x-wrapper > s,
.iphone-x-wrapper > span {
    position: absolute;
    display: block;
    color: transparent;
}

.iphone-x-wrapper > i {
    top: 2px;
    left: 50%;
    transform: translate(-50%, 6px);
    height: 8px;
    width: 15%;
    background-color: #f5f7f9;
    border-radius: 8px;
}

.iphone-x-wrapper > b {
    left: 10%;
    top: 2px;
    transform: translate(180px, 4px);
    width: 12px;
    height: 12px;
    background-color: #f5f7f9;
    border-radius: 12px;
    box-shadow: inset 0px -3px 2px 0px rgba(255, 255, 255, 0.2);
}

.iphone-x-wrapper > b:after {
    content: "";
    position: absolute;
    background-color: #f5f7f9;
    width: 6px;
    height: 6px;
    top: 2px;
    left: 2px;
    top: 3px;
    left: 3px;
    display: block;
    border-radius: 4px;
}

.iphone-x-wrapper > s {
    top: 25px;

    color: var(--globalColor);

    text-align: center;
    text-decoration: none;
    width: 100%;
    font-size: 70px;
    font-weight: 400;
}

.iphone-x-wrapper > s > span {
    font-size: 22px;
    display: block;
}

.iphone-x-wrapper > span {
    bottom: 50px;
    width: 40px;
    height: 40px;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 50%;
    left: 30px;
}

.iphone-x-wrapper > span + span {
    left: auto;
    right: 30px;
}

.iphone-x-wrapper .notifcation-msg {
    position: absolute;
    top: 170px;
    color: #fff;
    text-decoration: none;
    width: 100%;
}

.iphone-x-wrapper .notifcation-msg .push__box {
    display: none;
    position: relative;
    border-radius: 12px;
    background: #fff;
    border: 1px solid #eeeff0;
    color: #000;
    direction: rtl;
    z-index: 1;
    padding: 10px 12px;
    margin: 8px 10px;
}

.iphone-x-wrapper .notifcation-msg .push__box:last-child {
    display: block;
}

.iphone-x-wrapper .notifcation-msg .push__box::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 12px;
    box-shadow: inset 0 0 100px rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(20px);
    z-index: -1;
}

.iphone-x-wrapper .notifcation-msg .push__top {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}

.iphone-x-wrapper .notifcation-msg .push__top .col {
    display: flex;
    align-items: center;
    padding: 0;
}

.iphone-x-wrapper .notifcation-msg .push__imgwrap {
    margin: 0px 0 1px 5px;
}

.iphone-x-wrapper .notifcation-msg .push__icon {
    max-width: 25px;
    width: 15px;
}

.iphone-x-wrapper .notifcation-msg .push__title {
    color: #000;
    white-space: nowrap;
    text-transform: uppercase;
}

.iphone-x-wrapper .notifcation-msg .push__time {
    font-size: 14px;
    color: #000;
    margin-right: auto;
}

.iphone-x-wrapper .notifcation-msg .push__person {
    font-weight: 500;
    margin-bottom: 8px;
    letter-spacing: -1px;
}

.iphone-x-wrapper .notifcation-msg .push__sub {
    margin-bottom: 8px;
    font-weight: 700;
}

/* Orders Chart Bar */

.orders-summary-bar {
    width: 100%;
    padding: 20px;
}

.orders-summary-bar .chart-bar {
    display: flex;
    height: 30px;
    border-radius: 20px;
    margin-bottom: 20px;
    position: relative;
    gap: 3px;
}

.orders-summary-bar .segment {
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 14px;
    cursor: pointer;
}

.orders-summary-bar .segment:first-child {
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.orders-summary-bar .segment:last-child {
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

.orders-summary-bar .segment::before {
    content: attr(data-city);
    position: absolute;
    bottom: 110%;
    left: 50%;
    transform: translateX(-50%);
    background-color: rgba(0, 0, 0, 0.75);
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
    white-space: nowrap;
    font-size: 14px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
    z-index: 1;
    display: block;
}

.orders-summary-bar .segment:hover::before {
    opacity: 1;
}

.orders-summary-bar .labels {
    display: flex;
    justify-content: center;
    gap: 30px;
}

.orders-summary-bar .labels div {
    display: flex;
    align-items: center;
    font-size: 14px;
}

.orders-summary-bar .dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    margin-left: 5px;
}

.orders-summary-bar .labels span {
    margin-right: 5px;
    color: #000;
    font-weight: 500;
}

/* Shipping Cities */

.cities_wrapper {
    position: relative;
}

.add_category_wrap {
    position: absolute;
    top: 15px;
    left: 15px;
    color: #000;
    text-decoration: none !important;
}

.add_category_wrap:hover {
    color: #000;
    text-decoration: none !important;
}

.cities_wrapper > .search-query {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.citesSelectWrap,
.citiesWithNieghborhoodsSelectWrap {
    height: 150px;
    overflow: scroll;
    overflow-x: hidden;
    padding: 15px 10px;
    border: 1px solid #ebedf2;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    -webkit-overflow-scrolling: touch;
}

.cities_wrapper .checkbox {
    padding: 12px 0;
}

.cities_wrapper .subcategories {
    padding-right: 25px;
}

.cities_wrapper .subcategories .checkbox {
    padding: 10px 0;
}

.cities_wrapper .subcategories .checkbox:last-child {
    padding-bottom: 0;
}

/* summery_card */

.summery_card {
    display: flex;
    width: 100%;
    height: 347px;
}

/* .summery_card .empty-card-wrap .icon {
    display: none;
} */

@media (max-width: 1200px) {
    .summery_card {
        height: 100%;
    }

    .quick-statics-card {
        height: 340px;
    }
}

@media (max-width: 1024px) {
    .summery_card {
        height: 340px;
    }
}

@media (max-width: 767px) {
    .summery_card {
        height: auto;
    }
}

.summery_card .main-chart {
    /* width: 55%; */
    flex: 1.2;
}

.summery_card .main-statics {
    position: relative;
    padding: 1rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;

    /* width: auto; */
    flex: 1;
}

@media (max-width: 1024px) {
    .summery_card .statics-items .item {
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    /* .summery_card .statics-items .item .content,
    .summery_card .statics-items .item .content .content_number {
        text-align: center !important;
    } */
}

@media (max-width: 767px) {
    .summery_card {
        flex-direction: column;
    }

    .summery_card .main-statics,
    .summery_card .main-chart {
        width: 100%;
    }

    .summery_card .statics-items .item {
        flex-direction: row;
    }

    /* .summery_card .statics-more {
        position: relative !important;
        padding-bottom: 0 !important;
        margin-bottom: -11px;
    } */
}

.summery_card .main-chart-title {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 37px;
}

.summery_card .main-chart-title h6 {
    color: var(--globalColor);
    font-weight: 700;
    font-size: 14px;
    margin-bottom: 0;
}

.summery_card .statics-items {
    /* display: flex;
        flex-direction: column;
        gap: 1rem; */
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}

.summery_card .statics-items.no-memberships {
    display: block;
    margin-top: 0;
    top: -45%;
}

.summery_card .statics-items.no-memberships {
    display: block;
    margin-top: 0;
}

.summery_card .statics-items .item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 5px 0;
    margin: 15px 0;
    gap: 1rem;
}

.summery_card .statics-items .item .icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 45px;
    height: 45px;
    margin: 0 0 0 10px;
    border-radius: 99px;
    text-align: center;
    font-size: 26px;
}

.summery_card .statics-items .item .icon::before {
    content: " ";
    width: 30px;
    height: 30px;
    border-radius: 50px;
    display: block;
    position: absolute;
    left: -2px;
    bottom: 2px;
}

.summery_card .statics-items .item .content {
    font-size: 14px;
    font-weight: 500;
    color: #8193ae;
}

.summery_card .statics-items .item .content .content_number {
    font-size: 15px;
    margin: 0 0 10px;
    text-align: right;
    font-weight: 700;
    -webkit-text-stroke: 0.4px currentColor;
    color: var(--globalColor);
    text-wrap: nowrap;
}

/* نسبة التغيّر (الأحمر/الأخضر مع السهم) ترجع خفيفة — لا ترث وزن الرقم الأساسي */
.summery_card .statics-items .item .content .content_number .text-success,
.summery_card .statics-items .item .content .content_number .text-danger {
    font-weight: 500;
}

.summery_card .statics-more {
    color: #000;
    font-weight: 500;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 11.5px 0 0;
    border-top: 1px solid #eeeeee;
    /* position: absolute;
    bottom: 0;
    left: 0;
    right: 0; */
}

.summery_card .main-chart {
    /* background-color: #f4f6f9; */
    padding: 1rem 1.8rem;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    padding-bottom: 0;
    overflow: hidden;
}

.chart-bg-transparent {
    background-color: rgb(0 0 0 / 10%);
}

.top_sub_head h3 {
    color: var(--globalColor);
    font-weight: 700;
    font-size: 14px;
}

/* Verical  */

.summery_card.vertical .main-chart {
    border-top-left-radius: 15px;
    border-bottom-left-radius: 14px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.summery_card.vertical .main-statics .main-statics-title {
    margin-top: 0;
}

.summery_card.vertical .main-statics {
    background-color: #fff;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
}

.summery_card.vertical .statics-items {
    /* gap: 15px; */
    padding: 0 0px;
}

.summery_card .more-arrow {
    font-size: 14px;
    color: #000;
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 0;
}

.summery_card .more-arrow i {
    font-size: 10px;
}

.summery_card.vertical .main-chart .empty-card-wrap {
    min-height: 100%;
}

@media (max-width: 767px) {
    .quick-statics-card {
        margin-top: 1rem;
    }
}

/* Image Uploader Wrap */

.filepond--root .filepond--credits[style] {
    display: none;
}

.filepond--drop-label.filepond--drop-label {
    position: relative;
}

.filepond--drop-label.filepond--drop-label label::before {
    content: "\f2db";
    font-family: uicons-regular-rounded !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    /* line-height: 1; */
    vertical-align: bottom;
    /* font-size: 16px; */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: block;
    position: relative;
    top: -1rem;
    pointer-events: none;
}

.filepond--drop-label.filepond--drop-label label::after {
    white-space: nowrap;
}

.filepond--drop-label.filepond--drop-label label {
    font-family: "Ping AR + LT";
}

.filepond--drop-label {
    background: #f5f7f9;
    border: 1px solid #ebedf3;
    border-radius: 10px;
}

.filepond--root .filepond--drop-label {
    min-height: 9em !important;
}

.filepond--panel-root {
    background-color: #f5f7f9 !important;
}

.filepond--label-action {
    text-decoration: none !important;
}

.filepond--file-info {
    display: none !important;
}

/* .filepond--root {
    height: 320px !important;
} */

/* .filepond--pdf-preview-wrapper {
    height: 120px !important;
} */

/* Container settings for proper layout */
.filepond--list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    /* Spacing between items */
}

/* Default for one item (100% width) */
.filepond--item {
    width: 100%;
}

/* When two items are present, each takes 50% */
.filepond--item:nth-child(1):nth-last-child(2),
.filepond--item:nth-child(2):nth-last-child(1) {
    width: calc(50% - 0.5em);
}

/* Three items (33.33% width each) */
.filepond--item:nth-child(1):nth-last-child(3),
.filepond--item:nth-child(2):nth-last-child(2),
.filepond--item:nth-child(3):nth-last-child(1) {
    width: calc(33.33% - 0.5em);
}

/* When four or more items are present, each takes 25% */
.filepond--item:nth-child(1):nth-last-child(n + 4),
.filepond--item:nth-child(2):nth-last-child(n + 3),
.filepond--item:nth-child(3):nth-last-child(n + 2),
.filepond--item:nth-child(4):nth-last-child(n + 1),
.filepond--item:nth-child(n + 4) {
    width: calc(25% - 0.5em);
}

/* .filepond--image-preview-wrapper {

} */

/* Create Prdouct */

.priceItemWrap {
    background: #f5f7f9;
    padding: 15px 20px;
    border-radius: 12px;

}

/* Move Cursor */

.cursor-move-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0rem;
    padding: 0 40px 0 40px;
}

.moveCursor {
    position: absolute;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    transition: all 0.2s ease-in-out;
    z-index: 22;
    right: -15px;
    margin-bottom: 1px;
}

.moveCursor img {
    max-width: 18px;
}

.moveCursor:hover {
    background: #f5f7f9;
}

@keyframes jello-vertical {
    0% {
        transform: scale3d(1, 1, 1);
    }

    30% {
        transform: scale3d(0.75, 1.25, 1);
    }

    40% {
        transform: scale3d(1.25, 0.75, 1);
    }

    50% {
        transform: scale3d(0.85, 1.15, 1);
    }

    65% {
        transform: scale3d(1.05, 0.95, 1);
    }

    75% {
        transform: scale3d(0.95, 1.05, 1);
    }

    100% {
        transform: scale3d(1, 1, 1);
    }
}

.customTooltip {
    position: absolute;
    top: -20px;
    opacity: 0;
    background-color: #000;
    color: white;
    padding: 5px 10px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition-duration: 0.2s;
    pointer-events: none;
    white-space: nowrap;
}

.customTooltip::before {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    background-color: #000;
    background-size: 1000%;
    background-position: center;
    transform: rotate(45deg);
    bottom: -15%;
    transition-duration: 0.3s;
}

a:hover .customTooltip {
    top: -40px;
    opacity: 1;
    transition-duration: 0.3s;
}

.moveCursor:hover .customTooltip {
    top: -40px;
    opacity: 1;
    transition-duration: 0.3s;
}

.customTooltipWrapper {
    position: relative;
}

.customTooltipWrapper:hover .customTooltip {
    top: -40px;
    opacity: 1;
    transition-duration: 0.3s;
}

.tooltip-inner {
    background-color: #111;
    color: #fff;
    border-radius: 10px;
    font-family: "Ping AR + LT";
}

.bs-tooltip-auto[x-placement^="bottom"] .arrow::before,
.bs-tooltip-bottom .arrow::before {
    border-bottom-color: #111 !important;
}

.bs-tooltip-auto[x-placement^="top"] .arrow::before,
.bs-tooltip-top .arrow::before {
    border-top-color: #111 !important;
}

.bs-tooltip-auto[x-placement^="left"] .arrow::before,
.bs-tooltip-left .arrow::before {
    border-left-color: #111 !important;
}

.bs-tooltip-auto[x-placement^="right"] .arrow::before,
.bs-tooltip-right .arrow::before {
    border-right-color: #111 !important;
}

/* Orders Status */

.radio-status-inputs {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    border-radius: 10px;
    background-color: #fff;
    padding: 5px 5px;
    /* padding: 0.30rem; */
    margin-bottom: 0.75rem;
    width: 100%;
    gap: 1.3rem;
}

.radio-status-inputs .radio {
    /* text-align: center;
    margin-bottom: 0;
    flex: 1;
    max-width: calc(100% / 5); */
    width: 100%;
    flex: 1;
    max-width: max-content;
}

@media (max-width: 767px) {
    .radio-status-inputs .radio {
        max-width: 100%;
        width: 100%;
    }
}

.radio-status-inputs .radio input {
    display: none;
}

.radio-status-inputs .radio .name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    cursor: pointer;
    flex-flow: column;
    align-items: flex-start;
    border-radius: 10px;
    border: none;
    padding: 0.9rem 1.2rem;
    font-size: 14px;
    font-weight: 400;
    /* min-width: 100px; */
    box-shadow: 1px 1px 5px 0px rgba(89, 91, 181, 0.1);
    border: 1px solid #f0f2f5;
    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
    color: rgba(51, 65, 85, 1);
    -webkit-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
}

.radio-status-inputs .radio .name .icon {
    margin-bottom: 10px;
    font-size: 20px;
    display: block;
}

.radio-status-inputs .radio .name .stats {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 20px;
}

.radio-status-inputs .radio .circle {
    width: 9px;
    height: 9px;
    display: inline-block;
    border-radius: 50px;
    vertical-align: middle;
    margin-left: 5px;
}

.radio-status-inputs .radio .circle.state1 {
    background-color: #4081ff;
}

.radio-status-inputs .radio .circle.state2 {
    background-color: #4a4ca4;
}

.radio-status-inputs .radio .circle.state3 {
    background-color: #fcc739;
}

.radio-status-inputs .radio .circle.state4 {
    background-color: #28a3c1;
}

.radio-status-inputs .radio .circle.state5 {
    background-color: #ff0038;
}

.radio-status-inputs .radio .circle.state6 {
    background-color: #50748c;
}

.radio-status-inputs .radio .circle.state7 {
    background-color: #28a3c1;
}

.radio-status-inputs .radio .circle.state8 {
    background-color: #39d5ad;
}

.radio-status-inputs .radio .circle.state9 {
    background-color: #019474;
}

.radio-status-inputs .radio .circle.state10 {
    background-color: #ff9d46;
}

.radio-status-inputs .active.state-all .name {
    background-color: rgba(80, 116, 140, 0.1);
    color: #50748c;
}

.radio-status-inputs .active.state-1 .name {
    background-color: rgba(64, 129, 255, 0.1);
    color: rgb(64, 129, 255);
}

.radio-status-inputs .active.state-2 .name {
    background-color: rgba(74, 76, 164, 0.1);
    color: #4a4ca4;
}

.radio-status-inputs .active.state-3 .name {
    background-color: rgba(255, 194, 51, 0.1);
    color: #ffc233;
}

.radio-status-inputs .active.state-7 .name {
    background-color: rgba(40, 163, 193, 0.1);
    color: #28a3c1;
}

.radio-status-inputs .active.state-4 .name {
    background-color: rgb(40 163 193 / 10%);
    color: #28a3c1;
}

.radio-status-inputs .active.state-5 .name {
    background-color: rgba(245, 61, 107, 0.1);
    color: #f53d6b;
}

.radio-status-inputs .active.state-6 .name {
    background-color: rgba(80, 116, 140, 0.1);
    color: #50748c;
}

.radio-status-inputs .active.state-8 .name {
    background-color: rgb(57 213 173 / 10%);
    color: #39d5ad;
}

.radio-status-inputs .active.state-9 .name {
    background-color: rgba(1, 148, 116, 0.1);
    color: #019474;
}

.radio-status-inputs .active.state-10 .name {
    background-color: rgba(255, 157, 70, 0.1);
    color: #ff9d46;
}

.radio-status-inputs .chartState-clients input:checked + .name {
    background-color: rgba(64, 129, 255, 0.1);
    color: #4081ff;
}

.radio-status-inputs .radio .circle.chartStateclients {
    background-color: #5080f7;
}

.radio-status-inputs .chartState-dashboard input:checked + .name {
    background-color: rgba(1, 148, 116, 0.1);
    color: #019474;
}

.radio-status-inputs .radio .circle.chartStatedashboard {
    background-color: rgba(1, 148, 116, 1);
}

.radio-status-inputs .chartState-bookings input:checked + .name {
    background-color: rgba(118, 188, 199, 0.1);
    color: #76bcc7;
}

.radio-status-inputs .radio .circle.chartStatebookings {
    background-color: #76bcc7;
}

.radio-status-inputs .chartState-orders input:checked + .name {
    background-color: rgba(239, 173, 66, 0.1);
    color: #efad42;
}

.radio-status-inputs .radio .circle.chartStateorders {
    background-color: #efad42;
}

.radio-status-inputs .chartState-subscriptions input:checked + .name {
    background-color: rgba(83, 89, 147, 0.1);
    color: #535993;
}

.radio-status-inputs .radio .circle.chartStatesubscriptions {
    background-color: #535993;
}

.radio-status-inputs .chartState-advertisements input:checked + .name {
    background-color: rgb(118, 199, 245, 0.1);
    color: #76c7f5;
}

.radio-status-inputs .radio .circle.chartStateadvertisements {
    background-color: #76c7f5;
}

.radio-status-inputs .chartState-places input:checked + .name {
    background-color: rgb(255, 73, 1, 0.1);
    color: #ff4901;
}

.radio-status-inputs .radio .circle.chartStateplaces {
    background-color: #ff4901;
}

.radio-status-inputs .chartState-points input:checked + .name {
    background-color: rgb(163, 92, 216, 0.1);
    color: #a35cd8;
}

.radio-status-inputs .radio .circle.chartStatepoints {
    background-color: #a35cd8;
}

.radio-status-inputs {
    flex-wrap: nowrap;
    max-width: 100%;
    overflow-x: scroll;
}

.radio-status-inputs .radio .name {
    white-space: nowrap;
    min-width: 140px;
}

.radio-status-inputs label {
    position: relative;
}

.radio-status-inputs .radio-container {
    position: relative;
    /* flex: 1; */
    max-width: 100%;
}

.radio-status-inputs .reset-icon {
    display: flex;
    width: 22px;
    height: 22px;
    background: red;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    font-size: 13px;
    color: #fff;
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 22;
}

@media (max-width: 991px) {
    .radio-status-inputs .radio .name {
        padding: 1rem 1rem;
    }
}

.radio-status-inputs::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.radio-status-inputs::-webkit-scrollbar-track {
    background: #ffffff;
    border-radius: 5px;
}

.radio-status-inputs::-webkit-scrollbar-thumb {
    background-color: #f6f7fd;
    border-radius: 5px;
    height: 10px;
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}

.radio-status-inputs::-webkit-scrollbar-thumb:hover {
    background-color: #f6f7fd;
}

.radio-status-inputs .radio input:checked + .name .stats .arrow {
    display: none;
}

/* Order Copy  */

.IdNumWrapper {
    position: relative;
    right: 5px;
    white-space: nowrap;
    overflow: visible;
}

.IdNumWrapper a {
    color: #0d6efd;
}

.IdNumWrapper .hide-txt {
    position: absolute;
    opacity: 0;
    z-index: -1;
}

.hide-txt {
    position: absolute;
    opacity: 0;
}

.IdNumWrapper .copyToClipboardBtn {
    visibility: hidden;
    margin-right: 2px;
    vertical-align: middle;
}

.IdNumWrapper:hover .copyToClipboardBtn {
    position: relative;
    visibility: visible;
}

.copiedAlert {
    position: absolute;
    left: 50%;
    top: -35px;
    white-space: nowrap;
    transform: translateX(-50%);
    background: #fff;
}

.ordersTable .IdNumWrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

/* Status Change Item */

/* *="جديد" */

span.state-icon[data-status] {
    width: 10px;
    height: 10px;
    border-radius: 50px;
    background-color: #000;
    display: inline-block;
    margin-left: 10px;
}

span.state-icon[data-status*="جديد"] {
    background-color: #4081ff;
}

span.state-icon[data-status*="جاري التجهيز"] {
    background-color: #4a4ca4;
}

span.state-icon[data-status*="جاهزة للشحن"] {
    background-color: #ffc233;
}

span.state-icon[data-status*="جاري التوصيل"] {
    background-color: #28a3c1;
}

span.state-icon[data-status*="تم التوصيل"] {
    background-color: #39d5ad;
}

span.state-icon[data-status*="مكتمل"] {
    background-color: #39d5ad;
}

span.state-icon[data-status*="Arrived"] {
    background-color: #39d5ad;
}

span.state-icon[data-status*="ملغي"] {
    background-color: #f53d6b;
}

span.state-icon[data-status*="في الانتظار"] {
    background-color: #4a4ca4;
}

span.state-icon[data-status*="Pending"] {
    background-color: #4a4ca4;
}

span.state-icon[data-status*="تم الوصول"] {
    background-color: #39d5ad;
}

span.state-icon[data-status*="قيد الانتظار"] {
    background-color: #4081ff;
}

span.state-icon[data-status*="قيد المراجعة"] {
    background-color: #ffc233;
}

span.state-icon[data-status*="Review"] {
    background-color: #ffc233;
}

span.state-icon[data-status*="مقبول"] {
    background-color: #28a3c1;
}

span.state-icon[data-status*="غير مكتمل"] {
    background-color: #39d5ad;
}

span.state-icon[data-status*="مرفوض"] {
    background-color: #f53d6b;
}

span.state-icon[data-status*="Rejected"] {
    background-color: #f53d6b;
}

span.state-icon.vacations[data-status*="مقبولة"] {
    background-color: #39d5ad;
}

span.state-icon.vacations[data-status*="Accepted"] {
    background-color: #39d5ad;
}

span.state-icon.vacations[data-status*="غير مكتمل"] {
    background-color: #28a3c1;
}

span.state-icon[data-status*="مسترد"] {
    background-color: #019474;
}

span.state-icon[data-status*="مسترد جزئي"] {
    background-color: #ff9d46;
}

span.state-icon.vacations[data-status*="Incomplete"] {
    background-color: #28a3c1;
}

span.state-icon[data-status*="New"] {
    background-color: #4081ff;
}

span.state-icon[data-status*="Preparation"] {
    background-color: #4a4ca4;
}

span.state-icon[data-status*="Shipped"] {
    background-color: #ffc233;
}

span.state-icon[data-status*="Delivering"] {
    background-color: #28a3c1;
}

span.state-icon[data-status*="Delivered"] {
    background-color: #39d5ad;
}

span.state-icon[data-status*="Canceled"] {
    background-color: #f53d6b;
}

.custom-dropdown-filter.status li[data-status-ar] label::before {
    content: "";
    width: 10px;
    height: 10px;
    border-radius: 50px;
    background-color: #000;
    display: inline-block;
    margin-left: 10px;
}

.custom-dropdown-filter.status li[data-status-ar*="جديد"] label::before {
    background-color: #4081ff;
}

.custom-dropdown-filter.status
    li[data-status-ar*="جاري التجهيز"]
    label::before {
    background-color: #4a4ca4;
}

.custom-dropdown-filter.status li[data-status-ar*="جاهزة للشحن"] label::before {
    background-color: #ffc233;
}

.custom-dropdown-filter.status
    li[data-status-ar*="جاري التوصيل"]
    label::before {
    background-color: #28a3c1;
}

.custom-dropdown-filter.status li[data-status-ar*="تم التوصيل"] label::before {
    background-color: #39d5ad;
}

.custom-dropdown-filter.status li[data-status-ar*="ملغي"] label::before {
    background-color: #f53d6b;
}

.orderNotesBox {
    background-color: #fff;
    border-radius: 12px;
    padding: 15px 20px;
    border: 1px solid #ebebeb;

    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
    -webkit-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}

.orderUserInfo h5 {
    font-size: 14px;
    padding: 0;

    border-radius: 0.4rem;
}

.orderUserInfo.with_policis {
    padding: 0;
}

.orderUserInfo.with_policis .orderArrangeItems {
    padding: 0 1rem;
}

.orderUserInfo .card-title.with_policis {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, minmax(140px, 4fr));
    grid-gap: 0;
    align-items: center;
    padding-bottom: 10px;
    padding-right: 16px;
}

.orderUserInfo .card-title.with_policis .image_shipp img {
    float: none;
    margin: 6px auto 0 13px;
    display: block;
}

.orderArrangeItems {
    display: grid;
    width: 100%;
    grid-template-columns: 1fr;
    gap: 0.3rem;
}

.orderArrangeItems p {
    margin-bottom: 0 !important;
}

.orderArrangeItems p:last-child {
    white-space: nowrap;
}

@media (max-width: 576px) {
    .orderArrangeItems {
        grid-template-columns: repeat(auto-fill, minmax(100%, 4fr));
    }
}

/* Gloabal Color */

.btn-main,
.reports-summary .dateRange-input .icon,
.dropdown-item.active,
.swal2-styled.swal2-confirm,
.page-item.active .page-link,
.upload-btn-wrapper .btn,
.nav-tabs .nav-item .nav-link.active,
.nav-tabs .nav-item .nav-link:active {
    background-color: var(--globalColor) !important;
    border-color: var(--globalColor) !important;
    color: #fff;
}

.nav-tabs .nav-item .nav-link.active,
.nav-tabs .nav-item .nav-link:active {
    color: var(--globalColor);
}

/* .nav-tabs .nav-item .nav-link.active img[src*="bank-transfer.png"],
.nav-tabs .nav-item .nav-link:active img[src*="bank-transfer.png"] {
    filter: invert(1);
} */

.btn-change-password {
    border: 1px solid var(--globalColor) !important;
}

.btn-change-password:hover {
    background-color: var(--globalColor) !important;
    border: 1px solid var(--globalColor) !important;
}

/* Product Card */

.product-card {
    position: relative;
    border: 1px solid #ebedf2;
    background-color: #fff;
    border-radius: 10px;
    margin-bottom: 1rem;
    height: calc(100% - 1rem);
}

.product-card .image {
    position: relative;
    height: 215px;
    overflow: hidden;
}

.product-card .moveCursor {
    bottom: 10px;
    right: 8px;
    background: #f5f7f9;
    border-radius: 50px;
}

.product-card .moveCursor img {
    max-width: 15px;
}

.product-card .image > img {
    width: 100%;
    max-height: 100%;
    object-fit: cover;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}

.product-card .product-card-details {
    padding: 1rem;
}

.product-card .product-card-details ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.product-card .product-card-details li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 0;
}

.product-card .itemOptinos {
    position: absolute;
    top: 10px;
    left: 15px;
}

.product-card .product-check {
    position: absolute;
    top: 10px;
    right: 15px;
    z-index: 22;
}

/* view-grid-labels */

.view-grid-labels {
    background-color: #f5f7f9;
    border: 1px solid #f5f7f9;
    border-radius: 8px;
    max-width: max-content;
    display: flex;
    align-items: center;
    margin-right: auto;
    flex-wrap: nowrap;
}

.view-grid-labels label {
    flex: 1;
    background-color: #f5f7f9;
    border-radius: 7px;
    margin-bottom: 0;
    padding: 0.5rem 1rem;
    font-size: 14px;
    color: #707070;
    text-align: center;
    cursor: pointer;
    width: 40px;
}

.view-grid-labels .radio-label {
    display: none;
}

.view-grid-labels #label-grid-view:checked ~ .labels #label-grid {
    background-color: var(--globalColor);
    color: #fff;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.view-grid-labels #label-list-view:checked ~ .labels #label-list {
    background-color: var(--globalColor);
    color: #fff;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

/* TimeLine */

.timeline {
    position: relative;
}

.timeline:before {
    content: "";
    position: absolute;
    right: 7.5px;
    width: 3px;
    top: 0;
    bottom: 0;
    background-color: #f1f1f1;
}

.timeline .timeline-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    margin-bottom: 1.7rem;
}

.timeline .timeline-item .timeline-label {
    width: 50px;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    font-size: 1rem;
    font-weight: 500;
    position: relative;
    color: #3f4254;
}

.timeline .timeline-item .timeline-badge {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    background: white;
    width: 20px;
    height: 20px;
    border-radius: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    z-index: 1;
    position: relative;
    margin-top: 1px;
    margin-left: -0.5rem;
    padding: 3px !important;
    border: 6px solid var(--globalColor);
}

.timeline .timeline-item .timeline-content {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

/* TimeLine Progress */

.StepProgress {
    position: relative;
    padding-right: 140px;
    list-style: none;
}

.StepProgress::before {
    display: inline-block;
    content: "";
    position: absolute;
    top: 50px;
    right: 103px;
    width: 10px;
    height: calc(100% - 105px);
    border-left: 1px solid var(--globalColor);
}

@media (max-width: 767px) {
    .StepProgress::before {
        top: 58px;

        width: 10px;
        height: calc(100% - 145px);
    }
}

.StepProgress-item {
    position: relative;
    counter-increment: list;
}

.StepProgress .day {
    position: absolute;
    right: -140px;
    top: 50%;
    transform: translateY(-50%);
}

.StepProgress-item {
    background-color: #fff;
    border: 1px solid #f0f2f5;
    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
    -webkit-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}

.StepProgress-item {
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 15px;
}

.StepProgress-item::after {
    content: "";
    display: inline-block;
    position: absolute;
    top: 16px;
    right: -39px;
    width: 20px;
    height: 20px;
    border: 0;
    border-radius: 50%;
    background-color: #cfd4d9;
}

.StepProgress-item.current::after {
    content: " ";
    padding-top: 1px;
    width: 20px;
    height: 20px;
    top: 50%;
    right: -39px;
    font-size: 14px;
    text-align: center;
    color: #fff;
    background: var(--globalColor);
    border: 0;
    transform: translateY(-50%);
}

.StepProgress .stepIcon {
    background-color: var(--globalColor);
    color: #fff;
}

.StepProgress .stepIcon {
    position: relative;
    top: -8px;
    right: -53px;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
}

.StepProgress strong {
    display: block;
    font-weight: 400;
    color: #1a2d4c;
}

.notifi-progress-list {
    display: block;
}

.notifi-progress-list > div {
    white-space: nowrap;
    margin-bottom: 10px;
}

.notifi-progress-list span:not(.badge) {
    color: #081637;
}

.notifi-progress-list .status-read {
    background-color: #f0faf7;
    color: #6dd2ae;
}

.StepProgress-item::before {
    content: "";
    display: block;
    width: 30px;
    height: 1px;
    background-color: #e7eaee;
    position: absolute;
    top: 50%;
    right: -30px;
    border-radius: 10px;
}

@media (max-width: 767px) {
    .notifi-progress-list > div {
        white-space: unset;
    }
}

@media (max-width: 567px) {
    .StepProgress-item {
        padding: 10px;
    }

    .notifi-progress-list {
        flex-flow: column;
        align-items: flex-start;
        gap: 10px;
    }
}

#toast-container > div {
    width: max-content !important;
    max-width: max-content;
}

#toast-container > .toast-info {
    color: #406dbd;
    background-color: #edf4fa;
    box-shadow: none;
    opacity: 1;
}

#toast-container > .toast-info:hover {
    box-shadow: none;
}

#toast-container > .toast-error {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGlkPSJPdXRsaW5lIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSI1MTIiIGhlaWdodD0iNTEyIiBmaWxsPSIjZmZmIj48cGF0aCBkPSJNMTIsMEExMiwxMiwwLDEsMCwyNCwxMiwxMi4wMTMsMTIuMDEzLDAsMCwwLDEyLDBabTAsMjJBMTAsMTAsMCwxLDEsMjIsMTIsMTAuMDExLDEwLjAxMSwwLDAsMSwxMiwyMloiLz48cGF0aCBkPSJNMTIsMTBIMTFhMSwxLDAsMCwwLDAsMmgxdjZhMSwxLDAsMCwwLDIsMFYxMkEyLDIsMCwwLDAsMTIsMTBaIi8+PGNpcmNsZSBjeD0iMTIiIGN5PSI2LjUiIHI9IjEuNSIvPjwvc3ZnPgo=") !important;
}

#toast-container > .toast-info {
    background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGlkPSJPdXRsaW5lIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0iIzJmNmVjMyI+PHBhdGggZD0iTTEyLDBBMTIsMTIsMCwxLDAsMjQsMTIsMTIuMDEzLDEyLjAxMywwLDAsMCwxMiwwWm0wLDIyQTEwLDEwLDAsMSwxLDIyLDEyLDEwLjAxMSwxMC4wMTEsMCwwLDEsMTIsMjJaIi8+PHBhdGggZD0iTTEyLDEwSDExYTEsMSwwLDAsMCwwLDJoMXY2YTEsMSwwLDAsMCwyLDBWMTJBMiwyLDAsMCwwLDEyLDEwWiIgZmlsbD0iIzJmNmVjMyIvPjxjaXJjbGUgY3g9IjEyIiBjeT0iNi41IiByPSIxLjUiIGZpbGw9IiMyZjZlYzMiLz48L3N2Zz4K") !important;
    background-size: 20px;
}

@media (min-width: 241px) and (max-width: 480px) {
    #toast-container > div {
        padding: 13px 50px 13px 15px !important;
    }
}

.app-loyality-modal {
    width: 44px;
    height: 44px;
    font-size: 18px;
    margin: 0 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    background: var(--globalColor);
    color: #000;
    border-radius: 50px;
    background-color: #fff;
    border: 1px solid #ebedf2;
    font-size: 20px;
}

.app-loyality-modal i {
    position: relative;
    top: -1px;
}

.app-loyality-modal i::before {
    vertical-align: middle;
}

.app-loyality-modal:hover {
    color: #000;
}

.chat-mini-icon {
    position: relative;
    width: 44px;
    height: 44px;
    font-size: 18px;
    /* margin: 0 12px; */
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    background: var(--globalColor);
    color: #000;
    border-radius: 50px;
    background-color: #fff;
    border: 1px solid #ebedf2;
    font-size: 20px;
}

.chat-mini-icon i {
    position: relative;
    top: 1px;
}

.chat-mini-icon i::before {
    vertical-align: middle;
}

.chat-mini-icon:hover {
    color: #000;
}

.chat-mini-icon svg {
    position: relative;
    top: 1px;
}

.app-title-dropdown {
    width: 40px;
    height: 40px;
    font-size: 18px;
    margin: 0 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    background: var(--globalColor);
    color: #000;
    border-radius: 50px;
    background-color: #fff;
    border: 1px solid #ebedf2;
}

.app-title-dropdown:hover {
    color: #6c7293;
}

.app-title-dropdown span > i {
    position: relative;
    top: 2px;
}

.app-title-dropdown > span {
    height: 100%;
    display: flex;
    align-items: center;
}

.app-title-dropdown svg {
    width: 19.5px;
    height: 19.5px;
}

.app-title-dropdown::after {
    display: none !important;
}

.app-content-dropdown .app-content-inner {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0 1rem;
}

.app-content-dropdown .dropdown-item {
    display: flex;
    align-items: center;
    color: #000;
}

.app-content-dropdown .dropdown-item i {
    position: relative;
    top: 1px;
    margin-left: 10px;
    font-size: 14px;
    color: #000;
}

/* Radio */

.wrapper-list-view {
    position: relative;
    display: flex;
    flex-direction: row;
    gap: 1rem;
    margin-top: 1rem;
}

.wrapper-list-view .card {
    position: relative;
    width: 200px;
    height: 150px;
    background: #fff;
    border-radius: 15px;
    transition: all 0.3s;
    border: 0;
}

.wrapper-list-view .input {
    position: relative;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    cursor: pointer;
    appearance: none;
    border: 1px solid #e9e9e9;
    background-color: transparent;
    border-radius: 15px;
    z-index: 10;
    padding: 20px;
}

.wrapper-list-view .input + .check::before {
    content: "";
    position: absolute;
    top: 20px;
    right: 20px;
    width: 20px;
    height: 20px;
    border: 1px solid #ebedf3;
    border-radius: 50%;
    background-color: #ffffff;
}

.wrapper-list-view .input:checked + .check::before {
    border: 1px solid var(--globalColor);
}

.wrapper-list-view .input:checked + .check::after {
    content: "";
    position: absolute;
    top: 25px;
    right: 25px;
    width: 10px;
    height: 10px;
    background-color: rgba(0, 0, 0, 0.7);
    border-radius: 50%;
}

.wrapper-list-view .input[type="radio"]:checked + .check::after {
    background-color: var(--globalColor);
}

.wrapper-list-view .input[type="radio"]:checked {
    -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
    border: 1.5px solid var(--globalColor);
}

.wrapper-list-view .label {
    color: #323232;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-flow: column;
}

.wrapper-list-view .label .title {
    font-weight: 500;
    color: #000;
    font-size: 16px;
    text-align: center;
    position: relative;
    top: -21px;
    left: -5px;
}

.wrapper-list-view .label .icon {
    font-size: 22px;
    color: #000;
    text-align: center;
    align-items: center;
}

.wrapper-list-view .label .icon i::before {
    vertical-align: middle;
}

.wrapper-list-view .label .span {
    color: gray;
    font-weight: 700;
    font-size: 15px;
}

.wrapper-list-view .label .title {
    top: -8px;
}

.wrapper-list-view.gendar .icon img {
    border-radius: 50px;
}

/* New  */

/* .wrapper-list-view.gendar {
    flex-direction: column;
} */

.wrapper-list-view .input {
    padding: 10px;
}

.wrapper-list-view .card {
    height: 100px;
    width: 100%;
    padding: 0;
    /* width: 200; */
}

.wrapper-list-view .label {
    flex-direction: row;
    gap: 1rem;
    justify-content: space-between;
    padding: 0 45px 0 25px;
}

.wrapper-list-view.gendar .label {
    padding: 0 45px 0 20px;
}

.wrapper-list-view .input + .check::before {
    top: calc(50% - 10px);
}

.wrapper-list-view .label .title {
    top: 0;
    left: -10px;
}

.wrapper-list-view .input:checked + .check::after {
    top: 45%;
}

.wrapper-list-view .input[type="radio"]:checked {
    -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.1);
}

.wrapper-list-view.checkbox-list .input + .check::before {
    border-radius: 3px;
    border: 1px solid #bdbbbb;
}

.wrapper-list-view.checkbox-list .input:checked + .check::after {
    width: 5px;
    height: 10px;
    border-width: 0 2px 2px 0 !important;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    border: solid #fff;
    border-radius: 0;
    background: transparent;
}

.wrapper-list-view.checkbox-list .input:checked + .check::before {
    background-color: #000;
    border-color: #000;
}

.wrapper-list-view.checkbox-list .input:checked + .check::after {
    top: 44%;
    right: 27.5px;
}

.wrapper-list-view .alert a {
    color: #0d6efd;
    text-decoration: underline !important;
}

/* General Settings */

.general-settings .general-settings-items {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -10px;
    justify-content: flex-start;
}

.general-settings .general-s-item {
    flex: 0 0 33.33%;
    box-sizing: border-box;
    padding: 0 10px;
    margin-bottom: 20px;
}

.general-settings .s-item {
    position: relative;
    background-color: #f5f7f9;
    border: 1px solid #efeded;
    border-radius: 18px;
    text-align: center;
    padding: 30px 20px;
    margin: 0 0rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all 300ms ease-in-out;
    height: 100%;
}

.general-settings .s-item .feature-tooltip {
    margin: 0 15px;
}

.general-settings .s-item .feature-tooltip .feature-icon {
    width: 20px;
    height: 20px;
}

.general-settings .s-item .content {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: #000;
    font-size: 1.1rem;
    text-align: right;
}

.general-settings .s-item .content .describe {
    display: block;
    font-size: 13px;
    color: #959cb6;
    margin-top: 2px;
}

.general-settings .s-item .icon i {
    vertical-align: middle;
    font-size: 1.8rem;
    color: var(--globalColor);
}

.general-settings .s-item .icon svg,
.general-settings .s-item .icon svg path {
    fill: var(--globalColor);
}

.general-settings-title {
    font-size: 1.2rem;
    font-weight: 500;
    color: #464457;
    margin-bottom: 1.5rem;
}

.general-settings .s-item .soon {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgb(229 229 229 / 50%);
    border-radius: 14px;
    cursor: not-allowed;
}

.general-settings .s-item .soon-badge {
    padding: 10px 20px 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    background-color: rgba(138, 95, 230, 0.09);
    border: 1px solid #e7dbf9;
    color: #6654ea;
    position: absolute;
    top: 8px;
    left: 15px;
    /* width: 70px; */
    text-align: center;
    font-weight: 600;
    border-radius: 8px;
    line-height: 1;
    font-size: 10px;
}

@media (max-width: 767px) {
    .general-settings .general-s-item {
        flex: 0 0 50%;
    }
}

@media (max-width: 576px) {
    .general-settings .general-s-item {
        flex: 0 0 100%;
    }
}

#customFilterMenu.collapsing {
    transition: height 0.13s ease !important;
}

#collapseLightMode.collapsing,
#collapseDarkMode.collapsing {
    transition: height 0.3s ease !important;
}

/* Search Item */

.search-item-main {
    display: flex;
    align-items: center;
}

.search-item-main .input {
    max-width: 190px;
}

.search-item-main .label {
    position: relative;
    display: block;
    width: 400px;
    border-radius: 10px;
    border: 1px solid #ebedf2;
    padding: 10px 35px 10px 10px;
    margin: 0;
}

.search-item-main .typing-placeholder {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 35px;
    font-size: 13px;
    color: #a7abc3;
    white-space: nowrap;
    overflow: hidden;
    border-left: 2px solid;
    width: 0ch;
    pointer-events: none;
    max-width: max-content;
}

@keyframes typing {
    0% {
        width: 0ch;
    }

    50% {
        width: 34ch;
    }

    /* Typing speed */
    80% {
        width: 34ch;
    }

    /* Pause before deleting */
    100% {
        width: 0ch;
    }

    /* Deletion speed */
}

@keyframes blink {
    from,
    to {
        border-color: transparent;
    }

    50% {
        border-color: #777e90;
    }
}

.typing-placeholder {
    animation: typing 5s steps(34, end) infinite, blink 0.75s step-end infinite;
}

.search-item-main .shortcut {
    position: absolute;
    top: 50%;
    left: 3%;
    transform: translateY(-50%);
    transition: all 0.3s ease;
    color: #a7abc3;
    background-color: #fff;
    padding: 0;
    font-size: 14px;
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.search-item-main .icon-search {
    position: absolute;
    top: 50%;
    right: 3%;
    transform: translateY(-50%);
    transition: all 0.3s ease;
    color: #a7abc3;
    background-color: transparent;
    padding: 0;
    font-size: 14px;
    border-radius: 6px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.search-item-main .search_bar {
    background-color: transparent;
    border: 0;
    outline: none;
    font-size: 14px;
    color: #a1a0a8;
    width: 100%;
}

.search-item-main .search_bar::placeholder {
    font-size: 14px;
    color: #a7abc3;
}

.search-item-main .item-search-results {
    position: absolute;
    top: 102%;
    right: 0;
    left: 0;
    background: #fff;
    outline: 1px solid #ebedf2;
    padding-top: 5px;
    min-height: 230px;
    max-height: 230px;
    overflow-y: auto;
    border-radius: 12px;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    border-top: 0;
    display: none;
}

.search-item-main .label.active {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.search-item-main .label.active .item-search-results {
    display: block;
}

.search-item-main .label.active .typing-placeholder {
    display: none;
    /* Hide placeholder on active state */
}

/* .search-item-main .label.active .typing-placeholder {
    display: none !important;
} */

.item-search-results ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.item-search-results a {
    padding: 12px 20px;
    display: flex;
    color: inherit;
    transition: all 300ms ease-in-out;
    align-items: center;
    gap: 0.5rem;
}

.item-search-results .search_icon {
    display: flex;
    width: 30px;
    height: 30px;
    border-radius: 50px;
    align-items: center;
    justify-content: center;
    background: #f4f6f9;
    color: var(--globalColor);
}

.item-search-results a:hover {
    background-color: #f0f2f5;
}

.search-item-main .item-search-results .search_label {
    padding: 5px 20px 5px;
    color: #000;
    display: block;
}

.search-item-main .no-search-result {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: calc(230px - 5px);
}

.item-search-results.loading::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    z-index: 2;
}

.item-search-results.loading::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 30px;
    height: 30px;
    margin-top: -15px;
    margin-left: -15px;
    background-image: url(../images/loading.gif);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 3;
    filter: invert(1);
}

@media (max-width: 1024px) {
    .search-item-main {
        display: none;
    }
}

/* Input Icon Wrapper */

.input-icon-wrapper {
    position: relative;
    flex: 1;
}

.input-icon-wrapper input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.input-icon-wrapper.no-radius input {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.input-icon-wrapper .icon {
    position: absolute;
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
    cursor: pointer;
}

/* Add Media Wrapper */

.add-media-wrapper {
    position: relative;
}

.add-media-wrapper .delete_btn {
    position: absolute;
    top: 10px;
    left: 10px;
    border-radius: 50px;
    padding: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.add-media-wrapper .delete_btn i {
    padding: 0 !important;
}

/* Download Clients Button */

.downloadClientsBtn {
    display: inline-block;
    width: max-content;
}

.custom-user-select {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    direction: rtl;
    gap: 0.8rem;
}

.custom-user-select img {
    width: 30px;
    height: 30px;
}

/*  Selects  */

.membership_select {
    min-width: 200px;
}

@media (max-width: 576px) {
    .membership_select {
        min-width: auto;
    }
}

.timezones-select .select2-selection--single {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.timezones-select .timezones-select-input {
    width: calc(100% - 54px);
}

/* svg-select-wrapper */
.svg-select-wrapper .select2-results__options {
    display: flex;
    flex-wrap: wrap;
    /* Allow wrapping to the next row */
    justify-content: space-between;
    /* Ensure even spacing between items */
}

.svg-select-wrapper .select2-results__options > li {
    flex: 1 1 calc(20% - 10px);
    box-sizing: border-box;
}

.svg-select-wrapper .select2-results__option {
    padding: 10px 13px;
}

.svg-select-wrapper .custom-user-select {
    display: flex;
    align-items: center;
    direction: rtl;
    gap: 0.8rem;
    background-color: #fcfcfc;
    border: 1px solid #ededed;
    border-radius: 0.25rem;
    width: 35px;
    height: 35px;
    justify-content: center;
}

.svg-select-wrapper .custom-user-select img {
    width: 20px;
    height: 20px;
}

/* App Settings Mode  */

.app-settings-mode {
    margin-bottom: 14px;
    border: 1px solid #ebedf3;
    border-radius: 10px;
}

.app-settings-mode h3 {
    height: auto;
}

.app-settings-mode .btn-link {
    font-size: 1rem;
    font-weight: 500;
    color: #000;
    background: #fff;
    text-decoration: none;
    padding: 15px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.app-settings-mode .btn-link:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    transform: rotate(-180deg);
}

.app-settings-mode .btn-link::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: auto;
    content: "";
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform 0.2s ease-in-out;
}

.app-settings-mode > .card {
    padding: 0;
}

.app-settings-mode > .card:last-of-type {
    border-radius: 10px;
    border: 0;
}

/* .app-settings-mode .card .card-header {
    border-bottom: 1px solid #ebedf2;
} */

.roles-settings-mode .card .card-body {
    border-top: 1px solid #ebedf2;
}

.app-settings-mode .collapse.show > .card,
.app-settings-mode .collapse .card {
    border: 0 !important;
}

/* Roles  */

.roles-settings-mode {
    margin-bottom: 1.5rem;
    border: 1px solid #ebedf3;
    border-radius: 10px;
}

.roles-settings-mode .btn-link {
    font-size: 1rem;
    font-weight: 500;
    color: #000;
    text-decoration: none;
    padding: 15px 12px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

/* .roles-settings-mode .card .card-header {
    border-bottom: 1px solid #ebedf2;
} */
.roles-settings-mode .collapse.show > .card {
    border: 0;
}

.roles-settings-mode .btn-link:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    transform: rotate(-180deg);
}

.roles-settings-mode .btn-link::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: auto;
    content: "";
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform 0.2s ease-in-out;
    transform: rotate(0);
}

.roles-settings-mode > .card {
    padding: 0;
}

.roles-settings-mode > .card:last-of-type {
    border-radius: 10px;
    border: 0;
}

.roles-settings-mode .card .card-body {
    border-top: 1px solid #ebedf2;
}

.roles-settings-mode.points > .card {
    overflow: visible;
}

.roles-settings-mode.points .moveCursor {
    position: relative;
    right: 0;
}

.roles-settings-mode.points .customTooltip {
    font-size: 11px;
}

.roles-settings-mode.points .customTooltip::before {
    z-index: -1;
}

.roles-settings-mode.points .card-header,
.roles-settings-mode.forms-settings .card-header {
    padding-right: 10px;
}

/* Chat */

.chat-card-wrapper {
    display: flex;
    gap: 1rem;
    /* -webkit-box-shadow: 0px 0px 30px 0px rgba(82, 63, 105, 0.05);
    box-shadow: 0px 0px 30px 0px rgba(82, 63, 105, 0.05);
    border: 1px solid #ebedf2; */
}

.chat-card-wrapper > div {
    flex: 1;
}

.chat-card-wrapper .chat_aside {
    max-width: 350px;
}

.chat-card-wrapper .chat_aside a {
    color: #000;
}

.chat-card-wrapper .chat_aside a:hover {
    color: #000;
}

.chat-card-wrapper .chat_aside .badge {
    padding: 2px 0 0 0;
    font-size: 75%;
    width: 20px;
    height: 20px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    /* position: absolute;
    top: 8px;
    left: 17px; */
    background: #f60000 !important;
    color: #fff !important;
    margin-bottom: 10px;
}

.chat-card-wrapper .chat_aside .client-item-msg {
    width: 140px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 10px 0 0;
}

.chat-card-wrapper .chat_aside > .card {
    min-height: 100%;
}

.chat-card-wrapper .chat_aside .card-body {
    padding: 1.25rem 0 0;
}

.chat-card-wrapper .card-header {
    display: flex;
    border-radius: 15px 15px 0 0;
    padding: 1rem 1.25rem;
}

.chat-card-wrapper > .card-body {
    padding: 2rem 2.25rem;
}

.chat-card-wrapper .ps {
    overflow: hidden !important;
    overflow-anchor: none;
    -ms-overflow-style: none;
    touch-action: auto;
    -ms-touch-action: auto;
}

/* .chat-card-wrapper .scroll.scroll-pull {
    padding-left: 12px;
    margin-left: -12px;
} */

.chat-card-wrapper .scroll {
    position: relative;
    overflow: hidden;
}

.chat-card-wrapper .chat_content .card-body {
    padding-top: 0;
    padding-bottom: 0px;
}

.chat-card-wrapper .bg-light-success {
    padding: 10px 15px;
    border-radius: 12px;
    background-color: var(--side-active-bg);
}

.chat-card-wrapper .bg-light-primary {
    padding: 10px 15px;
    border-radius: 12px;
    background-color: var(--side-active-bg);
}

.chat-card-wrapper .card-header {
    background-color: #f5f7f9;
}

.chat-card-wrapper .card-footer {
    background-color: #f5f7f9;
}

.chat-card-wrapper .card-footer textarea {
    background: #fff;
    border: 0;
    height: 44px;
    /* resize: none; */
    padding: 10px;
}

.chat-card-wrapper .card-footer {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.chat-card-wrapper .chat-send {
    min-width: 100px;
    height: 100%;
}

.chat-card-wrapper .chat-actions-btns {
    display: flex;
    gap: 1rem;
}

.chat-card-wrapper .btn.btn-clean {
    height: 44px;
    width: 44px;
}

.chat-card-wrapper .btn.btn-clean,
.chat-card-wrapper .btn.btn-clean i {
    color: var(--globalColor);
    font-size: 16px;
}

.chat-card-wrapper .btn.btn-clean {
    background-color: var(--side-active-bg);
    border-radius: 10px;
}

.chat-card-wrapper .btn.btn-clean:last-child {
    margin-right: 0;
}

.chat-card-wrapper .show > .btn.btn-clean,
.chat-card-wrapper .btn.btn-clean.active,
.chat-card-wrapper .btn.btn-clean:active,
.chat-card-wrapper .btn.btn-clean:hover {
    background-color: var(--side-active-bg);
}

.chat-card-wrapper .search_input .input-group-text {
    background-color: transparent;
    border-left: 0;
}

.chat-card-wrapper .search_input .form-control {
    border-right: 0;
}

.chat-card-wrapper .scroll-pull::-webkit-scrollbar {
    width: 3px;
    height: 5px;
}

.chat-card-wrapper .scroll-pull::-webkit-scrollbar-track {
    background: #ffffff;
    border-radius: 15px;
}

.chat-card-wrapper .scroll-pull::-webkit-scrollbar-thumb {
    background-color: #eff0f5;
    border-radius: 15px;
    height: 5px;
    -webkit-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}

.chat-card-wrapper .scroll-pull::-webkit-scrollbar-thumb:hover {
    background-color: #eff0f5;
}

.chat-card-wrapper .attachemnt {
    display: block;
}

.chat-card-wrapper .attachemnt {
    margin-bottom: 1rem;
}

.chat-card-wrapper .attached-chat-image img {
    border-radius: 15px;
}

.chat-card-wrapper .attachemnt p {
    margin-bottom: 0;
    margin-top: 10px;
    text-align: center;
    color: #000;
}

.chat-card-wrapper .attachemnt {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
}

.chat-card-wrapper .attached-chat-file img {
    max-width: 100px;
}

.chat-card-wrapper .attached-chat-image p {
    display: none;
}

.chat-card-wrapper .admin_reply,
.chat-card-wrapper .user_reply {
    position: relative;
}

.chat-card-wrapper .admin_reply::before {
    content: "";
    width: 0;
    height: 0;
    border-right: 15px solid var(--side-active-bg);
    border-top: 8px solid transparent;
    border-bottom: 10px solid transparent;
    position: absolute;
    bottom: 10px;
    right: -15px;

    transform: rotate(180deg);
}

.chat-card-wrapper .user_reply::before {
    content: "";
    width: 0;
    height: 0;
    border-right: 15px solid var(--side-active-bg);
    border-top: 8px solid transparent;
    border-bottom: 10px solid transparent;
    position: absolute;
    bottom: 8px;
    left: -14px;
    /* transform: rotate(180deg); */
}

.chat-card-wrapper .user_reply .bg-light-success {
    background-color: #f3f5fa;
}

.chat-card-wrapper .user_reply::before {
    border-right: 15px solid #f3f5fa;
}

/* .chat-card-wrapper .attached-chat-file {
    padding: .7rem 1rem;
    background-color: #f4f6fa;
    color: inherit;
} */

.chat_aside .search_input {
    padding: 0 1.25rem;
    background: transparent;
    position: relative;
    top: -0.625rem;
}

.chat_aside .client-item {
    position: relative;
    padding: 1.5rem 1.25rem;
    border-bottom: 1px solid #ebedf3;
    cursor: pointer;
}

.chat_aside .client-item:hover {
    background-color: #f5f7f9;
}

.chat_aside .client-item.active {
    background: #f5f7f9;
}

.chat_aside .client-item:last-child {
    border-bottom: 0;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}

.chat_aside .client-item .msg-info {
    width: 100px;
    text-align: center;
    font-size: 12px;
}

.chat-card-wrapper .chat_content .card {
    height: 100%;
    padding-bottom: 0;
}

.chat-card-wrapper .chat-text-editor {
    flex: 1;
    background-color: #fff;
    border: 1px solid #ebedf3;
    border-radius: 10px;
}

.chat-card-wrapper .chat-text-editor .chat-editor-attachemnt {
    padding: 1rem;
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
}

.chat-card-wrapper .item-attached {
    position: relative;
    width: 200px;
    height: 200px;
    border-radius: 10px;
}

.chat-card-wrapper .item-attached img {
    width: 100%;
    border-radius: 10px;
    object-fit: cover;
    height: 100%;
}

.chat-card-wrapper .item-attached .remove_icon {
    position: absolute;
    top: -6px;
    left: -6px;
    color: #fff;
    background: red;
    width: 20px;
    height: 20px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
}

.chat-card-wrapper .item-attached .remove_icon i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-48%, -47%);
}

.chat-card-wrapper .chat-text-editor .chat-text-attachments {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 0 10px;
}

.chat-card-wrapper .chat-text-editor .item-attached {
    width: 85px;
    height: 85px;
    border-radius: 10px;
    border: 1px solid transparent;
    padding: 0px;
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.msg-attachment {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1rem;
}

.msg-attachment .item-attached > a {
    position: relative;
    display: flex;
    width: 200px;
    height: 200px;
    border-radius: 10px;
    align-items: center;
    justify-content: center;
}

.msg-attachment .item-attached img {
    max-width: 100%;
    border-radius: 10px;
    height: 100%;
    object-fit: cover;
}

.msg-attachment .item-attached span {
    display: block;
    text-align: center;
    margin-top: 5px;
}

.chat_content .item-attached.file {
    width: auto;
    height: auto;
}

.chat_content .item-attached.file > a {
    width: auto;
    height: auto;
    font-size: 15px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 10px 12px;
    background: #eef1f4;
    border-radius: 10px;
    color: #000;
}

.chat_content .item-attached.file > a i {
    color: var(--globalColor);
}

.chat_content .item-attached.file span {
    margin-top: 0;
    width: 140px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.msg-attachment .item-attached.files {
    position: relative;
    height: 120px;
    background: #eef1f4;
    padding: 10px;
    border-radius: 20px;
    display: flex;
    min-width: auto;
    width: max-content;
    align-items: center;
    margin-bottom: 1.5rem;
}

.msg-attachment .item-attached.files a {
    display: block;
    max-width: 100%;
    height: 100%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.msg-attachment .item-attached.files a img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    margin: 0 auto;
    border-radius: 10px;
}

@media (max-width: 767px) {
    .chat-card-wrapper {
        flex-direction: column;
    }

    .chat-card-wrapper .chat_aside {
        max-width: 100%;
    }

    .chat-card-wrapper .scroll-pull-clients {
        max-height: 250px;
        overflow-y: scroll;
    }

    .no-chats-opened {
        min-height: 200px;
    }

    .chat_content > card {
        padding-bottom: 0;
    }

    /* .chat_aside .client-item:first-child {
        padding-top: 0;
    } */

    .chat-card-wrapper .scroll {
        height: 250px;
    }

    .chat-card-wrapper .admin_reply,
    .chat-card-wrapper .user_reply {
        margin-bottom: 1rem;
    }

    .chat-card-wrapper .card-footer {
        flex-wrap: wrap;
    }

    .chat-card-wrapper .chat-text-editor {
        width: 100%;
        min-width: 100%;
    }

    .chat-card-wrapper .card-footer > div {
        flex: auto;
    }

    .chat-card-wrapper .chat-actions-btns {
        justify-content: flex-end;
    }
}

.chat-card-wrapper.newUserContact .chat_aside {
    max-width: 100%;
}

.chat-card-wrapper.newUserContact .chat_aside > .card {
    border: 0;
    border-radius: 0;
    background-color: transparent;
}

.chat-card-wrapper.newUserContact .chat_aside a:last-child:hover {
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
}

.chat-card-wrapper.newUserContact .scroll-pull-clients {
    padding-left: 0;
    margin-left: 0;
}

.chat-card-wrapper.newUserContact .chat_aside .client-item-msg {
    direction: ltr;
    padding-top: 4px;
}

.chat-card-wrapper.newUserContact .userContact_noresult {
    padding: 2.5rem 1.5rem;
    text-align: center;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.chat-card-wrapper.newUserContact .userContact_noresult .icon {
    display: flex;
    text-align: center;
    width: 70px;
    height: 70px;
    background: #f4f6f9;
    border-radius: 50px;
    align-items: center;
    justify-content: center;
    color: #bec3c9;
    font-size: 24px;
    margin: 0 auto 1rem;
}

.chats_unread_count {
    min-width: 20px;
    width: max-content;
    padding: 7px 5px 5px 5px;
    height: 20px;
    background-color: #f60000;
    border-radius: 50px;
    /* margin-right: 10px; */
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 11px;
    position: absolute;
    top: -4px;
    right: -1px;
    margin: 0;
}

.chat-file-item {
    position: relative;
    padding: 0.5rem;
    display: flex;
    border-radius: 0.25rem;
    background-color: #f5f7f9;
}

.chat-file-item .file-head {
    display: flex;
    align-items: center;
    color: #343a40;
    gap: 0.5rem;
    padding-bottom: 0.5rem;
}

.chat-file-item .file-head > span {
    max-width: 200px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.chat-file-item .file-details {
    display: flex;
    align-items: center;
    color: #a7abc3;
    gap: 10px;
    font-size: 12px;
}

.chat-file-item .file-download {
    margin: 0;
    position: relative;
    top: -1.5px;
}

.chat-file-item .file-download button {
    padding: 0 !important;
}

.chat-file-item .file-download button i {
    padding-left: 0;
    color: #a7abc3;
}

.chat-file-item .remove_icon {
    position: absolute;
    top: -6px;
    left: -6px;
    color: #fff;
    background: red;
    width: 20px;
    height: 20px;
    border-radius: 50px;
    /* display: flex;
    align-items: center;
    justify-content: center; */
    border: 0;
}

.chat-file-item .remove_icon i {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-48%, -47%);
}

.chat-msg-loading {
    filter: invert(1);
    padding: 20px 0;
}

.no-chats-opened {
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #f0f2f5;
    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
    border-radius: 15px;
    background-color: #fff;
}

.no-chats-opened-item .icon {
    display: flex;
    text-align: center;
    width: 100px;
    height: 100px;
    background: #f4f6f9;
    border-radius: 50px;
    align-items: center;
    justify-content: center;
    color: #bec3c9;
    font-size: 37px;
    margin: 0 auto 1rem;
}

.no-chats-opened-item .icon svg {
    fill: #bec3c9;
}

.chat-text-attachments .progress-bar {
    background-color: var(--globalColor);
}

.chat-text-attachments .progress {
    border-radius: 15px;
    height: 1.3rem;
}

.progress-files {
    /* background-color: #f5f7f9; */
    border-radius: 20px;
    position: relative;
    margin: 15px 0;
    height: 30px;
    width: 300px;
}

.progress-files .progress-done {
    background: var(--globalColor);
    border-radius: 20px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 0;
    opacity: 0;
    transition: 1s ease 0.3s;
}

/* Tagify */

.tagify {
    --tag-bg: #f5f7f9 !important;
    --tag-hover: #f5f7f9 !important;
    --tags-border-color: #ebedf3 !important;
}

.tagify__tag {
    border: 1px solid #ebedf3;
    border-radius: 5px;
}

.tagify__tag:focus div::before,
.tagify__tag:hover:not([readonly]) div::before {
    --tag-bg-inset: 0 !important;
    --tag-bg: #fff !important;
}

.tagify__tag__removeBtn:hover + div::before {
    box-shadow: none !important;
}

/* .tagify__tag__removeBtn:hover {
    background: #f5f7f9 !important;
} */

/* .loader {
    width: 60px;
    aspect-ratio: 4;
    --_g: no-repeat radial-gradient(circle closest-side, var(--globalColor) 90%, transparent);
    background:
        var(--_g) 0% 50%,
        var(--_g) 50% 50%,
        var(--_g) 100% 50%;
    background-size: calc(100%/3) 100%;
    animation: l7 1s infinite linear;
} */

@keyframes l7 {
    33% {
        background-size: calc(100% / 3) 0%, calc(100% / 3) 100%,
            calc(100% / 3) 100%;
    }

    50% {
        background-size: calc(100% / 3) 100%, calc(100% / 3) 0%,
            calc(100% / 3) 100%;
    }

    66% {
        background-size: calc(100% / 3) 100%, calc(100% / 3) 100%,
            calc(100% / 3) 0%;
    }
}

#rateCounter {
    opacity: 0;
}

#rateCounter.show {
    opacity: 1;
}

.tagify__tag {
    margin-block: 8px !important;
}

.tagify__input {
    padding: 0.6em 0.5em !important;
}

/* Spinner Buttons */
/* aspect-ratio: 4;
--_g: no-repeat radial-gradient(circle closest-side, #ffffff 90%, transparent);
background:
    var(--_g) 0%   50%,
    var(--_g) 50%  50%,
    var(--_g) 100% 50%;
background-size: calc(100%/3) 100%;
animation: l7 2.5s infinite linear; */

/*
.kt-grid__item.kt-grid__item--fluid.kt-grid.kt-grid--hor {
    background: #fff;
    border-top-right-radius: 50px;
}


.kt-grid__item.kt-grid__item--fluid.kt-grid.kt-grid--hor.kt-wrapper {
    background: linear-gradient(90deg, rgba(15,11,51,1) 10%, rgba(21,16,62,1) 50%);
    border-radius: 0;
}

.block-line {
    background-color: #fff;
}

@media (min-width: 1025px) {
    .kt-header--fixed.kt-subheader--fixed.kt-subheader--enabled .kt-wrapper {
        padding-top: 20px !important;
    }
    .kt-header {
        background-color: transparent;
        border-bottom: 0;
    }
} */

/* Responsive Fixs */

@media (max-width: 1024px) {
    .kt-content {
        padding: 14px 10px;
    }

    .kt-header-mobile {
        padding: 0 10px;
        box-shadow: none;
    }

    .kt-subheader {
        padding: 2px 10px;
    }

    .kt-header.kt-grid__item {
        display: none;
    }

    .kt-portlet .kt-portlet__head,
    .kt-portlet .kt-portlet__body {
        padding: 17px 0px;
    }
}

@media (max-width: 768px) {
    .kt-portlet .kt-portlet__head,
    .kt-portlet .kt-portlet__body {
        padding: 15px 10px;
    }
}

@media (max-width: 576px) {
    .summery_card.vertical .main-chart {
        border-top-left-radius: 0;
    }

    .filter-column {
        margin-bottom: 1rem;
    }

    .app-settings-mode {
        margin-bottom: 1rem;
    }

    .card-body + .app-settings-mode {
        padding: 0;
    }

    .no-reulst-note {
        height: 300px !important;
    }

    .custom-card-box .card-body {
        padding: 1rem;
    }

    .card-body {
        padding: 1.25rem 0.8rem;
    }

    .nav-categories-list {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        overflow-y: hidden;
    }

    .nav-categories-list .nav-item .nav-link {
        white-space: nowrap;
    }

    /* Make the scrollbar wider */
    .nav-categories-list::-webkit-scrollbar {
        width: 3px;
        height: 8px;
    }

    /* Adjust the scrollbar track color */
    .nav-categories-list::-webkit-scrollbar-track {
        background-color: #f6f7fd;
        border-radius: 5px;
    }

    /* Make the scrollbar thumb more visible */
    .nav-categories-list::-webkit-scrollbar-thumb {
        background-color: #f7f8fa;
        /* Darker color */
        border-radius: 5px;
        height: 10px;
        transition: background-color 0.3s ease-in-out;
    }

    /* Change color on hover */
    .nav-categories-list::-webkit-scrollbar-thumb:hover {
        background-color: #888888;
    }

    .reports_wrapper .kt-portlet__body {
        padding: 15px 0;
    }

    .reports_wrapper .kt-portlet__body > .card {
        padding-bottom: 0;
        margin-bottom: 1rem;
    }

    /* .input-group.input-group-solid {
        gap: 1rem;
        padding: 0 7px;
    } */

    .input-group.input-group-solid .input-group.input-group-solid {
        padding: 0 0px;
    }

    .input-group.input-group-solid .form-control {
        width: 100%;
        flex: 1;
    }

    .iti input,
    .iti input[type="text"],
    .iti input[type="tel"] {
        width: 100% !important;
    }

    .input-group.input-group-solid > .col {
        padding: 0;
    }

    /* .summery_card .statics-items {
        display: block;
    } */

    .summery_card .statics-items.no-memberships {
        min-height: 150px;
        display: flex;
        align-items: center;
        justify-content: center;
        top: -20px;
    }

    .back_wrapper > span {
        position: relative;
        top: 2px;
    }

    .reports_wrapper .login_card_item.horizontal .inner h4 {
        white-space: wrap;
        text-align: center;
    }

    .reports_wrapper .login_card_item.horizontal .inner h4 .text-success,
    .reports_wrapper .login_card_item.horizontal .inner h4 .text-danger {
        display: block;
    }

    .kt-portlet
        .kt-portlet__head
        .kt-portlet__head-label
        .kt-portlet__head-title {
        font-size: 14px;
    }
}

.daterangepicker {
    border-radius: 10px !important;
}

.daterangepicker .ranges ul {
    margin: 0 !important;
}

.daterangepicker .ranges li {
    min-width: 140px !important;
}

@media (min-width: 564px) {
    .daterangepicker .ranges ul {
        width: 100% !important;
    }
}

.daterangepicker:before {
    right: 15px;
}

.daterangepicker::after {
    right: 16px;
}

@media (min-width: 767px) {
    .vue-daterange-picker .daterangepicker {
        right: 50px !important;
    }
}

.vacation-dropdown .dropdown-item {
    padding: 1rem 1.2rem;
    cursor: pointer;
}

.vacation-dropdown .dropdown-item label {
    cursor: pointer;
}

.vacation-dropdown .dropdown-menu {
    min-width: 16rem;
}

.vacation-dropdown .dropdown-item-send {
    padding: 1rem;
}

.dropdown-overlay.active {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.1) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 1040;
}

.dropdown-overlay-wrapper.show .dropdown-toggle:after {
    transform: rotate(180deg);
}

.vue-apexcharts .apexcharts-canvas {
    direction: rtl !important;
}

/* Home Steps Card */

.home-steps-card {
    display: flex;
    align-items: center;
    padding: 1.7rem 1.29rem;
    color: inherit;
    border-radius: 15px;
    background-color: #fff;
    border: 1px solid #f0f2f5;
}

.home-steps-card .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 50px;
    height: 50px;
    margin: 0 0 0 10px;
    background: #f4f6f9;
    color: var(--globalColor);
    border-radius: 99px;
    text-align: center;
    font-size: 22px;
}

.home-steps-card .icon i {
    font-weight: 500;
}

.home-steps-card .inner h3 {
    font-size: 1.1rem;
    margin: 0;
    text-align: start;
    font-weight: 500;
    line-height: 24px;
}

.home-steps-card .go-button {
    margin-right: auto;
}

.home-steps-card .go-button .btn-main {
    height: 40px;
    padding: 1rem 2rem;
    white-space: nowrap;
}

.home-steps-card .go-arrow-icon i {
    color: #b6b6b6;
}

.home-steps-card .go-button .btn-main.btn-review {
    background-color: rgba(138, 95, 230, 0.1) !important;
    border-color: rgba(138, 95, 230, 0.1) !important;
    color: #6654ea;
    padding: 1rem 1rem;
}

.home-steps-card .check-icon {
    width: 15px;
    height: 15px;
    background-color: #039474;
    color: #fff;
    border-radius: 50px;
    display: inline-block;
    line-height: 15px;
    text-align: center;
    font-size: 9px;
    margin-left: 3px;
    vertical-align: middle;
    padding: 0;
}

.home-steps-card .btn-step-complete {
    background-color: rgba(16, 171, 123, 0.1);
    color: #10ab7b;
    height: 40px;
    border-radius: 10px;
    white-space: nowrap;
}

@media (max-width: 767px) {
    .home-steps-card {
        margin-bottom: 1rem;
    }
}

.steps-progress {
    background-color: #f3f5f7;
    border-radius: 50px;
    margin-bottom: 1.25rem;
}

.steps-progress .progress-bar {
    background-color: #6654ea;
}

/* New Home Cards */

.home-statics-card {
    display: flex;
    align-items: center;
    padding: 1.29rem 0;
    color: inherit;
}

.home-statics-card .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    margin: 0 0 0 10px;
    background: #f4f6f9;
    color: var(--globalColor);
    border-radius: 99px;
    text-align: center;
    font-size: 18px;
}

.home-statics-card .icon i {
    font-weight: 500;
}

.home-statics-card .inner h4 {
    font-size: 13px;
    text-align: right;
    margin-bottom: 5px;
    font-weight: 500;
    white-space: nowrap;
    color: #8193ae;
}

.home-statics-card:hover .inner h4 {
    color: #8193ae;
}

.home-statics-card .inner h3 {
    font-size: 1.2rem;
    margin: 0;
    text-align: right;
    font-weight: 500;
}

.home-statics-card .go-arrow-icon {
    margin-right: auto;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.home-statics-card .go-arrow-icon i {
    color: #b6b6b6;
}

.summery_card .statics-items .item:nth-child(1) .icon {
    background-color: rgba(64, 129, 255, 0.1);
    color: #4081ff;
}

.summery_card .statics-items .item:nth-child(1) .icon {
    color: #4081ff;
}

.summery_card .statics-items .item:nth-child(2) .icon {
    /* background-color: rgba(239, 173, 66, .1);
    color: #efad42; */
    background-color: rgb(255, 73, 1, 0.1);
    color: #ff4901;
}

.summery_card .statics-items .item:nth-child(2) .icon {
    color: #ff4901;
}

.summery_card .statics-items .item:nth-child(3) .icon {
    background-color: rgba(138, 95, 230, 0.1);
    color: #6654ea;
}

.summery_card .statics-items .item:nth-child(3) .icon {
    color: #6654ea;
}

.summery_card .statics-items .item:nth-child(4) .icon {
    background-color: rgb(255, 73, 1, 0.1);
    color: #ff4901;
    /* background-color: rgb(239, 173, 66, .1);
    color: #efad42; */
}

.summery_card .statics-items .item:nth-child(4) .icon {
    color: #ff4901;
    /* color: #efad42; */
}

.summery_card .statics-items .item.rates .icon {
    background-color: rgb(255, 73, 1, 0.1);
    color: #ff4901;
}

.summery_card .statics-items .item.rates .icon {
    background-color: rgb(118, 188, 199, 0.1);
    color: #76bcc7;
}

.summery_card .statics-items .item.rates .icon {
    /* color: #FF4901; */
    color: #76bcc7;
}

.main-statics .chart-button {
    display: flex;
    align-items: center;
    gap: 1rem;
    position: relative;
    top: -5px;
}

.main-statics .chart-button button {
    border: 0;
    border-radius: 0;
    height: auto;
    padding: 8px 3px !important;
    border-bottom: 2px solid transparent;
}

.main-statics .chart-button button.active {
    background-color: transparent !important;
    color: var(--globalColor);
    border-bottom: 2px solid var(--globalColor) !important;
}

.main-statics .chart-button button:hover {
    background-color: transparent !important;
    border-bottom: 2px solid var(--globalColor) !important;
}

/* .summery_card .main-chart-title {
    padding-bottom: 15px;
} */

.orders-horizontal-table {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 0;
    border-bottom: 1px solid #f0f0f0;
    font-weight: 500;
    gap: 1rem;
}

.orders-horizontal-table:last-child {
    border-bottom: 0;
}

.orders-horizontal-table .order-client-name {
    color: var(--globalColor);
    margin-top: 10px;
}

.orders-horizontal-table .order-client-name a {
    color: var(--globalColor);
}

.orders-horizontal-table .order-client-name a:hover {
    color: var(--globalColor);
}

.orders-horizontal-table .IdNumWrapper {
    position: relative;
    right: auto;
}

.orders-horizontal-table .IdNumWrapper a {
    color: #101010;
}

.orders-horizontal-table .order-shipping-name {
    color: #101010;
}

.orders-horizontal-table .order-shipping-name i {
    margin-left: 5px;
    vertical-align: middle;
}

.orders-horizontal-table .order-price {
    text-align: left;
    font-size: 15px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    white-space: nowrap;
}

.orders-horizontal-table .order-price:last-child {
    margin-top: 0;
}

.orders-horizontal-table .order-payment-status {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-top: 5px;
    gap: 0.5rem;
}

.orders-horizontal-table .order-info-side {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.orders-horizontal-table .order-info-side:first-child {
    flex: 1;
    min-width: 0;
}

.orders-horizontal-table .order-info-side:last-child {
    text-align: left;
    align-items: flex-end;
}

.orders-horizontal-table-wrapper {
    max-height: 400px;
    padding: 0 1rem;
    border-bottom: 1px solid #f3f3f3;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.orders-horizontal-table-wrapper:last-child {
    border-bottom: 0;
}

/* Customize the scrollbar track (background) */
.orders-horizontal-table-wrapper::-webkit-scrollbar {
    width: 3px;
    /* Width of the vertical scrollbar */
    height: 3px;
    /* Height of the horizontal scrollbar */
}

/* Customize the scrollbar track (background) */
.orders-horizontal-table-wrapper::-webkit-scrollbar-track {
    background: #ebedf2;
    /* Light gray background */
    border-radius: 2px;
}

/* Customize the scrollbar thumb */
.orders-horizontal-table-wrapper::-webkit-scrollbar-thumb {
    background: var(--globalColor);
    /* Darker thumb color */
    border-radius: 2px;
}

/* On hover, change thumb color */
.orders-horizontal-table-wrapper::-webkit-scrollbar-thumb:hover {
    background: var(--globalColor);
    /* Darker color on hover */
}

.custom-icon {
    font-size: 16px;
    vertical-align: middle;
    margin-inline-end: 5px;
}

.orders-list h3 {
    color: var(--globalColor);
}

.orders-list .go-icon-arrow {
    color: #b6b6b6;
}

/* Responsive styles for orders horizontal table */
@media (max-width: 768px) {
    .orders-horizontal-table {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
        padding: 1rem 0;
    }

    .orders-horizontal-table .order-info-side:last-child {
        width: 100%;
        align-items: flex-start;
    }

    .orders-horizontal-table-wrapper {
        padding: 0 0.5rem;
    }
}

.select2-container--default
    .select2-selection--single
    .select2-selection__arrow:before,
.select2-container--default
    .select2-selection--multiple
    .select2-selection__arrow:before,
.nav-link.dropdown-toggle:after,
.btn.dropdown-toggle:after {
    content: "\f10d";
    font-family: uicons-regular-rounded !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    /* line-height: 1; */
    vertical-align: bottom;
    /* font-size: 16px; */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 10px;
    vertical-align: middle;
}

.points-circle {
    width: 7px;
    height: 7px;
    display: inline-block;
    border-radius: 50px;
    background-color: #000;
    margin-left: 5px;
}

.reports-head-cards a:hover {
    color: inherit;
}

/* Subscription Page */
.card-packages-wrapper {
    margin-bottom: 30px;
    display: flex;
    gap: 50px;
    /* justify-content: center; */
    padding: 0 1.25rem;
}

@media (max-width: 767px) {
    .card-packages-wrapper {
        margin: 0px 0 20px;
        flex-direction: column;
        align-items: center;
        padding: 0;
    }
}

/* .plan-subscription-card .card-body {
    padding: 40px 20px;
} */

.plan-subscription-card .plan-name {
    font-size: 18px;
    color: var(--globalColor);
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.plan-subscription-card .plan-name .badge {
    font-size: 14px;
    font-weight: 500;
    vertical-align: middle;
    border-radius: 0.5rem;
    padding: 0.7em 0.85em;
    background-color: rgba(138, 95, 230, 0.1) !important;
    color: #6654ea;
}

.badge-purple {
    background-color: rgba(138, 95, 230, 0.1) !important;
    color: #6654ea;
}

.plan-subscription-card .plan-expire {
    font-size: 13px;
}

.plan-subscription-card .plan-expire .badge.badge-warning-3 {
    font-size: 13px;
    font-weight: 500;
    vertical-align: middle;
    border-radius: 0.5rem;
    padding: 0.7em 0.85em 0.6em;
}

.plan-subscription-card .btn-upgrade-package {
    width: 120px;
    /* margin-right: auto; */
    background: #000000 !important;
    border-color: #000000 !important;
    color: #fff !important;
    position: relative;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
    padding: 0 5px;
}

.plan-subscription-card .btn-upgrade-package img {
    position: relative;
    left: -2px;
}

.plan-subscription-card .btn-upgrade-package::before {
    content: "";
    position: absolute;
    width: 100px;
    height: 100%;
    background-image: linear-gradient(
        120deg,
        rgba(255, 255, 255, 0) 30%,
        rgba(255, 255, 255, 0.8),
        rgba(255, 255, 255, 0) 70%
    );
    top: 0;
    left: -100px;
    opacity: 0.6;
    animation: shine 2.5s ease-out infinite;
}

.subscription-wrapper .subscription-tilte {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 1rem;
}

.subscription-wrapper .upgrade_pay_icons {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: row-reverse;
    gap: 0.5rem;
}

.subscription-wrapper .upgrade_pay_icons img {
    width: 34px;
    margin: 0 !important;
}

.subscription-wrapper .nav-link.active .upgrade_pay_icons img[src*="visa.png"],
.subscription-wrapper .nav-link.active .upgrade_pay_icons img[src*="apple_pay"],
.subscription-wrapper .nav-link.active .upgrade_pay_icons img[src*="mada.png"],
.subscription-wrapper .nav-link.active img[src*="bank-transfer.png"] {
    filter: invert(1) brightness(100);
}

.subscription-wrapper .nav-link.active {
    color: #fff !important;
}

@media (max-width: 576px) {
    .subscription-wrapper .upgrade_pay_icons img {
        width: 28px;
    }
}

.subscription-wrapper .radio-input {
    display: flex;
    gap: 10px;
    flex-direction: row;
    justify-content: flex-start;
}

.subscription-wrapper .radio-input * {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

.subscription-wrapper .radio-input label {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 0px 0;
    min-width: 120px;
    justify-content: center;
    cursor: pointer;
    height: 50px;
    position: relative;
    border: 1px solid #ebedf3;
    border-radius: 10px;
    flex: 1 23.33%;
}

@media (max-width: 991px) {
    .subscription-wrapper .radio-input {
        flex-wrap: wrap;
    }

    .subscription-wrapper .radio-input label {
        width: 48%;
        flex: 1 48%;
    }
}

.subscription-wrapper .radio-input label::before {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    min-width: 120px;
    height: 45px;
    z-index: -1;
    transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    border-radius: 8px;
    border: 2px solid transparent;
}

.subscription-wrapper .radio-input label:hover::before {
    transition: all 0.2s ease;
    background-color: #2a2e3c;
}

.subscription-wrapper .radio-input .label:has(input:checked) {
    background-color: var(--side-active-bg-third);
    border-color: #000000;
    color: #fff;
    height: 50px;
}
/* Dark theme keeps its purple selected highlight from dark-mode-styles.css.
   The black border above is light-mode only — overridden by the dark
   .label:has(input:checked) rule because dark-mode-styles.css loads last. */

@media (max-width: 576px) {
    .subscription-wrapper .radio-input label {
        width: 48%;
    }
    .subscription-wrapper .radio-input .label .text {
        white-space: nowrap;
    }
}

.subscription-wrapper .radio-input .label .text {
    color: #000;
}

.subscription-wrapper .radio-input .label input[type="radio"] {
    background-color: #202030;
    appearance: none;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    position: absolute;
}

.subscription-wrapper .radio-input .label input[type="radio"]:checked {
    background-color: var(--globalColor);
    -webkit-animation: puls 0.7s forwards;
    animation: pulse 0.7s forwards;
}

.subscription-wrapper .radio-input .label input[type="radio"]:before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    transition: all 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
    background-color: #fff;
    transform: scale(0);
}

.subscription-wrapper .radio-input .label input[type="radio"]:checked::before {
    transform: scale(1);
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4);
    }

    70% {
        box-shadow: 0 0 0 8px rgba(255, 255, 255, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
    }
}

/* Product */

.productItem {
    border: 1px solid #ebedf3;
    background-color: #ffffff;
    margin-bottom: 15px;
    -webkit-transition: all 300msease-in-out;
    transition: all 300msease-in-out;
    position: relative;
    border-radius: 12px;
    padding-bottom: 15px;
    overflow: hidden;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    flex-direction: column;
    height: 100%;
}

.productItem .image {
    flex: auto;
    width: 100%;
    align-items: flex-start;
}

.productItem .image a {
    width: 100%;
    display: block;
    height: 100%;
    align-items: unset;
}

.productItem .image > a > img {
    display: block;
    width: 100%;
    height: auto;
    max-height: unset;
    max-width: 100%;
    border-radius: 5px;
}

.productItem .productTitle {
    padding: 15px 15px 8px;
}

.productItem .productTitle h3 {
    font-size: 15px;
    color: #1f2937;
    font-weight: 700;
    min-height: 25px;
    margin-bottom: 0;
    padding-top: 0;
}

.productItem .productPrice {
    padding: 0 15px 10px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

.productItem .productPrice p {
    font-size: 16px;
    color: #231f1e;
    margin-bottom: 0;
    font-weight: 500;
}

.productItem .productPrice p .icon-currency-sar {
    margin: 0 5px;
}

.productItem .floating-options {
    padding: 0 12px;
    width: 100%;
    text-align: center;
    transition: all 400ms ease-in-out;
}

.productItem .productAddCart {
    display: block;
    width: 100%;
}

.productItem .productAddCart button,
.productItem .productAddCart a {
    display: flex;
    border-radius: 12px;
    align-items: center;
    justify-content: center;
    background-color: var(--globalColor);
    color: #fff;
    font-size: 13px;
    cursor: pointer;
    line-height: 0 !important;
    outline: none;
    width: 100%;
    min-height: 41px;
    border: 1px solid var(--globalColor);
}

.productItem .productAddCart button svg,
.productItem .productAddCart a svg {
    margin-left: 10px;
}

.productItem .productAddCart button i,
.productItem .productAddCart a i {
    margin: 0 10px 2px;
}

.productItem .productAddCart button span,
.productItem .productAddCart a span {
    font-weight: 700;
}

.productItem .productAddCart button img {
    width: 22px;
    /* margin-left: 8px; */
    vertical-align: bottom;
}

.productItem .productAddCart button:hover,
.productItem .productAddCart a:hover {
    background-color: var(--globalColor);
    color: #fff;
}

/* .upgrade_modal_custom .modal-header,
.upgrade_modal_custom .modal-content{
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    border-radius: 0 !important;
    border: 0;
} */

.upgrade_modal_custom .alert-warning {
    margin-bottom: 1.25rem;
}

.upgrade_modal_custom .alert-warning h3 {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 0.2rem;
}

.upgrade_modal_custom .alert-warning p {
    font-size: 13.935px;
    margin-bottom: 0;
}

.upgrade_modal_custom .IdNumWrapper {
    display: flex;
    justify-content: space-between;
    right: 0;
}

.IdNumWrapper .copyToClipboardBtn {
    visibility: visible;
    color: var(--globalColor);
}

.table .IdNumWrapper .copyToClipboardBtn {
    position: relative;
    color: var(--globalColor);
    display: inline-block;
}

.table td:nth-child(1) .IdNumWrapper .copyToClipboardBtn,
.table td:nth-child(2) .IdNumWrapper .copyToClipboardBtn {
    color: #0d6efd;
}

.upgrade_modal_custom .transfer-info {
    padding: 0 3px;
}

.upgrade_modal_custom .newUploading .text {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.pp-switch .toggle,
.pp-switch .toggler {
    display: inline-block;
    vertical-align: middle;
    margin: 5px 10px;
}

.pp-switch .toggler {
    color: #000;
    transition: 0.2s;
    font-weight: normal;
}

.pp-switch .toggler--is-active {
    color: #000;
}

.pp-switch .toggle {
    position: relative;
    width: 50px;
    height: 30px;
    border-radius: 50px;
    background-color: #e9e9ea;
    border: 1px solid #e9e9ea;
    overflow: hidden;
}

/* .pp-switch .toggle.active {
    background: #6654EA;
    border: 1px solid #6654EA;
} */

.pp-switch .toggle.active .switch {
    background: #000;
}

.pp-switch .check {
    position: absolute;
    display: block;
    cursor: pointer;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 6;
}

.pp-switch .check:checked ~ .switch {
    left: 2px;
    right: 45%;
    transition: 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition-property: left, right;
    transition-delay: 0.08s, 0s;
}

.pp-switch .switch {
    position: absolute;
    left: 2px;
    top: 50%;
    transform: translateY(-50%);
    bottom: 2px;
    right: 5%;
    background: #000;
    border-radius: 36px;
    z-index: 1;
    transition: 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    transition-property: left, right;
    transition-delay: 0s, 0.08s;
    width: 24px;
    height: 24px;
    border-radius: 50px;
}

.pp-switch {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
}

/* .card-packages-wrapper {
    display: flex;
    align-items: center;
} */

.card-single-plan {
    position: relative;
    padding: 40px 20px;
    max-width: 100%;
    background: #f4f6f9;
    border-radius: 30px;
    margin-bottom: 1rem;
    text-align: center;
}

.card-single-plan .icon {
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 50px;
    font-size: 30px;
    margin: 0 auto;
    color: #000;
}

.card-single-plan .titles {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 20px 0 20px;
    width: 100%;
}

.card-single-plan .titles h2 {
    color: #444;
    font-size: 20px;
    font-weight: 800;
    margin: 0px auto 0;
}

.card-single-plan .titles p {
    color: #666;
    margin-bottom: 0;
}

.card-single-plan .pricing-header {
    padding: 1rem 0;
    text-align: center;
    color: #000;
    font-weight: 700;
}

.card-single-plan .pricing-header.free {
    margin: 40px 0;
}

.card-single-plan .price-value {
    font-size: 40px;
    font-weight: 500;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-single-plan .price-value i {
    font-size: 30px;
}

.card-single-plan .saved-amount-label {
    position: absolute;
    top: 15px;
    left: 20px;
    font-weight: 700;
}

.discountPrice {
    color: #8d8f9c;
    font-size: 23px;
    margin: 0 5px;
    text-decoration: line-through;
}

.discountPrice i {
    font-size: 23px !important;
    color: #8d8f9c;
}

.card-single-plan .plan-features {
    margin: 0;
    padding: 0;
    list-style: none;
}

.plan-features .paid-feature-check {
    width: 24px;
    height: 24px;
    font-size: 0.9rem;
    border-radius: 50px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #3b866c;
}

.plan-features .unpaid-feature-check {
    background-color: #ea3423;
    width: 24px;
    height: 24px;
    font-size: 0.9rem;
    border-radius: 50px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card-single-plan .plan-features li {
    padding: 10px 0;
    display: flex;
    align-items: center;
    gap: 1rem;
    font-weight: 600;
}

.card-single-plan .plan-features li span {
    vertical-align: middle;
}

.card-single-plan .subscription-btn {
    max-width: 100%;
    margin: 0 auto;
    height: 50px;
    font-weight: 600;
    border-radius: 14px;
}

/* Modals sides */

/* .modal.left .modal-dialog,
.modal.right .modal-dialog {
    position: fixed;
    margin: auto;
    width: 500px;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
}

.modal.left .modal-content,
.modal.right .modal-content {
    height: 100%;
    overflow-y: auto;
}

.modal.left .modal-body,
.modal.right .modal-body {
    padding: 15px 15px 80px;
}

.modal.left.modalFade .modal-dialog {
    left: 0;
    -webkit-transition: opacity 150ms linear, left 150ms ease-out;
    -moz-transition: opacity 150ms linear, left 150ms ease-out;
    -o-transition: opacity 150ms linear, left 150ms ease-out;
    transition: opacity 150ms linear, left 150ms ease-out;
}

.modal.left.modalFade.in .modal-dialog {
    left: 0;
}

.modal.right.modalFade .modal-dialog {
    right: px;
    -webkit-transition: opacity 150ms linear, right 150ms ease-out;
    -moz-transition: opacity 150ms linear, right 150ms ease-out;
    -o-transition: opacity 150ms linear, right 150ms ease-out;
    transition: opacity 150ms linear, right 150ms ease-out;
}

.modal.right.modalFade.in .modal-dialog {
    right: 0;
    -webkit-transition: opacity 150ms linear, right 150ms ease-out;
    -moz-transition: opacity 150ms linear, right 150ms ease-out;
    -o-transition: opacity 150ms linear, right 150ms ease-out;
    transition: opacity 150ms linear, right 150ms ease-out;

}

.modal .modal-dialog {
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}

.modal,
.modal-dialog-slideout {
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;

}

.modal-dialog-slideout {
    min-height: 100%;
    margin: 0 0 0 auto;
    background: #fff;
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}

.modal.modalFade .modal-dialog.modal-dialog-slideout {
    -webkit-transform: translate(-100%, 0)scale(1);
    transform: translate(-100%, 0)scale(1);
    -webkit-transition: all 150ms ease-in-out;
    -moz-transition: all 150ms ease-in-out;
    -o-transition: all 150ms ease-in-out;
    transition: all 150ms ease-in-out;
}

.modal.modalFade.show .modal-dialog.modal-dialog-slideout {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    display: flex;
    align-items: flex-start;
    -webkit-box-align: stretch;
    min-height: 100%;
    height: 100vh;
} */

/* Is is-feature */

.is-feature {
    position: relative;
    /* cursor: not-allowed !important; */
}

.is-feature-side {
    position: relative;
}

/*
.dropdown-menu>li>a.is-feature {
    background-color: hsl(35 67% 55% / 0.03);
    border-radius: 10px;
    color: #e7ad00;
}


.dropdown-menu > li > a.is-feature > i,
.dropdown-menu > .dropdown-item.is-feature > i {
    color: #e7ad00;
}

.is-feature .kt-menu__link-text {
    color: #e7ad00 !important;
} */

.is-feature::before {
    content: "";
    left: 5px;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBjbGFzcz0ibS0xIHctNCBoLTQiPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF82MTQxXzgzNjEzKSI+PHBhdGggZD0iTTMuNzcyNTYgMTQuMTI1MUMzLjEyODcgMTQuMTI1MSAyLjY1MDM4IDEzLjk2ODggMi4zMzc3NyAxMy42NTY0QzIuMDI5ODcgMTMuMzQ4NiAxLjg3NTgzIDEyLjg3MjkgMS44NzU4MyAxMi4yMjkyVjEwLjczMTlDMS44NzU4MyAxMC42MDEzIDEuODMxNTcgMTAuNDkxNyAxLjc0Mjg4IDEwLjQwMzFMMC42ODYwNCA5LjMzOTc0QzAuMjI4NjE3IDguODg3NDEgMCA4LjQ0MjA1IDAgOC4wMDM2NUMwIDcuNTY1MjUgMC4yMjg2MTcgNy4xMTc0NCAwLjY4NTg1MSA2LjY2MDRMMS43NDI2OSA1LjU5NzA2QzEuODMxMzkgNS41MDg0IDEuODc1NjQgNS40MDExMSAxLjg3NTY0IDUuMjc1MThWMy43NzA5OUMxLjg3NTY0IDMuMTIyNzEgMi4wMjk2OCAyLjY0NDU5IDIuMzM3NTggMi4zMzY4MkMyLjY1MDE5IDIuMDI5MDYgMy4xMjg1MSAxLjg3NTA4IDMuNzcyMzcgMS44NzUwOEg1LjI3MDI1QzUuNDAwOTQgMS44NzUwOCA1LjUxMDU0IDEuODMwODUgNS41OTkyNCAxLjc0MjE5TDYuNjYzMDQgMC42ODU4MTJDNy4xMjA0NiAwLjIyODc3NyA3LjU2NjAyIDcuMTIxNDllLTA1IDcuOTk5OTEgNy4xMjE0OWUtMDVDOC40Mzg1IC0wLjAwNDYzNDY3IDguODg0MDYgMC4yMjM4ODMgOS4zMzY3NyAwLjY4NTYyNEwxMC40MDA2IDEuNzQyQzEwLjQ5NCAxLjgzMDY2IDEwLjYwNTggMS44NzQ4OSAxMC43MzY1IDEuODc0ODlIMTIuMjI3NEMxMi44NzYgMS44NzQ4OSAxMy4zNTQzIDIuMDMxMTMgMTMuNjYyMiAyLjM0MzZDMTMuOTcwMSAyLjY1NjA3IDE0LjEyNDIgMy4xMzE5MyAxNC4xMjQyIDMuNzcwOFY1LjI3NDk5QzE0LjEyNDIgNS40MDA5MiAxNC4xNzA5IDUuNTA4MjEgMTQuMjY0MSA1LjU5Njg3TDE1LjMyMDkgNi42NjAyMUMxNS43NzM1IDcuMTE3MjUgMTUuOTk5OCA3LjU2NTA2IDE1Ljk5OTggOC4wMDM0NkMxNi4wMDQ1IDguNDQxODYgMTUuNzc4MiA4Ljg4NzIyIDE1LjMyMDkgOS4zMzk3NEwxNC4yNjQxIDEwLjQwMzFDMTQuMTcwNyAxMC40OTE3IDE0LjEyNDIgMTAuNjAxMyAxNC4xMjQyIDEwLjczMTlWMTIuMjI5MkMxNC4xMjQyIDEyLjg3NzQgMTMuOTY3OSAxMy4zNTU2IDEzLjY1NTMgMTMuNjYzM0MxMy4zNDc0IDEzLjk3MTEgMTIuODcxNSAxNC4xMjUxIDEyLjIyNzQgMTQuMTI1MUgxMC43MzY1QzEwLjYwNTggMTQuMTI1MSAxMC40OTM4IDE0LjE2OTUgMTAuNDAwNiAxNC4yNThMOS4zMzY3NyAxNS4zMjEzQzguODg0MjQgMTUuNzczNiA4LjQzODY4IDE1Ljk5OTkgNy45OTk5MSAxNS45OTk5QzcuNTY2MDIgMTYuMDA0NiA3LjEyMDI4IDE1Ljc3ODMgNi42NjMwNCAxNS4zMjEzTDUuNTk5MjQgMTQuMjU4QzUuNTEwNTQgMTQuMTY5MyA1LjQwMDk0IDE0LjEyNTEgNS4yNzAyNSAxNC4xMjUxSDMuNzcyMzdIMy43NzI1NloiIGZpbGw9IiNGRkMwMEEiPjwvcGF0aD48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTExLjU2NzYgNy42OTI1N0MxMS40NDQ0IDcuNjI5ODkgMTEuMjc5MyA3LjYwNDQ3IDExLjEzNTQgNy41NzMyM0MxMC43NDgyIDcuNDkxNzIgMTAuMzg1NSA3LjM0NTQ2IDEwLjA1NzcgNy4xNDc2M0MxMC4xNjMxIDYuNzIwOSAxMC4zNDc5IDYuMzEwNTQgMTAuNjEwOSA1Ljk0MTA0QzEwLjY2NDQgNS44NTg0IDEwLjcxMDQgNS43Nzg0IDEwLjczNzMgNS42OTgyMUMxMC44NTI0IDUuMzYwMTQgMTAuNjM5NiA1LjE0OTcgMTAuMzA1MyA1LjI2MTEzQzEwLjE3MzkgNS4zMDM4NiAxMC4wMzkyIDUuNDAyNjggOS45MTUzIDUuNDgyMTJDOS41ODQyNCA1LjY5Nzg0IDkuMjI0NzQgNS44NTA4NyA4Ljg1MzE5IDUuOTQyNzNDOC42Mjc0IDUuNTY5MDkgOC40Njg0NiA1LjE1MTM5IDguMzkyOTQgNC43MDcxNkM4LjM3Mzc0IDQuNjE2OCA4LjM1MjA4IDQuNTMyNDcgOC4zMTg5NCA0LjQ1OTI1QzguMjU2MDQgNC4zMTgwNyA4LjE0NzM4IDQuMjEzMjMgOC4wMzQ3NiA0LjE5NzZDNy44ODU5OSA0LjE3OTUzIDcuNzcyODIgNC4yODMwNiA3LjY5MzUzIDQuNDMzMDhDNy42MzEzOSA0LjU1NDY4IDcuNjA1OTcgNC43MTc4OSA3LjU3NTA4IDQuODYwMTlDNy40OTM3MyA1LjI0ODkgNy4zNDcwMyA1LjYxMzEzIDcuMTQ4MTcgNS45NDIzNkM2LjcyNDA4IDUuODM3ODkgNi4zMTU5OSA1LjY1NDU0IDUuOTQ4NCA1LjM5NDAzQzUuODcxIDUuMzQzNzcgNS43OTU4NiA1LjI5OTM0IDUuNzIwNzIgNS4yNzExMUM1LjU3NjQ3IDUuMjE1NzcgNS40MjU0NCA1LjIxODQgNS4zMzQ4NiA1LjI4NjkyQzUuMjE2OTcgNS4zNzkxNiA1LjIxMDAxIDUuNTMyNTcgNS4yNjAyOSA1LjY5NDY0QzUuMzAyMjggNS44MjQ1MiA1LjM5OTgzIDUuOTU3NzkgNS40Nzg3MyA2LjA4MDMzQzUuNjk2MDUgNi40MTI1NyA1Ljg1MDEgNi43NzM2IDUuOTQyMTggNy4xNDY2OUM1LjU2ODM3IDcuMzcyMTkgNS4xNTA2OSA3LjUzMDg3IDQuNzA2NjMgNy42MDYzNkM0LjYxNzk0IDcuNjI1MTggNC41MzQ3IDcuNjQ2NDUgNC40NjIzOSA3LjY3ODY0QzQuMTE5MDggNy44Mjk3OSA0LjEwMzgzIDguMTQ1ODQgNC40Mzk3OSA4LjMwODg1QzQuNTE0NzQgOC4zNDU1NiA0LjYwMjY4IDguMzY5MjcgNC42OTcyMiA4LjM4OTZDNS4xNDY3MyA4LjQ2MzAxIDUuNTY2ODcgOC42MjI0NSA1Ljk0MTYyIDguODUwMDNDNS44MzY5MSA5LjI3NDEyIDUuNjUzNjggOS42ODIwMyA1LjM5Mjg2IDEwLjA0OTdDNS4zNDM1MiAxMC4xMjU3IDUuMjk5NjQgMTAuMTk5NSA1LjI3MTIxIDEwLjI3MzVDNS4xMzU0MyAxMC42MjMgNS4zNDgyMyAxMC44NTcyIDUuNzAxMTQgMTAuNzM1QzUuNzgwMjMgMTAuNzA3OSA1Ljg1ODk1IDEwLjY2MjUgNS45NDAzIDEwLjYxMDJDNi4zMTAxNiAxMC4zNDQ0IDYuNzIwMzEgMTAuMTYwOSA3LjE0NjEgMTAuMDU3QzcuMzg2OTUgMTAuNDUzNiA3LjU1MzQzIDEwLjg5OTMgNy42MjYzIDExLjM3MjlDNy42NzcxNSAxMS42NDI3IDcuOTI5NjggMTEuOTU3NCA4LjE5Mjk1IDExLjcyMTZMOC4xOTU1OSAxMS43MTkxQzguMzU4ODYgMTEuNTcwNCA4LjM4NDg1IDExLjMxNjUgOC40MzI2OCAxMS4xMDM2QzguNTE0OTcgMTAuNzI4NCA4LjY1ODQ3IDEwLjM3NjggOC44NTA3NCAxMC4wNTgxQzkuMzAxOTUgMTAuMTY4MiA5LjczNTI3IDEwLjM2NTkgMTAuMTIyMSAxMC42NDk0QzEwLjM0ODggMTAuODA0MSAxMC43NDk5IDEwLjg0ODEgMTAuNzY5MyAxMC40OTU0VjEwLjQ5MThDMTAuNzc5NyAxMC4yNzE0IDEwLjYxODUgMTAuMDczNCAxMC41MDE1IDkuODg4OUMxMC4yOTQgOS41NjQ5NCAxMC4xNDY2IDkuMjE0MjYgMTAuMDU3MSA4Ljg1MjQ3QzEwLjQzMzkgOC42MjQ5IDEwLjg1NTQgOC40NjQ5IDExLjMwMzQgOC4zODk0MUMxMS4zOTk2IDguMzY4NzEgMTEuNDg4NyA4LjM0NDYxIDExLjU2NDYgOC4zMDY5N0MxMS44ODUxIDguMTQ5MjMgMTEuODgzNCA3Ljg1MDEyIDExLjU2ODIgNy42OTI1N0gxMS41Njc2WiIgZmlsbD0iYmxhY2siPjwvcGF0aD48L2c+PGRlZnM+PGNsaXBQYXRoIGlkPSJjbGlwMF82MTQxXzgzNjEzIj48cmVjdCB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9IndoaXRlIj48L3JlY3Q+PC9jbGlwUGF0aD48L2RlZnM+PC9zdmc+");
    display: inline-block;
    z-index: 2;
    position: absolute;
    width: 25px;
    height: 24px;
    object-fit: contain;
    top: 48%;
    transform: translateY(-50%) scale(0.6);
    pointer-events: none;
}

.is-feature-side::after {
    content: "";
    right: 5px;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBjbGFzcz0ibS0xIHctNCBoLTQiPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF82MTQxXzgzNjEzKSI+PHBhdGggZD0iTTMuNzcyNTYgMTQuMTI1MUMzLjEyODcgMTQuMTI1MSAyLjY1MDM4IDEzLjk2ODggMi4zMzc3NyAxMy42NTY0QzIuMDI5ODcgMTMuMzQ4NiAxLjg3NTgzIDEyLjg3MjkgMS44NzU4MyAxMi4yMjkyVjEwLjczMTlDMS44NzU4MyAxMC42MDEzIDEuODMxNTcgMTAuNDkxNyAxLjc0Mjg4IDEwLjQwMzFMMC42ODYwNCA5LjMzOTc0QzAuMjI4NjE3IDguODg3NDEgMCA4LjQ0MjA1IDAgOC4wMDM2NUMwIDcuNTY1MjUgMC4yMjg2MTcgNy4xMTc0NCAwLjY4NTg1MSA2LjY2MDRMMS43NDI2OSA1LjU5NzA2QzEuODMxMzkgNS41MDg0IDEuODc1NjQgNS40MDExMSAxLjg3NTY0IDUuMjc1MThWMy43NzA5OUMxLjg3NTY0IDMuMTIyNzEgMi4wMjk2OCAyLjY0NDU5IDIuMzM3NTggMi4zMzY4MkMyLjY1MDE5IDIuMDI5MDYgMy4xMjg1MSAxLjg3NTA4IDMuNzcyMzcgMS44NzUwOEg1LjI3MDI1QzUuNDAwOTQgMS44NzUwOCA1LjUxMDU0IDEuODMwODUgNS41OTkyNCAxLjc0MjE5TDYuNjYzMDQgMC42ODU4MTJDNy4xMjA0NiAwLjIyODc3NyA3LjU2NjAyIDcuMTIxNDllLTA1IDcuOTk5OTEgNy4xMjE0OWUtMDVDOC40Mzg1IC0wLjAwNDYzNDY3IDguODg0MDYgMC4yMjM4ODMgOS4zMzY3NyAwLjY4NTYyNEwxMC40MDA2IDEuNzQyQzEwLjQ5NCAxLjgzMDY2IDEwLjYwNTggMS44NzQ4OSAxMC43MzY1IDEuODc0ODlIMTIuMjI3NEMxMi44NzYgMS44NzQ4OSAxMy4zNTQzIDIuMDMxMTMgMTMuNjYyMiAyLjM0MzZDMTMuOTcwMSAyLjY1NjA3IDE0LjEyNDIgMy4xMzE5MyAxNC4xMjQyIDMuNzcwOFY1LjI3NDk5QzE0LjEyNDIgNS40MDA5MiAxNC4xNzA5IDUuNTA4MjEgMTQuMjY0MSA1LjU5Njg3TDE1LjMyMDkgNi42NjAyMUMxNS43NzM1IDcuMTE3MjUgMTUuOTk5OCA3LjU2NTA2IDE1Ljk5OTggOC4wMDM0NkMxNi4wMDQ1IDguNDQxODYgMTUuNzc4MiA4Ljg4NzIyIDE1LjMyMDkgOS4zMzk3NEwxNC4yNjQxIDEwLjQwMzFDMTQuMTcwNyAxMC40OTE3IDE0LjEyNDIgMTAuNjAxMyAxNC4xMjQyIDEwLjczMTlWMTIuMjI5MkMxNC4xMjQyIDEyLjg3NzQgMTMuOTY3OSAxMy4zNTU2IDEzLjY1NTMgMTMuNjYzM0MxMy4zNDc0IDEzLjk3MTEgMTIuODcxNSAxNC4xMjUxIDEyLjIyNzQgMTQuMTI1MUgxMC43MzY1QzEwLjYwNTggMTQuMTI1MSAxMC40OTM4IDE0LjE2OTUgMTAuNDAwNiAxNC4yNThMOS4zMzY3NyAxNS4zMjEzQzguODg0MjQgMTUuNzczNiA4LjQzODY4IDE1Ljk5OTkgNy45OTk5MSAxNS45OTk5QzcuNTY2MDIgMTYuMDA0NiA3LjEyMDI4IDE1Ljc3ODMgNi42NjMwNCAxNS4zMjEzTDUuNTk5MjQgMTQuMjU4QzUuNTEwNTQgMTQuMTY5MyA1LjQwMDk0IDE0LjEyNTEgNS4yNzAyNSAxNC4xMjUxSDMuNzcyMzdIMy43NzI1NloiIGZpbGw9IiNGRkMwMEEiPjwvcGF0aD48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTExLjU2NzYgNy42OTI1N0MxMS40NDQ0IDcuNjI5ODkgMTEuMjc5MyA3LjYwNDQ3IDExLjEzNTQgNy41NzMyM0MxMC43NDgyIDcuNDkxNzIgMTAuMzg1NSA3LjM0NTQ2IDEwLjA1NzcgNy4xNDc2M0MxMC4xNjMxIDYuNzIwOSAxMC4zNDc5IDYuMzEwNTQgMTAuNjEwOSA1Ljk0MTA0QzEwLjY2NDQgNS44NTg0IDEwLjcxMDQgNS43Nzg0IDEwLjczNzMgNS42OTgyMUMxMC44NTI0IDUuMzYwMTQgMTAuNjM5NiA1LjE0OTcgMTAuMzA1MyA1LjI2MTEzQzEwLjE3MzkgNS4zMDM4NiAxMC4wMzkyIDUuNDAyNjggOS45MTUzIDUuNDgyMTJDOS41ODQyNCA1LjY5Nzg0IDkuMjI0NzQgNS44NTA4NyA4Ljg1MzE5IDUuOTQyNzNDOC42Mjc0IDUuNTY5MDkgOC40Njg0NiA1LjE1MTM5IDguMzkyOTQgNC43MDcxNkM4LjM3Mzc0IDQuNjE2OCA4LjM1MjA4IDQuNTMyNDcgOC4zMTg5NCA0LjQ1OTI1QzguMjU2MDQgNC4zMTgwNyA4LjE0NzM4IDQuMjEzMjMgOC4wMzQ3NiA0LjE5NzZDNy44ODU5OSA0LjE3OTUzIDcuNzcyODIgNC4yODMwNiA3LjY5MzUzIDQuNDMzMDhDNy42MzEzOSA0LjU1NDY4IDcuNjA1OTcgNC43MTc4OSA3LjU3NTA4IDQuODYwMTlDNy40OTM3MyA1LjI0ODkgNy4zNDcwMyA1LjYxMzEzIDcuMTQ4MTcgNS45NDIzNkM2LjcyNDA4IDUuODM3ODkgNi4zMTU5OSA1LjY1NDU0IDUuOTQ4NCA1LjM5NDAzQzUuODcxIDUuMzQzNzcgNS43OTU4NiA1LjI5OTM0IDUuNzIwNzIgNS4yNzExMUM1LjU3NjQ3IDUuMjE1NzcgNS40MjU0NCA1LjIxODQgNS4zMzQ4NiA1LjI4NjkyQzUuMjE2OTcgNS4zNzkxNiA1LjIxMDAxIDUuNTMyNTcgNS4yNjAyOSA1LjY5NDY0QzUuMzAyMjggNS44MjQ1MiA1LjM5OTgzIDUuOTU3NzkgNS40Nzg3MyA2LjA4MDMzQzUuNjk2MDUgNi40MTI1NyA1Ljg1MDEgNi43NzM2IDUuOTQyMTggNy4xNDY2OUM1LjU2ODM3IDcuMzcyMTkgNS4xNTA2OSA3LjUzMDg3IDQuNzA2NjMgNy42MDYzNkM0LjYxNzk0IDcuNjI1MTggNC41MzQ3IDcuNjQ2NDUgNC40NjIzOSA3LjY3ODY0QzQuMTE5MDggNy44Mjk3OSA0LjEwMzgzIDguMTQ1ODQgNC40Mzk3OSA4LjMwODg1QzQuNTE0NzQgOC4zNDU1NiA0LjYwMjY4IDguMzY5MjcgNC42OTcyMiA4LjM4OTZDNS4xNDY3MyA4LjQ2MzAxIDUuNTY2ODcgOC42MjI0NSA1Ljk0MTYyIDguODUwMDNDNS44MzY5MSA5LjI3NDEyIDUuNjUzNjggOS42ODIwMyA1LjM5Mjg2IDEwLjA0OTdDNS4zNDM1MiAxMC4xMjU3IDUuMjk5NjQgMTAuMTk5NSA1LjI3MTIxIDEwLjI3MzVDNS4xMzU0MyAxMC42MjMgNS4zNDgyMyAxMC44NTcyIDUuNzAxMTQgMTAuNzM1QzUuNzgwMjMgMTAuNzA3OSA1Ljg1ODk1IDEwLjY2MjUgNS45NDAzIDEwLjYxMDJDNi4zMTAxNiAxMC4zNDQ0IDYuNzIwMzEgMTAuMTYwOSA3LjE0NjEgMTAuMDU3QzcuMzg2OTUgMTAuNDUzNiA3LjU1MzQzIDEwLjg5OTMgNy42MjYzIDExLjM3MjlDNy42NzcxNSAxMS42NDI3IDcuOTI5NjggMTEuOTU3NCA4LjE5Mjk1IDExLjcyMTZMOC4xOTU1OSAxMS43MTkxQzguMzU4ODYgMTEuNTcwNCA4LjM4NDg1IDExLjMxNjUgOC40MzI2OCAxMS4xMDM2QzguNTE0OTcgMTAuNzI4NCA4LjY1ODQ3IDEwLjM3NjggOC44NTA3NCAxMC4wNTgxQzkuMzAxOTUgMTAuMTY4MiA5LjczNTI3IDEwLjM2NTkgMTAuMTIyMSAxMC42NDk0QzEwLjM0ODggMTAuODA0MSAxMC43NDk5IDEwLjg0ODEgMTAuNzY5MyAxMC40OTU0VjEwLjQ5MThDMTAuNzc5NyAxMC4yNzE0IDEwLjYxODUgMTAuMDczNCAxMC41MDE1IDkuODg4OUMxMC4yOTQgOS41NjQ5NCAxMC4xNDY2IDkuMjE0MjYgMTAuMDU3MSA4Ljg1MjQ3QzEwLjQzMzkgOC42MjQ5IDEwLjg1NTQgOC40NjQ5IDExLjMwMzQgOC4zODk0MUMxMS4zOTk2IDguMzY4NzEgMTEuNDg4NyA4LjM0NDYxIDExLjU2NDYgOC4zMDY5N0MxMS44ODUxIDguMTQ5MjMgMTEuODgzNCA3Ljg1MDEyIDExLjU2ODIgNy42OTI1N0gxMS41Njc2WiIgZmlsbD0iYmxhY2siPjwvcGF0aD48L2c+PGRlZnM+PGNsaXBQYXRoIGlkPSJjbGlwMF82MTQxXzgzNjEzIj48cmVjdCB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9IndoaXRlIj48L3JlY3Q+PC9jbGlwUGF0aD48L2RlZnM+PC9zdmc+");
    display: inline-block;
    z-index: 2;
    position: relative;
    width: 25px;
    height: 24px;
    object-fit: contain;
    top: 0;
    transform: scale(0.6);
    pointer-events: none;
}

/* .btn-main.is-feature::before {
    position: relative;
    top:0;
    transform: translateY(0) scale(0.6);
} */

.feature-tooltip {
    /* font-size: 25px; */
    border: none;
    cursor: pointer;
    position: relative;
    overflow: visible;
    overflow: hidden;
    margin-right: auto;
    vertical-align: middle;
}

.feature-tooltip .feature-tooltip-content {
    position: absolute;
    color: white;
    background-color: #fcf6ed;
    border: 1px solid #fcf6ed;
    width: 170px;
    font-size: 18px;
    padding: 1rem;
    transition: 0.3s;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
    border-radius: 10px;
    z-index: 2;
    box-shadow: rgba(100, 100, 111, 0.1) 0px 7px 29px 0px;
}

.feature-tooltip .feature-icon {
    width: 14px;
    height: 14px;
}

.feature-tooltip .feature-tooltip-content > img {
    max-width: 85%;
    margin: 0 auto;
    display: block;
}

.feature-tooltip .feature-tooltip-content p {
    color: #000000;
    font-size: 11px;
    white-space: nowrap;
    margin-top: 1rem;
    margin-bottom: 0;
    text-align: center;
}

.feature-tooltip .btn-main {
    margin: 1rem auto 0;
    background: #000 !important;
    border-color: #000 !important;
    color: #fff !important;
    position: relative;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
    height: 40px;
    padding: 6px 14px !important;
    /* box-shadow: 0 5px 15px rgba(254, 194, 68, .4); */
}

.feature-tooltip .btn-main > span {
    position: relative;
    top: 2px;
}

.feature-tooltip .btn-main img {
    position: relative;
    left: -4px;
    width: 17px;
}

.feature-tooltip .btn-main::before {
    content: "";
    position: absolute;
    width: 100px;
    height: 100%;
    background-image: linear-gradient(
        120deg,
        rgba(255, 255, 255, 0) 30%,
        rgba(255, 255, 255, 0.8),
        rgba(255, 255, 255, 0) 70%
    );
    top: 0;
    left: -100px;
    opacity: 0.6;
    animation: shine 2.5s ease-out infinite;
}

@keyframes shine {
    0% {
        left: -100px;
    }

    60% {
        left: 100%;
    }

    to {
        left: 100%;
    }
}

.feature-tooltip:hover {
    overflow: visible;
}

.feature-tooltip:hover .feature-tooltip-content {
    opacity: 1;
    opacity: 1;
    visibility: visible;
}

.feature-tooltip .feature-tooltip-content::after {
    content: "";
    position: absolute;
    border: 10px solid transparent;
}

.feature-tooltip[data-position="top"] .feature-tooltip-content {
    bottom: 35px;
    left: 50%;
    transform: translateX(-50%);
}

.feature-tooltip[data-position="top"] .feature-tooltip-content::after {
    border-top-color: #fcf6ed;
    bottom: -20px;
    left: 50%;
    transform: translateX(-50%);
}

.feature-tooltip[data-position="left"] .feature-tooltip-content {
    top: -10px;
    right: 30px;
}

.feature-tooltip[data-position="left"] .feature-tooltip-content::after {
    border-left-color: #fcf6ed;
    right: -20px;
    top: 10px;
}

.feature-tooltip[data-position="bottom"] .feature-tooltip-content {
    top: 35px;
    left: 50%;
    transform: translateX(-45.5%) translateY(10px);
}

.feature-tooltip:not(.side)[data-position="bottom"] .feature-tooltip-content {
    top: 15px;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
}

.feature-tooltip[data-position="bottom"] .feature-tooltip-content::after {
    border-bottom-color: #fcf6ed;
    left: 50%;
    top: -20px;
    transform: translateX(-50%);
}

.feature-tooltip[data-position="right"] .feature-tooltip-content {
    top: 10px;
    right: -150px;
}

.feature-tooltip[data-position="right"] .feature-tooltip-content::after {
    border-right-color: black;
    left: -20px;
    bottom: 5px;
}

.dropdown-item .feature-tooltip {
    margin-right: auto;
    margin-left: 0;
}

.mdi-set,
.mdi:before {
    vertical-align: middle;
    /* line-height: 2; */
}

/* Membership Info */

.membership-info {
    position: relative;
    padding: 20px 20px 0.5rem 20px;
}

.membership-info .name-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.membership-info .name {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.membership-info .mail {
    font-size: 1rem;
    margin-bottom: 0;
}

.membership-info .membership-package {
    padding-top: 0.5rem;
    display: flex;
    gap: 0.5rem;
}

.membership-info .membership-package .badge {
    padding: 10px 8px 8px 8px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    font-size: 75%;
    cursor: pointer;
}

.membership-info .membership-package .badge.badge-purple {
    background-color: rgba(138, 95, 230, 0.1);
    color: #6654ea;
}

.membership-info .membership-package .badge.badge-primary {
    color: #4a4ca4;
}

.membership-info .membership-package .badge i {
    margin: 0 4px;
    line-height: 0 !important;
    position: relative;
    top: -1.5px;
}

.membership-info .membership-package .badge i::before {
    vertical-align: middle;
}

.membership-info .hidden-link {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.membership-info .personal-edit-btn {
    width: 35px;
    height: 35px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--side-active-bg-third);
    color: #000;
    font-size: 15px;
    margin-bottom: 0.5rem;
    /* position: absolute;
    top: 8px;
    left: 8px */
}

/* Subscription Modal */

.subscription_modal .upgrade-content > img {
    max-width: 200px;
    margin: 0 auto;
    display: block;
}

.subscription_modal .modal-content {
    border: 1px solid #fff;
}

.subscription_modal .modal-body {
    /* background-color: #fcf6ed; */
    background-color: #fff;
    border-radius: 20px;
}

.subscription_modal .upgrade-content {
    position: relative;
    padding-top: 25px;
}

.subscription_modal .close {
    width: 20px;
    height: 20px;
    opacity: 1;
    color: #000000;
    font-size: 16px;
    position: absolute;
    top: -5px;
    left: -5px;
    text-shadow: none;
}

.subscription_modal .upgrade-content p {
    color: #000000;
    font-size: 1.1rem;
    white-space: nowrap;
    margin-top: 1rem;
    margin-bottom: 0;
    text-align: center;
}

.subscription_modal .upgrade-content .btn-main {
    margin: 1rem auto 0;
    background: #000 !important;
    border-color: #000 !important;
    color: #fff !important;
    position: relative;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
    height: 41px;
    padding: 0 15px !important;
    /* box-shadow: 0 5px 15px rgba(254, 194, 68, .4); */
}

.subscription_modal .upgrade-content .btn-main > span {
    position: relative;
    top: 2px;
}

.subscription_modal .upgrade-content .btn-main img {
    position: relative;
    left: -5px;
}

.subscription_modal .upgrade-content .btn-main::before {
    content: "";
    position: absolute;
    width: 100px;
    height: 100%;
    background-image: linear-gradient(
        120deg,
        rgba(255, 255, 255, 0) 30%,
        rgba(255, 255, 255, 0.8),
        rgba(255, 255, 255, 0) 70%
    );
    top: 0;
    left: -100px;
    opacity: 0.6;
    animation: shine 2.5s ease-out infinite;
}

.subscription_modal .modal-content::before {
    content: "";
    width: 60px;
    height: 5px;
    border-radius: 50px;
    background-color: #e6e8ec;
    position: absolute;
    top: 9.0625px;
    left: 50%;
    transform: translateX(-50%);
    pointer-events: none;
    z-index: 2;
}

.quick-statics-card {
    overflow-y: scroll;
    height: 340px;
}

@media (max-width: 1200px) {
    .quick-statics-card {
        height: 340px;
    }
}

/* Make the scrollbar wider */
.quick-statics-card::-webkit-scrollbar {
    width: 3px;
    height: 8px;
}

/* Adjust the scrollbar track color */
.quick-statics-card::-webkit-scrollbar-track {
    background-color: #f6f7fd;
    border-radius: 5px;
}

/* Make the scrollbar thumb more visible */
.quick-statics-card::-webkit-scrollbar-thumb {
    background-color: #000;
    /* Darker color */
    border-radius: 5px;
    height: 10px;
    transition: background-color 0.3s ease-in-out;
}

/* Change color on hover */
.quick-statics-card::-webkit-scrollbar-thumb:hover {
    background-color: #888888;
}

.place-name-wrapper {
    position: relative;
}

.page_link_wrapper {
    flex-wrap: nowrap;
    flex-direction: row-reverse;
}

.page_link_wrapper .input-group-text {
    /* border: 1px solid #efeff1; */
    background: #f5f7f9;
    font-size: 14px;
    position: absolute;
    z-index: 22;
    height: 96%;
    left: 0px;
    border: 0;
    border-radius: 0;
    top: 50%;
    transform: translateY(-50%);
    border-top-left-radius: 9px !important;
    border-bottom-left-radius: 9px !important;
}

.page_link_wrapper input.form-control {
    box-shadow: none;
    outline: none;
    border-radius: 10px !important;
    padding-left: 200px !important;
}

.storeLinkAvailability {
    position: absolute;
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
    border-radius: 8px;
    color: white;
    background-color: #039474;
    padding: 5px 10px;
    font-size: 11px;
}

.storeLinkAvailability.not-available {
    background-color: red;
}

.page-link {
    color: gray;
    margin-top: 0.5rem;
}

.page-link span {
    vertical-align: middle;
}

/* Custom Table */

.custom_table .row-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
}

.custom_table .row-item:first-child {
    border-top: 0;
}

.custom_table .row-item .side {
    white-space: nowrap;
    display: flex;
    align-items: center;
    font-weight: 500;
    /* vertical-align: middle !important; */
    padding: 0.8rem 0;
    min-height: 66px;
}

.custom_table .row-item .side .icon {
    font-size: 14px;
    margin-left: 8px;
    background: #f5f7f9;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.15rem;
}

.custom_table .row-item .side > i {
    margin-bottom: 2.5px;
}

.custom_table .row-item .side img {
    margin: 0 5px;
    vertical-align: middle;
}

.custom_table .row-item .side small {
    margin-right: 10px;
}

.custom_table .btn-action-icon {
    text-align: center;
    background: #f5f7f9;
    border-radius: 10px;
    color: #000;
    border: 1px solid #ebedf2;
    display: flex;
    align-items: center;
    height: 35px;
}

.custom_table .btn-action-icon i {
    padding: 0;
}

@media (max-width: 576px) {
    .custom_table .row-item .side {
        white-space: normal;
        flex-wrap: wrap;
    }

    .custom_table .row-item .side .badge-verified {
        margin-top: 0.5rem;
    }
}

.points_icon {
    display: inline-flex;
    background: #f5f7f9;
    margin: 0 0 0 4px;
    min-width: 36px;
    width: 36px;
    height: 36px;
    padding: 7px;
    border-radius: 50px;
    object-fit: cover;
    border: 1px solid #ebedf2;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
}

.points_icon img {
    filter: invert(1);
    width: 14px;
}

/* .kt-aside__brand .kt-aside__brand-logo {
    padding: 20px 0;
} */

/* Super */

.kt-aside__brand-logo .mini-icon-logo {
    display: none;
}

.kt-aside--minimize .kt-aside__brand .kt-aside__brand-logo .main-points-logo {
    display: none;
}

.kt-aside--minimize .kt-aside__brand .kt-aside__brand-logo .mini-icon-logo {
    display: flex;
}

.kt-aside--minimize .kt-aside__brand .kt-aside__brand-logo .mini-icon-logo img {
    left: 0;
}

.summery_card.vertical .main-chart .currency {
    display: inline-block;
}

/* .summery_card.business .currency {
    display: none !important;
} */

/* .summery_card.business .statics-items {
    margin-bottom: 40px;
} */

@media (max-width: 767px) {
    .summery_card.business .statics-items {
        margin-bottom: 0;
    }
}

.badge-verified {
    background-color: rgba(3, 148, 116, 0.1) !important;
    color: #039474;
}

.badge-unverified {
    color: #ff4901;
    background: rgb(255, 73, 1, 0.1);
}

.badge-verified .check-icon {
    width: 15px;
    height: 15px;
    background-color: #039474;
    color: #fff;
    border-radius: 50px;
    display: inline-block;
    line-height: 15px;
    text-align: center;
    font-size: 9px;
    margin-left: 3px;
    vertical-align: middle;
}

/* reports_wrapper */

.reports_wrapper .kt-portlet {
    margin-bottom: 0;
}

/* .reports_wrapper .kt-portlet .kt-portlet__body {
    padding: 17px 0 0;
} */

.reports-head-cards a {
    color: inherit;
}

.reports_wrapper .radio-status-inputs .radio {
    max-width: 155px;
}

.reports_wrapper .radio-status-inputs .radio .name {
    padding: 0.9rem 1rem;
}

.reports_wrapper .radio-status-inputs .radio .name .stats {
    gap: 0;
}

.custom_table .row-item .btn-business-action {
    border-radius: 10px;
    background-color: rgba(74, 76, 164, 0.1);
    color: #4a4ca4;
    height: 40px;
    padding: 0.75rem 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
    min-width: 90px;
    font-weight: 500;
}

.custom_table .row-item .btn-business-action i {
    font-size: 14px;
    padding: 0 5px;
    font-weight: 500;
}

.custom_table .row-item:nth-child(1) .btn-business-action {
    background-color: rgba(64, 129, 255, 0.1);
    color: #4081ff;
}

.custom_table .row-item:nth-child(2) .btn-business-action {
    background-color: rgba(239, 173, 66, 0.1);
    color: #efad42;
}

.custom_table .row-item:nth-child(3) .btn-business-action {
    background-color: rgba(138, 95, 230, 0.1);
    color: #6654ea;
}

.custom_table .row-item:nth-child(4) .btn-business-action {
    background-color: rgba(74, 76, 164, 0.1);
    color: #4a4ca4;
}

/* .custom_table .row-item:not:nth-child(6) .btn-business-action {
    background-color: rgba(64, 129, 255, .1);
    color: #4081ff;
} */
.custom_table .row-item:nth-child(6) .btn-business-action {
    background-color: rgba(57, 213, 173, 0.1);
    color: #39d5ad;
}

.custom_table .row-item:nth-child(7) .btn-business-action {
    background-color: rgb(118, 199, 245, 0.1);
    color: #76c7f5;
}

.custom_table .row-item:nth-child(8) .btn-business-action {
    background-color: rgba(107, 180, 192, 0.1);
    color: #6bb4c0;
}

.custom_table .row-item .btn-business-action.btn-del {
    background-color: rgb(255, 73, 1, 0.1);
    color: #ff4901;
}

.btns-quick-actions {
    /* padding: 0 0 1rem 0; */
}

.btns-quick-actions h3 {
    margin-bottom: 0.8rem;
    color: #000;
    font-weight: 500;
    font-size: 15px;
    margin-top: 5px;
    position: relative;
    top: 5px;
}

.btns-quick-actions .actions-items {
    display: flex;
    gap: 0.5rem;
}

.btns-quick-actions .btn-business-action {
    border-radius: 10px;
    background-color: rgba(74, 76, 164, 0.1);
    color: #4a4ca4;
    height: 34px;
    padding: 0.25rem 0.8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: normal;
    font-weight: 500;
    font-size: 12px;
}

.btns-quick-actions .btn-business-action i {
    font-size: 12px;
    padding: 0 5px;
    font-weight: 500;
}

.btns-quick-actions .btn-business-action.btn-white {
    background-color: #fff;
    color: #000;
}

.btns-quick-actions .btn-business-action.btn-1 {
    background-color: rgba(64, 129, 255, 0.1);
    color: #4081ff;
}

.btns-quick-actions .btn-business-action.btn-2 {
    background-color: rgba(239, 173, 66, 0.1);
    color: #efad42;
}

.btns-quick-actions .btn-business-action.btn-3 {
    background-color: rgba(138, 95, 230, 0.1);
    color: #6654ea;
}

.btns-quick-actions .btn-business-action.btn-4 {
    background-color: rgba(74, 76, 164, 0.1);
    color: #4a4ca4;
}

.btns-quick-actions .btn-business-action.btn-5 {
    background-color: rgba(64, 129, 255, 0.1);
    color: #4081ff;
}

.btns-quick-actions .btn-business-action.btn-6 {
    background-color: rgba(57, 213, 173, 0.1);
    color: #39d5ad;
}

.btns-quick-actions .btn-business-action.btn-7 {
    background-color: rgb(118, 199, 245, 0.1);
    color: #76c7f5;
}

.btns-quick-actions .btn-business-action.btn-8 {
    background-color: rgba(255, 73, 1, 0.1);
    color: #ff4901;
}

@media (max-width: 576px) {
    .btns-quick-actions .btn-business-action {
        flex: 1;
        max-width: 31.33%;
    }
}

.custom_table .row-item .btn-business-action.btn-del {
    background-color: rgb(255, 73, 1, 0.1);
    color: #ff4901;
}

.busniess-details p {
    padding: 0.8rem 0;
    min-height: 66px;
    display: flex;
    align-items: center;
    margin-bottom: 0 !important;
}

.user-wrapper.latest_ratings {
    display: flex;
    gap: 1rem;
    max-width: 250px;
    justify-content: flex-start !important;
    margin: 0 auto;
    align-items: center;
    position: relative;
    right: 50px;
}

.reports_wrapper .user-wrapper.latest_ratings {
    max-width: 150px;
    right: 15px;
}

@media (max-width: 767px) {
    .user-wrapper.latest_ratings {
        max-width: 100%;
        right: 0;
    }
}

.jq-ry-container {
    padding: 0 5px 5px !important;
}

.iti--separate-dial-code .iti__selected-dial-code {
    margin-bottom: 0;
    margin-top: 2px;
}

.promotion-upgrade {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

@media (max-width: 767px) {
    .promotion-upgrade {
        justify-content: flex-start;
        margin-top: 1rem;
    }
}

.empty-label {
    opacity: 0;
}

@media (max-width: 767px) {
    .empty-label {
        display: none;
    }

    .kt-portlet {
        border: 0;
    }

    .kt-portlet .kt-portlet__head .kt-portlet__head-toolbar {
        gap: 0.5rem;
    }
}

@media (max-width: 1024px) {
    .kt-portlet .kt-portlet__head {
        /* padding: 10px 0 !important; */
        min-height: auto !important;
    }
}

html.with-fancybox body.hide-scrollbar {
    margin-right: 0 !important;
    overflow: visible !important;
}

.business-demo {
    align-items: center;
    background-color: #fff;
    border: 1px solid #f0f2f5;
    border-radius: 18px;
    box-shadow: 0 1px 2px #ededed80;
    display: flex;
    flex-direction: column;
    padding: 40px 20px;
}

.business-demo .image {
    align-items: center;
    background-color: #ffffff30;
    border-radius: 50%;
    box-shadow: 0 3px 6px #00000012;
    display: flex;
    height: 112px;
    justify-content: center;
    margin: 0 auto 1rem;
    width: 112px;
}

.business-demo .image img {
    border-radius: 50%;
    display: block;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
}

.business-demo .title h3 {
    color: #312e43;
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 1rem;
}

.business-demo .description {
    color: #312e43;
    font-size: 14px;
    font-weight: 500;
    max-width: 580px;
    text-align: center;
}

.swal2-icon.swal2-success {
    border-color: #51a351 !important;
}

.swal2-icon.swal2-success::before {
    content: "\e83f";
    font-family: feather !important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    color: #51a351;
    top: 50%;
}

/*

    Floating Options buttons

*/

.multi-action {
    display: inline-block;
    position: fixed;
    width: 56px;
    height: 56px;
    left: 10px;
    bottom: 15px;
    z-index: 222;
}

.multi-action .action-button {
    position: absolute;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 0;
    outline: 0;
    background: #000;
    font-size: 24px;
    color: white;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16),
        0 2px 5px 0 rgba(0, 0, 0, 0.26);
    transition: all 0.3s;
}

.multi-action .actions {
    position: absolute;
    list-style: none inside none;
    margin: 0;
    padding: 0;
    width: auto;
    float: left;
    background-color: transparent;
    top: 8px;
    left: 8px;
    z-index: 1;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    opacity: 1;
}

.multi-action .actions li {
    position: absolute;
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #000;
    box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.16),
        0 2px 5px 0 rgba(0, 0, 0, 0.26);
    margin: 0;
    color: #ffffff;
    transition: all 0.3s;
    transform: scale(0.3);
}

.multi-action .actions li a {
    position: relative;
    background: inherit;
    color: inherit;
    display: block;
    width: 43px;
    height: 43px;
    border-radius: 50%;
    line-height: 43px;
    text-align: center;
    font-size: 18px;
}

.multi-action .actions .infoHelp {
    position: absolute;
    color: #fff;
    font-size: 15px;
    top: 50%;
    transform: translateY(-50%);
    background: #000;
    padding: 0 10px;
    font-size: 11px;
    border-radius: 8px;
    line-height: 30px;
    display: none;
}

.multi-action .actions li:hover .infoHelp {
    display: block;
}

.multi-action .actions li:nth-child(1) .infoHelp {
    right: -120px;
    transform: translateY(-54px) rotate(-20deg);
}

.multi-action .actions li:nth-child(2) .infoHelp {
    right: -105px;
    transform: translateY(-52px) rotate(-20deg);
    white-space: nowrap;
}

.multi-action .actions li:nth-child(3) .infoHelp {
    right: -87px;
    transform: translateY(-41px) rotate(-20deg);
}

.multi-action .actions li:active {
    box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.19),
        0 8px 17px 0 rgba(0, 0, 0, 0.2);
}

.multi-action .action-button.active {
    box-shadow: 0 17px 50px 0 rgba(0, 0, 0, 0.19),
        0 12px 15px 0 rgba(0, 0, 0, 0.24);
}

.multi-action .action-button.active ~ .actions li {
    transition: all 0.3s;
    transform: scale(1);
}

/* Third */
.multi-action .action-button.active ~ .actions li:nth-child(1) {
    -webkit-transform: translateY(-50px) translateX(5px) translateZ(0);
    transform: translateY(-50px) translateX(5px) translateZ(0);
}

.multi-action .action-button.active ~ .actions li:nth-child(2) {
    -webkit-transform: translateY(-23px) translateX(45px) translateZ(0);
    transform: translateY(-23px) translateX(45px) translateZ(0);
}

.multi-action .action-button.active ~ .actions li:nth-child(3) {
    -webkit-transform: translateY(24px) translateX(45px) translateZ(0);
    transform: translateY(24px) translateX(45px) translateZ(0);
}

/* Third */

.multi-action .action-button.active ~ .actions li:nth-child(1) {
    -webkit-transform: translateY(-60px) translateX(-2px) translateZ(0);
    transform: translateY(-60px) translateX(-2px) translateZ(0);
}

.multi-action .action-button.active ~ .actions li:nth-child(2) {
    -webkit-transform: translateY(-35px) translateX(45px) translateZ(0);
    transform: translateY(-35px) translateX(45px) translateZ(0);
}

.multi-action .action-button.active ~ .actions li:nth-child(3) {
    -webkit-transform: translateY(14px) translateX(54px) translateZ(0);
    transform: translateY(14px) translateX(54px) translateZ(0);
}

.multi-action .action-button span {
    transition: all 0.3s;
}

.multi-action .action-button.active span::before {
    content: "\e8f6";
    font-size: 20px;
}

/*

    End Floating Options buttons

*/

.swal2-popup.swal2-toast .swal2-icon {
    transform: scale(0.5) !important;
}

.swal2-container .swal2-popup.swal2-toast .swal2-close {
    display: block !important;
    font-size: 18px;
}

/* .sweet-alert .sa-icon.sa-success::before, .swal2-container .swal2-icon.swal2-success::before, .sweet-alert .sa-icon.sa-success::after, .swal2-container .swal2-icon.swal2-success::after {
    background-color: #5ec269 !important;
  } */

.swal2-popup.swal2-toast .swal2-title {
    color: #fff;
    font-size: 15px;
}

.swal2-popup.swal2-toast .swal2-header {
    width: 100%;
}

.swal2-container .swal2-popup.swal2-toast {
    min-width: 300px;
    max-width: 305px;
    padding: 10px;
    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.0705882353);
    justify-content: space-between;
    border-radius: 10px !important;
}

.swal2-container .swal2-popup.swal2-toast .swal2-title {
    font-size: 1rem !important;
}

@media (max-width: 640px) {
    .swal2-container .swal2-popup.swal2-toast {
        max-width: 100%;
    }
}

.swal2-container .swal2-popup.swal2-toast .swal2-icon {
    --tw-scale-x: 0.5;
    --tw-scale-y: 0.5;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y))
        rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
        scaleX(0.5) scaleY(0.5);
    transform: translate(var(--tw-translate-x), var(--tw-translate-y))
        rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
        scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    animation: none;
}

.swal2-container
    .swal2-popup.swal2-toast
    .swal2-icon:where([dir="ltr"], [dir="ltr"] *) {
    margin-right: 0.25rem;
    margin-left: -0.375rem;
}

.swal2-container
    .swal2-popup.swal2-toast
    .swal2-icon:where([dir="rtl"], [dir="rtl"] *) {
    margin-left: 0.25rem;
    margin-right: -0.375rem;
}

.swal2-container
    .swal2-popup.swal2-toast
    .swal2-icon.swal2-success
    .swal2-success-ring {
    --tw-border-opacity: 1;
    border-color: #fff;
    border-color: rgba(255, 255, 255, var(--tw-border-opacity));
}

.swal2-container
    .swal2-popup.swal2-toast
    .swal2-icon.swal2-success
    .swal2-success-line-tip,
.swal2-container
    .swal2-popup.swal2-toast
    .swal2-icon.swal2-success
    .swal2-success-line-long {
    --tw-bg-opacity: 1;
    background-color: #fff;
    background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
}

.swal2-container .swal2-popup.swal2-toast .swal2-title {
    margin: 0;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.5rem;
}

.swal2-container .swal2-popup.swal2-toast .swal2-close {
    flex-shrink: 0;
    --tw-scale-x: 0.75;
    --tw-scale-y: 0.75;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y))
        rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
        scaleX(0.75) scaleY(0.75);
    transform: translate(var(--tw-translate-x), var(--tw-translate-y))
        rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))
        scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.swal2-container
    .swal2-popup.swal2-toast
    .swal2-close:where([dir="ltr"], [dir="ltr"] *) {
    margin-left: 0.5rem;
}

.swal2-container
    .swal2-popup.swal2-toast
    .swal2-close:where([dir="rtl"], [dir="rtl"] *) {
    margin-right: 0.5rem;
}

.swal2-container .swal2-popup.swal2-toast .swal2-timer-progress-bar-container {
    height: 2px;
}

.swal2-container .swal2-popup.swal2-toast .swal2-timer-progress-bar {
    background: #ddd;
}

.swal2-container .swal2-popup.swal2-toast.swal2-icon-error {
    --tw-bg-opacity: 1;
    background-color: #de3333 !important;
    /* background-color: #f87171; */
    background-color: rgba(248, 113, 113, var(--tw-bg-opacity));
}


.swal2-container .swal2-popup.swal2-toast.swal2-icon-error * {
    --tw-text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--tw-text-opacity));
}

.swal2-container .swal2-popup.swal2-toast.swal2-icon-error .swal2-error {
    --tw-border-opacity: 1;
    border-color: #fff;
    border-color: rgba(255, 255, 255, var(--tw-border-opacity));
}

.swal2-container
    .swal2-popup.swal2-toast.swal2-icon-error
    .swal2-x-mark-line-right,
.swal2-container
    .swal2-popup.swal2-toast.swal2-icon-error
    .swal2-x-mark-line-left {
    --tw-bg-opacity: 1;
    background-color: #fff;
    background-color: rgba(255, 255, 255, var(--tw-bg-opacity)) !important;
}

.swal2-container .swal2-popup.swal2-toast.swal2-icon-success {
    --tw-bg-opacity: 1;
    /* background-color: #00886a !important; */
    background-color: #22c55e;
    /* background-color: rgba(34,197,94,var(--tw-bg-opacity)) !important; */
    background-color: rgba(0, 136, 106, var(--tw-bg-opacity)) !important;
}

.swal2-container .swal2-popup.swal2-toast.swal2-icon-info {
    --tw-bg-opacity: 1;
    color: #fff;
    background-color: #3876ff;
}

.swal2-container .swal2-popup.swal2-toast.swal2-icon-info .swal2-icon::before {
    font-size: 1.5em;
    display: none;
}

.swal2-container .swal2-popup.swal2-toast.swal2-icon-info .swal2-icon-content {
    position: relative;
    top: 4px;
}

.swal2-container .swal2-popup.swal2-toast.swal2-icon-info .swal2-close {
    color: #fff;
}

.swal2-container .swal2-popup.swal2-toast.swal2-icon-info .swal2-title {
    color: #fff;
}

.swal2-container .swal2-popup.swal2-toast.swal2-icon-info {
    border-color: #fff !important;
    color: #fff !important;
}

.swal2-popup.swal2-toast .swal2-icon.swal2-info {
    border-color: #fff;
    color: #fff;
}

.swal2-success-circular-line-left,
.swal2-success-fix,
.swal2-success-circular-line-right {
    background-color: rgb(0, 136, 106) !important;
}

.swal2-container .swal2-popup.swal2-toast.swal2-icon-success * {
    --tw-text-opacity: 1;
    color: #fff;
    color: rgba(255, 255, 255, var(--tw-text-opacity));
}

.swal2-backdrop-show .swal2-icon.swal2-success::before,
.swal2-backdrop-show .swal2-icon.swal2-success::after {
    background-color: transparent !important;
}

.swal2-popup .swal2-title {
    font-size: 18px;
    color: #000;
    font-weight: 500;
    margin-bottom: 10px;
}

.swal2-popup {
    border-radius: 5px !important;
}

.swal2-container:not(.swal2-top):not(.swal2-top-start):not(.swal2-top-end):not(
        .swal2-top-left
    ):not(.swal2-top-right):not(.swal2-center-start):not(.swal2-center-end):not(
        .swal2-center-left
    ):not(.swal2-center-right):not(.swal2-bottom):not(.swal2-bottom-start):not(
        .swal2-bottom-end
    ):not(.swal2-bottom-left):not(.swal2-bottom-right):not(
        .swal2-grow-fullscreen
    )
    > .swal2-modal {
    border-radius: 20px !important;
}

.swal2-popup .swal2-styled {
    min-width: 80px;
    box-shadow: none !important;
    opacity: 1 !important;
    padding: 10px 12px;
    font-size: 15px !important;
    border-width: 0px;
    border-style: initial;
    border-color: initial;
    border-image: initial;
    border: 0;
    border-radius: 10px !important;
    outline: none !important;
    color: #fff;
    margin-left: 10px;
}

.swal2-popup .swal2-actions {
    margin: 0.7em auto 0;
}

.sweet-alert .sa-icon,
.swal2-container .swal2-icon {
    transform: scale(0.8);
}

.swal2-popup .swal2-styled.swal2-confirm {
    background-color: rgb(0, 0, 0) !important;
}

.swal2-container.swal2-backdrop-show,
.swal2-container.swal2-noanimation {
    background: rgba(107, 114, 128, 0.75);
}

.swal2-popup .swal2-styled.swal2-cancel {
    background-color: #e6e8f0 !important;
    font-size: 15px !important;
    color: #000;
}

/* Seo Preivew */

/* Seo Preview */

/* Specific colors for the SERP preview */
.seo-preview #titlePreview {
    color: #1a0dab;
    font-size: 1.3em;
    margin-bottom: 5px;
}

.seo-preview #URL {
    color: #188038;
    font-size: 1.1em;
    margin-bottom: 5px;
    display: block;
}

.seo-preview #descPreview {
    color: #4d5156;
}

.seo-preview .seo-preview-title {
    max-width: 35em;
    margin: 0 auto;
    visibility: hidden;
}

.seo-preview {
    display: block;
    max-width: 35em;
    padding: 10px;
    margin: 0;
    background-color: #fff;
    /* border: 1px solid #ebedf3; */
    border-radius: 14px;
}

@media (max-width: 567px) {
    .seo-preview {
        margin-top: 30px;
    }
}

/* Sms Card Details */

.sms-card-details {
    padding: 0;
    background: #fff;
    border: 1px solid #eee;
}

.balance-wrapper {
    margin-bottom: 25px;
}

.balance-wrapper .sender-title {
    text-align: center;
    /* border: 1px solid #000; */
    padding: 1.2rem 1rem;
    border-radius: 10px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    background-color: #f5f7f9;
}

.balance-wrapper .sender-title p {
    margin: 0;
}

.balance-wrapper .sender-title p span {
    color: #000;
    font-weight: 700;
}

.balance-wrapper .available-balance {
    background-color: #f5f7f9;
    /* border: 1px solid #000; */
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    font-size: 16px;
    height: 60px;
}

.balance-wrapper .available-balance p {
    margin-bottom: 0;
}

.balance-wrapper .available-balance p i {
    vertical-align: middle;
    margin: 0 5px;
    font-size: 20px;
}

.balance-wrapper p span {
    color: #000;
    font-weight: 700;
}

.sms-card-details .messages-buttons {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.sms-card-details .messages-buttons .link-messaget {
    background-color: #fff;
    border: 1px solid #ebedf2;
    border-radius: 10px;
}

.sms-card-packages .main-title {
    font-size: 1.1rem;
    color: #000;
    font-weight: 700;
}

.sms-card-packages .card-body {
    padding: 20px 20px;
}

.sms-packages-items {
    margin-top: 0px;
}

.sms-packages-items .item {
    padding: 2rem 1rem;
    text-align: center;
    border-left: 1px solid #000;
}

.sms-packages-items .col-md-4 .item {
    border-left: 1px solid #ebedf3;
}

.sms-packages-items .col-md-4:last-child .item {
    border-left: 0;
}

.sms-packages-items .item .icon {
    font-size: 33px;
}

.sms-packages-items .item h3 {
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 1rem;
}

.sms-packages-items .item .points-number {
    font-size: 20px;
}

.sms-packages-items .price {
    font-weight: 600;
    font-size: 30px;
    margin-bottom: 0.5rem;
}

.sms-packages-items .provider {
    margin-bottom: 0.5rem;
}

.sms-packages-items .pay-sms-btn {
    display: inline-flex;
    min-width: 120px;
    margin-top: 1rem;
}

.helping-text-links {
    margin-top: 1rem;
}

.helping-text-links .badge {
    padding: 1em 0.85em;
    border-radius: 50px;
}

.helping-text-links .badge:hover {
    color: #4a4ca4;
}

.helping-text-links .badge:focus {
    box-shadow: none;
    color: #4a4ca4;
}

@media (max-width: 767px) {
    .balance-wrapper .sender-title {
        margin-bottom: 1rem;
        height: auto;
    }

    .balance-wrapper .available-balance {
        flex-direction: column;
        align-items: center;
        gap: 1rem;
    }

    .sms-packages-items .col-md-4 .item {
        border-left: 0;
        border-bottom: 1px solid #ebedf3;
    }
}

.iphone_mockup {
    display: block;
    direction: ltr;
    text-align: left;
    border: solid 10px #000;
    width: 336px;
    height: 650px;
    transform: scale(0.9);
    margin: -25px auto 0;
    padding: 0px;
    border-radius: 50px;
    background: #fff;
    -webkit-box-shadow: 0px 0px 0px 5px #131313;
    -moz-box-shadow: 0px 0px 0px 5px #131313;
    box-shadow: 0px 0px 0px 5px #131313;
}

.iphone_mockup .outer-button {
    background: -webkit-gradient(
        left top,
        right top,
        color-stop(0%, #4c4c4c),
        color-stop(12%, #595959),
        color-stop(25%, #666),
        color-stop(39%, #474747),
        color-stop(50%, #2c2c2c),
        color-stop(51%, black),
        color-stop(60%, #111),
        color-stop(76%, #2b2b2b),
        color-stop(91%, #1c1c1c),
        color-stop(100%, #131313)
    );
    background: -webkit-linear-gradient(
        left,
        #4c4c4c 0%,
        #595959 12%,
        #666 25%,
        #474747 39%,
        #2c2c2c 50%,
        black 51%,
        #111 60%,
        #2b2b2b 76%,
        #1c1c1c 91%,
        #131313 100%
    );
    background: -o-linear-gradient(
        left,
        #4c4c4c 0%,
        #595959 12%,
        #666 25%,
        #474747 39%,
        #2c2c2c 50%,
        black 51%,
        #111 60%,
        #2b2b2b 76%,
        #1c1c1c 91%,
        #131313 100%
    );
    background: -ms-linear-gradient(
        left,
        #4c4c4c 0%,
        #595959 12%,
        #666 25%,
        #474747 39%,
        #2c2c2c 50%,
        black 51%,
        #111 60%,
        #2b2b2b 76%,
        #1c1c1c 91%,
        #131313 100%
    );
    background: linear-gradient(
        to right,
        #4c4c4c 0%,
        #595959 12%,
        #666 25%,
        #474747 39%,
        #2c2c2c 50%,
        black 51%,
        #111 60%,
        #2b2b2b 76%,
        #1c1c1c 91%,
        #131313 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4c4c4c', endColorstr='#131313', GradientType=1);
}

.iphone_mockup .outer-button-reversed {
    background: #131313;
    background: -moz-linear-gradient(
        left,
        #131313 0%,
        #1c1c1c 9%,
        #2b2b2b 24%,
        #111 40%,
        black 49%,
        #2c2c2c 50%,
        #474747 61%,
        #666 75%,
        #595959 88%,
        #4c4c4c 100%
    );
    background: -webkit-gradient(
        left top,
        right top,
        color-stop(0%, #131313),
        color-stop(9%, #1c1c1c),
        color-stop(24%, #2b2b2b),
        color-stop(40%, #111),
        color-stop(49%, black),
        color-stop(50%, #2c2c2c),
        color-stop(61%, #474747),
        color-stop(75%, #666),
        color-stop(88%, #595959),
        color-stop(100%, #4c4c4c)
    );
    background: -webkit-linear-gradient(
        left,
        #131313 0%,
        #1c1c1c 9%,
        #2b2b2b 24%,
        #111 40%,
        black 49%,
        #2c2c2c 50%,
        #474747 61%,
        #666 75%,
        #595959 88%,
        #4c4c4c 100%
    );
    background: -o-linear-gradient(
        left,
        #131313 0%,
        #1c1c1c 9%,
        #2b2b2b 24%,
        #111 40%,
        black 49%,
        #2c2c2c 50%,
        #474747 61%,
        #666 75%,
        #595959 88%,
        #4c4c4c 100%
    );
    background: -ms-linear-gradient(
        left,
        #131313 0%,
        #1c1c1c 9%,
        #2b2b2b 24%,
        #111 40%,
        black 49%,
        #2c2c2c 50%,
        #474747 61%,
        #666 75%,
        #595959 88%,
        #4c4c4c 100%
    );
    background: linear-gradient(
        to right,
        #131313 0%,
        #1c1c1c 9%,
        #2b2b2b 24%,
        #111 40%,
        black 49%,
        #2c2c2c 50%,
        #474747 61%,
        #666 75%,
        #595959 88%,
        #4c4c4c 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#131313', endColorstr='#4c4c4c', GradientType=1);
}

.iphone_mockup .silence-switch {
    position: absolute;
    margin-left: -19px;
    margin-top: 90px;
    width: 4px;
    height: 30px;
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
}

.iphone_mockup .volume-rocker-top {
    position: absolute;
    margin-left: -19px;
    margin-top: 140px;
    width: 4px;
    height: 50px;
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
}

.iphone_mockup .volume-rocker-bottom {
    position: absolute;
    margin-left: -19px;
    margin-top: 200px;
    width: 4px;
    height: 50px;
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
}

.iphone_mockup .power-button {
    position: absolute;
    margin-left: 350px;
    margin-top: 200px;
    width: 4px;
    height: 70px;
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
}

.iphone_mockup .top-section {
    background: #f6f6f7;
    height: 93px;
    margin: 0px;
    border-top-right-radius: 40px;
    border-top-left-radius: 40px;
    border-bottom: #e6e6e6 1px solid;
}

.iphone_mockup .top-section-time {
    position: absolute;
    margin-left: 30px;
    margin-top: 8px;
    font-size: 12px;
    font-weight: bold;
}

.iphone_mockup .top-section-middle {
    margin: auto;
    width: 180px;
    background: black;
    height: 20px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    padding-top: 5px;
}

.iphone_mockup .top-section-user-pic {
    margin: auto;
    margin-top: 20px;
    width: 30px;
    height: 40px;
    border-radius: 100%;
    background-color: none;
    font-size: 40px;
    color: #999999;
}

.iphone_mockup .clip-circle {
    clip-path: circle(20px at center);
}

.iphone_mockup .top-section-user-name {
    margin: auto;
    margin-top: 5px;
    background: none;
    height: 10px;
    width: 100px;
    font-size: 10px;
    text-align: center;
}

.iphone_mockup .speaker {
    width: 60px;
    height: 8px;
    background: #2e2e2e;
    margin-left: 55px;
    border-radius: 10px;
}

.iphone_mockup .front-camera {
    height: 8px;
    width: 8px;
    background: #005063;
    border-radius: 100%;
    margin-left: 70px;
}

.iphone_mockup .top-section-symbols {
    position: absolute;
    margin-left: 250px;
    margin-top: 10px;
    font-size: 12px;
}

.iphone_mockup .symbols {
    height: 14px;
    margin-left: -10px;
}

.iphone_mockup .arrow {
    position: absolute;
    border: solid #3478f6;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 5px;
    margin-top: 45px;
    margin-left: 13px;
    border-radius: 2px;
    opacity: 0.9;
}

.iphone_mockup .arrow:hover {
    cursor: pointer;
    opacity: 1;
}

.iphone_mockup .left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

.iphone_mockup .wifi {
    padding: 1px;
    width: 10px;
    height: 10px;
    display: inline-block;
    border: 10px double transparent;
    border-top-color: currentColor;
    border-radius: 50%;
}

.iphone_mockup .wifi:before {
    display: inline-block;
    border: 10px double transparent;
    border-top-color: currentColor;
    border-radius: 50%;
    content: "";
    width: 0;
    height: 0;
}

.iphone_mockup .battery-icon {
    position: absolute;
    width: 10px;
    height: 5px;
    border-radius: 2px;
    border: 2px solid #000;
    top: 50%;
    left: 100%;
    transform: translate(-50%, -50%);
}

.iphone_mockup .battery-icon:before {
    content: "";
    position: absolute;
    right: -4px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 2px;
    border-radius: 2px;
    background: #000;
}

.iphone_mockup .battery-icon:after {
    content: "";
    position: absolute;
    left: 0px;
    top: 0px;
    width: 70%;
    height: 4px;
    background-color: #000;
    border-radius: 2px;
}

.iphone_mockup .messages-section {
    margin-top: 85px;
    background: #fff;
    height: 305px;
    overflow: scroll;
    font-size: 13px;
    font-weight: 600;
}

.iphone_mockup .messages-section::-webkit-scrollbar {
    display: none;
}

.iphone_mockup .home-screen-button {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    border-radius: 50px;
    width: 125px;
    height: 5px;
    background: #000;
}

.iphone_mockup .inside-input {
    height: 25px;
    position: absolute;
    margin-top: 10px;
    margin-left: 302px;
    opacity: 1;
    color: #3478f6;
    padding: 2px;
    font-size: 22px;
}

.iphone_mockup .inside-input:hover {
    opacity: 1;
    cursor: pointer;
}

.iphone_mockup .inside-input:active {
    opacity: 0.8;
}

.iphone_mockup .message {
    border-radius: 20px 20px 20px 20px;
    margin: 0 15px 10px;
    padding: 10px 15px;
    position: relative;
    animation-name: fadeInOpacity;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: 0.4s;
    text-align: right;
}

.preview-iphone-text {
    font-size: 1.1rem;
    font-weight: 500;
    color: #464457;
    margin: 0 0 1rem 0;
}

.iphone_mockup .message #notifi_iphone_msg,
.iphone_mockup .message #notifi_iphone_title {
    display: block;
    line-break: anywhere;
    direction: rtl;
}

.iphone_mockup .message.to {
    background-color: #3478f6;
    color: #fff;
    margin-left: 80px;
    transition: width 2s;
}

.iphone_mockup .message.to:before {
    content: "";
    width: 0;
    height: 0;
    left: 93%;
    top: 30%;
    position: absolute;
    border-top: 13px solid transparent;
    border-left: 26px solid #3478f6;
    border-bottom: 13px solid transparent;
    border-radius: 40px;
    -ms-transform: rotate(40deg);
    transform: rotate(40deg);
}

.iphone_mockup .message.from {
    background-color: #e9e9ea;
    color: #363636;
    margin-right: 80px;
}

.iphone_mockup .message.from:before {
    content: "";
    width: 0;
    height: 0;
    right: 93%;
    top: 60%;
    position: absolute;
    border-top: 13px solid transparent;
    border-right: 26px solid #e9e9ea;
    border-bottom: 13px solid transparent;
    border-radius: 40px;
    -ms-transform: rotate(-40deg);
    transform: rotate(-40deg);
}

.summery_card .statics-items .item .icon {
    font-size: 22px;
}

.summery_card .statics-items .item .icon::before {
    display: none;
}

.summery_card .statics-items .item .content .content_number {
    margin: 0;
}

/* Branches */

.map-wrapper {
    position: relative;
}

.map-wrapper .map-loading-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #f5f7f9;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 99;
    border-radius: 12px;
    max-height: 450px;
}

.map-wrapper #googleMap {
    border-radius: 12px;
}

.map-wrapper .pac-target-input {
    top: 10px !important;
    width: calc(100% - 250px);
    height: calc(2.1em + 1.3rem + 2px);
    border-radius: 10px;
    padding: 0.65rem 1rem;
    font-family: "Ping AR + LT", sans-serif !important;
    border: 1px solid #ebedf2;
    outline: none;
    box-shadow: none;
}

.map-location-btn {
    position: absolute;
    bottom: 50px;
    right: 28px;
    z-index: 99;
    cursor: pointer;
}

.required_star {
    padding: 0;
}

.switchy-sm span {
    width: 40px;
    height: 24px;
    border-radius: 15px;
}

.switchy-sm span:after {
    width: 20px;
    height: 20px;
    border-radius: 13px;
}

.switchy-sm input:checked ~ span:after {
    transform: translate3d(16px, 0, 0);
}

[id^="gridRectMask"] {
    display: none;
}

/* Custom Switch */

.toggle-switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 24px;
    cursor: pointer;
}

.toggle-switch input[type="checkbox"] {
    display: none;
}

.toggle-switch-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #e9e9ea;
    border-radius: 15px;
    border: 1px solid #e9e9ea;
    transition: all 0.3s ease-in-out;
}

.toggle-switch-handle {
    position: absolute;
    top: 50%;
    left: 1px;
    width: 20px;
    height: 20px;
    background-color: #fff;
    border-radius: 13px;
    transition: transform 0.3s ease-in-out;
    transform: translateY(-50%);
}

.toggle-switch::before {
    content: "";
    position: absolute;
    top: -25px;
    right: -35px;
    font-size: 12px;
    font-weight: bold;
    color: #aaa;
    text-shadow: 1px 1px #fff;
    transition: color 0.3s ease-in-out;
}

.toggle-switch input[type="checkbox"]:checked + .toggle-switch-handle {
    transform: translateY(-50%) translateX(45px);
}

.toggle-switch input[type="checkbox"]:checked + .toggle-switch-background {
    background-color: #4cd964;
    border-color: #4cd964;
}

.toggle-switch
    input[type="checkbox"]:checked
    + .toggle-switch-background
    .toggle-switch-handle {
    transform: translateY(-50%) translateX(16px);
}

.no-reulst-note {
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    /* border: 1px solid #f0f2f5; */
    /* box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%); */
    border-radius: 15px;
    background-color: #fff;
}

.no-reulst-note .empty-card-wrap {
    min-height: 300px;
    width: 100%;
    border-radius: 15px;
}

.tabel .no-reulst-note {
    border: 0;
}

.refresh-icon {
    border: 1px solid #f0f2f5;
    background: #f5f7f9;
    border-radius: 7px;
    width: 30px;
    height: 30px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    margin: 0 0.5rem;
    outline: none;
    box-shadow: none;
}

.disabled-day input.form-control,
.disabled-day .btn.btn-main,
.disabled-day .delete-button {
    background: #f5f7f9 !important;
    background-color: #f5f7f9 !important;
    border-color: #f5f7f9 !important;
    pointer-events: none;
    color: #000;
}

.disabled-day .kt-checkbox.kt-checkbox--success > span {
    background: #f5f7f9;
    border-color: #ebedf3;
}

.disabled-day .full-time-wrapper label {
    color: #929292;
}

.disabled-day .full-time-wrapper {
    pointer-events: none;
}

.disabled-day .switchy {
    pointer-events: none;
}

/* Business Sub Images */

.sub-images-items-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 1rem;
}

.sub-images-items-wrapper .sub-image-item {
    position: relative;
    flex: 0 0 24%;

    border: 1px solid #ebedf2;
    border-radius: 12px;
    overflow: hidden;
    /* height: max-content; */
}

.sub-images-items-wrapper .sub-image-area {
    position: relative;
    height: 300px;
}

.sub-images-items-wrapper .sub-img img {
    max-width: 100%;
    width: 100%;
    object-fit: cover;
    height: 300px;
}

.sub-images-items-wrapper .alt-box {
    position: absolute;
    bottom: 10px;
    left: 10px;
    background: rgba(0, 0, 0, 0.3);
    border: 0;
    border-radius: 50px;
    display: flex;
    align-items: center;
    z-index: 222;
}

.sub-images-items-wrapper .alt-box > .search-txt {
    width: 0;
    padding: 0;
    color: #fff;
    border: 0;
}

.sub-images-items-wrapper .alt-box .search-btn {
    color: #fff;
    float: right;
    width: 40px;
    height: 40px;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    transition: 0.4s;
    cursor: pointer;
}

.sub-images-items-wrapper .alt-box .search-txt {
    border: none;
    background: none;
    outline: none;
    float: left;
    padding: 0;
    color: #fff;
    font-size: 13px;
    transition: 0.4s;
    line-height: 40px;
    width: 0;
}

.sub-images-items-wrapper .alt-box .search-txt::placeholder {
    color: #fff;
}

.sub-images-items-wrapper .sub-image-actions {
    position: relative;
    font-size: 14px;
    background-color: #f2f5f7;
    padding: 10px 11px 13px 10px;
    border-radius: 5px;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}

.sub-images-items-wrapper .main-image-check {
    display: flex;
    align-items: center;
}

.sub-images-items-wrapper .delete-button button i {
    padding: 0;
}

.sub-images-items-wrapper .sub-image-area .alt-box.opend > .search-txt {
    width: 185px;
    padding: 0 12px;
}

/* .sub-images-items-wrapper .progress-files {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgb(0 0 0 / 20%);
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0;
    border-radius: 0;
} */
.progress-images-upload {
    margin: 1rem auto 0;
}

.progress-images-upload .progress-bar {
    background-color: var(--globalColor);
    height: 28px;
    font-size: 14px;
}

.progress-images-upload .progress {
    width: 250px;
    height: 25px;
    border-radius: 50px;
}

/* Loyality Business */

.loyalty-business-wrapper {
    text-align: center;
}

.loyalty-business-wrapper .loyalty-sub-title {
    padding: 0;
    font-size: 14px;
    color: #000;
}

.loyalty-business-wrapper .loyalty-sub-title .coin-icon {
    display: block;
    margin: 0 auto 0.5rem;
    width: 40px;
}

.loyalty-business-wrapper .loyalty-coupon {
    position: relative;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background-color: #f5f7f9;
    border: 1px solid #ebedf3;
    -webkit-box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.03);
    box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.03);
    width: 100%;
    border-radius: 15px;
    padding: 1rem 1.2rem 1rem;
    /* justify-content: center; */
    flex-direction: column;
    justify-content: center;
}

.loyalty-business-wrapper .loyalty-coupon .copyBtn {
    color: var(--globalColor);
    position: relative;
    top: -2px;
}

.loyalty-business-wrapper .loyalty-coupon i {
    font-size: 17px;
}

.loyalty-business-wrapper .loyalty-coupon .copyBtn i {
    font-size: 13px;
}

.loyalty-business-wrapper .toggle-share-btn {
    color: #566370;
    display: flex;
    align-items: center;
    gap: 0.3rem;
    margin-top: 1rem;
}

.loyalty-business-wrapper .toggle-share-btn i {
    font-size: 14px;
    position: relative;
    top: -0.5px;
}

.loyalty-business-wrapper .loyalty-code {
    font-weight: bold;
    font-size: 27px;
}

.loyalty-business-wrapper .coupon_number {
    padding: 10px 12px 5px 12px;
    border-radius: 14px;
}

.loyalty-business-wrapper .loyalty-share {
    display: flex;
    align-items: center;
    margin-top: 0;
    /* overflow: hidden; */
    max-height: 0;
    opacity: 0;
    transition: max-height 0.4s ease, opacity 0.4s ease;
    gap: 10px;
    pointer-events: none;
    /* prevent click when hidden */
}

.loyalty-share.show {
    max-height: 100px;
    /* adjust based on content */
    opacity: 1;
    pointer-events: auto;
}

.loyalty-business-wrapper .loyalty-share .copyBtn.copied::before {
    content: "تم النسخ";
    position: absolute;
    top: -34%;
    left: 70%;
    white-space: nowrap;
    transform: translateX(-50%);
    font-size: 11px;
}

.loyalty-business-wrapper .loyalty-share a {
    position: relative;
    display: flex;
    width: 30px;
    height: 30px;
    align-items: center;
    color: #000;
    font-size: 16px;
}

.loyalty-business-wrapper .loyalty-current-points {
    margin-top: 0.5rem;
}

.loyalty-business-wrapper .loyalty-current-points .loyalty-sub-title {
    margin-bottom: 0;
}

.loyalty-business-wrapper .loyalty-current-points .current-points {
    font-size: 25px;
    color: var(--globalColor);
    font-weight: 700;
    margin: 0.5rem auto 0;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.loyalty-business-wrapper .loyalty-current-points .current-points .points {
    font-size: 1.1rem;
}

.loyalty-faqs {
    /* margin-top: 1rem; */
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: center;
    /* margin-top: 1.5rem; */
    margin: 0;
}

.loyalty-business-wrapper .v-line {
    background: #ebedf3;
    height: 25px;
    width: 1px;
}

.loyalty-faqs a {
    color: #000;
}

.loyalty-steps {
    padding: 30px 0 12.5px;
}

.loyalty-steps .title {
    font-size: 18px;
    margin-bottom: 2rem;
}

.loyalty-steps .loyalty-steps-content {
    display: flex;
    align-items: center;
    gap: 3rem 2rem;
    flex-wrap: wrap;
}

.loyalty-steps .item {
    display: flex;
    align-items: center;
    gap: 1rem;
    width: 48%;
}

.loyalty-steps .item .icon {
    min-width: 65px;
    height: 65px;
    background-color: #f4f6f9;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50px;
    font-size: 23px;
}

.loyalty-steps .item .content {
    text-align: right;
}

.loyalty-steps .item .content h3 {
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 0.4rem;
}

.loyalty-steps .item .content p {
    font-size: 13px;
    margin-bottom: 0;
}

@media (max-width: 1024px) {
    .loyalty-steps .loyalty-steps-content {
        flex-direction: column;
        align-items: flex-start;
        gap: 2.3rem;
    }

    .loyalty-steps .loyalty-steps-content .item {
        width: 100%;
    }
}

@media (max-width: 767px) {
    .loyalty-steps {
        flex-direction: column;
        align-items: flex-start;
    }
}

/* .loyalty-business-wrapper .points-logs {

} */

.loyalty-business-wrapper .points-logs .item {
    display: flex;
    justify-content: space-between;
    padding: 1rem 5px;
    border-bottom: 1px solid #f2f2f2;
}

.loyalty-business-wrapper .points-logs .item:last-child {
    border-bottom: 0;
}

.loyalty-business-wrapper .points-logs .item .user-wrapper > span {
    font-weight: 500;
    font-size: 14px;
    color: #000;
}

.loyalty-business-wrapper .points-logs .points-earned {
    display: flex;
    gap: 2rem;
    align-items: center;
}

.loyalty-business-wrapper .points-logs .points {
    color: #000;
    font-weight: 500;
    font-size: 15px;
}

.loyalty-business-wrapper .points-logs .date {
    color: #8193ae;
    font-size: 10px;
}

.loyalty-business-wrapper .faq-wrapper {
    text-align: right;
}

.loyalty-business-wrapper .faq-wrapper .item {
    padding: 0 0 1rem 0;
}

.loyalty-business-wrapper .faq-wrapper .question {
    font-weight: 700;
    font-size: 17px;
}

.loyalty-business-wrapper .faq-wrapper .answer {
    line-height: 30px;
    margin-top: 0.5rem;
    font-size: 15px;
}

.loyalty-business-wrapper .faq-wrapper .loyalty-sub-title {
    text-align: inherit;
    font-size: 20px;
    font-weight: 500;
}

@media (max-width: 576px) {
    .loyalty-business-wrapper .faq-wrapper .question {
        font-size: 14px;
    }

    .loyalty-business-wrapper .faq-wrapper .answer {
        font-size: 13px;
    }

    .loyalty-business-wrapper .user-wrapper {
        gap: 10px;
        text-align: right;
        max-width: 200px;
    }

    .loyalty-business-wrapper .points-logs .item .user-wrapper > span {
        font-size: 12px;
    }

    .loyalty-business-wrapper .points-logs .points {
        font-size: 12px;
    }
}

.points-balance {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 0.8rem;
    padding: 0 1rem;
}

/* Skeleton */
/*
.skeleton-wrapper {
    background: #fff;
    border: 1px solid;
    border-color: #f0f2f5;
    border-radius: 18px;
    -webkit-border-radius: 18px;
    margin: 10px 0;
    box-shadow: 0 1px 2px 0 rgba(237, 237, 237, 0.5);
}

.skeleton-wrapper-inner {
    padding: 15px;
    position: relative;
}

.skeleton-wrapper-body div:not(.skeleton-user) {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-name: placeholderSkeleton;
    -webkit-animation-timing-function: linear;
    background: #f5f7f9;
    background-image: -webkit-gradient(linear, left center, right center, from(#f5f7f9), color-stop(.2, #edeef1), color-stop(.4, #f5f7f9), to(#f5f7f9));
    background-image: -webkit-linear-gradient(left, #f5f7f9 0%, #edeef1 20%, #f5f7f9 40%, #f5f7f9 100%);
    background-repeat: no-repeat;
    background-size: 800px 104px;
    height: 104px;
    position: relative;
    height: 30px;
    margin-bottom: 15px;
    border-radius: 10px;
}

.skeleton-wrapper-body {
    -webkit-animation-name: skeletonAnimate;

    background-repeat: repeat;
    background-size: 50% auto;
}


div.skeleton-avatar {
    height: 50px !important;
    width: 50px;
    border-radius: 50px !important;
    right: 0;
    left: auto;
    margin: 0;
}

div.skeleton-author {
    top: 20px;
    height: 20px;
    right: 70px;
    width: 150px;
    margin: 0;
    top: 0;
    right: 20px;
}

div.skeleton-stars {
    top: 73px;
    right: 15px;
    height: 15px;
    max-width: 132px;
}

div.skeleton-label {
    right: 70px;
    top: 50px;
    height: 10px;
    width: 100px;
}

div.skeleton-user {
    display: flex;
    align-items: center;
    background-color: #fff;
}


div.skeleton-content-1,
div.skeleton-content-2,
div.skeleton-content-3 {
    right: 15px;
    right: 15px;
    height: 10px;
}

div.skeleton-content-1 {
    top: 108px;
}

div.skeleton-content-2 {
    top: 130px;
}

div.skeleton-content-3 {
    top: 150px;
}

div.skeleton-content-4 {
    top: 175px;
    height: 80px;
    width: 80px;
    border-radius: 18px;
}
div.skeleton-content-4-1 {
    top: 175px;
    height: 80px;
    width: 80px;
    right: calc(80px + 25px);
    border-radius: 18px;
}

div.skeleton-content-4-2 {
    top: 175px;
    height: 80px;
    width: 80px;
    right: calc(160px + 35px);
    border-radius: 18px;
}

div.skeleton-content-4-3 {
    top: 175px;
    height: 80px;
    width: 80px;
    right: calc(240px + 45px);
    border-radius: 18px;
}

div.skeleton-content-4-4 {
    top: 175px;
    height: 80px;
    width: 80px;
    right: calc(320px + 65px);
    border-radius: 18px;
}

@media(max-width: 767px) {

    div.skeleton-content-4-2,
    div.skeleton-content-4-3,
    div.skeleton-content-4-4 {
      display: none;
    }
}

.skeleton-images {
    display: flex;
    background: transparent !important;
    height: auto !important;
    gap: 1rem
}

.skeleton-images .skeleton-content {
    width: 80px !important;
    height: 80px !important;
    border-radius: 12px;
}



@-webkit-keyframes placeholderSkeleton {
    0% {
        background-position: -468px 0;
    }

    100% {
        background-position: 468px 0;
    }
}

@-webkit-keyframes skeletonAnimate {
    from {
        background-position: top left;
    }

    to {
        background-position: top right;
    }
} */

.skeleton-wrapper {
    background: #fff;
    border: 1px solid;
    border-color: #f0f2f5;
    border-radius: 18px;
    -webkit-border-radius: 18px;
    margin: 10px 0;
    box-shadow: 0 1px 2px 0 rgba(237, 237, 237, 0.5);
}

.skeleton-wrapper-inner {
    height: 280px;
    padding: 15px;
    position: relative;
}

.skeleton-wrapper-body div {
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-name: placeholderSkeleton;
    -webkit-animation-timing-function: linear;
    background: #f5f7f9;
    background-image: -webkit-gradient(
        linear,
        left center,
        right center,
        from(#f5f7f9),
        color-stop(0.2, #edeef1),
        color-stop(0.4, #f5f7f9),
        to(#f5f7f9)
    );
    background-image: -webkit-linear-gradient(
        left,
        #f5f7f9 0%,
        #edeef1 20%,
        #f5f7f9 40%,
        #f5f7f9 100%
    );
    background-repeat: no-repeat;
    background-size: 800px 104px;
    height: 104px;
    position: relative;
}

.skeleton-wrapper-body {
    -webkit-animation-name: skeletonAnimate;
    background-image: -webkit-gradient(
        linear,
        center top,
        center bottom,
        from(deg),
        color-stop(0, red),
        color-stop(0.15, orange),
        color-stop(0.3, yellow),
        color-stop(0.45, green),
        color-stop(0.6, blue),
        color-stop(0.75, indigo),
        color-stop(0.8, violet),
        to(red)
    );
    background-image: -webkit-linear-gradient(
        135deg,
        red 0%,
        orange 15%,
        yellow 30%,
        green 45%,
        blue 60%,
        indigo 75%,
        violet 80%,
        red 100%
    );
    background-repeat: repeat;
    background-size: 50% auto;
}

.skeleton-wrapper-body div {
    position: absolute;
    right: 15px;
    left: 15px;
    top: 15px;
}

div.skeleton-avatar {
    height: 40px;
    width: 40px;
    border-radius: 50px;
    right: 15px;
    left: auto;
}

div.skeleton-author {
    top: 20px;
    height: 20px;
    right: 70px;
    width: 150px;
}

div.skeleton-stars {
    top: 73px;
    right: 15px;
    height: 15px;
    max-width: 132px;
}

div.skeleton-label {
    right: 70px;
    top: 50px;
    height: 10px;
    width: 100px;
}

div.skeleton-content-1,
div.skeleton-content-2,
div.skeleton-content-3 {
    right: 15px;
    right: 15px;
    height: 10px;
}

div.skeleton-content-1 {
    top: 108px;
}

div.skeleton-content-2 {
    top: 130px;
}

div.skeleton-content-3 {
    top: 150px;
}

div.skeleton-content-4 {
    top: 175px;
    height: 80px;
    width: 80px;
    border-radius: 18px;
}

div.skeleton-content-4-1 {
    top: 175px;
    height: 80px;
    width: 80px;
    right: calc(80px + 25px);
    border-radius: 18px;
}

div.skeleton-content-4-2 {
    top: 175px;
    height: 80px;
    width: 80px;
    right: calc(160px + 35px);
    border-radius: 18px;
}

div.skeleton-content-4-3 {
    top: 175px;
    height: 80px;
    width: 80px;
    right: calc(240px + 45px);
    border-radius: 18px;
}

div.skeleton-content-4-4 {
    top: 175px;
    height: 80px;
    width: 80px;
    right: calc(320px + 65px);
    border-radius: 18px;
}

@media (max-width: 767px) {
    div.skeleton-content-4-2,
    div.skeleton-content-4-3,
    div.skeleton-content-4-4 {
        display: none;
    }
}

@-webkit-keyframes placeholderSkeleton {
    0% {
        background-position: -468px 0;
    }

    100% {
        background-position: 468px 0;
    }
}

@-webkit-keyframes skeletonAnimate {
    from {
        background-position: top left;
    }

    to {
        background-position: top right;
    }
}

/* Custom Upload Input */
.custom_upload_input {
    position: relative;
}

.custom_upload_input > label {
    background: #f5f7f9;
    border: 1px solid #ebedf3;
    border-radius: 10px;
    height: 126px;
    color: transparent;
    margin: auto;
    width: 100%;
    box-sizing: border-box;
    color: #4f4f4f;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.custom_upload_input .icon {
    margin-bottom: 0.5rem;
}

.custom_upload_input > label[for="gallery-input"] {
    cursor: pointer;
    transition: 400ms ease;
}

.custom_upload_input input[type="file"] {
    position: absolute;
    opacity: 0;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    cursor: pointer;
}

/* New Rate */

.rates_card_item {
    background: transparent;
    box-shadow: none;
    border: 0;
}

.rates_card_item .card-body {
    padding: 1.25rem 0;
}

.item_rate {
    background-color: #fff;
    border: 1px solid #f0f2f5;
    border-radius: 18px;
    box-shadow: 0 1px 2px #ededed80;
    padding: 15px 45px 15px 15px;
    position: relative;
    transition: all 0.5sease;
    margin-bottom: 1rem;
}

.item_rate.without-select {
    padding: 20px 20px;
}

.item_rate .item_rate_content {
    width: 100%;
}

.item_rate .item_rate_side {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.item_rate .item_rate_side.rate_super {
    position: relative;
    padding-right: 54px;
}

.item_rate .item_rate_side.rate_super::before {
    content: "";
    width: 30px;
    height: 1px;
    display: inline-block;
    background: #e2e2e2;
    position: absolute;
    top: 25px;
    right: 16px;
}

.item_rate .item_rate_super {
    position: relative;
    margin-bottom: 0.5rem;
}

.item_rate .item_rate_super::before {
    content: "";
    width: 1px;
    height: 70%;
    display: inline-block;
    background: #e2e2e2;
    position: absolute;
    top: 112%;
    right: 16px;
}

.item_rate .item_rate_super .place_image {
    position: relative;
    display: flex;
    align-items: center;
    gap: 1rem;
    font-weight: 500;
    color: #000;
    max-width: max-content;
}

.item_rate .item_rate_super .place_image .icon {
    align-items: center;
    background-color: #ffffff30;
    border-radius: 12px;
    box-shadow: 0 3px 6px #00000012;
    display: flex;
    height: 40px;
    width: 40px;
    justify-content: center;
}

.item_rate .item_rate_super .place_image img {
    border-radius: 8px;
    display: block;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%;
}

.item_rate .item_rate_head {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.item_rate .item_rate_head .image {
    position: relative;
    display: inline-block;
    min-width: 45px;
    min-height: 45px;
    width: 45px;
    height: 45px;
    border-radius: 50px;
    overflow: hidden;
}

.item_rate .item_rate_head .image img {
    max-width: 100%;
    width: 100%;
    height: 100%;
}

.item_rate .item_rate_head .content .name {
    margin-bottom: 0.3rem;
    color: #000;
    font-weight: 500;
    font-size: 15px;
}

.item_rate .item_rate_head .content .name a {
    color: #000;
}

.item_rate .item_rate_head .content .details {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 12.5px;
}

.item_rate .item_rate_head .content .details .date,
.item_rate .item_rate_head .content .details .rate_id {
    color: #777e90;
    font-weight: 500;
}

.item_rate .item_rate_body {
    padding-right: 55px;
}

.item_rate .item_rate_body .stars {
    margin-top: 0.5rem;
}

.item_rate .item_rate_body .stars .jq-ry-container {
    padding: 0 !important;
}

.item_rate .item_rate_body .description {
    font-size: 14px;
    color: #312e43;
    line-height: 24px;
    padding: 0.5rem 0;
    font-weight: 500;
    max-width: 600px;
}

.item_rate .item_rate_body .rate_counts {
    display: flex;
    align-items: center;
    gap: 1rem;
    color: #777e90;
    font-weight: 500;
    padding-top: 10px;
}

.item_rate .item_rate_body .rate_counts .count {
    color: #000;
    margin: 0 5px;
}

.item_rate .item_rate_body .rate_attached_images {
    margin-top: 0;
}

.item_rate .item_rate_body .rate_attached_images.end {
    display: flex;
    justify-content: flex-end;
}

.item_rate .item_rate_body .rate_attached_images a {
    max-width: max-content;
}

.item_rate .item_rate_body .rate_attached_images img {
    object-fit: cover;
    width: 60px;
    height: 60px;
    border-radius: 12px;
}

.item_rate .item_rate_body .video-image {
    position: relative;
}

.item_rate .item_rate_body .video-image::before {
    content: "";
    width: 45px !important;
    height: 45px;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    color: #fbfbfb;
    transform: translate(-50%, -50%) scale(0.8);
    pointer-events: none;
    background-image: url("data:image/svg+xml;base64,PHN2ZyBpZD0iSWNvbiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNDYuODA5IiBoZWlnaHQ9IjQ2LjgwOSIgdmlld0JveD0iMCAwIDQ2LjgwOSA0Ni44MDkiPgogIDxnIGlkPSJHcm91cF85NDQyOCIgZGF0YS1uYW1lPSJHcm91cCA5NDQyOCI+CiAgICA8Y2lyY2xlIGlkPSJPdmFsIiBjeD0iMjMuNDA0IiBjeT0iMjMuNDA0IiByPSIyMy40MDQiIGZpbGw9IiMwNzA3MDciIG9wYWNpdHk9IjAuMzA1Ii8+CiAgICA8cGF0aCBpZD0iUGF0aF8xMjM1NTAiIGRhdGEtbmFtZT0iUGF0aCAxMjM1NTAiIGQ9Ik0xNDExLjM3Nyw2MTc2LjE1bDExLjYwOSw3LjE2Ny0xMS42MDksNi4zNDlaIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTM5MS43MTEgLTYxNTkuNTA0KSIgZmlsbD0iI2ZiZmJmYiIvPgogIDwvZz4KPC9zdmc+Cg==");
    background-repeat: no-repeat;
}

.item_rate .item_rate_actions {
    position: absolute;
    top: 20px;
    left: 15px;
}

.item_rate.rates_page {
    padding-right: 60px;
}

.item_rate.rates_page .kt-checkbox {
    position: absolute;
    top: 30px;
    right: 20px;
}

.description-content {
    display: flex;
    align-items: center;
    gap: 1rem;
    justify-content: space-between;
}

@media (max-width: 767px) {
    .item_rate {
        padding: 12px 12px !important;
    }

    .item_rate .item_rate_head {
        align-items: flex-start;
    }

    .item_rate .item_rate_head .content .details {
        /* flex-direction: column;
        align-items: flex-start;
        gap: 3px; */
        flex-wrap: wrap;
        gap: 3px;
    }

    .item_rate .item_rate_head .content .details .rate_id {
        margin-left: 10px;
    }

    .description-content {
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        margin-bottom: 0.7rem;
        gap: 0;
    }

    .item_rate .item_rate_side.rate_super {
        padding-right: 48px;
    }
}

.item_rate_content .replay_input {
    position: relative;
    margin-top: 1rem;
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.item_rate_content .replay_input textarea {
    resize: none;
}

.item_rate_content .replay_input .btn-main {
    position: absolute;
    bottom: 10px;
    left: 10px;
}

.item_rate_side.item_side_reply {
    position: relative;
    padding-top: 10px;
    padding-right: 30px;
}

.item_rate_side.item_side_reply::before {
    content: "";
    width: 30px;
    height: 1px;
    display: inline-block;
    background: #e2e2e2;
    position: absolute;
    top: 40px;
    right: 0;
}

.item_rate_side.item_side_reply .date {
    color: #777e90;
    font-weight: 500;
}

.item_rate_side.item_side_reply .item_rate_super::before {
    content: "";
    width: 1px;
    height: 35px;
    display: inline-block;
    background: #e2e2e2;
    position: absolute;
    bottom: 10px;
    right: -30px;
    top: auto;
}

.item_rate_side.item_side_reply .reply-edit-buttons {
    margin: 0 5px;
}

.item_rate_side.item_side_reply .reply-edit-buttons a,
.item_rate_side.item_side_reply .reply-edit-buttons button {
    color: #000;
    background-color: transparent;
    border: 0;
    padding: 0 0px;
    font-weight: 400;
    margin: 0 3px;
}

.item_rate_side.item_side_reply .reply-edit-buttons .edit-reply-btn {
    /* color: #0d6efd; */
    color: #777e90;
}

.item_rate_side.item_side_reply .reply-edit-buttons .delete-reply-btn {
    color: #777e90;
}

/* Applications  */

.app-card {
    position: relative;
    padding-bottom: 0;
    height: calc(100% - 13.5px);
    background-color: #fff;
}

.app-card .card-body {
    padding: 1rem;
}

.app-card .soon {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgb(229 229 229 / 25%);
    border-radius: 14px;
    cursor: not-allowed;
}

.app-card .soon-badge {
    padding: 0.35em 0.75em 0.2em 0.75em;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    /* background-color: rgba(138, 95, 230, 0.09); */
    /* border: 1px solid #e7dbf9; */
    /* color: #6654EA; */
    background-color: rgb(255, 73, 1, 0.1);
    color: #ff4901;
    position: absolute;
    top: 10px;
    left: 10px;
    width: 70px;
    text-align: center;
    font-weight: 600;
    border-radius: 10px;
}

.app-card .soon-badge i {
    position: relative;
    top: -2px;
}

.app-card .soon-badge img {
    max-width: 15px;
    position: relative;
    top: -2px;
}

.app-card .app-head {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 0.8rem;
}

.app-card .circle-dot {
    width: 3px;
    height: 3px;
    background-color: var(--globalColor);
    border-radius: 50px;
}

.app-card .icon {
    position: relative;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
    box-shadow: rgba(67, 71, 85, 0.2) 0px 0px 0.25em,
        rgba(90, 125, 188, 0.02) 0px 0.25em 1em;
    position: relative;
    z-index: 2;
}

.app-card .icon.space {
    padding: 5px;
}

.app-card .icon img {
    max-width: 100%;
    object-fit: contain;
}

.app-card .app-name {
    font-size: 15px;
    margin-bottom: 0.5rem;
}

.app-card .app-rate {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0;
    font-size: 13px;
}

.app-card .rate-num {
    position: relative;
    top: 1px;
}

.app-card .app-rate .icon-star {
    font-size: 10px;
}

.app-card .app-describe {
    padding: 10px 0 0;
    margin-bottom: 0;
    font-size: 13px;
    min-height: 49px;
}

.app-card .app-link {
    margin-top: 0.8rem;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.app-card .app-link a {
    max-width: 100px;
    background-color: #fff;
}

.app-card .app-link a:hover,
.app-card .app-link a:focus {
    background-color: #fff;
}

.app-card .app-link a.copyBtn.copied::before {
    transform: translateY(-50%);
    top: 50%;
    left: 0;
    right: 120%;
}

.app-card .icon.webook {
    background-color: #e55679;
}

.app-card .icon.webook img {
    filter: invert(1) brightness(100);
}

.app-card .icon.marn {
    background-color: #000;
}

.app-card .icon.marn img {
    filter: invert(1) brightness(100);
}

.app-card .icon.rewaa {
    background-color: #4eabaf;
}

.app-card .icon.rewaa img {
    filter: invert(1) brightness(100);
}

.app-card .icon.jahez {
    background-color: #cf3536;
}

.app-card .icon.jahez img {
    filter: invert(1) brightness(100);
}

.app-card .icon.mrsool {
    background-color: #12b36a;
}

.app-card .icon.taker {
    background-color: #46225d;
}

.app-card .icon.taker img {
    filter: invert(1) brightness(100);
}

.app-card .icon.order {
    background-color: #8b52f6;
}

.app-card .icon.order img {
    filter: invert(1) brightness(100);
}

.app-card .icon.mailchimp {
    background-color: #fae150;
}

.app-card .icon.matajer {
    background-color: #4d4fa8;
}

/* New Whatsapp Pages */

.link-whatsapp {
    padding: 20px 0;
    text-align: center;
    border: 1px solid #f0f2f5;
    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
    border-radius: 15px;
    background-color: #fff;
    min-height: 400px;
}

.link-whatsapp.not_initialized {
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.link-whatsapp p {
    font-size: 17px;
}

@media (max-width: 767px) {
    .link-whatsapp p {
        padding: 0 2rem;
    }
}

.link-whatsapp .icon {
    display: flex;
    text-align: center;
    width: 70px;
    height: 70px;
    background: #f4f6f9;
    border-radius: 50px;
    align-items: center;
    justify-content: center;
    color: #bec3c9;
    font-size: 20px;
    margin: 0 auto 1rem;
}

.link-whatsapp .btn-main {
    max-width: max-content;
    margin: 0 auto;
}

.link-whatsapp > img {
    width: 100%;
    max-width: 36rem;
}

.link-whatsapp .loading-container {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
    width: 250px;
    border: 1px solid #ebedf2;
    border-radius: 12px;
    margin: 1rem auto;
}

.qr-container .qr {
    text-align: center;
    margin-bottom: 2rem;
}

.qr-container .qr-image {
    max-width: 200px;
}

.qr-container .qr-info {
    font-size: 17px;
}

.qr-container .refresh-btn {
    padding: 5px 10px;
}

.mini-loading-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 1.5rem;
    min-height: 200px;
}

.whatsapp-link-steps {
    /* text-align: start; */
    padding: 17px 15px 0;
}

.whatsapp-link-steps h3 {
    margin-bottom: 1rem;
}

.whatsapp-link-steps .steps-list {
    padding: 0.5rem 2rem 0.5rem 0;
    margin: 0;
    max-width: max-content;
    text-align: right;
    margin: 0 auto;
}

.whatsapp-link-steps .steps-list li {
    padding: 5px 0;
}

.whatsapp-link-steps .phone_link {
    text-align: center;
    margin-top: 1rem;
    color: var(--globalColor);
}

.whatsapp-link-steps .phone_link a {
    color: #566370;
}

.phone-link-steps .steps {
    padding: 1rem 0;
}

.phone-link-steps h3 {
    text-align: center;
    margin-bottom: 0.5rem;
    font-size: 16px;
}

.phone-link-steps p {
    text-align: center;
    font-size: 14px;
}

.phone-link-steps .btn-main {
    height: 44px;
}

.phone-link-steps .phone_link {
    text-align: center;
    margin-top: 1rem;
    color: var(--globalColor);
}

.phone-link-steps .phone_link a {
    color: #566370;
}

.new-contacts-groups {
    margin-top: 1rem;
}

.new-contacts-groups .contact-group-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 0;
}

.new-contacts-groups .contact-group-item .info {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.new-contacts-groups .contact-group-item .info .badge {
    margin: 0 0.5rem;
    display: flex;
    min-width: 27px;
    width: max-content;
    height: 25px;
    justify-content: center;
    border-radius: 0.6rem;
}

.new-contacts-groups .contact-group-item .group-item-title {
    display: flex;
    align-items: center;
}

.user-whatsapp-profile {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.user-whatsapp-profile .user-wrap-info {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.user-whatsapp-profile {
    background-color: #fff;
    border: 1px solid #f0f2f5;
    border-radius: 18px;
    box-shadow: 0 1px 2px #ededed80;
    height: 100%;
    padding: 20px 15px;
}

.user-whatsapp-profile .image img {
    height: 65px;
    max-width: 65px;
    min-width: 65px;
    background: #f5f7f9;
    border: 1px solid #f0f2f5;
    border-radius: 50px;
    box-shadow: 0 3px 6px #00000012;
    display: block;
}

.user-whatsapp-profile .details {
}

.user-whatsapp-profile .details h3 {
    color: #312e43;
    font-size: 14px;
    font-weight: 600;
    margin: 0 0 4px 0;
}

.user-whatsapp-profile .details h3 .badge {
    padding: 8px 12px;
    border-radius: 8px;
    vertical-align: middle;
    margin: 0 0.3rem;
}

.user-whatsapp-profile .details .phone_num {
    margin-bottom: 0;
    direction: ltr;
}

.user-whatsapp-profile .details .date {
    color: #777e90;
    font-size: 11.5px;
}

.user-whatsapp-profile .user-actions-btns {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.user-whatsapp-profile .user-actions-btns .btn-logout {
    color: #ff0000;
}

.user-card-title {
    font-size: 1.2rem;
}

/* Widgets */

.widget-ready-item {
    padding-bottom: 0;
    margin-bottom: 30px;
    position: relative;
    height: calc(100% - 30px);
}

.widget-ready-item .widget-preview {
    background: #f5f7f9;
    border: 1px solid #ebedf2;
    padding: 10px;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 15px;
}

.widget-ready-item .widget-preview {
    min-height: 347px;
}

@media (max-width: 576px) {
    .widget-ready-item .widget-preview iframe {
        min-width: 100% !important;
    }

    .widget-ready-item .widget-preview {
        overflow: hidden;
    }
}

.widget-ready-item .code-editor {
    position: relative;
    padding: 10px;
    background: #f5f7f9;
    border: 1px solid #ebedf2;
    border-radius: 15px;
}

.widget-ready-item .code-editor.paid {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-touch-callout: none;
}

.widget-ready-item .code-editor.paid::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    background-color: rgba(255, 255, 255, 0.1);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}

.widget-ready-item .code-editor.paid::after {
    content: "";
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBjbGFzcz0ibS0xIHctNCBoLTQiPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMF82MTQxXzgzNjEzKSI+PHBhdGggZD0iTTMuNzcyNTYgMTQuMTI1MUMzLjEyODcgMTQuMTI1MSAyLjY1MDM4IDEzLjk2ODggMi4zMzc3NyAxMy42NTY0QzIuMDI5ODcgMTMuMzQ4NiAxLjg3NTgzIDEyLjg3MjkgMS44NzU4MyAxMi4yMjkyVjEwLjczMTlDMS44NzU4MyAxMC42MDEzIDEuODMxNTcgMTAuNDkxNyAxLjc0Mjg4IDEwLjQwMzFMMC42ODYwNCA5LjMzOTc0QzAuMjI4NjE3IDguODg3NDEgMCA4LjQ0MjA1IDAgOC4wMDM2NUMwIDcuNTY1MjUgMC4yMjg2MTcgNy4xMTc0NCAwLjY4NTg1MSA2LjY2MDRMMS43NDI2OSA1LjU5NzA2QzEuODMxMzkgNS41MDg0IDEuODc1NjQgNS40MDExMSAxLjg3NTY0IDUuMjc1MThWMy43NzA5OUMxLjg3NTY0IDMuMTIyNzEgMi4wMjk2OCAyLjY0NDU5IDIuMzM3NTggMi4zMzY4MkMyLjY1MDE5IDIuMDI5MDYgMy4xMjg1MSAxLjg3NTA4IDMuNzcyMzcgMS44NzUwOEg1LjI3MDI1QzUuNDAwOTQgMS44NzUwOCA1LjUxMDU0IDEuODMwODUgNS41OTkyNCAxLjc0MjE5TDYuNjYzMDQgMC42ODU4MTJDNy4xMjA0NiAwLjIyODc3NyA3LjU2NjAyIDcuMTIxNDllLTA1IDcuOTk5OTEgNy4xMjE0OWUtMDVDOC40Mzg1IC0wLjAwNDYzNDY3IDguODg0MDYgMC4yMjM4ODMgOS4zMzY3NyAwLjY4NTYyNEwxMC40MDA2IDEuNzQyQzEwLjQ5NCAxLjgzMDY2IDEwLjYwNTggMS44NzQ4OSAxMC43MzY1IDEuODc0ODlIMTIuMjI3NEMxMi44NzYgMS44NzQ4OSAxMy4zNTQzIDIuMDMxMTMgMTMuNjYyMiAyLjM0MzZDMTMuOTcwMSAyLjY1NjA3IDE0LjEyNDIgMy4xMzE5MyAxNC4xMjQyIDMuNzcwOFY1LjI3NDk5QzE0LjEyNDIgNS40MDA5MiAxNC4xNzA5IDUuNTA4MjEgMTQuMjY0MSA1LjU5Njg3TDE1LjMyMDkgNi42NjAyMUMxNS43NzM1IDcuMTE3MjUgMTUuOTk5OCA3LjU2NTA2IDE1Ljk5OTggOC4wMDM0NkMxNi4wMDQ1IDguNDQxODYgMTUuNzc4MiA4Ljg4NzIyIDE1LjMyMDkgOS4zMzk3NEwxNC4yNjQxIDEwLjQwMzFDMTQuMTcwNyAxMC40OTE3IDE0LjEyNDIgMTAuNjAxMyAxNC4xMjQyIDEwLjczMTlWMTIuMjI5MkMxNC4xMjQyIDEyLjg3NzQgMTMuOTY3OSAxMy4zNTU2IDEzLjY1NTMgMTMuNjYzM0MxMy4zNDc0IDEzLjk3MTEgMTIuODcxNSAxNC4xMjUxIDEyLjIyNzQgMTQuMTI1MUgxMC43MzY1QzEwLjYwNTggMTQuMTI1MSAxMC40OTM4IDE0LjE2OTUgMTAuNDAwNiAxNC4yNThMOS4zMzY3NyAxNS4zMjEzQzguODg0MjQgMTUuNzczNiA4LjQzODY4IDE1Ljk5OTkgNy45OTk5MSAxNS45OTk5QzcuNTY2MDIgMTYuMDA0NiA3LjEyMDI4IDE1Ljc3ODMgNi42NjMwNCAxNS4zMjEzTDUuNTk5MjQgMTQuMjU4QzUuNTEwNTQgMTQuMTY5MyA1LjQwMDk0IDE0LjEyNTEgNS4yNzAyNSAxNC4xMjUxSDMuNzcyMzdIMy43NzI1NloiIGZpbGw9IiNGRkMwMEEiPjwvcGF0aD48cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTExLjU2NzYgNy42OTI1N0MxMS40NDQ0IDcuNjI5ODkgMTEuMjc5MyA3LjYwNDQ3IDExLjEzNTQgNy41NzMyM0MxMC43NDgyIDcuNDkxNzIgMTAuMzg1NSA3LjM0NTQ2IDEwLjA1NzcgNy4xNDc2M0MxMC4xNjMxIDYuNzIwOSAxMC4zNDc5IDYuMzEwNTQgMTAuNjEwOSA1Ljk0MTA0QzEwLjY2NDQgNS44NTg0IDEwLjcxMDQgNS43Nzg0IDEwLjczNzMgNS42OTgyMUMxMC44NTI0IDUuMzYwMTQgMTAuNjM5NiA1LjE0OTcgMTAuMzA1MyA1LjI2MTEzQzEwLjE3MzkgNS4zMDM4NiAxMC4wMzkyIDUuNDAyNjggOS45MTUzIDUuNDgyMTJDOS41ODQyNCA1LjY5Nzg0IDkuMjI0NzQgNS44NTA4NyA4Ljg1MzE5IDUuOTQyNzNDOC42Mjc0IDUuNTY5MDkgOC40Njg0NiA1LjE1MTM5IDguMzkyOTQgNC43MDcxNkM4LjM3Mzc0IDQuNjE2OCA4LjM1MjA4IDQuNTMyNDcgOC4zMTg5NCA0LjQ1OTI1QzguMjU2MDQgNC4zMTgwNyA4LjE0NzM4IDQuMjEzMjMgOC4wMzQ3NiA0LjE5NzZDNy44ODU5OSA0LjE3OTUzIDcuNzcyODIgNC4yODMwNiA3LjY5MzUzIDQuNDMzMDhDNy42MzEzOSA0LjU1NDY4IDcuNjA1OTcgNC43MTc4OSA3LjU3NTA4IDQuODYwMTlDNy40OTM3MyA1LjI0ODkgNy4zNDcwMyA1LjYxMzEzIDcuMTQ4MTcgNS45NDIzNkM2LjcyNDA4IDUuODM3ODkgNi4zMTU5OSA1LjY1NDU0IDUuOTQ4NCA1LjM5NDAzQzUuODcxIDUuMzQzNzcgNS43OTU4NiA1LjI5OTM0IDUuNzIwNzIgNS4yNzExMUM1LjU3NjQ3IDUuMjE1NzcgNS40MjU0NCA1LjIxODQgNS4zMzQ4NiA1LjI4NjkyQzUuMjE2OTcgNS4zNzkxNiA1LjIxMDAxIDUuNTMyNTcgNS4yNjAyOSA1LjY5NDY0QzUuMzAyMjggNS44MjQ1MiA1LjM5OTgzIDUuOTU3NzkgNS40Nzg3MyA2LjA4MDMzQzUuNjk2MDUgNi40MTI1NyA1Ljg1MDEgNi43NzM2IDUuOTQyMTggNy4xNDY2OUM1LjU2ODM3IDcuMzcyMTkgNS4xNTA2OSA3LjUzMDg3IDQuNzA2NjMgNy42MDYzNkM0LjYxNzk0IDcuNjI1MTggNC41MzQ3IDcuNjQ2NDUgNC40NjIzOSA3LjY3ODY0QzQuMTE5MDggNy44Mjk3OSA0LjEwMzgzIDguMTQ1ODQgNC40Mzk3OSA4LjMwODg1QzQuNTE0NzQgOC4zNDU1NiA0LjYwMjY4IDguMzY5MjcgNC42OTcyMiA4LjM4OTZDNS4xNDY3MyA4LjQ2MzAxIDUuNTY2ODcgOC42MjI0NSA1Ljk0MTYyIDguODUwMDNDNS44MzY5MSA5LjI3NDEyIDUuNjUzNjggOS42ODIwMyA1LjM5Mjg2IDEwLjA0OTdDNS4zNDM1MiAxMC4xMjU3IDUuMjk5NjQgMTAuMTk5NSA1LjI3MTIxIDEwLjI3MzVDNS4xMzU0MyAxMC42MjMgNS4zNDgyMyAxMC44NTcyIDUuNzAxMTQgMTAuNzM1QzUuNzgwMjMgMTAuNzA3OSA1Ljg1ODk1IDEwLjY2MjUgNS45NDAzIDEwLjYxMDJDNi4zMTAxNiAxMC4zNDQ0IDYuNzIwMzEgMTAuMTYwOSA3LjE0NjEgMTAuMDU3QzcuMzg2OTUgMTAuNDUzNiA3LjU1MzQzIDEwLjg5OTMgNy42MjYzIDExLjM3MjlDNy42NzcxNSAxMS42NDI3IDcuOTI5NjggMTEuOTU3NCA4LjE5Mjk1IDExLjcyMTZMOC4xOTU1OSAxMS43MTkxQzguMzU4ODYgMTEuNTcwNCA4LjM4NDg1IDExLjMxNjUgOC40MzI2OCAxMS4xMDM2QzguNTE0OTcgMTAuNzI4NCA4LjY1ODQ3IDEwLjM3NjggOC44NTA3NCAxMC4wNTgxQzkuMzAxOTUgMTAuMTY4MiA5LjczNTI3IDEwLjM2NTkgMTAuMTIyMSAxMC42NDk0QzEwLjM0ODggMTAuODA0MSAxMC43NDk5IDEwLjg0ODEgMTAuNzY5MyAxMC40OTU0VjEwLjQ5MThDMTAuNzc5NyAxMC4yNzE0IDEwLjYxODUgMTAuMDczNCAxMC41MDE1IDkuODg4OUMxMC4yOTQgOS41NjQ5NCAxMC4xNDY2IDkuMjE0MjYgMTAuMDU3MSA4Ljg1MjQ3QzEwLjQzMzkgOC42MjQ5IDEwLjg1NTQgOC40NjQ5IDExLjMwMzQgOC4zODk0MUMxMS4zOTk2IDguMzY4NzEgMTEuNDg4NyA4LjM0NDYxIDExLjU2NDYgOC4zMDY5N0MxMS44ODUxIDguMTQ5MjMgMTEuODgzNCA3Ljg1MDEyIDExLjU2ODIgNy42OTI1N0gxMS41Njc2WiIgZmlsbD0iYmxhY2siPjwvcGF0aD48L2c+PGRlZnM+PGNsaXBQYXRoIGlkPSJjbGlwMF82MTQxXzgzNjEzIj48cmVjdCB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIGZpbGw9IndoaXRlIj48L3JlY3Q+PC9jbGlwUGF0aD48L2RlZnM+PC9zdmc+");
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 22;
    pointer-events: none;
}

.widget-ready-item pre {
    margin-bottom: 0;
}

.widget-ready-item code {
    background: #f5f7f9;
    border-radius: 0;
    color: #000;
}

.widget-ready-item .widget-copy-code {
    margin-top: 1rem;
}

.widget-ready-item .widget-copy-code .copyBtn {
    color: #fff;
}

.widget-ready-item .widget-copy-code .copyBtn:hover {
    color: #fff;
}

/* whatsapp_chat */
.whatsapp_chat {
    max-width: 90%;
    margin: 0 auto;
}

.whatsapp_chat .status-bar {
    height: 25px;
    background: #004e45;
    color: #fff;
    font-size: 14px;
    padding: 0 8px;
}

.whatsapp_chat .status-bar:after {
    content: "";
    display: table;
    clear: both;
}

.whatsapp_chat .status-bar div {
    float: right;
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin: 0 0 0 8px;
    font-weight: 600;
}

.whatsapp_chat .user-bar {
    height: 55px;
    background: #005e54;
    color: #fff;
    padding: 0 8px;
    font-size: 24px;
    position: relative;
    z-index: 1;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}

.whatsapp_chat .user-bar:after {
    content: "";
    display: table;
    clear: both;
}

.whatsapp_chat .user-bar div {
    float: right;
    transform: translateY(-50%);
    position: relative;
    top: 50%;
}

.whatsapp_chat .page {
    width: 20%;
    margin: 0 auto;
    position: fixed;
    left: 8%;
}

.whatsapp_chat .user-bar .avatar {
    margin: 0 0 0 5px;
    width: 36px;
    height: 36px;
}

.whatsapp_chat .user-bar .avatar img {
    border-radius: 50%;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
    display: block;
    width: 100%;
}

.whatsapp_chat .user-bar .name {
    font-size: 17px;
    font-weight: 600;
    text-align: start;
    text-overflow: ellipsis;
    letter-spacing: 0.3px;
    margin: 0 0 0 8px;
    overflow: hidden;
    white-space: nowrap;
    width: 110px;
}

.whatsapp_chat .user-bar .status {
    display: block;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0;
}

.whatsapp_chat .conversation {
    position: relative;
    background: #efe7dd
        url(https://cloud.githubusercontent.com/assets/398893/15136779/4e765036-1639-11e6-9201-67e728e86f39.jpg)
        repeat;
    z-index: 0;
    border-radius: 10px;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}

.whatsapp_chat .conversation ::-webkit-scrollbar {
    transition: all 0.5s;
    width: 5px;
    height: 1px;
    z-index: 10;
}

.whatsapp_chat .conversation ::-webkit-scrollbar-track {
    background: 0 0;
}

.whatsapp_chat .conversation ::-webkit-scrollbar-thumb {
    background: #b3ada7;
}

.whatsapp_chat .conversation .conversation-container {
    height: calc(100% - 68px);
    box-shadow: inset 0 10px 10px -10px #000;
    overflow-x: hidden;
    padding: 0 16px;
    margin-bottom: 5px;
}

.whatsapp_chat .conversation .conversation-container:after {
    content: "";
    display: table;
    clear: both;
}

.whatsapp_chat .message {
    color: #000;
    clear: both;
    line-height: 25px;
    font-size: 15px;
    padding: 8px;
    position: relative;
    margin: 8px 0;
    max-width: 295px;
    word-wrap: break-word;
    z-index: -1;
}

.whatsapp_chat .message:after {
    position: absolute;
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
}

.whatsapp_chat .metadata {
    display: inline-block;
    float: right;
    padding: 0 0 0 7px;
    position: relative;
    bottom: -4px;
}

.whatsapp_chat .metadata .time {
    color: rgba(0, 0, 0, 0.45);
    font-size: 11px;
    display: inline-block;
}

.whatsapp_chat .read-tick {
    width: 1.3rem;
}

.whatsapp_chat .metadata .tick {
    display: inline-block;
    margin-right: 15px;
    position: relative;
    top: 4px;
    height: 16px;
    width: 16px;
    inset-inline-start: -15px;
}

.whatsapp_chat .metadata .tick svg {
    position: absolute;
    transition: 0.5s ease-in-out;
}

.whatsapp_chat .metadata .tick svg:first-child {
    backface-visibility: hidden;
    transform: perspective(800px) rotateY(180deg);
}

.whatsapp_chat .metadata .tick svg:last-child {
    backface-visibility: hidden;
    transform: perspective(800px) rotateY(0deg);
}

.whatsapp_chat .metadata .tick-animation svg:first-child {
    transform: perspective(800px) rotateY(0);
}

.whatsapp_chat .metadata .tick-animation svg:last-child {
    transform: perspective(800px) rotateY(-179.9deg);
}

.whatsapp_chat .message:first-child {
    margin: 16px 0 8px;
}

.whatsapp_chat .message.received {
    background: #fff;
    border-radius: 0 5px 5px 5px;
    float: left;
}

.whatsapp_chat .message.received .metadata {
    padding: 0 0 0 16px;
}

.whatsapp_chat .message.received:after {
    border-width: 0 10px 10px 0;
    border-color: transparent #fff transparent transparent;
    top: 0;
    left: -10px;
}

.whatsapp_chat .message.sent {
    background: #e1ffc7;
    border-radius: 5px 0 5px 5px;
    float: right;
    text-align: right;
}

.whatsapp_chat .message.sent:after {
    max-width: 80%;
    border-width: 0 0 10px 10px;
    border-color: transparent transparent transparent #e1ffc7;
    top: 0;
    right: -10px;
}

.whatsapp_chat .conversation-compose {
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    overflow: hidden;
    height: 50px;
    width: 100%;
    z-index: 2;
}

.whatsapp_chat .conversation-compose div,
.whatsapp_chat .conversation-compose input {
    background: #fff;
    height: 100%;
}

.whatsapp_chat .conversation-compose .emoji {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    border-radius: 5px 0 0 5px;
    flex: 0 0 auto;
    margin-left: 8px;
    width: 48px;
}

.whatsapp_chat .conversation-compose .input-msg {
    border: 0;
    flex: 1 1 auto;
    font-size: 16px;
    margin: 0;
    outline: 0;
    min-width: 50px;
}

.whatsapp_chat .conversation-compose .photo {
    flex: 0 0 auto;
    border-radius: 0 0 5px 0;
    text-align: center;
    position: relative;
    width: 48px;
}

.whatsapp_chat .conversation-compose .photo:after {
    border-width: 0 0 10px 10px;
    border-color: transparent transparent transparent #fff;
    border-style: solid;
    position: absolute;
    width: 0;
    height: 0;
    content: "";
    top: 0;
    right: -10px;
}

.whatsapp_chat .conversation-compose .photo i {
    display: block;
    color: #7d8488;
    font-size: 24px;
    transform: translate(-50%, -50%);
    position: relative;
    top: 50%;
    left: 50%;
}

.whatsapp_chat .conversation-compose .send {
    background: none;
    border: 0;
    cursor: pointer;
    flex: 0 0 auto;
    margin-left: 8px;
    margin-right: 8px;
    padding: 0;
    position: relative;
    outline: 0;
}

.whatsapp_chat .conversation-compose .send .circle {
    background: #008a7c;
    border-radius: 50%;
    color: #fff;
    position: relative;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.whatsapp_chat .conversation-compose .send .circle i {
    font-size: 24px;
    margin-left: 5px;
}

/* Campaign Statics */

.quick-statics-row {
    margin-bottom: 20px;
}

.quick-statics-row .quick-statics-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 2.3rem 1rem;
    border: 1px solid #f0f2f5;
    background-color: #fff;
    box-shadow: 0 1px 2px 0 hsl(0deg 0% 93% / 50%);
    border-radius: 20px;
    margin-bottom: 1rem;
}

.quick-statics-row .quick-statics-item .icon {
    position: relative;
}

.quick-statics-row .quick-statics-item .icon i {
    font-size: 35px;
}

.quick-statics-row .quick-statics-item .icon i {
    /* color: #a35bd8; */
}

.quick-statics-row .quick-statics-item .icon::before {
    content: " ";
    width: 35px;
    height: 35px;
    border-radius: 50px;
    display: block;
    position: absolute;
    bottom: -7px;
    left: -5px;
}

.quick-statics-row .quick-statics-item.bg_1 .icon::before {
    background-color: rgba(42, 202, 115, 0.1);
}

.quick-statics-row .quick-statics-item.bg_2 .icon i {
    color: #a35bd8;
}

.quick-statics-row .quick-statics-item.bg_0 .icon::before {
    background-color: rgba(80, 116, 140, 0.1);
}

.quick-statics-row .quick-statics-item.bg_0 .icon i {
    color: #50748c;
}

.quick-statics-row .quick-statics-item.bg_2 .icon::before {
    background: rgb(163 91 216 / 10%);
}

/* .quick-statics-row .quick-statics-item.bg_3 .icon i {
    color: #28a745;
} */

.quick-statics-row .quick-statics-item.bg_6 .icon i {
    color: #28a745;
}

.quick-statics-row .quick-statics-item.bg_6 .icon::before {
    background: rgb(42 202 115 / 10%);
}

/* .quick-statics-row .quick-statics-item.bg_3 .icon i {
    color: #fcc739;
}

.quick-statics-row .quick-statics-item.bg_3 .icon::before {
    background-color: rgba(255, 194, 51, .1);
} */

.quick-statics-row .quick-statics-item.bg_4 .icon i {
    color: #4081ff;
}

.quick-statics-row .quick-statics-item.bg_4 .icon::before {
    background-color: rgba(64, 129, 255, 0.1);
}

.quick-statics-row .quick-statics-item.bg_5 .icon i {
    color: #ff0038;
}

.quick-statics-row .quick-statics-item.bg_5 .icon::before {
    background-color: rgba(245, 61, 107, 0.1);
}

.quick-statics-row .quick-statics-item .content {
}

.quick-statics-row .quick-statics-item .content h3 {
    font-size: 14px;
    margin: 0;
    color: #000;
    font-weight: 600;
}

.quick-statics-row .quick-statics-item .content p {
    font-size: 1rem;
    margin-top: 0;
    font-weight: 600;
    color: #000;
    margin-bottom: 10px;
}

.campaign-statics .whatsapp_chat {
    max-width: 100%;
}

/* Applications New Pages */

.points-card-wrapper {
    background: linear-gradient(135deg, #1a1a24 0%, #232336 55%, #2a2440 100%);
    border: 0;
    border-radius: 16px;
    padding: 35px 40px;
    display: flex;
    color: #fff;
    align-items: center;
    gap: 50px;
    margin-bottom: 14px;
}

.points-card-wrapper .icon {
    min-width: 95px;
    height: 95px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.12);
    border-radius: 50px;
    font-size: 40px;
}

.points-card-wrapper .icon i {
    color: #fff;
}

.points-card-wrapper .welcome-msg h3 {
    font-size: 22px;
    margin-bottom: 0.5rem;
    font-weight: 700;
    color: #fff;
}

.points-card-wrapper .welcome-msg .infoTooltip {
    font-size: 14px;
}

.points-card-wrapper .welcome-msg p {
    font-size: 18px;
    margin-bottom: 0;
    max-width: 700px;
    color: #fff;
}

.points-card-wrapper .welcome-msg .current-balance-wrapper {
    font-size: 20px;
    font-weight: 800;
    color: #fff;
    margin-top: 0.5rem;
}

@media (max-width: 767px) {
    .points-card-wrapper {
        padding: 40px 15px;
        align-items: flex-start;
        gap: 15px;
        border-radius: 22px;
    }

    .points-card-wrapper .icon {
        min-width: 60px;
        height: 60px;
        font-size: 27px;
    }

    .points-card-wrapper .welcome-msg h3 {
        font-size: 17px;
        margin-bottom: 0.5rem;
    }

    .points-card-wrapper .welcome-msg p {
        font-size: 12px;
    }
}

.applications-items {
}

.applications-items .card-title {
    color: #4b5563;
    font-size: 20px;
    font-weight: 700;
}

.applications-items .application-item {
    height: calc(100% - 13.5px);
    background-color: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 22px;
    padding: 10px;
}

.applications-items .application-item .image img {
    max-width: 100%;
    display: block;
    border-radius: 22px;
}

.applications-items .application-item .details {
    padding: 1.5rem 0.5rem;
}

.applications-items .application-item .details h3 {
    font-size: 15px;
    margin-bottom: 0.5rem;
    color: #252526;
    font-weight: 600;
}

.applications-items .application-item .details p {
    color: #767676;
    font-size: 13px;
    font-weight: 500;
    min-height: 60px;
}

@media (max-width: 1305px) {
    .applications-items .application-item .details p {
        min-height: 120px;
    }
}

@media (max-width: 767px) {
    .applications-items .application-item .details p {
        min-height: auto;
    }
}

.applications-items .application-item .details .price {
    margin-top: 1rem;
}

.applications-items .application-item .details .price .badge {
    padding: 10px;
}

.applications-items .application-item .details .app-btns {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.applications-items .application-item .details .app-btns a {
    flex: 1;
}

.applications-items .application-item .details .app-btns {
    margin-top: 1.3rem;
}

.applications-items .application-item .app-btns .feature-icon {
    margin: 0 0 0 0.5rem;
}

.applications-items .application-item .app-btns .btn {
    height: 44px;
    font-weight: 600;
}

.applications-items .application-item .app-btns .btn-cancel {
    background: rgba(255, 0, 25, 0.06);
    color: #fa4758;
    border-radius: 10px;
}

.app-modal-details .btn-cancel {
    background: rgba(255, 0, 25, 0.06);
    color: #fa4758;
    border-radius: 10px;
    width: 100%;
}

.applications-items .application-item .details .btn-soon {
    background: rgba(25, 25, 25, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.06);
    color: #989898;
    border-radius: 10px;
}

.applications-items .application-item .details .btn-soon i {
    line-height: 2;
}

.application-slides {
    padding-bottom: 30px !important;
}

.application-slides .swiper-pagination {
    bottom: 0 !important;
}

.application-slides img {
    max-width: 100%;
    border-radius: 30px;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.06);
    background-color: #fff;
}

.application-slides .swiper-pagination-bullet {
    border-radius: 4px;
    width: 12px;
    height: 5px;
    background: #efeff1 !important;
    opacity: 1;
}

.application-slides .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: var(--globalColor) !important;
    width: 28px;
}

.app-modal-details {
    padding: 1.5rem 0.5rem;
}

.app-modal-details h3 {
    font-size: 17px;
    margin-bottom: 0.5rem;
    font-weight: 700;
    color: #252526;
}

.app-modal-details p {
    color: #4b5563;
    font-size: 14px;
    font-weight: 500;
}

.app-modal-details .price {
    margin: 1.5rem 0;
}

.app-modal-details .price .badge {
    padding: 10px;
}

/* .app-modal-details .app-features {
    margin-bottom: 3rem;
} */

.app-modal-details .app-features h3 {
    margin-bottom: 1rem;
}

.app-modal-details .app-features ul {
    padding: 0 1rem;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    /* spacing between grid items */
    padding: 0 1rem 0 0;
}

.app-modal-details .app-features ul li {
    font-weight: 500;
}

.app-modal-details .activation-btn {
    margin-top: 3rem;
}

.app-modal-details .activation-btn a {
    height: 44px;
    font-weight: 700;
}

/* Finance */

.finance-item {
    position: relative;
    background-color: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 22px;
    padding: 10px;
    text-align: center;
    height: calc(100% - 13.5px);
}

.finance-item .card-body {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
    padding: 0.5rem;
}

.finance-item .icon {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 55px;
    height: 55px;
    margin: 0 0 0 0;
    border-radius: 99px;
    text-align: center;
}

.finance-item .icon i {
    font-size: 30px;
}

.finance-item h3 {
    font-weight: 700;
    margin-bottom: 0;
}

.finance-item .content {
    text-align: start;
}

.finance-item .content p {
    margin-bottom: 0.5rem;
}

.finance-item .content strong {
    font-size: 16px;
}

.finance-item.bg_1 .icon {
    background-color: rgba(138, 95, 230, 0.1);
    color: #6654ea;
}

.finance-item.bg_2 .icon {
    background-color: rgba(64, 129, 255, 0.1);
    color: #4081ff;
}

.finance-item.bg_3 .icon {
    background-color: rgb(255, 73, 1, 0.1);
    color: #ff4901;
}

.finance-item.bg_4 .icon {
    background-color: rgb(118, 188, 199, 0.1);
    color: #76bcc7;
}

/* .finance-item .infoTooltip {
    position: absolute;
    top: 5px;
    left: 12px;
    font-size: 18px;
} */

.finance-management {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-bottom: 1rem;
}

.finance-management a {
}

.payment-select-icon {
    max-width: 26px;
    margin-left: 10px;
    vertical-align: middle;
    object-fit: contain;
}

.search-group .search-btn {
    pointer-events: none;
}

/* Payment Icon Card  */

.payment-icon-card {
    display: flex;
    align-items: center;
    margin-bottom: 1rem;
    padding: 20px 15px;
    border: 1px solid #ebedf2;
    border-radius: 10px;
    cursor: pointer;
}

.payment-icon-card .payment-content {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0 0.7rem;
}

.vat {
    color: #8d8f9c;
    font-size: 12px;
    font-weight: 400;
    margin-right: 5px;
}

.card-single-plan .percentge-dicount {
    background-color: #6654ea1a;
    border-radius: 50px;
    color: #6654ea;
    font-size: 11px;
    margin-right: 0;
    padding: 8px 10px;
    /* position: absolute; */
    /* top: -18px; */
    /* left: 50%; */
    /* transform: translateX(-50%); */
    white-space: nowrap;
    font-weight: 600;
    display: block;
    max-width: max-content;
    margin: 0 auto 10px;
}

.compare-packages {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 30px;
}

.compare-packages .btn-main {
    font-weight: 600;
    height: 45px;
}

.custom-height-filepond {
    height: 80px !important;
    min-height: 80px !important;
    overflow: hidden;
}

.custom-height-filepond .filepond--root .filepond--drop-label {
    min-height: 80px !important;
}

.custom-height-filepond
    .filepond--drop-label.filepond--drop-label
    label::before {
    top: -2px !important;
}

.custom-height-filepond .filepond--image-preview-wrapper {
    height: 70px !important;
}

.kt-section .kt-section__heading h3,
.kt-section .kt-section__title h3 {
    font-size: 16px;
}

.kt-section .kt-section__heading p,
.kt-section .kt-section__title p {
    font-size: 14px;
}

.form-control:disabled,
.form-control[readonly] {
    cursor: not-allowed;
}

.points-display .coin-icon {
    position: relative;
    left: 0;
    top: -1.5px;
}

.refund-modal {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.refund-modal h3 {
    font-weight: 700;
    font-size: 20px;
    margin-bottom: 0;
}

.refund-balance-card {
    background: #f7f8fc;
    border-radius: 16px;
    padding: 20px 24px;
    border: 1px solid #e6e9f5;
}

.refund-balance-title {
    font-weight: 600;
    font-size: 15px;
    margin-bottom: 16px;
    color: #1f2432;
}

.refund-balance-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

.refund-balance-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.refund-balance-value {
    font-size: 24px;
    font-weight: 700;
    color: #1f2432;
}

.refund-balance-label {
    font-size: 13px;
    color: #6f7787;
}

.refund-options-section {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.refund-section-title {
    font-weight: 600;
    font-size: 15px;
    color: #1f2432;
    margin-bottom: 0;
    display: block;
}

.refund-section-title.start {
    text-align: start;
}

.refund-options {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.refund-option {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 18px;
    border: 1.5px solid #e1e4ee;
    border-radius: 14px;
    cursor: pointer;
    background: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease,
        background-color 0.2s ease;
}

.refund-option input[type="radio"] {
    width: 18px;
    height: 18px;
    margin-top: 3px;
}

/* Normalize Safari + Chrome radio buttons */
.refund-option input[type="radio"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    border: 1px solid #000;
    border-radius: 50%;
    position: relative;
    cursor: pointer;
    outline: none;
    transition: all 0.2s ease-in-out;
    background-color: #fff;

    /* inner circle */
}

.refund-option input[type="radio"]::before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #000;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0);
    transition: transform 0.2s ease-in-out;
}

.refund-option input[type="radio"]:checked::before,
.refund-option.active input[type="radio"]::before {
    transform: translate(-50%, -50%) scale(1) !important;
}

.refund-option input.active,
.refund-option:has(input:checked) {
    border: 1.3px solid #000;
    color: #000000;
}

.refund-option-content {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.refund-option-title {
    font-size: 14px;
    font-weight: 600;
    color: #1f2432;
    text-align: start;
}

.refund-option-helper {
    font-size: 12px;
    color: #6f7787;
    text-align: start;
}

.refund-option.active,
.refund-option:has(input:checked) {
    border-color: #000;
    color: #000000;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.05);
    background-color: #fdfdfd;
}

.refund-partial-section {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.refund-amount-input {
    position: relative;
}

.refund-amount-input .form-control {
    padding-left: 48px;
    height: 48px;
    border-radius: 12px;
}

.refund-amount-currency {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 16px;
    display: flex;
    align-items: center;
    color: #000;
    font-size: 18px;
}

.refund-order-total {
    color: #6f7787;
    font-size: 12px;
}

.refund-equivalent {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 20px;
    background-color: rgba(138, 95, 230, 0.1);
    color: #6654ea;
    font-size: 12px;
    font-weight: 600;
    width: fit-content;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 10px;
}

.refund-modal-actions {
    display: flex;
    gap: 0;
    justify-content: flex-end;
    flex-wrap: wrap;
}

@media (max-width: 576px) {
    .refund-modal {
        gap: 18px;
    }

    .refund-balance-value {
        font-size: 20px;
    }

    .refund-modal-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .refund-modal-actions .swal2-styled {
        width: 100%;
    }
}

.form-control[readonly] {
    background-color: #f7f8fa;
}

.input-group .input-group-append .btn-outline-secondary {
    border-color: #ebedf2;
    color: var(--globalColor);
}

.alert.alert-primary.alert-msg-custom {
    color: #ff4901;
    background-color: rgb(255, 73, 1, 0.1);
    border-color: rgb(255, 73, 1, 0.1);
}

.alert.alert-primary.alert-msg-custom a {
    color: inherit;
    text-decoration: underline !important;
}

.input-group.phone_number_input {
    flex-wrap: nowrap;
}
.input-group.phone_number_input input {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.payment-points-image {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
    justify-content: center;
}

.payment-points-image.start {
    justify-content: flex-start;
    flex-direction: row;
}

.payment-points-image img {
    width: 50px;
    aspect-ratio: 3 / 2;
    object-fit: contain;
}

.apexcharts-text.apexcharts-xaxis-label {
    font-size: 13px;
}

.apexcharts-svg {
    overflow: visible !important;
}

.select2-container--default.select2-container--disabled
    .select2-selection--multiple,
.select2-container--default.select2-container--disabled
    .select2-selection--single {
    border-color: #f7f8fa;
}

.input-group .select2-container {
    min-width: auto;
}

.voucher-amount-container {
    position: relative;
}

.voucher-amount-container .voucher-amount-badge {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 10px;
}

.sp-replacer {
    width: 100%;
    height: 45px;
    display: block;
    padding: 10px;
    border-radius: 10px;
    height: calc(2.1em + 1.3rem + 2px);
    border: 1px solid #ebedf2;
    background-color: #fff;
    max-width: 300px;
}

.sp-replacer:hover {
    border: 1px solid #ebedf2;
}

.sp-replacer .sp-dd {
    display: none;
}

.main-profile {
    align-items: center;
    /* background-color: #fff; */
    /* border: 1px solid #f0f2f5;
    border-radius: 18px;
    box-shadow: 0 1px 2px #ededed80; */
    padding: 10px 0 20px 0;
}

.main-profile .main-profile-inner {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 1rem;
}

.main-profile .profile_logo {
    min-width: 75px;
    width: 75px;
    height: 75px;
    background: #fff;
    border: 1px solid #f0f2f5;
    border-radius: 18px;
    box-shadow: 0 3px 6px #00000012;
    overflow: hidden;
    min-height: 45px;
    position: relative;
    display: inline-block;
}

.main-profile .profile_logo img {
    max-width: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main-profile .profile_details h3 {
    font-size: 14px;
    font-weight: 700;
    color: #000;
    margin-bottom: 0.5rem;
    line-height: 0;
    height: auto;
}

.main-profile .profile_details p {
    color: #312e43;
    font-size: 14px;
    font-weight: 500;
    max-width: 580px;
    margin-bottom: 0;
}


.nav-link.dropdown-toggle:after, .btn.dropdown-toggle:after {
    opacity: 1;
}

.kt-menu__link-icon .sidebar-icon {
    width: 18px;
    height: 18px;
    vertical-align: middle;
    color: inherit;
}
.kt-menu__link-icon .sidebar-icon path {
    stroke: currentColor;
}

/* ── Uniform sidebar dropdown icon size ──────────────────────────────
   Single source of truth for EVERY sub-item icon inside ANY sidebar
   dropdown — font glyphs (<i>) and inline <svg> alike render at the exact
   same 16px box (the icon font fills its em, so font-size:16px matches a
   16px svg edge-to-edge). Keeps super-admin and merchant dropdowns
   identical. Do NOT set per-icon width/height in the blade; this rule
   governs. !important so it beats the Metronic bundle's per-breakpoint
   svg sizing and the .sidebar-icon cap above. */
.kt-aside-menu .kt-menu__submenu .kt-menu__link-icon > i,
.kt-aside-menu .kt-menu__submenu .kt-menu__link-icon > svg {
    font-size: 16px !important;
    width: 16px !important;
    height: 16px !important;
    vertical-align: middle;
}

/* Status badges that mirror the colors of the .radio-status-inputs tabs above the table.
   Used in the abandoned-carts table so the row badge matches the tab. */
.badge-state-1  { background-color: rgba(64, 129, 255, 0.1); color: #4081ff; }
.badge-state-3  { background-color: rgba(255, 194, 51, 0.1); color: #ffc233; }
.badge-state-5  { background-color: rgba(245, 61, 107, 0.1); color: #f53d6b; }
.badge-state-7  { background-color: rgba(40, 163, 193, 0.1); color: #28a3c1; }
.badge-state-8  { background-color: rgba(57, 213, 173, 0.1); color: #39d5ad; }
.badge-state-10 { background-color: rgba(255, 157, 70, 0.1); color: #ff9d46; }

/* Reports date-filter card: kill the extra bottom whitespace (the picker's own
   .reports-summary mb-3) so the space below the calendar matches the space above. */
.rep-date-card .reports-summary { margin-bottom: 0 !important; }

/* Salla payment-method logo (square JPG) — round its corners wherever the
   payment method cell renders it (subscriptions, wallet history, ...). */
.paymentTypeImg img[src*="integration/Salla"] {
    border-radius: 6px;
}