﻿body {
    color: #1b1b28;
    font-family: "Schibsted Grotesk", serif;
}

.form-group .select2-container {
    width: 100% !important;
}

span.select2.select2-container.select2-container--default.select2-container--below.select2-container--open {
    width: 100% !important;
}

.flex-1 {
    flex: 1;
}

.gap-1 {
    gap: 0.5rem;
}

.gap-2 {
    gap: 1rem;
}

.gap-3 {
    gap: 1.5rem;
}

.leading-400 {
    line-height: 1.2;
}

.font-semibold {
    font-weight: 600;
}

.text-400 {
    font-size: 20px;
}

.bg-white {
    background: #ffffff;
}

.border-gray-100 {
    border: 1px solid rgb(224 225 233);
}

.bl-1 {
    border-left: 1px solid rgb(224 225 233);
}

.rounded-tr-m {
    border-top-right-radius: 6px;
}

.rounded-m {
    border-radius: 6px;
}

.line-clamp-2,
.line-clamp-3 {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
}

.line-clamp-2 {
    -webkit-line-clamp: 2;
}

.line-clamp-3 {
    -webkit-line-clamp: 3;
}

.img-rg {
    max-width: 100px;
}

button.theme-muted {
    height: 28px;
    min-width: 28px;
    border-radius: 6px;
    font-size: 14px;
    color: #6c6e79;
    background-color: transparent;
    border: 1px solid transparent;
}

.branchname-overflow {
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.btn.btn-label-light-o3 {
    background-color: rgba(255, 255, 255, 0.8);
    color: #564ec0;
    cursor: text !important;
}

.dt_btn {
    display: block;
    background-color: #5578eb;
    border-color: #5578eb;
    border-radius: 4px;
    color: #ffffff;
    width: 34px;
    height: 30px;
    padding: 6px 10px;
}

.dt_btn-del {
    display: block;
    background-color: #e83e3e;
    border-color: #e83e3e;
    border-radius: 4px;
    color: #ffffff;
    width: 34px;
    height: 30px;
    padding: 6px 10px;
}

.dt_btn-view {
    display: block;
    background-color: #716aca;
    border-color: #716aca;
    border: none;
    border-radius: 4px;
    color: #ffffff;
    width: 34px;
    height: 30px;
    padding: 0px 5px;
    box-shadow: none;
}

.dt_btn:hover {
    color: #fff;
    background-color: #385aca;
}

.dt_btn-del:hover {
    color: #fff;
    background-color: #bd3232;
}

.dt_btn-view:hover {
    color: #fff;
    background-color: #564ec0;
}

/* The Modal (background) */
.modal.layout_modal {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 50px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 999;
}

/* Modal Content */
.layout_modal .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    width: 100%;
    max-width: 650px;
}

/* The Close Button */
.layout_modal .close {
    color: white;
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 35px;
    font-weight: bold;
    z-index: 1000;
}

    .layout_modal .close:hover,
    .layout_modal .close:focus {
        color: #999;
        text-decoration: none;
        cursor: pointer;
    }

.layout_modal .mySlides {
    display: none;
}

.cursor-pointer {
    cursor: pointer;
}

/* Next & previous buttons */
.layout_modal .prev,
.layout_modal .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 6px 16px;
    margin-top: -20px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
    background: rgba(255, 255, 255, 0.8);
    color: #333;
    width: 40px;
    height: 40px;
}

/* Position the "next button" to the right */
.layout_modal .next {
    right: 0;
    border-radius: 3px 0 0 3px;
}

    /* On hover, add a black background color with a little bit see-through */
    .layout_modal .prev:hover,
    .layout_modal .next:hover {
        background: rgb(255, 255, 255);
    }

/* Number text (1/3 etc) */
.layout_modal .numbertext {
    color: #333;
    font-size: 12px;
    position: absolute;
    top: 10px;
    right: 5px;
    background: rgba(255, 255, 255, 0.6);
    padding: 6px 10px;
    border-radius: 5px;
}

.image_name {
    color: #333;
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(255, 255, 255, 0.6);
    padding: 6px 10px;
    border-radius: 5px;
}

/*========Loader*========*/

.loader,
.loader:after {
    border-radius: 50%;
    width: 10em;
    height: 10em;
}

.loader {
    margin: 20% auto 0;
    font-size: 10px;
    position: relative;
    text-indent: -9999em;
    border-top: 1.1em solid rgba(255, 255, 255, 0.2);
    border-right: 1.1em solid rgba(255, 255, 255, 0.2);
    border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);
    border-left: 1.1em solid #ffffff;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load8 1.1s infinite linear;
    animation: load8 1.1s infinite linear;
}

@-webkit-keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes load8 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

#loadingDiv {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 999;
    overflow: hidden;
}

    #loadingDiv svg {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        width: 100px;
    }

.datepicker table tr td.disabled {
    color: #ccc !important;
}

table.table-section {
    display: inline;
}

    table.table-section tr td {
        display: inline-block;
        text-align: center;
        font-size: 14px;
        font-weight: 500;
    }

        table.table-section tr td.green {
            background-color: green;
            color: #fff;
        }

        table.table-section tr td.red {
            background-color: red;
            color: #fff;
        }

.nav-sec ul {
    padding-left: 0px;
}

    .nav-sec ul li {
        list-style-type: none;
    }

        .nav-sec ul li a {
            display: block;
            font-size: 14px;
            color: #333;
            padding: 10px;
        }

            .nav-sec ul li a:hover,
            .nav-sec ul li.active a {
                background-color: #f3f6f9;
                color: #5867dd;
            }

.nav-sec .table td {
    vertical-align: middle !important;
}

.accordion-height {
    height: auto;
    max-height: 250px;
    overflow-y: auto;
}

    .accordion-height::-webkit-scrollbar {
        width: 6px;
    }

    /* Track */
    .accordion-height::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    /* Handle */
    .accordion-height::-webkit-scrollbar-thumb {
        background: #888;
        border-radius: 4px;
    }

        /* Handle on hover */
        .accordion-height::-webkit-scrollbar-thumb:hover {
            background: #555;
        }

.nav-sec ul.accordion-height li a {
    font-size: 13px;
}

.font-500 {
    font-weight: 500;
}

.font-size-10 {
    font-size: 10px;
}

.action-detail label strong {
    font-weight: 500;
}

.alert-box1 {
    width: 240px !important;
    position: absolute;
    top: 80px;
    right: 80px;
    z-index: 999;
}

    .alert-box1 .alert-icon i {
        font-size: 1.8rem;
    }

.cnt-code-view {
    width: 67px;
    border-radius: 4px 0px 0px 4px;
}

.border-rd-left-0 {
    border-radius: 0pc 4px 4px 0px;
}

/*.kt-header-menu .kt-menu__nav > .kt-menu__item > .kt-menu__link > .kt-menu__link-text {
    font-family: 'Asap Condensed';
    font-weight: 500;
    font-size: 1.2rem;
    color: #ffffff;
    text-transform: uppercase;
}*/
.events__item {
    background: #fff;
    border: 1px solid #efeff5;
    border-radius: 2px;
    -moz-box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: 0px 6px 12px rgb(0 0 0 / 5%);
    box-shadow: 0px 6px 12px rgb(0 0 0 / 5%);
    padding: 15px 14px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    margin-right: 5px;
}

.events__item--left {
    width: calc(100% - 76px);
}

.events__name {
    font-size: 12px;
    font-weight: 700;
    color: #222741;
    display: block;
    margin-bottom: 6px px;
}

.events__date {
    font-size: 12px;
    color: #9faab7;
    display: inline-block;
}

.events__tag {
    background: #5a5ae2;
    border: 2px solid #fefefe;
    box-shadow: none;
    border-radius: 20px;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    width: 60px;
    margin-left: 5px;
    padding: 5px 2px;
    text-align: center;
}

.bl8-primary {
    border-left: 8px solid #5a5ae2;
}

.bl8-warning {
    border-left: 8px solid #ffb822 !important;
}

.bl8-danger {
    border-left: 8px solid #fd397a;
}

.bl8-success {
    border-left: 8px solid #1dc9b7;
}

/*.bl8-info {
    border-left: 8px solid #008ff8;
    border-left: 8px solid #025f80;
}*/

.h-6px {
    height: 6px !important;
}

.text-slate-700 {
    color: #334155;
}

.text-base {
    font-size: 1rem;
    line-height: 1.5rem;
}

line-clamp-1,
.line-clamp-2 {
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow: hidden;
}

.line-clamp-1 {
    -webkit-line-clamp: 1;
}

.text-xs {
    font-size: 0.8125rem;
    line-height: 1.125rem;
}

.mask.is-star {
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none'%3E%3Cpath fill='%23000' d='M82.39 2.111a14 14 0 0 1 14.568 0l10.401 6.337a14 14 0 0 0 7.613 2.04l12.176-.287a14.003 14.003 0 0 1 12.616 7.283l5.839 10.688a14.005 14.005 0 0 0 5.573 5.574l10.688 5.84a14.001 14.001 0 0 1 7.284 12.615l-.287 12.175a14.004 14.004 0 0 0 2.04 7.614l6.336 10.4a14 14 0 0 1 0 14.568l-6.336 10.401a14 14 0 0 0-2.04 7.613l.287 12.176a14.002 14.002 0 0 1-7.284 12.616l-10.688 5.839a14.005 14.005 0 0 0-5.573 5.573l-5.839 10.688a14.003 14.003 0 0 1-12.616 7.284l-12.176-.287a14 14 0 0 0-7.613 2.04l-10.401 6.336a13.998 13.998 0 0 1-14.567 0l-10.401-6.336a14.004 14.004 0 0 0-7.614-2.04l-12.175.287a13.994 13.994 0 0 1-12.616-7.284l-5.84-10.688a14.004 14.004 0 0 0-5.573-5.573l-10.688-5.839a14.001 14.001 0 0 1-7.283-12.616l.287-12.176a14 14 0 0 0-2.04-7.613L2.11 96.958a14 14 0 0 1 0-14.567L8.448 71.99a14 14 0 0 0 2.04-7.614L10.2 52.201a13.998 13.998 0 0 1 7.283-12.616l10.688-5.84a14 14 0 0 0 5.574-5.573l5.84-10.688A14 14 0 0 1 52.2 10.201l12.175.287a14 14 0 0 0 7.614-2.04l10.4-6.337h.001z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180' fill='none'%3E%3Cpath fill='%23000' d='M82.39 2.111a14 14 0 0 1 14.568 0l10.401 6.337a14 14 0 0 0 7.613 2.04l12.176-.287a14.003 14.003 0 0 1 12.616 7.283l5.839 10.688a14.005 14.005 0 0 0 5.573 5.574l10.688 5.84a14.001 14.001 0 0 1 7.284 12.615l-.287 12.175a14.004 14.004 0 0 0 2.04 7.614l6.336 10.4a14 14 0 0 1 0 14.568l-6.336 10.401a14 14 0 0 0-2.04 7.613l.287 12.176a14.002 14.002 0 0 1-7.284 12.616l-10.688 5.839a14.005 14.005 0 0 0-5.573 5.573l-5.839 10.688a14.003 14.003 0 0 1-12.616 7.284l-12.176-.287a14 14 0 0 0-7.613 2.04l-10.401 6.336a13.998 13.998 0 0 1-14.567 0l-10.401-6.336a14.004 14.004 0 0 0-7.614-2.04l-12.175.287a13.994 13.994 0 0 1-12.616-7.284l-5.84-10.688a14.004 14.004 0 0 0-5.573-5.573l-10.688-5.839a14.001 14.001 0 0 1-7.283-12.616l.287-12.176a14 14 0 0 0-2.04-7.613L2.11 96.958a14 14 0 0 1 0-14.567L8.448 71.99a14 14 0 0 0 2.04-7.614L10.2 52.201a13.998 13.998 0 0 1 7.283-12.616l10.688-5.84a14 14 0 0 0 5.574-5.573l5.84-10.688A14 14 0 0 1 52.2 10.201l12.175.287a14 14 0 0 0 7.614-2.04l10.4-6.337h.001z'/%3E%3C/svg%3E");
}

.w-5 {
    width: 1.25rem;
}

.h-5 {
    height: 1.25rem;
}

.bg-light-success {
    background-color: rgba(16, 185, 129, 0.1);
}

.bg-light-info {
    background-color: rgba(14, 165, 233, 0.1);
}

.bg-light-primary {
    background-color: rgba(79, 70, 229, 0.1);
}

.bg-light-pink {
    background-color: rgba(79, 70, 229, 0.1);
}

.bg-pink {
    background: #f000b9;
}

.text-pink {
    color: #f000b9;
}

.space-x-1 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-left: calc(0.25rem * (1 - var(--tw-space-x-reverse)));
    margin-right: calc(0.25rem * var(--tw-space-x-reverse));
}

.w-8m {
    width: 0.875rem;
}

.h-8m {
    height: 0.875rem;
}

.w-15px {
    width: 15px;
}

.h7 {
    font-size: 0.875rem;
}

.justify-center {
    justify-content: center;
}

.items-center {
    align-items: center;
}

.shrink-0 {
    flex-shrink: 0;
}

.w-10 {
    width: 2.5rem;
}

.h-10 {
    height: 2.5rem;
}

.flex {
    display: flex;
}

.br-30px {
    border-radius: 30px;
}

.mask {
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.flex-btn {
    width: 160px;
    display: flex;
    gap: 1px;
}

.btn-flx {
    border-radius: 6px;
    flex-grow: 1;
    color: #ffffff;
    background-color: #008ff8;
    background-color: #025f80;
    font-size: 14px;
    height: 28px;
    min-width: 28px;
    border: 1px solid transparent;
}

.events__tag.bg-info {
    background-color: #025f80 !important;
}

.rd-r-0 {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}

.rd-l-0 {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

.icnn:not(:only-child):first-child {
    margin-left: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.icnn-svg {
    display: inline-block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    shape-rendering: geometricPrecision;
    box-sizing: content-box;
    fill: currentColor;
    flex-shrink: 0;
    outline: none;
    color: #fff;
}

.cus-sec {
}

.btnf-txt {
    margin-left: 8px;
    margin-right: 8px;
    line-height: 1.42;
    display: inline-flex;
}

.btnf-innr {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
}

.btn-eves {
    height: 28px;
    min-width: 28px;
    border-radius: 6px;
    font-size: 14px;
    color: #ffffff;
    background-color: #008ff8;
    padding: 0;
    white-space: nowrap;
    margin: 0;
}

#selected-date {
    max-width: 120px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.card-box {
    background-color: #fff;
    padding: 1.5rem;
    box-shadow: 0 0 35px 0 rgba(154, 161, 171, 0.15);
    margin-bottom: 24px;
    border-radius: 0.25rem;
}

@media (max-width: 1023px) {
    .events__item-main {
        width: 32.3%;
    }

    .events__item {
        margin: 0;
        width: 100%;
    }

    .flex-headr {
    }

    .col-res {
        -ms-flex-direction: column-reverse !important;
        flex-direction: column-reverse !important;
    }

    .flex-mdd {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
    }
}

@media (max-width: 1024px) {
    .kt-header-mobile--fixed .kt-header-mobile {
        background: #fff;
    }
}

@media (max-width: 767px) {
    .events__item-main {
        margin: 0;
        width: 49%;
    }

    .flex-xs-column {
        flex-direction: column !important;
    }

    .pt-cs-2 {
        padding-top: 0.5rem !important;
    }

    .pt-cs-3 {
        padding-top: 1rem !important;
    }

    .ml-cs-auto {
        margin-left: auto !important;
    }

    .w-cusm {
        width: 100% !important;
    }

    .w-mxc {
        width: max-content !important;
    }
}

@media (max-width: 425px) {
    .events__item-main {
        margin: 0;
        width: 100%;
    }
}

@media (min-width: 1024px) {
    .bl-lg-1 {
        border-left: 1px solid rgb(224 225 233);
    }
}

@media (max-width: 767.98px) {
    .fc .fc-header-toolbar {
        flex-direction: column;
        align-items: flex-start;
    }
}

.css-1p1rx0p {
    -webkit-box-align: center;
    align-items: center;
    background-color: transparent;
    border-radius: 3px;
    border: 2px solid transparent;
    box-sizing: border-box;
    color: inherit;
    display: flex;
    font-size: inherit;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    outline: none;
    margin: 0px;
    padding: 4px;
    text-align: left;
    text-decoration: none;
    width: 100%;
}

.sc-1ulardc-0 {
    box-sizing: border-box;
    align-self: flex-start;
    display: none;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    min-height: 32px;
    min-width: 32px;
    border-radius: 4px;
    text-align: center;
}

    .sc-1ulardc-0.cQYYaB {
        background-color: #0065ff;
        border: 1px solid rgba(0, 0, 0, 0.1);
    }

.css-jdn6mg {
    min-width: 0px;
    max-width: 100%;
    padding-left: 8px;
    flex: 1 1 100%;
    line-height: 1.4;
}

.css-18mjdzo {
    display: block;
    margin: 0px;
    color: #091e42;
    overflow-x: hidden;
    text-overflow: ellipsis;
}

.sc-96yduf-1.hWvXSM {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    gap: 4px;
}

.sc-96yduf-0.bbrXTg {
    margin-top: -4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 22px;
    overflow: hidden;
}

.css-1huq13 {
    display: block;
    margin: 0px;
    color: #6b778c;
    overflow-x: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.85em;
}

.css-snhnyn svg {
    color: #172b4d;
}

.active .css-snhnyn svg {
    color: #0065ff;
}

.sc-96yduf-2.bXRAby {
    margin-top: 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
}

.nav-link.colp:not(:first-of-type) {
    margin-top: 8px;
}

.lefttabs .nav-link {
    color: unset !important;
    background-color: unset !important;
}

a.active .dInVEd > button {
    background-color: #deebff;
}

.dInVEd > button {
    padding: 12px;
    background-color: #ebecf0;
    background-color: #ebecf08c;
}

.lefttabs .nav-link {
    padding: 0px !important;
    width: 100%;
    overflow: auto;
}

.igeHyE {
    background-color: #ffab00;
}

.hYGvlv {
    background-color: #6554c0;
}

.fhMXJe {
    background-color: #36b37e;
}

.count-issue {
    width: 1.5em;
    height: 1.5em;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background-color: #000;
    color: white;
}

.v-card-text {
    flex: 1 1 auto;
    font-size: 1rem;
    font-weight: 400;
    letter-spacing: 0.0178571429em;
    padding: 24px;
    text-transform: none;
    margin-bottom: 1rem;
}

.topvr {
    border-radius: 5px;
    box-shadow: 1px 4px 7px 3px #acacac47;
}

.title-name {
    color: #333;
    display: flex;
    align-items: center;
}

#Title_Name h4 {
    margin: 0;
}

.v-row {
    display: flex;
    flex-wrap: wrap;
    flex: 1 1 auto;
    margin: -12px;
}

.v-col-12 {
    flex: 0 0 100%;
    max-width: 100%;
}

.v-card .v-card-title {
    line-height: 1.65rem;
}

.v-card-title {
    display: block;
    flex: none;
    font-size: 1.25rem;
    font-weight: 500;
    hyphens: auto;
    letter-spacing: 0.0125em;
    min-width: 0;
    overflow-wrap: normal;
    overflow: hidden;
    padding: 0.5rem 1rem;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap;
    word-break: normal;
    word-wrap: break-word;
}

.overvs {
    border: 1px solid #e9ebf0;
    border-radius: 4px;
}

.font-weight-semibold {
    font-weight: 600 !important;
}

.text-base {
    font-size: 1rem;
    line-height: 1.5rem;
}

.text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
}

.justify-space-between {
    justify-content: space-between !important;
}

.font-weight-bold {
    font-weight: 700 !important;
}

.nav-bordered {
    border-bottom: 2px solid rgba(152, 166, 173, 0.2) !important;
}

    .nav-bordered li a {
        border: 0 !important;
        padding: 10px 20px;
    }

    .nav-bordered .nav-item {
        margin-bottom: -2px;
    }

    .nav-bordered a.active {
        border-bottom: 2px solid #3283f6 !important;
    }

.avatar-group .avatar-group-item {
    display: inline-block;
    border-radius: 50%;
}

.avatar-xs {
    height: 1.5rem;
    width: 1.5rem;
}

.rounded-circle {
    border-radius: 50% !important;
}

.act-table .thead-light th {
    background-color: #e8f1f6;
    border-color: #e8f1f6;
}

.act-table .badge {
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.grey-1 {
    color: #595d6e;
}

.card-bx .cds {
    box-shadow: 0 0 35px 0 rgb(154 161 171 / 15%);
    background-color: #fff;
    padding: 1.5rem;
    border-radius: 5px;
}

.card-bx .cd-lt {
    margin-right: 30px;
    width: 400px;
}

.card-bx .cd-rt {
    width: 100%;
}

.Stars {
    --percent: calc(var(--rating) / 5 * 100%);
    display: inline-block;
    font-size: 24px;
    font-family: Times;
    line-height: 1;
}

    .Stars::before {
        content: "★★★★★";
        letter-spacing: 3px;
        background: linear-gradient( 90deg, #fc0 var(--percent), #d3d3d3 var(--percent) );
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

tr.issue {
    background-color: #ffeded !important;
}

.issuep {
    background-color: #ffeded !important;
    padding: 0 5px;
    max-width: 99%;
    width: max-content;
    display: block;
    margin-bottom: 7px;
    font-size: 12.5px;
}

.ver-m {
    vertical-align: middle;
}

.colpse-svg {
    width: 1.25rem;
    height: 1.25rem;
    color: #008ff8 !important;
}

.collapsed .colpse-svg {
    transform: rotate(270deg);
}

.cell-1 {
    border-collapse: separate;
    border-spacing: 0 4em;
    background: #ffffff;
    border-bottom: 2px solid transparent;
    /*background-color: gold;*/
    background-clip: padding-box;
    cursor: pointer;
}

.clsp {
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s 0.1s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.h-10px {
    height: 10px;
}

.w-10px {
    width: 10px;
}

.row-child {
    background-color: #ffeded !important;
}

.img-v {
    width: 30px;
    margin-right: 6px;
    padding: 4px 0px;
    cursor: pointer;
}

.let-go {
    color: #1e293b;
    background-color: #e2e8f0;
    font-weight: 500;
    padding: 0;
    border-radius: 9999px;
    width: 2rem;
    height: 2rem;
}

.d-flex-center {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.rotate-45 {
    transform: rotate(45deg);
}

.iss-date {
    color: #94a3b8;
    width: 1.125rem;
    height: 1.125rem;
    position: relative;
    top: -2px;
}

.iss-txt {
    color: #94a3b8;
}

.w-5 {
    width: 1.25rem;
}

.h-5 {
    height: 1.25rem;
}
/* tracking */
.order-tracking {
    text-align: center;
    width: 50%;
    position: relative;
    display: block;
}

.count-3 .order-tracking {
    width: 33.33%;
}

.order-tracking .is-complete {
    display: block;
    position: relative;
    border-radius: 50%;
    height: 30px;
    width: 30px;
    border: 0px solid #afafaf;
    background-color: #f7be16;
    margin: 0 auto;
    transition: background 0.25s linear;
    -webkit-transition: background 0.25s linear;
    z-index: 2;
}

    .order-tracking .is-complete:after,
    .order-tracking .is-complete.close-icn:before {
        display: block;
        position: absolute;
        content: "";
        height: 14px;
        width: 7px;
        top: -2px;
        bottom: 0;
        left: 5px;
        margin: auto 0;
        border: 0px solid #afafaf;
        border-width: 0px 2px 2px 0;
        transform: rotate(45deg);
        opacity: 0;
    }

.order-tracking.completed .is-complete {
    border-color: #008ff8;
    border-width: 0px;
    background-color: #008ff8;
}

.order-tracking .is-complete.is-success {
    border-color: #27aa80;
    border-width: 0px;
    background-color: #27aa80;
}

.order-tracking.is-success::before {
    background-color: #27aa80;
}

.order-tracking .is-complete.is-danger {
    border-color: #f9ecdb;
    border-width: 0px;
    background-color: #f9ecdb;
}

.order-tracking.is-danger::before {
    background-color: #fd397a;
    background-color: #fd578e96;
}

.order-tracking .is-complete.is-danger.is-late {
    background-color: #f9ecdb;
}

.order-tracking.completed .is-complete:after {
    border-color: #ea9b39;
    border-width: 0px 3px 3px 0;
    width: 7px;
    left: 11px;
    opacity: 1;
}

.order-tracking.completed .is-complete.start:after {
    border-color: #ea9b39;
    width: 7px;
    left: 8px;
    opacity: 1;
    border-width: 12px 2px 3px 13px;
    border-radius: 19px;
    top: 1px;
}

.order-tracking .is-complete.close-icn:after {
    border-color: #ea9b39;
    border-width: 0px 3px 0px 0;
    width: 7px;
    left: 11px;
    opacity: 1;
}

.order-tracking p {
    color: #857e7e;
    font-size: 12px;
    margin-bottom: 8px;
    margin-top: 0;
    line-height: 20px;
}

    .order-tracking p.nyet {
        color: #857e7e;
    }

    .order-tracking p span {
        font-size: 14px;
    }

.order-tracking::before {
    content: "";
    display: block;
    height: 3px;
    width: calc(100% - 40px);
    background-color: #f7be16;
    top: 42px;
    position: absolute;
    left: calc(-50% + 20px);
    z-index: 0;
}

.order-tracking .is-complete.close-icn:before {
    border-color: #ea9b39;
    border-width: 0px 0px 0px 3px;
    width: 7px;
    left: 11px;
    transform: rotate(135deg);
    opacity: 1;
    top: 4px;
}

.order-tracking:first-child:before {
    display: none;
}

.order-tracking.completed:before {
    background-color: #99d7c3;
}
/*.order-tracking .is-complete.is-danger.is-late {
    background-color: #ffe2d9;
}*/
/*.order-tracking.completed span.is-complete.is-danger.is-late:after {
    border-color: #ff5722;
}*/
.order-tracking.completed.is-danger.is-late:before {
    background-color: #ffb9a4;
}

.order-tracking.completed .is-complete.is-success {
    border-color: #f9ecdb;
    border-width: 0px;
    background-color: #f9ecdb;
}

    .order-tracking.completed .is-complete.is-success:after {
        border-color: #ea9b39;
    }

.w-80 {
    width: 80%;
}

.nav-tabs .nav-item .nav-link.active,
.nav-tabs .nav-item .nav-link:active,
.nav-tabs .nav-item .nav-link:hover {
    color: #3283f6;
    font-weight: 600;
}

.text-info {
    color: #008ff8 !important;
}

.bg-soft-info {
    background-color: rgba(67, 190, 225, 0.25) !important;
}

.bg-soft-danger {
    background-color: rgba(248, 98, 98, 0.25) !important;
}

.bg-soft-dark {
    background-color: rgba(50, 58, 70, 0.25) !important;
}

.bg-soft-success {
    background-color: rgba(16, 185, 129, 0.1) !important;
}

.bg-black {
    background-color: #000 !important;
}

.badge-min {
    min-width: 45px;
}

.avatar-sm {
    height: 2.25rem;
    width: 2.25rem;
}

.avatar-sm-1 {
    height: 2.25rem;
    width: 3.25rem;
}

.svgs-aperture svg circle,
.svgs-aperture svg line {
    color: #fff;
}

.bg-blue {
    background-color: #4a81d4;
}

.bg-green {
    background-color: #1abc9c;
}

.avatar-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--ct-card-bg);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
}

.card-box1 {
    background-color: #fff;
    padding: 1.5rem;
    box-shadow: 0 0 35px 0 rgb(154 161 171 / 15%);
    margin-bottom: 24px;
    border-radius: 0.25rem;
    box-shadow: var( --ds-shadow-raised, 0 1px 1px rgba(9, 30, 66, 0.25), 0 0 1px 1px rgba(9, 30, 66, 0.13) );
}

.svg-open svg {
    transform: rotate(90deg);
    vertical-align: text-bottom;
}

.act-table .thead-light th {
    min-width: 130px;
    width: 130px;
}

.table-sticky {
    position: relative;
}

    .table-sticky thead.thead-light {
        width: 100%;
        top: 0;
        position: sticky;
    }

.act-table .thead-light th.actth {
    width: 65%;
}

.active .drkbg .text-muted {
    color: #ffffff !important;
}

.active .drkbg .dInVEd > button .bbrXTg {
    color: #fff;
}

.active .drkbg .bg-light-primary {
    background-color: rgb(255 255 255 / 48%);
}

.active .drkbg .sc-96yduf-2.bXRAby {
    color: #fff;
}

.active .drkbg .css-snhnyn svg {
    color: #ffffff;
}

.active .css-1p1rx0p.drkbg {
    background-color: #008ff8 !important;
}

.kt-media-num span {
    background: #deecf8;
    color: #2786fb;
}

.tabs-btn {
    position: absolute;
    right: 100px;
    top: 38px;
    top: 28px;
    width: 86px;
    cursor: pointer;
}

    .tabs-btn.right10 {
        right: 10px;
    }

.title-w {
    width: 85%;
    color: #333;
}
/* Popup Styling */
.img-popup-child {
    position: relative;
}

.img-popup {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgb(0 0 0 / 70%);
    display: flex;
    justify-content: center;
    align-items: center;
    display: none;
    z-index: 999;
}

    .img-popup img {
        max-width: 900px;
        width: 100%;
        opacity: 0;
        transform: translateY(-100px);
        -webkit-transform: translateY(-100px);
        -moz-transform: translateY(-100px);
        -ms-transform: translateY(-100px);
        -o-transform: translateY(-100px);
        border: 6px solid #6782a4;
        transform: scale(2);
        box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.2);
        border-radius: 20px;
    }

.close-btn svg {
    width: 32px;
    height: 32px;
    fill: #fff;
}

.close-btn {
    position: absolute;
    top: 5px;
    right: 0;
    cursor: pointer;
    border-radius: 2px 8px 0px 8px;
    background: #6782a4;
    margin-right: 6px;
}

    .close-btn .bar {
        height: 3px;
        background: #dee3e7;
    }

        .close-btn .bar:nth-child(1) {
            transform: rotate(45deg);
        }

        .close-btn .bar:nth-child(2) {
            transform: translateY(-3px) rotate(-45deg);
        }

    .close-btn:hover .bar {
        background: #fff;
    }

.opened {
    display: flex;
}

    .opened img {
        animation: animatepopup 1s ease-in-out 0.8s;
        -webkit-animation: animatepopup 0.3s ease-in-out forwards;
    }

@keyframes animatepopup {
    to {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
    }
}

/*tracking*/
@media (min-width: 960px) {
    .order-md-1 {
        order: 1 !important;
    }

    .v-col-md-1 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333%;
        flex: 0 0 8.33333%;
        max-width: 8.33333%;
    }

    .v-col-md-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66667%;
        flex: 0 0 16.66667%;
        max-width: 16.66667%;
    }

    .v-col-md-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333%;
        flex: 0 0 33.33333%;
        max-width: 33.33333%;
    }

    .v-col-md-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66667%;
        flex: 0 0 41.66667%;
        max-width: 41.66667%;
    }

    .v-col-md-6 {
        flex: 0 0 50%;
        max-width: 50%;
    }
}
/*tickets*/
.card-ticket {
    margin-bottom: 10px;
    padding: 1rem;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    background-color: #fff;
    border-radius: calc(0.375rem - 1px);
    border-left: 4px solid rgb(0, 170, 255);
    box-shadow: 1px 4px 7px 3px #acacac47;
    box-shadow: 0px 0px 0px 2px #acacac1f;
    font-weight: 400;
}

    .card-ticket:hover {
        box-shadow: 0 0 2rem 0 rgb(157 165 176 / 68%);
        box-shadow: 1px 4px 7px 3px #acacac47;
        transform: translateY(-1px);
    }
/*
    .card-ticket .card-title {
        color: #32325d;
        line-height: 1.5;
    }*/

.bl4-info {
    border-left: 4px solid rgb(0, 170, 255) !important;
}

.bl4-warning {
    border-left: 4px solid #ffb822 !important;
}

.bl4-success {
    border-left: 4px solid #1dc9b7 !important;
}

.icon {
    width: 3rem;
    height: 3rem;
}

.icon-shape {
    display: inline-flex;
    padding: 12px;
    text-align: center;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
}

    .icon-shape.tktid {
        display: inline-flex;
        padding: 3px 6px;
        text-align: center;
        border-radius: 5px;
        align-items: center;
        justify-content: center;
        font-size: 11px;
        font-weight: 500;
    }

.tic-abt {
    color: #8898aa !important;
}

.tic-arrow {
    line-height: 1;
    color: #8898aa !important;
}

    .tic-arrow i {
        vertical-align: middle;
    }

.tkt-actn {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 350px;
}

[class*="shadow"] {
    transition: all 0.15s ease;
}

.shadow {
    box-shadow: 0 0 2rem 0 rgb(136 152 170 / 15%) !important;
}

.bg-gradient-primary {
    background: linear-gradient(87deg, #5e72e4 0, #825ee4 100%) !important;
}

span.tic-det {
    border: 1px solid #d3d8f3;
    padding: 1px 4px;
    border-radius: 3px;
    font-size: 0.7125rem;
}

.small-bg {
    width: 10px;
    height: 10px;
    display: inline-block;
    margin: auto;
    border-radius: 2px;
    margin-right: 2px;
    vertical-align: unset;
}

.small-bg {
    width: 10px;
    height: 10px;
    display: inline-block;
    margin: auto;
    border-radius: 2px;
    margin-right: 6px;
    vertical-align: unset;
}

.bg-red {
    background-color: #f5365c !important;
}

.bg-orange {
    background-color: #fb6340 !important;
}

.bl-0 {
    border-left: 0 !important;
}

.tic-shadow {
    box-shadow: 1px 4px 7px 3px #acacac47;
}

.kt-widget.kt-widget--user-profile-3
.kt-widget__bottom_cus
.kt-widget__item
.kt-widget__icon
i {
    font-size: 1.7rem;
    color: #a2a5b9;
}

.kt-widget.kt-widget--user-profile-3
.kt-widget__bottom_cus
.kt-widget__item
.kt-widget__icon
svg {
    font-size: 1.7rem;
    fill: #a2a5b9;
}

.img-tic {
    cursor: pointer;
}

.fa,
.fas {
    font-weight: 900 !important;
}

.kt-tic-list {
    cursor: pointer;
}

.kt-widget__bottom_cus {
    flex-wrap: nowrap !important;
}

.svg-icon.svg-icon-3 svg {
    height: 1.35rem !important;
    width: 1.35rem !important;
}

.btn.btn-info .svg-icon svg [fill]:not(.permanent):not(g) {
    transition: fill 0.3s ease;
    fill: #ffffff;
}

.btn.btn-light-info .svg-icon svg [fill]:not(.permanent):not(g) {
    transition: fill 0.3s ease;
    fill: #eb9c39;
}

/*ticket status second*/
.kt-portlet__head.ml--2 {
    margin-left: -10px !important;
    margin-right: -10px !important;
}

.mh-50 {
    min-height: 50px !important;
}

.tic_status_div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    overflow: hidden;
}

.ticketbar {
    width: 100%;
    padding: 20px 0 0;
}

    .ticketbar li {
        list-style-type: none;
        width: 22.5%;
        float: left;
        font-size: 12px;
        font-weight: 500;
        position: relative;
        text-align: center;
        text-transform: uppercase;
        color: #7d7d7d;
        margin-bottom: 20px;
    }

        .ticketbar li:before {
            width: 25px;
            height: 25px;
            font: normal normal normal 16px/1 "LineAwesome";
            content: "\f17b";
            font-size: 16px;
            line-height: 20px;
            border: 2px solid #7d7d7d;
            display: block;
            text-align: center;
            margin: 0 auto 10px auto;
            font-weight: bold;
            border-radius: 50%;
            background-color: white;
        }

        .ticketbar li:after {
            width: 100%;
            font: normal normal normal 16px/1 "LineAwesome";
            content: "\f112";
            display: inline-block;
            padding-right: 3px;
            vertical-align: middle;
            font-size: 34px;
            position: absolute;
            top: 0px;
            left: 50%;
        }

        .ticketbar li:last-child:after {
            content: none;
        }

        .ticketbar li.active {
            color: #2cafdd;
        }

            .ticketbar li.active:before {
                border-color: #2cafdd;
            }

        .ticketbar li.active {
            color: #2cafdd;
        }

.ticket-full-details tr td:last-child {
    color: #2cafdd;
    font-weight: 500;
}
/*ticket status second end*/
.tic-det_card span.st-r-lable-svg {
    width: 220px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.events__item-main {
    position: relative;
    margin-right: 5px;
    transition: all 0.25s ease-in;
}

a.new-tabbie {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #eff0f3;
    background: #ffffff;
    border-radius: 8px;
    -webkit-user-select: none;
    user-select: none;
    cursor: pointer;
    border: 1px solid #dcdfe4;
    width: 32px;
    height: 32px;
    padding: 1px 6px;
}

span.tab__icon {
    transition: all 0.2s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
    width: 16px;
    height: 16px;
    fill: #8d95a5;
    color: #8d95a5;
}

span.tab__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-grow: 0;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
}

a.new-tabbie:hover span.tab__icon {
    color: #7b68ee;
    transform: rotate(360deg);
}

.new-tab-div {
    position: absolute;
    width: 76px;
    height: 100%;
    right: 4px;
    top: 0px;
    background: #eff0f3;
    background: #eff0f3;
    border-radius: 0px 2px 2px 0px;
    text-align: center;
    align-items: center;
    transition: all 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    width: 0;
    overflow: hidden;
}

.events__item-main:hover .new-tab-div {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
}

.bs-tooltip-left > .tooltip-inner {
    background: rgba(0, 0, 0, 0.7);
    color: #ffffff;
}

.bs-tooltip-left .arrow::before,
.bs-tooltip-auto[x-placement^="left"] .arrow::before {
    border-left-color: rgba(0, 0, 0, 0.7);
}

.w-170 {
    width: 170px;
}

@media (max-width: 1440px) {
    .kt-widget--user-profile-3 .kt-widget__value {
        max-width: 350px;
        font-size: 1.15rem;
    }
}

@media (max-width: 1366px) {
    .kt-widget--user-profile-3 .kt-widget__value {
        max-width: 250px;
        font-size: 1.15rem;
    }
}
/*tickets*/
.kt-quick-search--custom .input-group {
    background: #fff;
    border: 1px solid #e8eaed;
    border-radius: 6px;
}

.details .card-ticket {
    flex: 1;
    width: 50%;
    min-height: 195px;
}

.s-t-d-title h5 {
    font-size: 14px;
    font-weight: 700;
    color: #333;
}

.det-sect {
    display: flex;
    margin-top: 10px;
    color: rgb(64, 69, 83);
    align-items: center;
}

span.st-r-lable-svg {
    width: 30px;
}

p.st-r-info {
    margin-bottom: 0px;
    font-size: 14px;
    width: 90%;
    padding-left: 10px;
}

cd-call-section a {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.form-control.kt-quick-search__input {
    height: calc(1.3em + 1rem + 2px);
}

@media (max-width: 690px) {
    .title-w {
        width: 80%;
    }
}

@media (max-width: 420px) {
    .tabs-btn {
        position: relative;
        width: 100%;
        margin-bottom: 10px;
        right: unset;
        top: unset;
    }

        .tabs-btn.right10 {
            right: unset;
        }
}

.order-2 {
    order: 2 !important;
}

.min-h-table {
    max-height: 400px;
}

.scroll-y::-webkit-scrollbar {
    background-color: #fff;
    width: 6px;
}

.scroll-y::-webkit-scrollbar-track {
    background-color: #fff;
}

.scroll-y::-webkit-scrollbar-thumb {
    background-color: #1c1c9e80;
    border-radius: 6px;
    border: 5px solid #ccc;
}

/*-----02-03-2023-- Ticket Demo Name--*/
.kt-tk-NM {
    width: 110px;
    border-radius: 8px;
    background-color: #cda04f;
    height: 93px;
    display: flex;
    color: #fff;
    align-items: center;
    justify-content: center;
}
/*-----02-03-2023-- Ticket Demo Name end--*/
.theme-b {
    background: #333;
    border-radius: 5px;
}

    .theme-b .title-w {
        color: #fff;
    }

    .theme-b .tabs-btn.btn-info {
        color: #333;
        background-color: #ffffff;
        border-color: #ffffff;
    }

.store-tag {
    border: 0px solid #fefefe;
    -moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0px 2px 2px rgb(0 0 0 / 10%);
    box-shadow: 0px 2px 2px rgb(0 0 0 / 10%);
    border-radius: 16px;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    width: 60px;
    padding: 2px 2px;
    text-align: center;
    background-color: #fd397a;
    background: #5a5ae2;
    display: inline-block;
}

.tabs-btn {
    font-weight: 500;
}

.theme-b .store-tag {
    background-color: #fff;
    color: #000;
}

.title-kt {
    color: #48465b !important;
}

div.evedivs {
    max-height: calc(100vh + 88px);
    overflow-x: hidden;
    overflow-y: auto;
}

.kt-portlet__body_scroll::-webkit-scrollbar {
    width: 6px;
}

.kt-portlet__body_scroll::-webkit-scrollbar-track {
    background: #f8f9ff;
}

.kt-portlet__body_scroll::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 40px;
}

    .kt-portlet__body_scroll::-webkit-scrollbar-thumb:hover {
        background: #ccc;
    }

.px-15px {
    padding: 0 15px !important;
}

.px-5px {
    padding: 0 5px !important;
}

.p-cus1 {
    padding-left: 15px !important;
    padding-right: 9px !important;
}

.kt-media span.initial-box {
    color: #ff8e00 !important;
    background-color: #f9ecdb !important;
    border-radius: 15% !important;
    font-weight: 600;
    font-size: 15px;
    line-height: 1;
    width: 43px;
    max-width: 43px;
    height: 43px;
    text-align: center;
    display: flex;
    margin: 0;
    align-items: center;
    justify-content: center;
    letter-spacing: 0;
}

.br-50 {
    border-radius: 50% !important;
}

.asc-ar {
    display: none;
}

.btn-sort {
    color: #0b0e1f;
    background-color: #fff;
    border: 1px solid #eef1f6;
    border-radius: 30px;
    display: flex;
    align-items: center;
}

a.ordr-a {
    font-size: 14px;
    margin-left: 5px;
    color: #0b0e1f;
}

.sort-by {
    color: #999999;
    font-size: 12px;
    padding: 8px;
}

.sort-a {
    text-decoration: underline;
}

.sort-drop {
    padding: 0.8rem 0;
    margin-top: 5px;
    width: 500px;
    max-width: 700px;
    font-weight: 400;
}

    .sort-drop .dropdown-item {
        padding: 0.4rem 1rem;
        white-space: unset;
        cursor: pointer;
    }

.dropdown-item:not(.active):active {
    background: #008ff8;
    color: #fff;
}

.sort-drop .active {
    background: #f1f6fd;
    color: #0b0e1f;
    align-items: center;
    justify-content: space-between;
    display: flex;
}

    .sort-drop .active .ckc-icn {
        display: inline-block;
        color: #3b93fc;
    }

.btn-sort:hover,
.btn-sort:focus,
.btn-sort:active {
    color: #0b0e1f;
    background-color: #f5f7fa;
    border: 1px solid #e1e6ee;
}

.d-branch {
    margin: 0 12px;
}

.d-branch,
.d-dept,
.d-divis {
    width: 100%;
    max-width: 30%;
}

.d-divis {
    margin: 0 12px;
}

.filt-scroll {
    max-height: 135px;
    overflow-y: auto;
}

.btn-sort.active,
.btn-sort.active .ordr-a {
    color: #3b93fc;
}

.no-after::after {
    content: none !important;
}

.count-list label {
    margin-bottom: 0;
}

.py-8px {
    padding-top: 8px;
    padding-bottom: 8px;
}

.bdg-new {
    background-color: #7b68ee26;
    color: #7b68ee;
    font-size: 12px;
    font-weight: 500;
}

span.count {
    background: #9886eb;
    padding: 0 4px;
    color: #fff;
    cursor: auto;
    border-radius: 3px;
}

.ticks-grad {
    background-image: linear-gradient(to left, #f9a8d4, #d8b4fe, #818cf8);
    color: #fff;
    padding: 15px 20px;
    border-radius: 12px;
    margin-bottom: 20px;
    min-height: 90px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background: #025f80;
}

.example_icon {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 55px;
    height: 55px;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    margin-right: 10px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

span.example_icon svg {
    width: 25px;
    height: 25px;
}

span.example_icon i {
    font-size: 22px;
}

.filter-dot1:after {
    content: "\2022" !important;
    position: absolute !important;
    top: -5px;
    right: 5px;
    font-size: 33px !important;
    color: #cd5c5c;
}

.d-flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

@media (min-width: 768px) {
    .ticks-grad .col-md-2 {
        flex: 0 0 20%;
        max-width: 20%;
    }
}

@media (max-width: 768px) {
    .ticks-grad .col-md-2 {
        margin-bottom: 10px;
    }
}

.fc-unthemed .fc-toolbar .fc-button:focus,
.fc-unthemed .fc-toolbar .fc-button:active,
.fc-unthemed .fc-toolbar .fc-button.fc-button-active {
    background: #025f80;
    color: #ffffff;
    border: 1px solid #025f80;
}

.card-bs {
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 3px 0px;
}

.card1 {
    background: #ececff;
}

.card2 {
    background: #eef1f6;
}

.card3 {
    background: #e4f4f1;
}

.card4 {
    background: #f5f1da;
}

.card5 {
    background: #f2f2f4;
}

.card-icn {
    padding: 8px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 1px 4px;
}

    .card-icn svg {
        width: 30px;
        height: 30px;
        color: #585858;
        /*fill: #585858;*/
    }

.card-val {
    font-size: 1.75rem;
    font-weight: 600;
    color: #000;
}

.line-1 {
    line-height: 1;
}

.symbol {
    display: inline-block;
    flex-shrink: 0;
    position: relative;
    border-radius: 0.475rem;
}

    .symbol.symbol-circle, .symbol.symbol-circle .symbol-label, .symbol.symbol-circle > img {
        border-radius: 50%;
    }

    .symbol > img {
        width: 100%;
        flex-shrink: 0;
        display: inline-block;
        border-radius: 0.475rem;
    }

    .symbol > img {
        width: 50px;
        height: 50px;
    }

    .symbol img {
        border: 1px solid #cdcdd8;
    }

    .symbol.symbol-22px > img {
        width: 22px;
        height: 22px;
    }

.colp-sf:not(:last-child) {
    margin-bottom: 3px;
}

.br-b:not(:last-of-type) {
    border-bottom: 1px solid #dee2e6 !important;
}

.userbtn.active {
    background-color: #deebff;
}

.colp .css-snhnyn svg {
    transform: rotate(90deg);
}

.colp.active .css-snhnyn svg {
    transform: rotate(270deg);
}

/*----22-06-23--------*/
span.card-label.fw-bold.text-dark {
    display: block;
    font-size: 16px;
    font-weight: 600;
}

span.text-gray-400.pt-2.fw-semibold.fs-6 {
    font-size: 13px;
    color: #7e7e7e;
}

.card {
    border: 0px;
    box-shadow: 2px 4px 5px #ccc;
}

.p-4.pt-7.crd-hd {
    margin-bottom: 13px;
}

.page-heading {
    font-size: 1.35rem !important;
    font-weight: 600 !important;
}

p.page-tt-sub {
    margin-bottom: 0px;
    color: #ababab;
    font-weight: 400;
}

.card-toolbar {
    display: flex;
    align-items: center;
    margin: 0.5rem 0;
    flex-wrap: wrap;
}

.flex-stack {
    justify-content: space-between;
    align-items: center;
}

.d-flex {
    display: flex !important;
}

.kt-btn-tg {
    padding: calc(0.55rem + 1px) calc(1.25rem + 1px);
    color: #9b9b9b;
    border-color: #ffffff;
    background-color: #ffffff !important;
    margin: 0px 5px;
    border-radius: 5px;
    font-weight: 500;
    cursor: pointer;
    font-size: 13px;
    box-shadow: 4px 5px 6px #cccccc29;
}

/*----22-06-23--------*/
.mg-check {
    width: 100%;
    justify-content: space-between;
    align-items: center;
}

.event-dt-l {
    width: 100%;
}

.event-dt-r {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}

.mng-check-points span {
    font-size: 9px;
}

.mng-check-points label {
    margin: -1px !important;
    font-size: 11px;
    color: #898989;
    font-weight: 400;
    /* text-transform: uppercase; */
}

.mng-check-points {
    padding-left: 2px;
}

.events__item {
    padding: 15px 7px;
}

.evnt-ptf {
    width: 100%;
}

.evnt-pc span {
    border-radius: 5px;
    padding: 1px 2px;
}

.base-line {
    align-items: center;
    border-top: 1px dashed #ccc;
    padding-top: 8px;
    margin-top: 8px;
}

small.kt-lst-sn {
    font-size: 8px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #505050;
}

.my-st-v .select2-selection__arrow {
    top: 18px !important;
}
/*------new css fo assign list of stores-------*/
.kt-svg-ic {
    width: 50px;
    height: 50px;
    background-color: #e7e7e7;
    text-align: center;
    padding: 9px;
    border-radius: 5px;
}

    .kt-svg-ic svg {
        height: 30px;
        fill: #ccc;
    }

.kt-bd label {
    margin-bottom: 5px;
    margin-left: 0.5rem;
    text-transform: capitalize;
    font-size: 12px;
    font-weight: 400;
    color: #9d9d9d;
}

.kt-bd {
    width: 15%;
}

.kt-mg-dtl {
    width: 100%;
    display: flex;
    margin-left: 10px px;
    margin-top: 4px;
}

.kt-store-icon img {
    width: 100%;
    /* height: 35px; */
    border-radius: 5px;
}

.kt-store-icon {
    padding: 4px;
    background-color: #dddddd;
    border-radius: 5px;
    margin-right: 13px;
    width: 46px;
    height: 46px;
    display: flex;
}

.kt-store-dtl p {
    margin-bottom: 0px;
    font-size: 13px;
    color: #787878;
    font-weight: 400;
}

button.kt-rm-btn {
    border: 0;
    background-color: #efefef;
    padding: 5px 7px;
    border-radius: 3px;
}

.kt-rm-btn svg {
    fill: #898989;
}

.kt-ass-row {
    padding: 15px;
    box-shadow: 0px 0px 10px #ccc;
    margin-bottom: 9px;
    border-radius: 5px;
    background: linear-gradient(90deg,#ffffff, #ffffff 35%, #025f8000 55%, #ffc2bd);
    background-size: 180% 100%;
    transition: background 1s;
}

    .kt-ass-row:hover {
        background-position: 75% 100%;
    }

button.kt-rm-btn:hover {
    background-color: #ffffff;
    box-shadow: 1px 4px 6px #ccc;
}

.kt-prd-logo {
    display: flex;
    border: 2px solid #e7e7e7;
    border-radius: 10px;
}

.kt-assed-ttl {
    text-align: center;
    padding: 2px 5px;
}

    .kt-assed-ttl h4 {
        margin-bottom: 0px;
        font-weight: 800;
        font-size: 20px;
        line-height: 19px;
        color: #4a4a4a;
    }

    .kt-assed-ttl span {
        font-size: 11px;
        font-weight: 400;
        color: #999797;
    }

.kt-add-total {
    display: flex;
    align-items: baseline;
    gap: 10px;
    width: 100%;
    justify-content: end;
}

.sub-ct-tittle h5 {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 0px;
}

.sub-ct-tittle {
    padding: 7px 5px;
    background-color: #f4f4f4;
    line-height: 13px;
    margin-bottom: 1rem;
    border-radius: 5px;
    margin-top: 1rem;
}

.w-24-v {
    width: 10%;
    text-align: end;
}

.kt-line-ht {
    line-height: 13px;
}

/*------- new ticket card design css 05-02-2024 ------------*/
.tc-tl-no {
    width: 105px;
    background-color: #008ff8;
    padding: 5px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 72px;
    text-align: center;
    border-top-left-radius: 8px;
}

.tc-up-v {
    background-color: #ffeeee;
    border-radius: 0;
    color: #9f0000;
    position: absolute;
    width: 100%;
    text-align: left;
    left: 0;
    top: 0;
    font-weight: 500;
}

.tt-no-value {
    color: #fff;
    text-align: center;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 0.5px;
    padding-bottom: 0px;
    padding-top: 1rem;
}

.new-card-ticket {
    display: flex;
    align-items: center;
    justify-content: space-between;
    overflow: hidden;
    cursor: pointer;
    -webkit-transition: border .4s ease-in;
    -moz-transition: border .4s ease-in;
    -o-transition: border .4s ease-in;
    transition: border .4s ease-in;
}

.tc-tt {
    display: flex;
    align-items: center;
    /* padding-left: 10px; */ width: 100%;
}

.ttl-name-lv-brnch {
    padding: 5px 10px;
}

.tc-tt {
    display: flex;
    align-items: center;
}

.ttl-name-lv-brnch {
    padding: 8px 14px;
}

.tt-sb-1 {
    margin-bottom: 4px;
    font-weight: 700;
}

    .tt-sb-1 * {
        font-weight: 400;
    }

.tt-sb-2 {
    color: #3c3c3c;
    margin-bottom: 5px;
    font-size: 16px;
    font-weight: 500;
}

.ttl-tb-right {
    width: 22%;
    text-align: right;
    padding-right: 12px;
}

    .ttl-tb-right h6 {
        margin-bottom: 7px !important;
    }

.tc-up-v span {
    background-color: #ff8080;
    padding: 3px;
    display: inline-block;
    height: 100%;
    border-top-left-radius: 8px;
}

    .tc-up-v span svg {
        height: 21px;
        width: 20px;
        padding: 0px;
    }

.new-card-ticket:hover {
    box-shadow: 1px 0px 20px 1px #008ff814;
    border-color: #008ff821;
}

a.kt-tic-list {
    margin-bottom: 16px;
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 8px;
    box-shadow: 2px 4px 5px #e7e7e7;
    transition: border .3s ease-in;
}

    a.kt-tic-list:hover {
        border-right: 18px solid #eb9c39;
    }

.new-lb-v {
    font-size: 11px;
    font-weight: 300;
    text-transform: uppercase;
    line-height: 11px;
    letter-spacing: 2px;
    position: absolute;
    top: 20px;
    left: 0;
    width: 100%;
    text-align: center;
}

.new-card-ticket:hover::after {
    position: absolute;
    content: "";
    width: 40px;
    height: 90px;
    background-color: #fff;
    right: 34px;
    border-radius: 30px;
    display: none;
}

.new-card-ticket:hover {
    box-shadow: 1px 0px 20px 1px #008ff814;
    border-right: 18px solid #008ff8;
}

.up-v-refer-img {
    width: 90px;
    border-radius: 5px;
    overflow: hidden;
}

.up-dtl-info {
    width: 100%;
}

.up-v-refer-img img {
    width: 100%;
}

.up-dtl-card {
    display: flex;
    align-items: center;
    position: relative;
    width: 100%;
    box-shadow: 1px 0px 6px #ccc;
    border-radius: 5px;
    padding: 10px 10px;
    margin-bottom: 20px;
}

.up-dl-ttlv {
    padding: 0px 10px;
}

.up-dtl-up-status svg {
    background-color: #ffffff;
    padding: 2px;
    height: 20px;
    width: 20px;
    position: relative;
    /* left: -4px; */
}

    .up-dtl-up-status svg path {
        fill: #e90000;
    }

.up-dtl-up-status {
    background-color: #fff8f8;
    padding: 0px 3px;
    border-radius: 4px;
    margin-bottom: 5px;
    position: relative;
    left: -2px;
    font-weight: 500;
    color: #f91515;
}

.up-dl-ttlv-v {
    margin: 3px 10px;
    border-top: 1px dashed #ebebeb;
}

.up-dl-ttlv h4 {
    margin-bottom: 3px;
}

span.htv-cnt {
    color: #e31a0c;
    font-size: 16px;
    font-weight: 700;
}

.new-ticket-details {
    display: flex;
    align-items: center;
    border-top: 1px solid #e7e7e7;
    background: #fbf8fb;
    border-radius: 0px 0px 8px 8px;
}

.ticket-store {
    width: 105px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.ticket-created {
    border-left: 1px solid #efedef;
    display: flex;
    align-items: center;
    padding: 2px 10px;
    gap: 6px;
    min-width: 350px;
}

.ticket-assigned {
    border-left: 1px solid #efedef;
    display: flex;
    align-items: center;
    padding: 2px 10px;
    gap: 6px;
}

.kt-ticket-card {
    background: transparent;
    box-shadow: none !important;
}

    .kt-ticket-card .card-body {
        padding: 0px;
    }

.small-title {
    color: #8898aa;
    font-weight: 400;
    font-size: 11.5px
}

.ticket-form {
    color: #100f10;
    font-weight: 500;
}

span.ticketicon svg {
    width: 20px;
    height: 20px;
}

.new-card-ticket:hover {
    border: 0px !important;
}

.ticket-time-weight {
    color: #aeaeae !important;
    font-weight: 400;
}

/*--------------- ticket new css end ------------*/

/*-------------ticket history design css------*/
.card-data-historical {
    background-color: #fff;
    margin-bottom: 10px;
    padding: 5px;
    border-radius: 5px;
    box-shadow: 3px 5px 6px #0000000d;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 10px;
    cursor: pointer;
}

.ht-d-data {
    -webkit-transition: all .4s ease-in-out;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -ms-transition: all .4s ease-in-out;
}

    .ht-d-data:hover {
        background-color: #fff;
        box-shadow: 1px 0px 14px 0px #00000029;
        -webkit-transform: scale(1.01);
        transform: scale(1.01);
        -ms-transform: scale(1.01);
        -webkit-transform: scale(1.01)
    }

.t-count {
    padding: 3px;
    background-color: #008ff8;
    border-radius: 4px;
    width: 24px;
    text-align: center;
    color: #fff;
    font-weight: 500;
    font-size: 14px;
}

.t-t-info {
    margin-left: 8px;
    font-weight: 400;
    color: #484848;
    font-size: 14px;
}

.ticket-t-number {
    padding: 5px;
    background-color: #008ff8;
    color: #fff;
    font-weight: 500;
    margin-right: 10px;
}

.ticket-t-v-more a {
    color: #008ff8;
    font-size: 13px;
    font-weight: 400;
}

.tickt-tab-hty {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ht-d-data {
    border: 1px solid #e7e7e7;
    border-radius: 5px;
    overflow: hidden;
    padding-right: 10px;
    margin-bottom: 19px;
}

.historical-data-load {
    background-color: #fff;
    padding: 25px 20px;
    border-radius: 5px;
    margin-bottom: 10px;
    box-shadow: 3px 5px 6px #0000000d;
}

.loade-more-v-btn.text-center span {
    color: #8f8e8e;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}

    .loade-more-v-btn.text-center span:hover {
        color: #008ff8;
    }

.loade-more-v-btn.text-center {
    padding-top: 12px;
}

.historical-data-load {
    display: none;
}

.svg-ic-tgl svg {
    -moz-transition: all .5s linear;
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
}

.card-data-historical.active svg {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.card-data-alert {
    background-color: #f1e1e1;
    margin-bottom: 10px;
    padding: 5px;
    border-radius: 5px;
    box-shadow: 3px 5px 6px #0000000d;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 10px;
    cursor: pointer;
    border: 2px solid #ecc5c5;
    margin-top: 10px;
}

    .card-data-alert .right-btn-toggle {
        display: none;
    }

.kt-widget__media.kt-hidden-.img-tic {
    border: 2px solid #d9d9d9;
    border-radius: 5px;
    margin: 0.5rem !important;
}

.kt-widget--user-profile-3 .kt-widget__top {
    align-items: center !important;
}

.icon-shape.tktid {
    color: #008ff8;
    font-size: 14px;
    font-weight: 600;
    padding: 0px;
}

.left-border-badge {
    background-color: #008ff8 !important;
    color: #fff !important;
    text-align: center;
    border-radius: 6px 0px 0px 6px;
}

.ticket-status {
    width: 100%;
    background-color: #fff;
    padding: 10px 10px;
    padding-top: 25px;
    padding-bottom: 15px;
    border-radius: 5px;
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    box-shadow: 0px 0px 0px 2px #acacac1f;
    font-weight: 400;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
}

.track {
    position: relative;
}

ul.track {
    margin-bottom: 0px;
    padding-left: 0px;
    display: inline-flex;
    width: 100%;
    align-items: center;
}

.track li {
    list-style: none;
    float: left;
    width: 33.3333%;
    position: relative;
    text-align: center;
    text-transform: uppercase;
}


    .track li:before {
        content: "";
        width: 50px;
        height: 50px;
        border: 8px solid #d4d4d4;
        border-radius: 50%;
        display: block;
        text-align: center;
        line-height: 50px;
        margin: 10px auto 10px auto;
        background: #9b9b9b;
        color: #000;
        transition: all ease-in-out .3s;
        cursor: pointer;
        z-index: 9;
        position: relative;
    }

    .track li:after {
        content: "";
        position: absolute;
        width: 100%;
        height: 1px;
        background-color: #fff;
        border: 1px dashed #9b9b9b;
        top: 35px;
        left: -50%;
        transition: all ease-in-out .3s;
    }

    .track li:first-child:after {
        content: none;
    }

    .track li.active {
        color: #555555;
    }

        .track li.active:before {
            background: #008ff8;
            color: #F1F1F1;
            border: 8px solid #d4ecfe;
            font: normal normal normal 16px / 1 "LineAwesome";
            content: "\f17b";
            font-size: 16px;
            line-height: 2;
            font-weight: bold;
        }

        .track li.active + li:after {
            background: #fff;
            border: 1px dashed #008ff8;
        }

.track-title {
    color: #9b9b9b;
    position: absolute;
    top: -15%;
    left: 34%;
    font-weight: 500;
    width: 30%;
}

.track-time {
    color: #9b9b9b;
    font-weight: 500;
    min-height: 39px;
}

.active .track-title {
    color: #008ff8;
}

.head-title {
    font-size: 1.2rem;
    font-weight: 500;
    color: #48465b;
}

.head-title-dark {
    color: #48465b;
}

.up-v-refer-img {
    width: 110px;
    border-radius: 5px;
    overflow: visible;
}

    .up-v-refer-img img {
        width: 110px;
        border-radius: 8px;
        object-fit: cover;
        border: 1px solid #d9d9d9;
    }

.up-dl-ttlv h4 {
    color: #1a1a1a;
}

ul.comment-list {
    margin-bottom: 0px;
    padding-left: 0px;
}

.comments-item {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 10px;
    width: 100%;
    margin-bottom: 18px;
}

    .comments-item .user-img {
        width: 43px;
        height: 43px;
        background-color: #ccc;
        border-radius: 50%;
    }

        .comments-item .user-img img {
            border-radius: 50%;
            width: 43px;
            height: 43px;
        }

        .comments-item .user-img span {
            color: #ffffff !important;
            background-color: #eb9c39 !important;
            border-radius: 50% !important;
            font-weight: 600;
            font-size: 15px;
            line-height: 1;
            width: 43px !important;
            max-width: 43px !important;
            height: 43px !important;
            text-align: center;
            display: flex;
            margin: 0;
            align-items: center;
            justify-content: center;
            letter-spacing: 0;
        }

    .comments-item .user-name {
        font-size: 12px;
        color: #000;
        font-weight: 500;
    }

    .comments-item .user-time {
        font-size: 12px;
        color: #7b7b7b;
        margin-left: 10px;
        font-weight: 500;
    }

    .comments-item .user-comment {
        background: #fff;
        border-radius: 10px;
        font-size: 14px;
        color: #392f2f;
        padding: 12px;
    }

        .comments-item .user-comment p {
            margin-bottom: 0px;
        }

.add-comment textarea.form-control {
    height: auto;
    border: 2px solid #dbdbdb;
    border-radius: 10px;
    background-color: #f4f4f4;
}
/*.Buttonhide {
    display: none;
}*/
/*-----end--------ticket history design css------*/
/*--new sidebar--*/
.aside.aside-dark {
    background-color: #1e1e2d;
}

.aside {
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 28px 0 rgba(82,63,105,.05);
    padding: 0;
}

.aside-dark .hover-scroll-overlay-y {
    --scrollbar-space: 0.4rem;
    scrollbar-color: #3b3b64 transparent;
    /*height: 775px;*/
    height: calc(100vh - 140px);
    scrollbar-width: thin;
}

.hover-scroll-overlay-y {
    overflow-y: auto;
    position: relative;
    --scrollbar-space: 0.5rem;
}

.menu-column {
    flex-direction: column;
    width: 100%;
}

.menu, .menu-wrapper {
    display: flex;
    padding: 0;
    margin: 0;
    list-style: none;
}

.aside-menu .menu-item {
    padding: 0;
}

.menu-item {
    display: block;
    padding: 0;
}


.aside-dark .menu .menu-item.active > .menu-link {
    transition: color .2s ease,background-color .2s ease;
    background-color: #1b1b28;
    color: #fff;
}

.aside-dark .menu .menu-item .menu-link {
    color: #9899ac;
}

.aside-menu .menu .menu-item .menu-content, .aside-menu .menu .menu-item .menu-link {
    padding-left: 25px;
    padding-right: 25px;
}

.kt-header__brand-logo-default {
    width: 130px;
}

    .kt-header__brand-logo-default.s-logo {
        width: 25px;
    }

    .kt-header__brand-logo-default.mobile {
        width: 95px;
    }

.menu-state-bullet-primary .menu-item.show > .menu-link {
    transition: color .2s ease,background-color .2s ease;
}

.menu-state-icon-primary .menu-item.show > .menu-link {
    transition: color .2s ease,background-color .2s ease;
}

.menu-state-title-primary .menu-item.show > .menu-link {
    transition: color .2s ease,background-color .2s ease;
    color: #eb9c39;
}

.aside-menu .menu-item .menu-link {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.menu-title-gray-800 .menu-item .menu-link {
    color: #3f4254;
}

.menu-item .menu-link {
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 0;
    flex: 0 0 100%;
    padding: 0.65rem 1rem;
    transition: none;
    outline: 0 !important;
}

.aside-dark .menu .menu-item.show > .menu-link .menu-icon, .aside-dark .menu .menu-item.show > .menu-link .menu-icon .svg-icon, .aside-dark .menu .menu-item.show > .menu-link .menu-icon i {
    color: #eb9c39;
}

.aside-dark .menu .menu-item.active > .menu-link .menu-icon, .aside-dark .menu .menu-item.active > .menu-link .menu-icon .svg-icon, .aside-dark .menu .menu-item.active > .menu-link .menu-icon i {
    color: #eb9c39;
}

.aside-dark .menu .menu-item .menu-link .menu-icon, .aside-dark .menu .menu-item .menu-link .menu-icon .svg-icon, .aside-dark .menu .menu-item .menu-link .menu-icon i {
    color: #f0f0f0;
}

.menu-state-icon-primary .menu-item.show > .menu-link .menu-icon, .menu-state-icon-primary .menu-item.show > .menu-link .menu-icon .svg-icon, .menu-state-icon-primary .menu-item.show > .menu-link .menu-icon i {
    color: #eb9c39;
}

.aside-menu .menu-item .menu-icon {
    justify-content: flex-start;
}

.menu-item .menu-link .menu-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    margin-right: 0.5rem;
}

.aside-dark .menu .menu-item.active > .menu-link .menu-title {
    color: #fff;
}

.aside-dark .menu .menu-item .menu-link .menu-title {
    color: #a0b6bd;
}

.menu-title-gray-800 .menu-item .menu-link .menu-title {
    color: #3f4254;
}

.menu-item .menu-link .menu-title {
    display: flex;
    align-items: center;
    flex-grow: 1;
}

.menu-item .menu-link .menu-arrow {
    display: flex;
    align-items: stretch;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    margin-left: 0.5rem;
    width: 0.8rem;
    height: 0.8rem;
}

.aside-menu .menu .menu-sub:not([data-popper-placement]) > .menu-inner > .menu-item > .menu-content, .aside-menu .menu .menu-sub:not([data-popper-placement]) > .menu-inner > .menu-item > .menu-link, .aside-menu .menu .menu-sub:not([data-popper-placement]) > .menu-item > .menu-content, .aside-menu .menu .menu-sub:not([data-popper-placement]) > .menu-item > .menu-link {
    padding-left: calc(0.75rem + 25px);
}

.aside-dark .menu .menu-item .menu-link {
    color: #9899ac;
}

.aside-menu .menu .menu-item .menu-content, .aside-menu .menu .menu-item .menu-link {
    padding-left: 25px;
    padding-right: 25px;
}

.menu-sub:not([data-popper-placement]) > .menu-inner > .menu-item > .menu-content, .menu-sub:not([data-popper-placement]) > .menu-inner > .menu-item > .menu-link, .menu-sub:not([data-popper-placement]) > .menu-item > .menu-content, .menu-sub:not([data-popper-placement]) > .menu-item > .menu-link {
    padding-left: calc(1rem + 1rem);
}

.aside-menu .menu-item .menu-link {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.menu-title-gray-800 .menu-item .menu-link {
    color: #3f4254;
}

.menu-item .menu-link {
    cursor: pointer;
    display: flex;
    align-items: center;
    padding: 0;
    flex: 0 0 100%;
    padding: 0.65rem 1rem;
    transition: none;
    outline: 0 !important;
}

    .menu-item .menu-link .menu-bullet {
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 1.25rem;
        margin-right: 0.5rem;
    }

.aside-dark .menu .menu-item .menu-link .menu-bullet .bullet {
    background-color: #9899ac;
}



.bullet {
    display: inline-block;
    background-color: #b5b5c3;
    border-radius: 6px;
    width: 8px;
    height: 4px;
    flex-shrink: 0;
}

.bullet-dot {
    width: 4px;
    height: 4px;
    border-radius: 100% !important;
    transition: all 0.15s ease-in-out;
}


.menu-state-bullet-primary .menu-item.hover:not(.active) > .menu-link:not(.disabled):not(.active):not(.active), .menu-state-bullet-primary .menu-item:not(.active) .menu-link:hover:not(.disabled):not(.active):not(.active) {
    transition: color .2s ease,background-color .2s ease;
}

.menu-state-icon-primary .menu-item.hover:not(.active) > .menu-link:not(.disabled):not(.active):not(.active), .menu-state-icon-primary .menu-item:not(.active) .menu-link:hover:not(.disabled):not(.active):not(.active) {
    transition: color .2s ease,background-color .2s ease;
}

.menu-state-title-primary .menu-item.hover:not(.active) > .menu-link:not(.disabled):not(.active):not(.active), .menu-state-title-primary .menu-item:not(.active) .menu-link:hover:not(.disabled):not(.active):not(.active) {
    transition: color .2s ease,background-color .2s ease;
    color: #eb9c39;
}

.aside-dark .menu .menu-item .menu-link {
    color: #9899ac;
}

.hover-scroll-overlay-y::-webkit-scrollbar {
    width: calc(0.4rem + 0.4rem);
}


.hover-scroll-overlay-y::-webkit-scrollbar-thumb {
    background-clip: content-box;
    border-right: 0.4rem solid transparent;
}

.kt-header__topbar .kt-header__topbar-item .kt-header__topbar-icon i {
    color: #a1a5b7;
}

.kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--user .kt-header__topbar-username {
    color: #343a40;
    text-align: right;
}

.kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--search .kt-quick-search .kt-quick-search__form .input-group {
    border-radius: 8px;
    background-color: #ffffff;
    border: 1px solid #a1a5b7;
}

.kt-header .kt-header__top {
    background: #ffffff;
}

    .kt-header .kt-header__top .kt-container {
        justify-content: flex-end;
    }

.aside-dark .menu .menu-item .menu-link .menu-arrow:after {
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 9' fill='%239899ac'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.06463 4.42111C1.96161 4.22088 1.9809 3.9637 2.12863 3.78597L5.12847 0.177181C5.31402 -0.046034 5.63049 -0.060261 5.83532 0.145404C6.04015 0.351069 6.05578 0.698744 5.87023 0.921959L3.19406 4.14137L5.84414 7.06417C6.03896 7.27904 6.03835 7.62686 5.84278 7.84105C5.64721 8.05524 5.33073 8.05469 5.13591 7.83982L2.14806 4.54449C2.1141 4.50704 2.08629 4.46541 2.06463 4.42111Z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 9' fill='%239899ac'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.93537 4.57889C6.03839 4.77912 6.0191 5.0363 5.87137 5.21403L2.87153 8.82282C2.68598 9.04603 2.36951 9.06026 2.16468 8.8546C1.95985 8.64893 1.94422 8.30126 2.12977 8.07804L4.80594 4.85863L2.15586 1.93583C1.96104 1.72096 1.96165 1.37314 2.15722 1.15895C2.35279 0.944757 2.66927 0.945311 2.86409 1.16018L5.85194 4.45551C5.8859 4.49296 5.91371 4.53459 5.93537 4.57889Z'/%3e%3c/svg%3e");
}

.menu-arrow-gray-500 .menu-item .menu-link .menu-arrow:after {
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 9' fill='%239899ac'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.06463 4.42111C1.96161 4.22088 1.9809 3.9637 2.12863 3.78597L5.12847 0.177181C5.31402 -0.046034 5.63049 -0.060261 5.83532 0.145404C6.04015 0.351069 6.05578 0.698744 5.87023 0.921959L3.19406 4.14137L5.84414 7.06417C6.03896 7.27904 6.03835 7.62686 5.84278 7.84105C5.64721 8.05524 5.33073 8.05469 5.13591 7.83982L2.14806 4.54449C2.1141 4.50704 2.08629 4.46541 2.06463 4.42111Z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 9' fill='%239899ac'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.93537 4.57889C6.03839 4.77912 6.0191 5.0363 5.87137 5.21403L2.87153 8.82282C2.68598 9.04603 2.36951 9.06026 2.16468 8.8546C1.95985 8.64893 1.94422 8.30126 2.12977 8.07804L4.80594 4.85863L2.15586 1.93583C1.96104 1.72096 1.96165 1.37314 2.15722 1.15895C2.35279 0.944757 2.66927 0.945311 2.86409 1.16018L5.85194 4.45551C5.8859 4.49296 5.91371 4.53459 5.93537 4.57889Z'/%3e%3c/svg%3e");
}

.menu-item .menu-link .menu-arrow:after {
    display: block;
    width: 100%;
    content: " ";
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 9' fill='%239899ac'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M2.06463 4.42111C1.96161 4.22088 1.9809 3.9637 2.12863 3.78597L5.12847 0.177181C5.31402 -0.046034 5.63049 -0.060261 5.83532 0.145404C6.04015 0.351069 6.05578 0.698744 5.87023 0.921959L3.19406 4.14137L5.84414 7.06417C6.03896 7.27904 6.03835 7.62686 5.84278 7.84105C5.64721 8.05524 5.33073 8.05469 5.13591 7.83982L2.14806 4.54449C2.1141 4.50704 2.08629 4.46541 2.06463 4.42111Z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: center;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 9' fill='%239899ac'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M5.93537 4.57889C6.03839 4.77912 6.0191 5.0363 5.87137 5.21403L2.87153 8.82282C2.68598 9.04603 2.36951 9.06026 2.16468 8.8546C1.95985 8.64893 1.94422 8.30126 2.12977 8.07804L4.80594 4.85863L2.15586 1.93583C1.96104 1.72096 1.96165 1.37314 2.15722 1.15895C2.35279 0.944757 2.66927 0.945311 2.86409 1.16018L5.85194 4.45551C5.8859 4.49296 5.91371 4.53459 5.93537 4.57889Z'/%3e%3c/svg%3e");
}

.menu-item.menu-accordion[aria-expanded="true"] > .menu-link .menu-arrow:after {
    transform: rotateZ(90deg);
    transition: transform .3s ease;
}

.menu-item.menu-accordion[aria-expanded="false"] > .menu-link .menu-arrow:after {
    transition: transform .3s ease;
}

span.svg-icon {
    color: #a1a5b7;
}

.aside-toggle span.svg-icon {
    line-height: 1;
}

    .aside-toggle span.svg-icon svg {
        width: 20px;
        height: 20px;
    }

.aside-toggle:hover .svg-icon {
    color: #eb9c39;
    transition: transform .3s ease;
}

.toggled .aside-toggle .svg-icon {
    color: #eb9c39;
}

.pb-2 {
    padding-bottom: 0.5rem !important;
}

.pt-8 {
    padding-top: 2rem !important;
}

.aside-dark .menu .menu-item.hover:not(.active) > .menu-link:not(.disabled):not(.active):not(.active) .menu-bullet .bullet, .aside-dark .menu .menu-item:not(.active) .menu-link:hover:not(.disabled):not(.active):not(.active) .menu-bullet .bullet {
    background-color: #eb9c39;
    width: 6px;
    height: 6px;
}

.aside-dark .menu .menu-item.hover:not(.active) > .menu-link:not(.disabled):not(.active):not(.active) .menu-title, .aside-dark .menu .menu-item:not(.active) .menu-link:hover:not(.disabled):not(.active):not(.active) .menu-title {
    color: #fff;
}

.aside-dark .menu .menu-item.hover:not(.active) > .menu-link:not(.disabled):not(.active):not(.active) .menu-icon, .aside-dark .menu .menu-item.hover:not(.active) > .menu-link:not(.disabled):not(.active):not(.active) .menu-icon .svg-icon, .aside-dark .menu .menu-item.hover:not(.active) > .menu-link:not(.disabled):not(.active):not(.active) .menu-icon i, .aside-dark .menu .menu-item:not(.active) .menu-link:hover:not(.disabled):not(.active):not(.active) .menu-icon, .aside-dark .menu .menu-item:not(.active) .menu-link:hover:not(.disabled):not(.active):not(.active) .menu-icon .svg-icon, .aside-dark .menu .menu-item:not(.active) .menu-link:hover:not(.disabled):not(.active):not(.active) .menu-icon i {
    color: #eb9c39;
}

.aside-dark .menu .menu-item.hover:not(.active) > .menu-link:not(.disabled):not(.active):not(.active), .aside-dark .menu .menu-item:not(.active) .menu-link:hover:not(.disabled):not(.active):not(.active) {
    transition: color .2s ease,background-color .2s ease;
    background-color: #1b1b28;
    color: #fff;
}

.aside-dark .menu .menu-item.menu-accordion[aria-expanded="true"]:not(.active) .menu-link:not(.disabled):not(.active):not(.active) {
    transition: color .2s ease,background-color .2s ease;
    background-color: #1b1b28;
    color: #fff;
}

.menu-item.menu-accordion[aria-expanded="true"] .menu-link {
    transition: color .2s ease,background-color .2s ease;
    color: #eb9c39;
}

.aside-dark .menu .menu-item.menu-accordion[aria-expanded="true"]:not(.active) .menu-link:not(.disabled):not(.active):not(.active) .menu-icon, .aside-dark .menu .menu-item.menu-accordion[aria-expanded="true"] .menu-link .menu-icon .svg-icon {
    color: #eb9c39;
}

.aside-dark .menu .menu-item.menu-accordion[aria-expanded="true"]:not(.active) .menu-link:not(.disabled):not(.active):not(.active) .menu-title {
    color: #fff;
}

.aside-dark .menu .menu-item.menu-accordion[aria-expanded="true"]:not(.active) .menu-sub .menu-link:not(.disabled):not(.active):not(.active) .menu-title {
    color: #9899ac;
}

.aside-dark .menu .menu-item .menu-sub .menu-link:hover .menu-title {
    color: #fff !important;
}

.aside-dark .menu .menu-item .menu-section {
    color: #a0b6bd !important;
}

.text-muted {
    color: #a1a5b7 !important;
}

.ls-1 {
    letter-spacing: .1rem !important;
}

.fs-8 {
    font-size: .85rem !important;
}

.svg-icon.svg-icon-2 svg {
    height: 22px !important;
    width: 22px !important;
}

.kt-header--fixed {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transition: height 0.3s ease;
    transition: height 0.3s ease;
    z-index: 2;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 100;
    background-color: #fff;
    box-shadow: 0 10px 30px 0 rgba(82,63,105,.05);
    height: 65px;
    padding: 0;
}

#kt_header {
    left: 250px;
    transition: left .3s ease;
}

.toggled #kt_header {
    left: 75px;
    transition: left .3s ease;
}

.kt-header__top {
    padding: 10px 0px;
}

    .kt-header__top .kt-header-main {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

.btn.btn-active-light-primary:hover:not(.btn-active), .show > .btn.btn-active-light-primary {
    color: #eb9c39;
    border-color: #f1faff;
    background-color: #f1faff !important;
}

.btn.btn-active-light-primary:hover .svg-icon {
    color: #eb9c39;
}

.kt-header__topbar .kt-header__topbar-item .kt-header__topbar-icon {
    border-radius: 10%;
}

.kt-header__topbar .kt-header__topbar-item:hover .kt-header__topbar-icon, .kt-header__topbar .kt-header__topbar-item.show .kt-header__topbar-icon {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    background-color: #7dcaf5;
    border: 1px solid #7bbee0;
}

.kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--search .kt-quick-search .kt-quick-search__form i {
    color: #a1a5b7;
}

.kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--search .kt-quick-search .kt-quick-search__form .form-control {
    color: #1e1e2d;
}

.card-icn1 svg {
    color: #0372dd;
}

.card-icn2 svg {
    color: #26d476;
}

.card-icn3 svg {
    color: #ffd646;
}

.card-icn4 svg {
    color: #ab02e5;
}

.card1 .text-success {
    color: #00891c !important;
}

.card1 .text-primary {
    color: #5902ff !important;
}

.kt-header__topbar .kt-header__topbar-item:hover .kt-header__topbar-icon, .kt-header__topbar .kt-header__topbar-item.show .kt-header__topbar-icon {
    transition: all 0.3s;
    background-color: #f9ecdb;
    border: 1px solid #f9ecdb;
}

    .kt-header__topbar .kt-header__topbar-item:hover .kt-header__topbar-icon i, .kt-header__topbar .kt-header__topbar-item.show .kt-header__topbar-icon i {
        color: #eb9c39;
    }

.kt-header__topbar .kt-header__topbar-item .kt-header__topbar-icon {
    border-radius: 10%;
    position: relative;
}

.not-count {
    position: absolute;
    border-radius: 50%;
    background-color: #eb9c39;
    color: #ff8e00;
    border: 1px solid #ffdeb5;
    width: 10px;
    height: 10px;
    text-align: center;
    font-size: 12px;
    font-weight: 500;
    top: 4px;
    right: 6px;
    line-height: 20px;
    animation: blink 1s infinite;
}

@keyframes blink {
    0% {
        opacity: 0
    }

    49% {
        opacity: 0
    }

    50% {
        opacity: 1
    }
}

.kt-header__topbar {
    gap: 4px;
}

    .kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--search .kt-quick-search .kt-quick-search__form .input-group {
        border-radius: 8px;
        background-color: #ffffff;
        border: 1px solid #efefef;
        box-shadow: 2px 2px 6px #efefef;
    }

    .kt-header__topbar .kt-header__topbar-item .kt-header__topbar-icon i {
        color: #343a40;
    }

@media (min-width: 768px) {
    .events__item-main {
        width: 100%;
    }

    .kt-wrapper {
        padding-top: 80px;
    }

    .kt-media span.initial-box {
        width: 34px;
        height: 34px;
    }

    .kt-media.kt-media--circle {
        align-items: center;
    }

    .sticky-card {
        position: -webkit-sticky;
        position: sticky;
        top: 6rem;
    }
}

@media (min-width: 992px) {
    .toggled .aside {
        width: 75px;
        transition: width .3s ease;
    }

        .toggled .aside .aside-menu .menu-content, .toggled .aside .aside-menu .menu-title {
            opacity: 0;
            transition: opacity .3s ease;
            display: none;
        }

        .toggled .aside .aside-menu .menu-arrow {
            opacity: 0;
            transition: opacity .3s ease;
            display: none;
        }

    /*    .aside.aside-hoverable:hover:not(.animating) {
        transition: width .3s ease;
        width: 250px;
        box-shadow: 5px 0 10px rgba(70,78,95,.075);
    }*/
    .kt-header__brand-logo-default.s-logo {
        display: none;
    }

    .toggled .kt-header__brand-logo-default.s-logo {
        display: block;
    }

    .toggled .aside .aside-menu .sub-menu.show .menu-title {
        opacity: 1;
        display: block;
    }

    .toggled .collapsing {
        height: 0px !important;
        transition: none;
    }

    .sub-menu-title {
        display: none;
    }

    .toggled .sub-menu-title {
        display: block;
        color: #fff;
        font-size: 14px;
        font-weight: 600;
        padding-left: 8px;
    }

    .toggled .svg-icon.svg-icon-2 svg {
        height: 25px !important;
        width: 25px !important;
    }

    .toggled .menu-sub.menu-sub-accordion.sub-menu.collapse .menu-link {
        padding-left: 14px;
    }

    .toggled .menu-sub.menu-sub-accordion.sub-menu.collapse .menu-title {
        color: #e7e7e7 !important;
    }

    .toggled .menu-sub.menu-sub-accordion.sub-menu.collapse.show {
        position: fixed !important;
        /*        transform: translate3d(88px, 120px, 0) !important;*/
        top: 80px !important;
        left: 90px !important;
        background-color: #1b1b28;
        box-shadow: 0 0 50px #523f6926;
        border-radius: 6px;
        padding: 14px 0px;
        min-width: 20rem;
        animation: fadeshowEffect 0.3s ease-out;
    }

    @keyframes fadeshowEffect {
        from {
            transform: translate(-50px, 0px);
        }

        to {
            transform: none;
        }
    }

    .toggled #Checklist2.menu-sub.menu-sub-accordion.sub-menu.collapse.show {
        top: 110px !important;
    }

    .toggled #Checklist3.menu-sub.menu-sub-accordion.sub-menu.collapse.show {
        top: 160px !important;
    }

    .toggled #Checklist4.menu-sub.menu-sub-accordion.sub-menu.collapse.show {
        top: 200px !important;
    }

    .toggled #Checklist5.menu-sub.menu-sub-accordion.sub-menu.collapse.show {
        top: 180px !important;
    }

    .toggled #Checklist6.menu-sub.menu-sub-accordion.sub-menu.collapse.show {
        top: 270px !important;
    }

    .toggled #Checklist7.menu-sub.menu-sub-accordion.sub-menu.collapse.show {
        top: 300px !important;
    }

    .aside-dark .hover-scroll-overlay-y::-webkit-scrollbar-thumb {
        background-color: #3b3b64;
    }

    div::-webkit-scrollbar, main::-webkit-scrollbar, ol::-webkit-scrollbar, pre::-webkit-scrollbar, span::-webkit-scrollbar, ul::-webkit-scrollbar {
        width: 0.4rem;
        height: 0.4rem;
    }

    div::-webkit-scrollbar-thumb, main::-webkit-scrollbar-thumb, ol::-webkit-scrollbar-thumb, pre::-webkit-scrollbar-thumb, span::-webkit-scrollbar-thumb, ul::-webkit-scrollbar-thumb {
        background-color: #eff2f5;
    }

    .aside .aside-logo {
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 65px;
        padding: 0 25px;
        background: #1b1b28;
    }

    .aside .aside-menu {
        width: 100%;
    }

    .aside {
        width: 250px;
        transition: width .3s ease;
    }

    .aside-fixed .aside {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 101;
        overflow: visible;
    }

    .aside.aside-dark {
        background-color: #1e1e2d;
    }

    .aside {
        width: 250px;
        transition: width .3s ease;
    }

    .aside {
        display: flex;
        flex-direction: column;
        box-shadow: 0 0 28px 0 rgba(82,63,105,.05);
        padding: 0;
    }

    .aside-enabled.aside-fixed .kt-wrapper {
        transition: padding-left .3s ease;
        padding-left: 250px;
    }

    .aside-enabled.aside-fixed .toggled .kt-wrapper {
        transition: padding-left .3s ease;
        padding-left: 75px;
    }

    .header-fixed .kt-wrapper {
        padding-top: 65px;
    }

    .toggled .aside .aside-logo .logo {
        display: none;
    }

    .aside:not(.aside-hoverable) .aside-logo .s-logo, .aside:not(:hover) .aside-logo .s-logo {
        display: none;
    }

    /*    .aside.aside-hoverable:hover .aside-logo .s-logo {
        display: none;
    }*/

    .toggled .aside:not(.aside-hoverable) .aside-logo .s-logo, .toggled .aside:not(:hover) .aside-logo .s-logo {
        display: block;
    }


    .toggled .rotate-180 {
        transform: rotateZ(180deg);
        transition: transform .3s ease;
    }

    #kt_aside_toggle {
        display: inline-flex;
        background: #f9ecdb;
        position: absolute;
        right: -13px;
    }

    .aside-toggle.btn.btn-icon {
        height: 2rem;
        width: 2rem !Important;
    }

    #kt_aside_mobile_toggle_close {
        display: none;
    }

    /*.kt-wrapper {
        padding-top: calc(65px + 55px);
    }*/
}

@media (min-width: 1024px) {
    .sticky-card {
        position: sticky !important;
        top: 6rem;
    }
}

@media (min-width: 375px) and (max-width: 1024px) {
    .kt-header--fixed {
        background-color: #1e1e2d;
    }
}

@media (max-width: 1024px) {
    .aside .aside-logo {
        display: flex;
        justify-content: space-between;
        align-items: center;
        height: 65px;
        padding: 0 25px;
    }

    #kt_header, .toggled #kt_header {
        left: 0px;
    }

    .kt-header__topbar {
        padding: 0 15px;
        background-color: transparent;
        -webkit-transition: all 0.3s ease;
        transition: all 0.3s ease;
        height: 50px;
        position: absolute;
        left: 0;
        right: 0;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        width: 100%;
        border-top: 1px solid transparent;
        display: flex;
    }

        .kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--search {
            justify-content: flex-end;
        }

    .kt-header-mobile--fixed .kt-header__topbar {
        position: relative;
        z-index: 96;
    }

    .kt-header__brand .kt-header__brand-logo {
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .aside-fixed .aside {
        position: fixed;
        top: 0;
        bottom: 0;
        left: -265px;
        z-index: 101;
        overflow: hidden;
        transition: all .3s ease;
    }

    .mobile-toggled .aside {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0px;
        z-index: 101;
        overflow: hidden;
        transition: all .3s ease;
        width: 250px;
    }

    .aside-enabled.aside-fixed .kt-wrapper {
        padding-left: 5px;
    }

    #kt_aside_toggle {
        display: none;
    }

    #kt_aside_mobile_toggle_close {
        display: block;
    }

    .mobile-toggled .aside-mobile {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0px;
        z-index: 101;
        overflow: hidden;
        transition: width .3s ease;
        background-color: #1e1e2da1;
        width: 100%;
    }

    .kt-header-mobile--fixed .kt-wrapper {
        padding-top: 80px;
    }

    .kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--search .kt-quick-search {
        max-width: 300px;
        width: auto;
        margin-right: 0.25rem;
    }

        .kt-header__topbar .kt-header__topbar-item.kt-header__topbar-item--search .kt-quick-search .kt-quick-search__form .input-group {
            box-shadow: none;
        }

    .kt-header__topbar .kt-header__topbar-item .kt-header__topbar-icon {
        border: none;
    }

        .kt-header__topbar .kt-header__topbar-item .kt-header__topbar-icon i {
            color: #ffffff;
        }

    .not-count {
        border: 1px solid #eb9c39;
        top: 1px;
        right: 3px;
    }
}

.card-toolbar {
    justify-content: flex-end;
}

ul#kt_chart_widget_8_tabs {
    display: flex;
}

.kt-header--minimize .kt-header--fixed {
    box-shadow: 0 10px 30px 0 rgba(82,63,105,.05);
}

.card {
    box-shadow: 2px 4px 5px #e7e7e7;
}

.card1 {
    background: #ffffff;
    padding: 0.5rem !important;
    box-shadow: 2px 4px 5px #e7e7e7;
    min-height: 68px;
}

/*    .card1::before {
        content: "";
        position: absolute;
        width: 2%;
        left: -2px;
        height: 70%;
        border-radius: 24px;
    }*/

.card-location.card1::before {
    background-color: #0372dd;
}

.card-check.card1::before {
    background-color: #26d476;
}

.card-team.card1::before {
    background-color: #ffd646;
}

.card-ticket.card1::before {
    background-color: #ab02e5;
}

.card-icn {
    box-shadow: none;
}

.card-title {
    color: #000;
    font-weight: normal;
}

.card-graph {
    padding: 1px 3px;
    border-radius: 5px;
    font-size: 11px;
    margin-left: 4px;
    display: none;
}

    .card-graph svg {
        width: 12px;
        height: 12px;
    }

.card-location .card-graph {
    color: #0372dd;
    background: #e5f0fb;
}

.card-check .card-graph {
    color: #04ad52;
    background: #cbf7df;
}

.card-team .card-graph {
    color: #eb9c39;
    background: #fff3c9;
}

.card-ticket .card-graph {
    color: #ab02e5;
    background: #f7e6fd;
}

.card-flush {
    position: relative;
}

    .card-flush::before {
        content: "";
        position: absolute;
        width: 4px;
        left: -2px;
        top: 13px;
        height: 30px;
        border-radius: 24px;
        background-color: #eb9c39;
    }

p#selected_date_display {
    color: #343a40;
}

.events__tag.bg-info {
    background-color: #ffe6c8 !important;
    color: #ff8e00;
}

.btn-primary {
    color: #fff;
    background-color: #eb9c39;
    border-color: #eb9c39;
    color: #ffffff;
}

    .btn-primary:hover {
        color: #fff;
        background-color: #d79139;
        border-color: #d79139;
    }

    .btn-primary:focus, .btn-primary.focus {
        color: #fff;
        background-color: #d79139;
        border-color: #d79139;
        -webkit-box-shadow: 0 0 0 0.2rem rgba(113, 126, 226, 0.5);
        box-shadow: 0 0 0 0.2rem rgba(113, 126, 226, 0.5);
    }

    .btn-primary.disabled, .btn-primary:disabled {
        color: #fff;
        background-color: #eb9c39;
        border-color: #eb9c39;
    }

.kt-header__topbar-item.kt-header__topbar-item--search {
    display: none;
}

.ticks-grad {
    background: #1e1e2d;
}

.example_icon {
    background: #eb9c3924;
}

span.example_icon svg {
    color: #eb9c39;
}

.tc-tl-no {
    background-color: #eb9c39;
}

.new-card-ticket:hover {
    border-right: 18px solid #eb9c39;
}

.new-card-ticket .text-info {
    color: #eb9c39 !important;
}

.tc-up-v {
    background-color: #ffc9c9;
}

.page-item.active .page-link {
    background-color: #1b1b28;
    border-color: #1b1b28;
}

.page-link {
    color: #1b1b28;
}

    .page-link:hover {
        color: #1b1b28;
        background-color: #1b1b2824;
        border-color: #17172100;
    }

.btn-sort.active, .btn-sort.active .ordr-a {
    color: #1e1e2d;
}

.left-border-badge {
    background-color: #eb9c39 !important;
}

.icon-shape.tktid {
    color: #eb9c39;
}

.tktid .text-info {
    color: #eb9c39 !important;
}

.t-count {
    background-color: #eb9c39;
}

.ticket-t-number {
    background-color: #eb9c39;
}

.track li.active:before {
    background: #eb9c39;
    border: 8px solid #f9dcb8;
}

.track li.active + li:after {
    border: 1px dashed #eb9c39;
}

.active .track-title {
    color: #eb9c39;
}

.btn-info {
    background-color: #1b1b28;
    border-color: #1b1b28;
}

    .btn-info:hover {
        color: #fff;
        background-color: #000000;
        border-color: #000000;
    }

    .btn-info:not(:disabled):not(.disabled):active, .btn-info:not(:disabled):not(.disabled).active, .show > .btn-info.dropdown-toggle {
        color: #fff;
        background-color: #000000;
        border-color: #000000;
    }

a:hover {
    color: #1b1b28;
}

.dataTables_wrapper .pagination .page-item.active > .page-link {
    background: #1b1b28;
    color: #ffffff;
}

.dataTables_wrapper .pagination .page-item:hover > .page-link {
    background: #000000;
    color: #ffffff;
}

.dataTables_wrapper .pagination .page-item.previous > .page-link:hover, .dataTables_wrapper .pagination .page-item.next > .page-link:hover, .dataTables_wrapper .pagination .page-item.last > .page-link:hover, .dataTables_wrapper .pagination .page-item.first > .page-link:hover {
    background: #1b1b28;
    color: #ffffff;
}

.btn-brand {
    color: #fff;
    background-color: #1b1b28;
    border-color: #1b1b28;
    color: #ffffff;
}

    .btn-brand:hover {
        color: #fff;
        background-color: #000000;
        border-color: #000000;
    }

.show > .btn.btn-brand.btn-elevate, .btn.btn-brand.btn-elevate:focus, .btn.btn-brand.btn-elevate.active, .btn.btn-brand.btn-elevate:active, .btn.btn-brand.btn-elevate:hover {
    -webkit-box-shadow: 0px 9px 16px 0px rgba(113, 106, 202, 0.25) !important;
    box-shadow: 0px 9px 16px 0px rgb(44 44 47 / 25%) !important;
}

.show > .btn.btn-default, .btn.btn-default.active, .btn.btn-default:active, .btn.btn-default:hover {
    color: #ffffff;
    background: #1b1b28;
    border-color: #1b1b28;
}

.dt_btn {
    background-color: #5578eb00;
    border-color: #5578eb00;
    color: #5578eb;
}

    .dt_btn:hover {
        color: #385aca;
        background-color: #385aca00;
    }

.dt_btn-del {
    background-color: #e83e3e00;
    border-color: #e83e3e00;
    color: #e83e3e;
}

    .dt_btn-del:hover {
        color: #bd3232;
        background-color: #bd323200;
    }

.dt_btn-view {
    background-color: #716aca00;
    border-color: #716aca00;
    color: #716aca;
}

    .dt_btn-view:hover {
        color: #564ec0;
        background-color: #564ec000;
    }

.kt-font-brand {
    color: #ff8e00 !important;
}

.table-scroll {
    width: 100%;
    overflow-x: auto;
}

    .table-scroll::-webkit-scrollbar {
        width: 5px;
    }

    .table-scroll::-webkit-scrollbar-thumb {
        background: #c1c1c1;
    }

    .table-scroll::-webkit-scrollbar-track {
        background: #ebe9f2;
    }

.dataTables_wrapper .dataTables_scroll .dataTables_scrollBody::-webkit-scrollbar-thumb {
    background: #c1c1c1;
}

.dataTables_wrapper .dataTables_scroll .dataTables_scrollBody::-webkit-scrollbar-track {
    background: #ebe9f2;
}

.accordion.accordion-toggle-arrow .card .card-header .card-title {
    color: #eb9c39;
    position: relative;
}

.nav-sec ul li a:hover, .nav-sec ul li.active a {
    background-color: #fff9f2;
    color: #ff8e00;
}

.accordion.accordion-toggle-arrow .card .card-header .card-title:after {
    color: #eb9c39;
}

.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-brand, .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-brand {
    background-color: #eb9c39;
    border-color: #eb9c39;
    color: #ffffff;
}

.btn.btn-label-light-o3 {
    background-color: #fff5e8;
    color: #ff8e00;
    cursor: text !important;
}

.btn.btn-label-brand {
    background-color: rgb(27 27 40 / 10%);
    color: #1b1b28;
    cursor: text !important;
}

label.btn.btn-label-brand:focus, label.btn.btn-label-brand:hover, label.btn.btn-label-brand.active, 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: #1b1b28;
    color: #ffffff;
}

.btn-success {
    background-color: #1b1b28;
    border-color: #1b1b28;
    color: #ffffff;
}

    .btn-success:hover {
        color: #fff;
        background-color: #000000;
        border-color: #000000;
    }

.form-control:focus {
    border-color: #eb9c39;
}

.kt-wizard-v3 .kt-wizard-v3__nav .kt-wizard-v3__nav-items .kt-wizard-v3__nav-item[data-ktwizard-state="current"] .kt-wizard-v3__nav-body .kt-wizard-v3__nav-bar:after {
    width: 100%;
    background-color: #eb9c39;
}

.kt-wizard-v3 .kt-wizard-v3__nav .kt-wizard-v3__nav-items .kt-wizard-v3__nav-item[data-ktwizard-state="current"] .kt-wizard-v3__nav-body {
    color: #ff8e00;
}

.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: #e7be8a;
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background: #fff9f1;
    color: #ff8e00;
}

.select2-container--default .select2-results__option.select2-results__option--highlighted {
    background: #fff9f1;
    color: #ff8e00;
}

.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 {
    background: #eb9c39;
    color: #ffffff;
}

.datepicker tbody tr > td.day:hover {
    background: #fdefde;
    color: #595d6e;
}

.store-tag {
    background: #eb9c39;
}

.nav-tabs .nav-item .nav-link.active, .nav-tabs .nav-item .nav-link:active, .nav-tabs .nav-item .nav-link:hover {
    color: #ff8e00;
    font-weight: 600;
}

.nav-tabs .nav-item .nav-link {
    color: #1b1b28;
}

.nav-bordered a.active {
    border-bottom: 2px solid #eb9c39 !important;
}

.active .css-snhnyn svg {
    color: #eb9c39;
}

.order-tracking.completed .is-complete {
    border-color: #f9ecdb;
    border-width: 0px;
    background-color: #f9ecdb;
}

a.new-tabbie:hover span.tab__icon {
    color: #ff8e00;
}

span.tab__icon {
    transition: all 0.2s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
    width: 16px;
    height: 16px;
    fill: #1b1b28;
    color: #1b1b28;
}

.nav-tabs.nav-tabs-line.nav-tabs-line-brand.nav.nav-tabs .nav-link:hover, .nav-tabs.nav-tabs-line.nav-tabs-line-brand.nav.nav-tabs .nav-link.active, .nav-tabs.nav-tabs-line.nav-tabs-line-brand a.nav-link:hover, .nav-tabs.nav-tabs-line.nav-tabs-line-brand a.nav-link.active {
    color: #eb9c39;
    border-bottom: 1px solid #eb9c39;
}

.kt-notification .kt-notification__item:hover .kt-notification__item-details .kt-notification__item-title {
    -webkit-transition: color 0.3s ease;
    transition: color 0.3s ease;
    color: #1b1b28;
}

.btn.btn-label-primary {
    background-color: rgb(249 236 219);
    color: #eb9c39;
    cursor: text !important;
}

.kt-notification .kt-notification__item .kt-notification__item-icon i {
    font-size: 1.4rem;
    color: #eb9c39;
}

.kt-notification .kt-notification__item .kt-notification__item-details .kt-notification__item-title {
    color: #1b1b28;
}

.kt-user-card.kt-user-card--skin-light .kt-user-card__name {
    color: #1b1b28;
}

.kt-body {
    background-color: transparent;
    box-shadow: none;
}

.datepicker {
    z-index: 999 !important;
}

.loade-more-v-btn.text-center span:hover {
    color: #1e1e2d;
}

.ticket-t-v-more {
    color: #1e1e2d;
}

.user-comment-info {
    width: 100%;
}

.loade-more-v-btn.text-center #loader i {
    color: #eb9c39;
}

.ctn-repeat {
    background: rgba(204, 37, 37, 0.07);
    padding: 0 4px;
    cursor: auto;
    border-radius: 3px;
    color: #CC2525;
    margin-left: 8px;
    line-height: 1.6;
}

    .ctn-repeat svg {
        width: 14px;
        height: 14px;
    }

    .ctn-repeat .ctn-count {
        font-weight: 500;
    }

.tc-other {
    background: rgb(33 150 243 / 15%);
    padding: 0 4px;
    cursor: auto;
    border-radius: 3px;
    color: #2196f3;
    text-transform: uppercase;
    font-size: 12px;
    margin-left: 8px;
}

    .tc-other .tc-other-txt {
        font-weight: 500;
    }

.other-svg {
    margin: 2px 0px;
    margin-right: 2px;
}

    .other-svg svg {
        width: 20px;
        height: 20px;
    }

div#kt_quick_search_inline {
    position: relative;
}

div#suggestions {
    position: absolute;
    background: #fff;
    box-shadow: 0px 0px 8px #ccc;
    width: 100%;
    top: 40px;
    z-index: 9;
    padding: 4px 0px;
    border-radius: 4px;
}

.suggestion-item {
    cursor: pointer;
    padding: 4px 12px;
}

    .suggestion-item:hover {
        background: #f3efef;
    }

span.dev-v {
    padding: 0px;
    margin: 0px 4px;
}

    span.dev-v svg {
        fill: #eb9c39;
        height: 32px;
    }

span.st_line {
    position: relative;
    top: 2px;
}

    span.st_line svg {
        height: 30px;
        width: 30px;
    }

.kt-tic-overdue .tc-tl-no {
    background-color: #FC2E2E;
}

.kt-tic-overdue .new-card-ticket .text-info {
    color: #FC2E2E !important;
}

a.kt-tic-list.kt-tic-overdue:hover {
    border-right: 18px solid #FC2E2E;
}

.btn-forward {
    border: 1px solid #b1adad;
    color: #b1adad;
    padding: 6.5px 13px;
}

    .btn-forward:hover {
        border: 1px solid #6c79e1;
        color: #ffffff;
        background-color: #6c79e1;
    }

        .btn-forward:hover svg path {
            stroke: #fff;
            fill: #fff;
        }

.btn-decline {
    border: 1px solid #dbdbdb;
    background-color: #dbdbdb;
    color: #707070;
}

    .btn-decline:hover {
        border: 1px solid #cecccc;
        background-color: #cecccc;
        color: #707070;
    }

.forward-ticket {
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0px 0px 8px 2px #eae6e6;
    transition: border .3s ease-in;
}

.f-t-number {
    width: 105px;
    background-color: #eb9c39;
    padding: 5px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 72px;
    text-align: center;
    border-top-left-radius: 8px;
    color: #fff;
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 0.5px;
}

.f-t-store {
    width: 105px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background-color: #e1e1e1;
    overflow: hidden;
    border-radius: 0px 0px 0px 8px;
}

.right-det {
    flex: 1;
}

.f-t-d {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 5px;
}

.f-t-cre {
    display: flex;
    align-items: center;
    gap: 6px;
}

span.f-t-icon {
    line-height: 1;
}

    span.f-t-icon svg {
        width: 16px;
        height: 16px;
    }

.f-t-form {
    color: #100f10;
    font-weight: 500;
}

.for-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-right: 6px;
}

    .for-actions .btn {
        padding: 6.5px 13px;
    }

    .for-actions p {
        color: #6c79e1;
        font-size: 13px;
        font-weight: 500;
    }

.date-assigned {
    border-left: 0px solid #efedef;
    flex: 1;
    flex-direction: column;
    align-items: end;
    gap: 0px;
}

.date-assigned-d-t {
    text-align: end;
    display: flex;
    align-items: center;
    gap: 6px;
}

.ttl-tb-right {
    width: 22%;
    text-align: right;
    padding-right: 0px;
    display: flex;
    align-items: center;
    justify-content: end;
}

    .ttl-tb-right span.bg-.info.info.small-bg {
        display: none;
    }

.new-card-ticket .text-info {
    color: #eb9c39 !important;
    background-color: #eb9c3917;
    width: max-content;
    padding: 2px 6px;
    border-radius: 4px 0px 0px 4px;
    display: flex;
    align-items: center;
    gap: 3px;
}

    .new-card-ticket .text-info svg {
        width: 20px;
        height: 20px;
    }

li.tablinks.active span.tabcount {
    background-color: #eb9c3924;
    color: #eb9c39;
}

span.tabcount {
    display: inline-block;
    background-color: #a3a19f24;
    color: #585857;
    border-radius: 4px;
    padding: 0px 6px;
    margin-left: 4px;
}

.kt-tic-overdue .tc-tl-no {
    background-color: #FC2E2E;
}

.kt-tic-overdue .new-card-ticket .text-info {
    color: #fc2e2e !important;
    background-color: #fc2e2e1c;
}

a.kt-tic-list.kt-tic-overdue:hover {
    border-right: 18px solid #FC2E2E;
}

.kt-tic-resolved .tc-tl-no {
    background-color: #008ff8;
}

.kt-tic-resolved .new-card-ticket .text-info {
    color: #008ff8 !important;
    background-color: #008ff81c;
}

a.kt-tic-list.kt-tic-resolved:hover {
    border-right: 18px solid #008ff8;
}

.kt-tic-closed .tc-tl-no {
    background-color: #4caf50;
}

.kt-tic-closed .new-card-ticket .text-info {
    color: #4caf50 !important;
    background-color: #4caf5029;
}

a.kt-tic-list.kt-tic-closed:hover {
    border-right: 18px solid #4caf50;
}

.kt-ticket-card.ticket-scroll {
    height: calc(100vh - 204px);
    overflow: auto;
    margin-bottom: 1rem;
    padding-right: 6px !important;
    padding-top: 0px;
}

    .kt-ticket-card.ticket-scroll::-webkit-scrollbar {
        background: transparent;
        height: 8px;
        width: 16px;
    }

.tkt-actn {
    max-width: 100px;
}

.kt-ticket-card.ticket-scroll::-webkit-scrollbar-thumb {
    border: 4px solid #f4f4f4;
    background: #dadce0;
    border-radius: 8px;
    min-height: 40px;
}

.tickets-tabs {
    width: 100%;
    min-width: 400px;
    margin: 0 auto;
    margin-bottom: 12px;
    border-bottom: 4px solid #000;
    overflow: hidden;
    transition: border 250ms ease;
}

    .tickets-tabs ul {
        margin: 0px;
        padding: 0px;
        overflow: hidden;
        float: left;
        padding-left: 48px;
        list-style-type: none;
    }

    .tickets-tabs.round ul li {
        border-radius: 8px 8px 0 0;
    }

    .tickets-tabs ul li {
        display: block;
        float: left;
        padding: 10px 24px 8px;
        background-color: #FFF;
        margin-right: 46px;
        z-index: 2;
        position: relative;
        cursor: pointer;
        color: #777;
        text-transform: uppercase;
        font-weight: 500;
        transition: all 250ms ease;
    }

        .tickets-tabs ul li:before, .tickets-tabs ul li:after {
            display: block;
            content: " ";
            position: absolute;
            top: 0;
            height: 100%;
            width: 44px;
            background-color: #FFF;
            transition: all 250ms ease;
        }

        .tickets-tabs ul li:before {
            right: -24px;
            transform: skew(30deg, 0deg);
            box-shadow: rgba(0, 0, 0, .1) 3px 2px 5px, inset rgba(255, 255, 255, .09) -1px 0;
        }

    .tickets-tabs.round ul li:before {
        border-radius: 0 8px 0 0;
    }

    .tickets-tabs ul li:after {
        left: -24px;
        transform: skew(-30deg, 0deg);
        box-shadow: rgba(0, 0, 0, .1) -3px 2px 5px, inset rgba(255, 255, 255, .09) 1px 0;
    }

    .tickets-tabs.round ul li:after {
        border-radius: 8px 0 0 0;
    }

    .tickets-tabs ul li.active {
        z-index: 3;
    }

        .tickets-tabs ul li.active, .tickets-tabs ul li.active:before, .tickets-tabs ul li.active:after {
            background-color: #000;
            color: #fff;
        }

.tabcontent.fadeing {
    display: none;
    padding: 0px 8px;
    -webkit-animation: fadeEffect 1s;
    animation: fadeEffect 1s;
}

@-webkit-keyframes fadeEffect {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes fadeEffect {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.forward-modal-popup.modal .modal-content {
    border-radius: 4px;
    border: 0px;
    border-top: 10px solid #eb9c39;
}

    .forward-modal-popup.modal .modal-content .modal-header {
        border-bottom: 0px;
    }

        .forward-modal-popup.modal .modal-content .modal-header .modal-title {
            font-weight: 600;
            font-size: 1.6rem;
            color: #000000;
        }

.forward-modal-popup-scroll {
    max-height: 56vh;
    overflow: auto;
    padding: 6px 6px 0px 16px;
    margin-bottom: 16px;
}

    .forward-modal-popup-scroll::-webkit-scrollbar {
        background: transparent;
        height: 8px;
        width: 16px;
    }

    .forward-modal-popup-scroll::-webkit-scrollbar-thumb {
        border: 4px solid #fff;
        background: #dadce0;
        border-radius: 8px;
        min-height: 40px;
    }

.forward-modal-popup .modal-lg {
    max-width: 700px;
}

.forward-modal-popup .f-t-store {
    color: #171818;
}

.forward-modal-popup .f-t-number {
    height: 26px;
    border-bottom-left-radius: 8px;
    border-top-left-radius: 0px;
    font-size: 16px;
}

.forward-modal-popup .f-t-store {
    height: 20px;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 0px;
    gap: 3px;
}

.forward-modal-popup .h6.tic-abt {
    max-width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.forward-modal-popup .tt-sb-2 {
    font-size: 15px;
    max-width: 314px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.forward-modal-popup .f-t-form {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 149px;
}

.forward-modal-popup .ticket-items .kt-checkbox-inline {
    height: max-content;
    margin-top: 4px;
}

.forward-modal-popup span.ticketicon {
    line-height: 1;
}

    .forward-modal-popup span.ticketicon svg {
        width: 16px;
        height: 16px;
    }

.forward-modal-popup .ttl-name-lv-brnch {
    padding: 0px 14px;
}

.forward-ticket {
    width: 100%;
    cursor: pointer;
    margin-bottom: 8px;
    transition: 0.15s ease-in-out;
}

    .forward-ticket:hover {
        transform: scale(1.01);
    }

.forward-modal .select2-selection__arrow {
    top: 18px !important;
}

.ticket-items {
    display: flex;
}

.forward-modal .kt-checkbox > span:after {
    border: solid #eb9c39;
}

.forward-modal .kt-checkbox {
    padding-left: 24px;
}

.forward-modal .modal-sm {
    max-width: 400px;
}

.f-h-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 12px;
    margin-bottom: 4px;
}

.btn-for-accept {
    padding: 0.25rem 1rem;
    background-color: #eb9c3940;
    border-color: #eb9c391f;
    color: #eb9c39;
}

.btn-for-decline {
    padding: 0.25rem 1rem;
    background-color: #70707036;
    border-color: #7070700f;
    color: #707070;
}

.ticket-activity-div {
    width: 100%;
    background-color: #fff;
    padding: 10px 10px;
    border-radius: 5px;
    margin-bottom: 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    box-shadow: 0px 0px 0px 2px #acacac1f;
    font-weight: 400;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
}

.ticket-activity {
    position: relative;
    padding-left: 32px;
    margin: 0 10px 0 30px;
    color: white;
}

    .ticket-activity .ticket-activity-container {
        position: relative;
        margin-bottom: 22px;
    }

        .ticket-activity .ticket-activity-container:last-child {
            margin-bottom: 0px;
        }

        .ticket-activity .ticket-activity-container:before {
            content: "";
            position: absolute;
            left: -32px;
            top: 40px;
            width: 1px;
            height: 20px;
            border: 1px dashed #eb9c3996;
        }

        .ticket-activity .ticket-activity-container:last-child::before {
            display: none;
        }

        .ticket-activity .ticket-activity-container .ticket-activity-icon {
            position: absolute;
            left: -50px;
            top: 0px;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            text-align: center;
            font-size: 2rem;
            background: #eb9c3924;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 1px solid #eb9c3970;
            color: #eb9c39;
        }


            .ticket-activity .ticket-activity-container .ticket-activity-icon svg {
                width: 18px;
                height: 18px;
            }

            .ticket-activity .ticket-activity-container .ticket-activity-icon i {
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
            }

            .ticket-activity .ticket-activity-container .ticket-activity-icon img {
                width: 100%;
                height: 100%;
                border-radius: 50%;
            }

        .ticket-activity .ticket-activity-container .ticket-activity-body {
            padding-top: 6px;
        }

            .ticket-activity .ticket-activity-container .ticket-activity-body .ticket-activity-title {
                margin-bottom: 0px;
                font-size: 14px;
                color: #1d1d1f;
            }

            .ticket-activity .ticket-activity-container .ticket-activity-body .ticket-activity-subtitle {
                font-weight: 500;
                margin-bottom: 0px;
                font-size: 12px;
                color: #8898aa;
            }

            .ticket-activity .ticket-activity-container .ticket-activity-body .ticket-activity-content {
                color: #9b9b9b;
                margin-bottom: 0px;
            }

.ticket-activity-scroll {
    max-height: 400px;
    overflow: auto;
}

    .ticket-activity-scroll::-webkit-scrollbar {
        width: 5px;
    }

    .ticket-activity-scroll::-webkit-scrollbar-thumb {
        background: #c1c1c1;
    }

    .ticket-activity-scroll::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

.ticket-filters-search svg {
    color: #a6a6a6;
    width: 20px;
    height: 20px;
}

.ticket-filters-search .form-control.kt-quick-search__input {
    height: calc(1.3em + 1rem + 7px);
    padding-left: 1rem !important;
}

.tkt-main-actn {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 230px;
}

.ticket-filters-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #707070;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 500;
    border-bottom: 1px solid #cacaca;
}

.btn-clearall {
    color: #eb9c39;
    font-size: 16px;
    text-transform: uppercase;
}

    .btn-clearall:hover {
        color: #e78000;
    }

.ticket-filters-date {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0px;
    color: #999898;
}

.btn-filters-date {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    border: 1px solid #a5a5a5;
    color: #696969;
}

.ticket-filters-date input[type="date"] {
    -webkit-appearance: listbox;
    border: 1px solid #e8eaed;
    border-radius: 5px;
    background-color: #fff;
    padding: 3px 5px;
    width: 90%;
}

.ticket-filters-date-drop {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0px 10px;
}

.ticket-filters-search-head {
    position: relative;
}

.ticket-filters-search-head-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
}

.search-head-title {
    color: #000;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 500;
}

.search-head-open {
    color: #666666;
    width: 30px;
    height: 30px;
    background-color: #e2e2e2;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

    .search-head-open svg {
        width: 18px;
        height: 18px;
    }

.search-head-filter {
    background-color: #e2e2e2;
    color: #666666;
    border-radius: 30px;
    position: absolute;
    left: 0;
    top: -4px;
    right: 0;
    display: flex;
    align-items: center;
}

    .search-head-filter .form-control {
        background-color: transparent;
        border: 0;
        height: calc(1.5em + 1.3rem + 0px);
    }

.search-head-close {
    color: #666666;
    width: 30px;
    height: 30px;
    background-color: #e2e2e2;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding-right: 0.75rem;
}

    .search-head-close svg {
        width: 18px;
        height: 18px;
    }

.ticket-filters-search-item .item-title {
    color: #545454;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    display: flex;
}

.ticket-filters-search-item span.item-title-count {
    color: #808080;
    font-weight: 400;
    letter-spacing: 0.5px;
    padding-left: 4px;
}

.ticket-filters-search-item .kt-checkbox-inline .kt-checkbox {
    margin-bottom: 0px;
    padding-left: 26px;
}

.ticket-filters-search-item .kt-checkbox > span {
    border: 1px solid #b9b9b9;
}

.ticket-filters-search-item .kt-checkbox > input:checked ~ span {
    border: 1px solid #f5a560;
    background-color: #f5a560;
}

.ticket-filters-search-item .kt-checkbox > span:after {
    border: solid #ffffff;
}

.ticket-filters-search-item {
    margin-bottom: 1rem;
}

.ticket-filters-section {
    padding: 1rem 0px;
    border-bottom: 1px solid #cacaca;
}

    .ticket-filters-section.max-height .ticket-filters-search-body {
        height: 130px;
        overflow: hidden;
    }

    .ticket-filters-section.max-height.expanded .ticket-filters-search-body {
        height: 230px;
        overflow: auto;
        scrollbar-width: thin;
    }

.ticket-filters-search-more {
    color: #e98d19;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

    .ticket-filters-search-more:hover {
        color: #d47702;
    }

.ticket-filters-height {
    height: calc(100vh - 270px);
    overflow: auto;
}

    .ticket-filters-height::-webkit-scrollbar {
        background: transparent;
        height: 8px;
        width: 16px;
    }

    .ticket-filters-height::-webkit-scrollbar-thumb {
        border: 4px solid #f4f4f4;
        background: #dadce0;
        border-radius: 8px;
        min-height: 40px;
    }

.filtered-items-ul {
    display: flex;
    align-items: center;
    gap: 8px;
}

.filtered-items-li {
    border: 1px solid #cacaca;
    width: max-content;
    display: flex;
    align-items: center;
    padding: 0px 4px;
    border-radius: 25px;
    color: #6d6d6d;
}

.filtered-items-li-count {
    width: max-content;
    display: flex;
    align-items: center;
    padding: 0px 4px;
    color: #000;
    font-size: 14px;
    font-weight: 500;
    cursor: default;
}

span.filtered-items-li-close {
    color: #6d6d6d;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

    span.filtered-items-li-close svg {
        width: 14px;
        height: 14px;
    }

.right-side-data-cnt {
    display: flex;
    justify-content: end;
}

    .right-side-data-cnt p {
        margin-bottom: 0px;
        position: relative;
        font-size: 14px;
    }

.kt-tic-forward .tc-tl-no {
    background-color: #9c27b0;
}

.kt-tic-forward .new-card-ticket .text-info {
    color: #9c27b0 !important;
    background-color: #9c27b01f;
}

a.kt-tic-list.kt-tic-forward:hover {
    border-right: 18px solid #9c27b0;
}

.filter-ticket-row {
    display: flex;
    overflow: hidden;
    height: calc(100vh - 120px);
}

.filtercol {
    width: 0px;
    overflow: hidden;
    transition: width .3s ease;
}

.tickettoggled .filtercol {
    width: 260px;
    transition: width .3s ease;
}

.ticketcol {
    flex: 1 1 0%;
    padding-left: 0px;
}

.tickettoggled .ticketcol {
    padding-left: 10px;
}

.rotate-180 {
    transform: rotateZ(180deg);
}

.tickettoggled .rotate-180 {
    transform: rotateZ(0deg);
    transition: transform .3s ease;
}

.tickettoggled .aside-toggle .svg-icon {
    color: #eb9c39;
}

div#kt_aside_filter_toggle {
    display: inline-flex;
    background: #f9ecdb;
    position: absolute;
    left: 10px;
    top: 2px;
    height: 2rem;
    width: 2rem !Important;
}

.right-side-data-cnt {
    line-height: 1;
    align-items: end;
}

.filtered-items-ul {
    padding-left: 30px;
    min-height: 24px;
}

.ticket-filters-search-item .item-title span.item-title-label {
    max-width: 152px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

a.btn.btn-sm.btn-analytics {
    background-color: #f9ecdb;
    color: #ff8e00;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    padding: 0.3rem 0.5rem;
    margin-left: 32px;
    margin-right: 12px;
}

    a.btn.btn-sm.btn-analytics svg {
        width: 16px;
        height: 16px;
    }

.btn-clearall {
    font-size: 12px;
}

.ticket-filters-height {
    visibility: hidden;
}

    .ticket-filters-section, .ticket-filters-height:hover, .ticket-filters-height:focus {
        visibility: visible;
    }

.right-side-data-cnt {
    line-height: 1;
    align-items: center;
}

.analytics-container {
    width: 100%
}

.analytics-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.analytics-heading-title {
    color: #000;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 18px;
    font-weight: 500;
    padding: 0.3rem 0.5rem;
}

    .analytics-heading-title svg {
        width: 18px;
        height: 18px;
    }

.login-root .login-card {
    box-shadow: none !important;
    position: relative;
    z-index: 9;
    background: transparent !important;
}

.login-root .form-control.form-control-solid {
    background-color: #dcdcdd4d;
    /* border-color: #b0b5c78a; */
    color: #5e6278;
    transition: color .2s ease,background-color .2s ease;
    box-shadow: 6px 5px 3px 0 rgb(0 0 0 / 9%) !important;
}

    .login-root .form-control.form-control-solid:focus {
        background-color: #dcdcddc2;
        /* border-color: #b0b5c7e3; */
        border-color: #b0b5c7e3 !important;
        color: #5e6278;
        transition: color .2s ease,background-color .2s ease;
    }

.login-root .smart-bg-img {
    position: absolute;
    top: 0%;
    right: 8%;
    bottom: 0;
    width: 44%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-root .img-logo {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-root .app-page {
    display: flex;
    height: 100vh;
    overflow: hidden;
    justify-content: center;
}

.login-root {
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' width='1440' height='560' preserveAspectRatio='none' viewBox='0 0 1440 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1064%26quot%3b)' fill='none'%3e%3cpath d='M633.855,581.52C660.857,581.194,686.418,566.38,698.394,542.177C709.304,520.128,699.854,495.205,686.918,474.28C674.819,454.708,656.865,437.912,633.855,437.778C610.649,437.643,592.147,454.064,579.709,473.655C566.048,495.171,555.126,520.991,566.56,543.768C578.927,568.405,606.29,581.853,633.855,581.52' fill='rgba(235, 156, 57, 0.13)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M49.68473815564028 222.78698512987296L167.80599455930854 199.82653879439212 144.8455482238277 81.70528239072388 26.724291820159454 104.6657287262047z' fill='rgba(235, 156, 57, 0.13)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M176.66813149043418-113.12512736333946L53.03507959660189-26.55633245540585 139.6038745045355 97.07671943842644 263.2369263983678 10.50792453049283z' fill='rgba(235, 156, 57, 0.13)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M1256.8977549973356 435.30927100017806L1352.2165150434837 464.45114046488146 1381.358384508187 369.1323804187333 1286.039624462039 339.9905109540299z' fill='rgba(235, 156, 57, 0.13)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M517.1930432180874 231.64918641195652L328.6056986289639 194.80496691658647 380.5118186986392 354.55557813366806z' fill='rgba(235, 156, 57, 0.13)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M960.4167766892316 213.3850981040194L1067.4050911002616 172.43307571515982 990.6919971191865 108.06314684917155z' fill='rgba(235, 156, 57, 0.13)' class='triangle-float1'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1064'%3e%3crect width='1440' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3cstyle%3e %40keyframes float1 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-10px%2c 0)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float1 %7b animation: float1 5s infinite%3b %7d %40keyframes float2 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-5px%2c -5px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float2 %7b animation: float2 4s infinite%3b %7d %40keyframes float3 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(0%2c -10px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float3 %7b animation: float3 6s infinite%3b %7d %3c/style%3e%3c/defs%3e%3c/svg%3e");
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' width='1440' height='730' preserveAspectRatio='none' viewBox='0 0 1440 730'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1029%26quot%3b)' fill='none'%3e%3cpath d='M1431.281%2c842.892C1483.485%2c842.418%2c1540.885%2c840.812%2c1570.22%2c797.627C1602.579%2c749.99%2c1599.778%2c686.622%2c1571.522%2c636.442C1542.725%2c585.3%2c1489.932%2c548.689%2c1431.281%2c550.882C1375.654%2c552.962%2c1335.851%2c598.036%2c1308.099%2c646.291C1280.453%2c694.362%2c1258.461%2c753.197%2c1287.904%2c800.189C1316.282%2c845.48%2c1377.836%2c843.377%2c1431.281%2c842.892' fill='rgba(235%2c 156%2c 57%2c 0.13)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M1070.6122208043764 374.29150208374074L939.7490460424749 256.46177027846954 952.7824889991052 505.1546768456423z' fill='rgba(235%2c 156%2c 57%2c 0.13)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M-133.01 51.89 a187.68 187.68 0 1 0 375.36 0 a187.68 187.68 0 1 0 -375.36 0z' fill='rgba(235%2c 156%2c 57%2c 0.13)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M1396.045578420525 302.7767820011479L1526.4685867038293 200.87916026363592 1424.5709649663172 70.45615198033181 1294.147956683013 172.3537737178438z' fill='rgba(235%2c 156%2c 57%2c 0.13)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M723.942031480749 248.00428245761233L838.7041068308271 221.50936971172422 812.209194084939 106.74729436164617 697.447118734861 133.24220710753428z' fill='rgba(235%2c 156%2c 57%2c 0.13)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M-33.76 698.77 a166.55 166.55 0 1 0 333.1 0 a166.55 166.55 0 1 0 -333.1 0z' fill='rgba(235%2c 156%2c 57%2c 0.13)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M371.62378145632454 427.54297075172434L435.337897893468 345.99262056542705 281.15531439545026 291.1966210028605z' fill='rgba(235%2c 156%2c 57%2c 0.13)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M1361.363%2c926.869C1414.218%2c927.557%2c1449.584%2c878.602%2c1475.201%2c832.365C1499.798%2c787.968%2c1516.202%2c735.834%2c1491.886%2c691.283C1466.736%2c645.204%2c1413.822%2c621.832%2c1361.363%2c623.795C1312.128%2c625.637%2c1269.77%2c656.907%2c1246.729%2c700.456C1225.153%2c741.237%2c1231.707%2c788.304%2c1252.547%2c829.466C1276.115%2c876.016%2c1309.191%2c926.19%2c1361.363%2c926.869' fill='rgba(235%2c 156%2c 57%2c 0.13)' class='triangle-float2'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1029'%3e%3crect width='1440' height='730' fill='white'%3e%3c/rect%3e%3c/mask%3e%3cstyle%3e %40keyframes float1 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-10px%2c 0)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float1 %7b animation: float1 5s infinite%3b %7d %40keyframes float2 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-5px%2c -5px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float2 %7b animation: float2 4s infinite%3b %7d %40keyframes float3 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(0%2c -10px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float3 %7b animation: float3 6s infinite%3b %7d %3c/style%3e%3c/defs%3e%3c/svg%3e");
}

    .login-root .smart-logo {
        width: 120px;
    }

    .login-root p.kt-mn-tl-sub {
        color: #a7a6a6;
        font-weight: 300;
        letter-spacing: 0.5px;
    }

    .login-root .login_footer a {
        color: #aaaab1 !important;
        font-weight: 400;
    }

    .login-root .app-container {
        padding-left: 30px !important;
        padding-right: 30px !important;
    }
    /*    .login-root .mt-51 {
        margin-top: 8rem !important;
    }*/
    .login-root .form-small-text {
        margin-top: 0.5rem;
        font-size: 0.95rem;
        color: #a1a5b7;
    }

    .login-root label.form-label {
        font-weight: 500;
    }

.btn-signin-w {
    width: 120px;
}

.action-detail-item {
    display: flex;
    align-items: center;
    padding: 10px 10px;
    gap: 12px;
}

.action-detail-item-div {
    font-weight: 500;
    width: 160px;
}

.ribbon-box {
    position: relative;
    border: 1px solid #e7e6e6;
}

    .ribbon-box .ribbon {
        position: relative;
        clear: both;
        padding: 5px 12px;
        box-shadow: 2px 5px 10px #323a4626;
        color: #fff;
        font-size: 13px;
        font-weight: 600;
    }

    .ribbon-box .ribbon-info {
        background: #4fc6e1;
    }

    .ribbon-box .ribbon {
        margin-left: -26px;
        border-radius: 0 3px 3px 0;
    }

        .ribbon-box .ribbon:before {
            content: " ";
            border-style: solid;
            border-width: 10px;
            display: block;
            position: absolute;
            bottom: -10px;
            left: 0;
            margin-bottom: -10px;
            z-index: 1;
        }

    .ribbon-box .ribbon-info:before {
        border-color: #25b7d8 transparent transparent;
    }

.personal-border {
    border-top: 4px solid #6ecee1 !important;
}

.company-border {
    border-top: 4px solid #4a81d4 !important;
}

.ribbon-box .action-detail {
    margin-top: 3rem;
}

.company-border.ribbon-box .ribbon-info:before {
    border-color: #4a81d4 transparent transparent;
}

.company-border.ribbon-box .ribbon-info {
    background: #4a81d4;
}

.kt-notification-scroll {
    max-height: 230px;
    /*height: auto;*/
    overflow: auto;
}

    .kt-notification-scroll::-webkit-scrollbar {
        background-color: #fff;
        width: 6px;
    }

    .kt-notification-scroll::-webkit-scrollbar-track {
        background-color: #fff;
    }

    .kt-notification-scroll::-webkit-scrollbar-thumb {
        background-color: #1c1c9e80;
        border-radius: 6px;
        border: 5px solid #ccc;
    }

.dataTables_scrollHeadInner {
    width: 100% !important;
}
/*new styles*/
body {
    font-weight: 400;
}

.sb-table thead th {
    border: 0px;
    background-color: #e7e7e7;
    color: #1b1b28 !important;
    font-weight: bold;
}

.sb-table td {
    color: #595d6e;
    font-weight: 400;
}

.kt-grid__item.kt-grid__item--fluid.kt-grid.kt-grid--ver.kt-page {
    flex: none !important;
}
/*.kt-portlet .kt-portlet__head {
    background-color: #f9ecdb;
}*/
.kt-notification__item-details {
    text-align: justify;
}

.company-border, .personal-border {
    height: 100%;
}

.avatar-title {
    padding: 4px;
}

.sb-portlet .kt-portlet__head {
    background-color: #f9ecdb;
    border-bottom: 1px solid #ffd39d;
}

    .sb-portlet .kt-portlet__head .kt-portlet__head-label .kt-portlet__head-title {
        margin: 0;
        padding: 0;
        font-size: 1.2rem;
        font-weight: 500;
        color: #1b1b28;
    }

    .sb-portlet .kt-portlet__head i.kt-font-brand.flaticon2-line-chart {
        display: none;
    }

    .sb-portlet .kt-portlet__head .kt-quick-search .kt-quick-search__form {
        padding: 0;
        background-color: #fbfbfb;
        margin-right: 10px;
        border-radius: 4px;
        border: 1px solid #e3e1e1;
    }

        .sb-portlet .kt-portlet__head .kt-quick-search .kt-quick-search__form .form-control {
            height: 40px;
        }

.sb-portlet .kt-wizard-v3 .kt-wizard-v3__nav .kt-wizard-v3__nav-items .kt-wizard-v3__nav-item .kt-wizard-v3__nav-body {
    padding-top: 0px;
}


.sb-portlet .kt-portlet__head .btn.btn-default {
    border: 0;
    background: transparent;
    color: #7c7c7c;
    border: 1px solid #7c7c7cbf;
    padding: 2px;
    margin-left: 4px;
}

    .sb-portlet .kt-portlet__head .btn.btn-default:hover {
        color: #ffffff;
        background: #1b1b28;
        border-color: #1b1b28;
    }

    .sb-portlet .kt-portlet__head .btn.btn-default svg {
        width: 24px;
        height: 24px;
    }

.sb-branch-list .kt-portlet.kt-widget19 {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: .25rem;
    box-shadow: 0px 0px 6px #d2d2d2;
}

.sb-branch-list .kt-widget19 .kt-widget19__pic > img {
    width: 100%;
    min-height: 220px;
    border-radius: .25rem .25rem 0 0;
}

@media screen and (min-width: 1450px) {
    .sb-branch-list .kt-widget19 .kt-widget19__pic > img {
        min-height: 250px;
    }
}

@media screen and (min-width: 1700px) {
    .sb-branch-list .kt-widget19 .kt-widget19__pic > img {
        min-height: 300px;
    }
}

.dt_btn-view {
    padding: 6px 10px;
}

@media (min-width: 992px) {
    .side-rotate.rotate-180 {
        transform: rotateZ(0deg);
        transition: transform .3s ease;
    }

    .toggled .side-rotate.rotate-180 {
        transform: rotateZ(180deg);
        transition: transform .3s ease;
    }
}

.kt-header__topbar {
    align-items: center;
}

.vr {
    height: 26px;
    width: 1px;
    background-color: #e3e3e3;
}

.company-logo {
    margin: 0 0.25rem;
}

    .company-logo img {
        height: 30px;
    }

.sb-in-file {
    background-color: #f3f3f3;
    height: 120px;
    border: 1px dashed #b1b1b1;
    border-radius: 10px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease-in-out;
}

input.sb-in-file-input {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    cursor: pointer !important;
    opacity: 0;
}

.sb-in-file-icon svg {
    width: 44px;
    height: 44px;
    color: #1b1b28;
}

.sb-in-file-label {
    font-size: 14px;
}

.sb-in-file-label-muted {
    font-size: 12px;
    margin-top: 3px;
    color: #7c7c7c;
}

.sb-in-file-list {
    margin-top: 10px;
}

.sb-in-file-list-item {
    display: flex;
    align-items: center;
    width: 100%;
    background-color: #eeeeee;
    border-radius: 10px;
    padding: 8px 10px;
    cursor: default;
}

.sb-in-file-list-item-icon {
    width: 32px;
    height: 32px;
    background-color: #d3d3d3;
    color: #383838;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    margin-right: 6px;
}

    .sb-in-file-list-item-icon svg {
        width: 24px;
        height: 24px;
    }

.sb-in-file-list-item-label {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
}

.sb-in-file-list-item-remove {
    width: 32px;
    height: 32px;
    background-color: #fdcfcf;
    color: #d10000;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    cursor: pointer;
}

    .sb-in-file-list-item-remove svg {
        width: 24px;
        height: 24px;
    }

.sb-in-file:hover {
    border: 2px dashed #eb9c39;
    background-color: rgb(235 156 57 / 10%);
}

.sb-in-file.dragover {
    border: 2px dashed #eb9c39;
    background-color: rgb(235 156 57 / 10%);
}

.sb-in-file1 {
    background-color: #f3f3f3;
    height: 120px;
    border: 1px dashed #b1b1b1;
    border-radius: 10px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease-in-out;
}

input.sb-in-file1-input {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    cursor: pointer !important;
    opacity: 0;
}

.sb-in-file1-icon svg {
    width: 44px;
    height: 44px;
    color: #1b1b28;
}

.sb-in-file1-label {
    font-size: 14px;
}

.sb-in-file1-label-muted {
    font-size: 12px;
    margin-top: 3px;
    color: #7c7c7c;
}

.sb-in-file1-list {
    margin-top: 10px;
}

.sb-in-file1-list-item {
    display: flex;
    align-items: center;
    width: 100%;
    background-color: #eeeeee;
    border-radius: 10px;
    padding: 8px 10px;
    cursor: default;
}

.sb-in-file1-list-item-icon {
    width: 32px;
    height: 32px;
    background-color: #d3d3d3;
    color: #383838;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    margin-right: 6px;
}

    .sb-in-file1-list-item-icon svg {
        width: 24px;
        height: 24px;
    }

.sb-in-file1-list-item-label {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
}

.sb-in-file1-list-item-remove {
    width: 32px;
    height: 32px;
    background-color: #fdcfcf;
    color: #d10000;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    cursor: pointer;
}

    .sb-in-file1-list-item-remove svg {
        width: 24px;
        height: 24px;
    }

.sb-in-file1:hover {
    border: 2px dashed #eb9c39;
    background-color: rgb(235 156 57 / 10%);
}

.sb-in-file1.dragover {
    border: 2px dashed #eb9c39;
    background-color: rgb(235 156 57 / 10%);
}


.comp-logo-img {
    margin-right: 10px;
    border-radius: 10px;
    border: 1px solid #ccc;
    padding: 10px;
}

    .comp-logo-img img {
        height: 100px;
    }


.pname {
    color: #0b0e1f;
    font-size: 20px;
    font-weight: 500;
}


.user-main-det-div {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.user-det-div {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
}

.user-com-logo {
    border: 1px solid #ebebeb;
    padding: 10px;
    border-radius: 10px;
    text-align: center;
}

    .user-com-logo img {
        width: 90%;
    }

.user-i {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 8px;
    width: 50%;
}

.user-i-icon {
    line-height: 1;
}

    .user-i-icon svg {
        width: 24px;
        height: 24px;
        color: #445066;
        margin-top: 0;
    }

.user-i-control {
    font-weight: 500;
}

.user-i-label {
    line-height: 1;
    margin-bottom: 4px;
    font-size: 12px;
    color: #727171;
}

.user-i-form {
    line-height: 1;
    font-size: 14px;
    color: #202124;
}

.profile-details-form {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.profile-details-image {
    position: relative;
}

.profile-details-image-in img {
    height: 120px;
    border-radius: 6px;
    width: 120px;
}

.profile-details-image-edit svg {
    width: 17px;
    height: 17px;
}

.profile-details-image-edit {
    width: 30px;
    height: 30px;
    background-color: #f8f8f8;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 0;
    right: 0;
    color: #74788d;
    border-bottom-right-radius: 0.475rem;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

    .profile-details-image-edit:hover {
        color: #3F51B5;
    }

input.img-input {
    width: 100%;
    height: 100%;
    opacity: 0;
    position: absolute;
    cursor: pointer !important;
}

.profile-details-form {
    display: flex;
    gap: 12px;
}

.profile-details-control {
    flex: 1;
    padding-top: 6px;
}

.per-item {
    display: flex;
    gap: 4px;
    margin-bottom: 6px;
    align-items: center;
}

.per-item-icon svg {
    width: 18px;
    height: 18px;
}

.per-item-icon {
    color: #727272;
    width: 24px;
    height: 24px;
    background-color: #e4e6e7;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-primary-upload {
    background-color: #ffe5c4;
    border-color: #fff3e5;
    color: #eb9c39;
    width: 100%;
    padding: 4px 4px;
    margin-top: 4px;
}

.btn-success:disabled, .btn-success:hover:disabled {
    color: #898989;
    background-color: #e7e7e7;
    border-color: #dfdfdf;
}

.info-pass p {
    color: #050708;
    font-size: 14px;
}

.info-pass li {
    color: #050708;
    margin-bottom: 7px;
    font-size: 14px;
}

.info-pass h4 {
    color: #050708;
}

.info-pass {
    background-color: #f6f6fe;
    height: 100%;
    padding: 2rem 2rem;
    border-radius: 14px;
}

.dropdown-menu-profile .kt-media span.initial-box {
    width: 50px;
    max-width: 50px;
    height: 50px;
}

.dropdown-menu-profile .kt-user-card {
    background-color: #f9fafe;
    align-items: flex-start;
    border-bottom: 1px solid #d7e3fa;
    padding: 1.5rem 1rem;
}

.dropdown-menu-profile .kt-user-card__name {
    line-height: 1;
    margin-top: 6px;
}

.dropdown-menu-profile small.kt-cl-name {
    font-size: 12px;
}

.ann-search-filter {
    background-color: #f3f3f3;
    /*background-color: #ffffff;*/
    color: #666666;
    border-radius: 6px;
    display: flex;
    align-items: center;
    padding-left: 10px;
}

    .ann-search-filter span.search-icon svg {
        width: 20px;
        height: 20px;
    }

    .ann-search-filter .form-control {
        background-color: transparent;
        border: 0;
        height: calc(1.5em + 1.3rem + 0px);
    }

.ann-ul {
    margin-top: 0rem;
    max-height: 196px;
    overflow: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
}

.ann-li {
    margin-bottom: 1rem;
}

    .ann-li .kt-checkbox-inline {
        display: flex;
    }

    .ann-li .item-title {
        color: #545454;
        font-size: 14px;
        font-weight: 500;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 220px;
    }

.ann-card {
    padding: 0px 0.5rem;
}

.ann-li .kt-checkbox > span:after {
    border: solid #f5a560;
}

.ann-li .kt-checkbox-inline .kt-checkbox {
    margin-bottom: 0px;
    padding-left: 26px;
}

.ann-sec-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 1rem;
    background-color: #f6f6f6;
    border-radius: 6px;
}

.ann-sec-head-title {
    font-size: 1.2rem;
    font-weight: 500;
    color: #1b1b28;
}

.ann-sec-head-check .item-title {
    color: #545454;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    display: flex;
}

.ann-sec-head-check .kt-checkbox > span:after {
    border: solid #f5a560;
}

.ann-sec-head-check .kt-checkbox-inline .kt-checkbox {
    margin-bottom: 0px;
    padding-left: 26px;
}

.ann-sec-head-search-check {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.ann-note {
    background-color: #e5f3ff;
    border-left: 4px solid #2196F3;
    border-radius: 4px;
    padding: 1rem;
    margin: 0px 10px;
    margin-top: 10px;
    font-size: 15px;
}

.ann-video-thumb-img {
    margin-left: 10px;
    border-radius: 10px;
    border: 1px solid #ccc;
    padding: 2px;
    position: relative;
}

    .ann-video-thumb-img img {
        height: 114px;
        width: 170px;
        border-radius: 8px;
    }

.select-thumb-in {
    width: 30px;
    height: 30px;
    background-color: #f3f3f3;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    margin-bottom: 0px;
    bottom: 2px;
    right: 2px;
    color: #1b1b28;
    border-bottom-right-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

    .select-thumb-in svg {
        width: 20px;
        height: 20px;
    }

    .select-thumb-in:hover {
        color: #3F51B5;
    }

input.video-img-input {
    width: 100%;
    height: 100%;
    opacity: 0;
    display: none;
    position: absolute;
    cursor: pointer !important;
}

.ck-content.ck-focused {
    border-color: #eb9c39 !important;
}

.ann-search-head {
    position: relative;
}

.ann-search-head-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 10px 0px;
}

.ann-search-head-title {
    font-size: 14px;
}

.ann-search-head-open {
    color: #666666;
    width: 30px;
    height: 30px;
    background-color: #e2e2e2;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

    .ann-search-head-open svg {
        width: 18px;
        height: 18px;
    }

.ann-search-head-filter {
    background-color: #e2e2e2;
    color: #666666;
    border-radius: 30px;
    position: absolute;
    left: 0;
    top: -4px;
    right: 0;
    display: flex;
    align-items: center;
}

    .ann-search-head-filter .form-control {
        background-color: transparent;
        border: 0;
        height: calc(1.5em + 1.3rem + 0px);
    }

.ann-search-head-close {
    color: #666666;
    width: 30px;
    height: 30px;
    background-color: #e2e2e2;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    padding-right: 0.75rem;
}

    .ann-search-head-close svg {
        width: 18px;
        height: 18px;
    }

.ann-not-ul {
    /* max-height: calc(100vh - 234px);*/
    overflow: auto;
    padding: 0rem 2rem;
    padding-bottom: 0px;
}

    .ann-not-ul::-webkit-scrollbar {
        background-color: #fff;
        width: 6px;
    }

    .ann-not-ul::-webkit-scrollbar-thumb {
        background-color: #1c1c9e80;
        border-radius: 6px;
        border: 5px solid #ccc;
    }

.ann-not-li {
    padding: 16px 0px;
    border-bottom: 2px solid #cacaca;
    display: flex;
    gap: 16px;
}

    .ann-not-li:last-child {
        border-bottom: 0px solid #cacaca;
    }

.ann-not-group {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 8px;
    border-radius: 8px;
    width: 100%;
}

.ann-not-main-heading {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 4px;
}

.ann-not-sub-heading {
    color: #777575;
    font-size: 14px;
    margin-bottom: 0px;
}

.ann-not-media {
    min-width: 460px;
    max-width: 460px;
    height: 260px;
    margin: 0px 0px;
    position: relative;
    transition: all 200ms ease-in-out;
    box-shadow: 0px 0px 5px #d1d1d1;
    border-radius: 4px;
    position: relative;
}

    .ann-not-media img {
        width: 100%;
        height: 100%;
        border-radius: 4px;
        object-fit: cover;
    }

    .ann-not-media video {
        border-radius: 4px;
        width: 100%;
        aspect-ratio: 16 / 9;
        object-fit: cover;
        max-width: 100%;
        height: 260px;
        display: inline-block;
        vertical-align: top;
    }

.ann-not-description p {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    font-size: 14px;
    margin-bottom: 0px;
}

.ann-not-dt-tm {
    text-align: center;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 10px;
    width: 90px;
    overflow: hidden;
    box-shadow: 0px 0px 8px #cbcbcb;
    box-shadow: 0px 0px 10px #989898;
}

.ann-not-month {
    padding: 6px 0;
    color: #fff;
    background-color: #eb9c39;
    font-size: 13px;
    font-weight: 500;
    box-shadow: 0 5px 10px #ffd6a4;
    text-transform: uppercase;
}

.ann-not-day {
    line-height: .8em;
    font-size: 2.5em;
    padding-top: 7px;
    font-weight: 500;
}

.ann-not-year {
    border-top: 1px dashed #959595;
    margin: 7px 12px 4px;
}

.ann-not-time {
    border-top: 1px solid #d7d7d7;
    margin: 4px 0px;
    font-weight: 600;
    color: #777575;
}

.ann-not-left {
    position: absolute;
    top: 10px;
    left: 10px;
}

.ann-not-heading {
    margin-top: 1rem;
    margin-bottom: 19px;
}

.ann-not-description {
    margin-bottom: 30px;
    margin-bottom: auto;
}

.ann-not-media .video-control {
    margin: 0;
    padding: 0;
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.8);
    -webkit-appearance: none;
    z-index: 2;
    transition: all 200ms ease-in-out;
}

.video-control-fullscreen {
    margin: 0;
    padding: 0;
    position: absolute;
    bottom: 15px;
    right: 15px;
    border: 0;
    background: transparent;
    cursor: pointer;
    border-radius: 0;
    -webkit-appearance: none;
    z-index: 3;
    transition: all 200ms ease-in-out;
}

.video-control-fullscreen-icon {
    display: block;
    vertical-align: top;
    color: #fff;
    opacity: 0;
    visibility: hidden;
    transition: all 200ms ease-in-out;
}

    .video-control-fullscreen-icon polygon {
        fill: currentColor;
    }

.ann-not-media .video-control[data-button-state="play"] {
    background-color: rgba(0,0,0,.4);
}

    .ann-not-media .video-control[data-button-state="play"]:hover {
        background-color: rgba(0,0,0,.4);
    }

.ann-not-media .video-control[data-button-state="pause"] {
    background-color: rgba(0,0,0,0);
}

    .ann-not-media .video-control[data-button-state="pause"]:hover {
        background-color: rgba(0,0,0,.4);
    }

.ann-not-media .video-control[data-button-state="play"] .video-control-play {
    display: block;
}

.ann-not-media .video-control[data-button-state="play"] .video-control-pause {
    display: none;
}

.ann-not-media .video-control[data-button-state="pause"] .video-control-play {
    display: none;
}

.ann-not-media .video-control[data-button-state="pause"] .video-control-pause {
    display: block;
    opacity: 0;
}

.ann-not-media:hover .video-control[data-button-state="pause"] .video-control-pause {
    display: block;
    opacity: 1;
}

.ann-not-media:hover .video-control[data-button-state="pause"] + .video-control-fullscreen .video-control-fullscreen-icon {
    opacity: 1;
    visibility: visible;
}

.video-control-play, .video-control-pause {
    width: 9%;
}
/*@media screen and (min-width: 1450px) {
    .ann-not-media {
        height: 340px;
    }

    .ann-not-media video {
        height: 340px;
    }
}*/
.btn-ann-not-more {
    background-color: #eb9c3900;
    color: #0a0a0e;
    border: 1px solid #1e1e2d;
    padding: 10px 13px;
    width: 188px;
    border-radius: 2px;
    margin-bottom: 1.4rem;
    font-weight: 500;
    font-size: 14px;
}

.ann-not-media:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #00000012;
    border-radius: 4px;
}

.notice-board-head {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 1.5rem;
}

.notice-board-icon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0px 0px 6px #dedede;
}

    .notice-board-icon svg {
        width: 24px;
        height: 24px;
        transform: rotate(360deg);
    }

.notice-board-head-title {
    font-size: 24px;
    font-weight: 500;
    color: #1b1b28;
}

.notice-board-body {
    background-color: #fff;
    margin-left: 4rem;
    box-shadow: 0px 0px 13px 0px rgb(82 63 105 / 11%);
    border-radius: 4px;
}

.ann-not-right {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.notice-board-view {
    background-color: #fff;
    box-shadow: 0px 0px 13px 0px rgb(82 63 105 / 11%);
    border-radius: 6px;
    border-top: 4px solid #eb9c39;
}

.notice-board-view-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding: 0px 2rem;
    min-height: 50px;
}

.notice-board-view-head-subject {
    font-size: 20px;
    font-weight: 500;
    color: #1b1b28;
    margin-bottom: 0px;
}

.notice-board-view-head-date {
    display: flex;
    align-items: center;
    gap: 4px;
    color: #707070;
}

.notice-board-view-head-date-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background-color: #f1f1f1;
    border-radius: 4px;
    color: #707070;
}

    .notice-board-view-head-date-icon svg {
        width: 22px;
        height: 22px;
    }

.notice-board-view-body {
    /*padding: 0rem 2rem;*/
    padding-bottom: 1rem;
}

.noticeboard-users-date {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 8px;
    margin-top: 0.5rem;
}

.noticeboard-announce {
    display: flex;
    align-items: end;
    justify-content: end;
    flex-direction: column;
    margin-top: 0.5rem;
}

.notice-board-view-description {
    margin: 2rem 0px;
}

.notice-board-view-media {
    width: 100%;
    height: 420px;
    margin: 0px 0px;
    position: relative;
    transition: all 200ms ease-in-out;
    box-shadow: 0px 0px 5px #d1d1d1;
    border-radius: 16px;
    position: relative;
}

    .notice-board-view-media img {
        width: 100%;
        height: 100%;
        border-radius: 16px;
        object-fit: cover;
    }

    .notice-board-view-media video {
        border-radius: 16px;
        width: 100%;
        aspect-ratio: 16 / 9;
        object-fit: cover;
        max-width: 100%;
        height: 420px;
        display: inline-block;
        vertical-align: top;
    }

    .notice-board-view-media .video-control {
        margin: 0;
        padding: 0;
        cursor: pointer;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: 0;
        border-radius: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: rgba(0,0,0,0.8);
        -webkit-appearance: none;
        z-index: 2;
        transition: all 200ms ease-in-out;
    }

.video-control-fullscreen {
    margin: 0;
    padding: 0;
    position: absolute;
    bottom: 15px;
    right: 15px;
    border: 0;
    background: transparent;
    cursor: pointer;
    border-radius: 0;
    -webkit-appearance: none;
    z-index: 3;
    transition: all 200ms ease-in-out;
}

.video-control-fullscreen-icon {
    display: block;
    vertical-align: top;
    color: #fff;
    opacity: 0;
    visibility: hidden;
    transition: all 200ms ease-in-out;
}

    .video-control-fullscreen-icon polygon {
        fill: currentColor;
    }

.notice-board-view-media .video-control[data-button-state="play"] {
    background-color: rgba(0,0,0,.4);
}

    .notice-board-view-media .video-control[data-button-state="play"]:hover {
        background-color: rgba(0,0,0,.4);
    }

.notice-board-view-media .video-control[data-button-state="pause"] {
    background-color: rgba(0,0,0,0);
}

    .notice-board-view-media .video-control[data-button-state="pause"]:hover {
        background-color: rgba(0,0,0,.4);
    }

.notice-board-view-media .video-control[data-button-state="play"] .video-control-play {
    display: block;
}

.notice-board-view-media .video-control[data-button-state="play"] .video-control-pause {
    display: none;
}

.notice-board-view-media .video-control[data-button-state="pause"] .video-control-play {
    display: none;
}

.notice-board-view-media .video-control[data-button-state="pause"] .video-control-pause {
    display: block;
    opacity: 0;
}

.notice-board-view-media:hover .video-control[data-button-state="pause"] .video-control-pause {
    display: block;
    opacity: 1;
}

.notice-board-view-media:hover .video-control[data-button-state="pause"] + .video-control-fullscreen .video-control-fullscreen-icon {
    opacity: 1;
    visibility: visible;
}

.video-control-play, .video-control-pause {
    width: 9%;
}

.btn-notice-back {
    display: flex;
    align-items: center;
    gap: 4px;
    border: 1px solid #000;
    padding: 0.15rem 1rem;
    transition: all 0.15s ease-in-out;
}

    .btn-notice-back:hover {
        color: #fff;
        background-color: #000;
    }

    .btn-notice-back svg {
        width: 22px;
        height: 22px;
    }

.ann-not-li.ann-unread .ann-not-group {
    background-color: #f2f2f2;
}

/*new dashboard design*/
.perform-circle-chart {
    display: flex;
    align-items: center;
    justify-content: space-around;
    width: 100%;
    height: 100%;
    padding: 1rem;
}

.perform-circle-chart-divider {
    height: 160px;
    border-right: 1px solid #dfdfdf;
}

.perform-circle-chart-2 {
    /*flex: 1;*/
    padding-right: 40px;
}

.perform-circle-chart-dual {
    display: flex;
    align-items: center;
    gap: 4rem;
    width: 100%;
}

.perform-circle-chart-dual-item {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 10px;
}

.perform-circle-chart-dual-item-color.dual-green {
    background-color: #46bd84;
}

.perform-circle-chart-dual-item-color.dual-blue {
    background-color: #4ca6f7;
}

.perform-circle-chart-dual-item-color.dual-red {
    background-color: #fd4984;
}

.perform-circle-chart-dual-item-color.dual-yellow {
    background-color: #ffc03d;
}


.perform-circle-chart-dual-count {
    font-size: 16px;
    font-weight: 700;
}

.perform-circle-chart-dual-item-colon {
    width: 5px;
    height: 26px;
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 700;
}

.perform-circle-chart-dual-item-label-bold {
    font-size: 13px;
    font-weight: 400;
}

.perform-circle-chart-dual-item-label-percentage {
    font-size: 13px;
    font-weight: 700;
}

.perform-circle-chart-dual-item-label {
    min-width: 80px;
    text-align: right;
    line-height: 1.4;
}

.perform-circle-chart-dual-item-total {
    min-width: 80px;
    text-align: right;
    font-weight: 700;
    font-size: 16px;
}

.perform-circle-chart-dual-item-color {
    background-color: #e8e8e8;
    width: 5px;
    height: 26px;
    border-radius: 18px;
}

.perform-circle-chart-overall {
    display: flex;
    flex-flow: row nowrap;
}

    .perform-circle-chart-overall .single-chart {
        cursor: default;
    }

    .perform-circle-chart-overall .circular-chart {
        display: block;
        margin: 10px auto;
        width: 70%;
        max-height: 250px;
    }

    .perform-circle-chart-overall .circle-bg {
        fill: none;
        stroke: #eee;
        stroke-width: 1.4;
    }

    .perform-circle-chart-overall .circle {
        fill: none;
        stroke-width: 2.8;
        stroke-linecap: round;
        animation: progress 1s ease-out forwards;
    }

    .perform-circle-chart-overall .circular-chart.green .circle {
        stroke: #46bd84;
    }

    .perform-circle-chart-overall .circular-chart.blue .circle {
        stroke: #4ca6f7;
    }

    .perform-circle-chart-overall .circular-chart.yellow .circle {
        stroke: #ffc03d;
    }

    .perform-circle-chart-overall .circular-chart.red .circle {
        stroke: #fd4984;
    }


.perform-circle-chart-overall-percentage-today {
    fill: #4ca6f7;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

.perform-circle-chart-overall-percentage-red {
    fill: #fd4984;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

.perform-circle-chart-overall-percentage-yellow {
    fill: #ffc03d;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

.perform-circle-chart-overall-percentage-blue {
    fill: #4ca6f7;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

.perform-circle-chart-overall-percentage {
    fill: #46bd84;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

.perform-circle-chart-overall-percentage-label {
    fill: #aba9a9;
    font-size: 2.8px;
    font-weight: 500;
    text-anchor: middle;
    white-space: nowrap;
    text-transform: capitalize;
}

.perform-circle-chart-dual-pie {
    display: flex;
    flex-flow: row nowrap;
}

    .perform-circle-chart-dual-pie .single-chart {
        cursor: default;
    }

    .perform-circle-chart-dual-pie .circular-chart {
        display: block;
        margin: 10px auto;
        width: 70%;
        max-height: 250px;
    }

    .perform-circle-chart-dual-pie .circle-bg {
        fill: none;
        stroke: #eeeeee;
        stroke-width: 2.7;
    }

    .perform-circle-chart-dual-pie .circle {
        fill: none;
        stroke-width: 2.8;
        stroke-linecap: square;
        animation: progress 1s ease-out forwards;
    }

@keyframes progress {
    0% {
        stroke-dasharray: 0 100;
    }
}


.perform-circle-chart-dual-pie .circular-chart.green .circle {
    stroke: #46bd84;
}

.perform-circle-chart-dual-pie .circular-chart.blue .circle {
    stroke: #4ca6f7;
}

.perform-circle-chart-dual-pie .circular-chart.red .circle {
    stroke: #fd4984;
}

.perform-circle-chart-dual-pie .circular-chart.yellow .circle {
    stroke: #ffc03d;
}

.perform-circle-chart-dual-pie-percentage {
    fill: #090909;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

.perform-circle-chart-dual-pie-percentage-red {
    fill: #fd4984;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

.perform-circle-chart-dual-pie-percentage-yellow {
    fill: #ffc03d;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

.perform-circle-chart-dual-pie-percentage-green {
    fill: #4bcebd;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

.perform-circle-chart-dual-pie-percentage-blue {
    fill: #4ca6f7;
    font-size: 0.5em;
    text-anchor: middle;
    font-weight: 700;
}

.perform-circle-chart-dual-pie-percentage-label {
    fill: #aba9a9;
    font-size: 2.8px;
    font-weight: 500;
    text-anchor: middle;
    white-space: nowrap;
    text-transform: capitalize;
}

.checklist-head {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #efefef;
    padding: 10px;
    background-color: #f7f7f7;
    text-transform: uppercase;
    color: #6d6d6d;
    font-weight: 500;
}

.checklist-head-store-name-more {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.checklist-head-name {
    flex: 1 1 auto;
    width: 30%;
    padding-left: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.checklist-head-store {
    flex: 1 1 auto;
    width: 70%;
    padding-left: 10px;
}

.btn-viewmore {
    border: 1px solid #c1c1c1;
}

.checklist-body {
    width: 100%;
}

.checklist-item {
    display: flex;
    align-items: baseline;
    padding: 10px;
    cursor: pointer;
}

.checklist-title {
    flex: 1 1 auto;
    width: 30%;
    padding-left: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: capitalize;
    font-weight: 500;
}

.checklist-progress {
    flex: 1 1 auto;
    width: 70%;
    padding-left: 10px;
}

.checklist-progress-value-bar {
    display: flex;
    gap: 12px;
}

.checklist-progress-value {
    font-size: 14px;
    font-weight: 500;
}

.checklist-progress-bar {
    flex: 1;
    padding-top: 6px;
}

    .checklist-progress-bar .progress {
        background-color: #ebedf2;
        height: 6px;
    }

        .checklist-progress-bar .progress .progress-bar {
            border-radius: 0.25rem;
        }

.progress-text p {
    margin-bottom: 0px;
    color: #544747;
    font-size: 12px;
}

.progress-bar-red {
    background-color: #fd4984;
}

.progress-bar-yellow {
    background-color: #ffc03d;
}

.progress-bar-blue {
    background-color: #4ca6f7;
}

.progress-bar-green {
    background-color: #4bcebd;
}

.card-pending-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    color: #6f6f6f;
    font-weight: 700;
}

.card-pending-body {
    padding: 10px;
    padding-top: 0px;
}

.card-pending-chart-title {
    font-weight: 600;
    font-size: 14px;
}

.card-tickets-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    color: #6f6f6f;
    font-weight: 700;
}

.card-tickets-body {
    /*    padding: 10px;
    padding-top: 0px;*/
}

.ticketslist-head {
    display: flex;
    align-items: baseline;
    padding: 10px;
    cursor: default;
    color: #6d6d6d;
}

.ticketslist-head-sno {
    flex: 1 1 auto;
    width: 15%;
    padding-left: 10px;
}

.ticketslist-head-title {
    flex: 1 1 auto;
    width: 70%;
    padding-left: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: capitalize;
}

.ticketslist-head-count {
    flex: 1 1 auto;
    width: 25%;
    padding-left: 10px;
    padding-right: 10px;
    text-align: right;
}

.ticketslist-item {
    display: flex;
    align-items: baseline;
    padding: 10px;
    cursor: pointer;
}

.ticketslist-sno {
    flex: 1 1 auto;
    width: 15%;
    padding-left: 10px;
}

.ticketslist-title {
    flex: 1 1 auto;
    width: 70%;
    padding-left: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ticketslist-count {
    flex: 1 1 auto;
    width: 25%;
    padding-left: 10px;
    padding-right: 10px;
    text-align: right;
}

    .ticketslist-count span {
        background-color: #e3ebff;
        padding: 2px 4px;
        border-radius: 4px;
        font-weight: 500;
        color: #373333;
        min-width: 23px;
        height: 22px;
        line-height: 1.4;
        display: inline-block;
    }

.card-tickets-more {
    padding: 10px;
    text-align: center;
    cursor: pointer;
    font-weight: 500;
    color: #737373;
}

    .card-tickets-more span {
        transition: all 0.15s ease-in-out;
    }

    .card-tickets-more:hover span {
        text-decoration: underline;
    }

div.evedivs {
    max-height: calc(100vh - 210px);
}

.loader-body {
    display: flex;
    align-items: center;
    justify-content: center;
    height: calc(100vh - 260px);
}

.loading {
    height: 0;
    width: 0;
    padding: 15px;
    border: 6px solid #eb9c3942;
    border-right-color: #eb9c39;
    border-radius: 22px;
    -webkit-animation: rotate 1s infinite linear;
}

@-webkit-keyframes rotate {
    100% {
        -webkit-transform: rotate(360deg);
    }
}

.checklist-item {
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

    .checklist-item:hover {
        background-color: #f7f7f7;
    }

.checklistdetails-item {
    cursor: default;
    border: 1px solid #e5e5e5;
    padding: 0px 1rem;
    border-radius: 8px;
}

.checklistdetails-item-progress {
    width: 100%;
}

.checklistdetails-item-progress-value-bar {
    display: flex;
    align-items: center;
    gap: 12px;
}

.checklistdetails-item-progress-value {
    font-size: 60px;
    font-weight: 500;
}

.checklistdetails-item-progress-bar {
    flex: 1;
    padding-top: 6px;
}

    .checklistdetails-item-progress-bar .progress {
        background-color: #ebedf2;
        border-radius: 16px;
        height: 12px;
    }

        .checklistdetails-item-progress-bar .progress .progress-bar {
            border-radius: 16px;
        }

.checklistdetails-item-progress-text p {
    margin-bottom: 0px;
    color: #544747;
    font-size: 16px;
}

.checklistdetails-item-progress-divider {
    height: 60px;
    border-right: 1px solid #dfdfdf;
}

.storelist-scroll {
    height: calc(100vh - 348px);
/*    height: calc(100vh - 408px);*/ 
        overflow: auto;
}

    .storelist-scroll::-webkit-scrollbar {
        background: transparent;
        height: 8px;
        width: 8px;
    }

    .storelist-scroll::-webkit-scrollbar-thumb {
        border: 0px solid #ffffff;
        background: #dadce0;
        border-radius: 8px;
        min-height: 40px;
    }

    .storelist-scroll::-webkit-scrollbar-track {
        background: #f4f4f4;
    }

.storelist-ul {
    /*display: grid;*/
    gap: 1rem;
    padding: 2px 1rem;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    /*grid-auto-rows: minmax(100px, auto);*/
}

.storelist-li {
    box-shadow: 0px 0px 4px #d0d0d0;
    border-radius: 4px;
    padding: 0.5rem;
    cursor: default;
    transition: all 0.15s ease-in-out;
    margin-bottom: 1rem;
    cursor: pointer;
}

    .storelist-li:hover {
        transform: scale(1.01);
    }

    .storelist-li .fw-bold {
        font-weight: 700;
        font-size: 14px;
    }

.storelist-control {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.storelist-name {
    display: flex;
    align-items: center;
    gap: 4px;
    flex: 1;
    white-space: nowrap;
}

.storelist-name-icon {
    background-color: #efefef;
    color: #453c3c;
    border-radius: 4px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .storelist-name-icon svg {
        width: 20px;
        height: 20px;
    }

.storelist-name-info {
    font-size: 16px;
    font-weight: 500;
    color: #323232;
}

.storelist-percentage {
    font-size: 12px;
    font-weight: 500;
    background-color: #ccc;
    border-radius: 4px;
    padding: 0px 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.storelist-bg-red {
    background-color: #fd498426;
    color: #fd4984;
}

.storelist-bg-yellow {
    background-color: #ffc03d26;
    color: #ffac00;
}

.storelist-bg-blue {
    background-color: #4ca6f726;
    color: #2698ff;
}

.storelist-bg-green {
    background-color: #31bdab26;
    color: #00ac96;
}

.storelist-bg-critical {
    color: #5867dd;
    background-color: rgba(79, 70, 229, 0.1);
}

.checklist-details-card {
    display: flex;
}

.card-bx.card-bx-left {
    margin-right: 20px;
}

    .card-bx.card-bx-left .cds {
        padding: 0rem;
    }

.checklist-search {
    padding: 1rem 1rem 1rem 1rem;
}

.checklist-all-items-ul {
    display: block;
    margin: 0;
    border: 0;
    height: calc(100vh - 218px);
    overflow: auto;
}

    .checklist-all-items-ul::-webkit-scrollbar {
        background: transparent;
        height: 8px;
        width: 6px;
    }

    .checklist-all-items-ul::-webkit-scrollbar-thumb {
        border: 0px solid #ffffff;
        background: #dadce0;
        border-radius: 8px;
        min-height: 40px;
    }

.checklist-all-items-li {
    padding: 0.5rem 20px;
    border-radius: 4px;
    display: flex;
    flex-grow: 1;
    align-items: center;
    cursor: pointer;
    margin-right: 1rem;
    margin-left: 1rem;
    margin-bottom: 0.5rem;
    transition: all 0.3s;
}

.checklist-all-items-text {
    font-weight: 400;
    color: #838383;
    font-size: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 160px;
    margin-left: 10px;
}

.checklist-all-items-li svg {
    color: #363636;
}

.checklist-all-items-li:hover {
    background-color: rgb(235 156 57 / 11%);
    color: #d37500 !important;
    transition: all 0.3s;
}

    .checklist-all-items-li:hover svg {
        color: #d37500 !important;
    }

    .checklist-all-items-li:hover .checklist-all-items-text {
        color: #d37500 !important;
    }

.checklist-all-items-li.active {
    background-color: rgb(235 156 57 / 11%);
    color: #d37500 !important;
    transition: all 0.3s;
}

    .checklist-all-items-li.active svg {
        color: #d37500 !important;
    }

    .checklist-all-items-li.active .checklist-all-items-text {
        color: #d37500 !important;
    }

.checklist-body {
    max-height: 500px;
    overflow: auto;
}

    .checklist-body::-webkit-scrollbar {
        background: transparent;
        height: 8px;
        width: 8px;
    }

    .checklist-body::-webkit-scrollbar-thumb {
        border: 0px solid #ffffff;
        background: #dadce0;
        border-radius: 8px;
        min-height: 40px;
    }

    .checklist-body::-webkit-scrollbar-track {
        background: #f4f4f4;
    }

span.checklist-all-items-percentage {
    margin-left: 10px;
    font-size: 12px;
}
/* START TOOLTIP STYLES */
[tooltip] {
    position: relative;
}

    /* Applies to all tooltips */
    [tooltip]::before,
    [tooltip]::after {
        text-transform: none;
        font-size: .9rem;
        line-height: 1;
        user-select: none;
        pointer-events: none;
        position: absolute;
        display: none;
        opacity: 0;
    }

    [tooltip]::before {
        content: '';
        border: 5px solid transparent;
        z-index: 1001;
    }

    [tooltip]::after {
        content: attr(tooltip);
        font-family: Poppins, Helvetica, sans-serif;
        text-align: center;
        min-width: 3em;
        max-width: 21em;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 1ch 1.5ch;
        border-radius: .3ch;
        box-shadow: 0 1em 2em -.5em rgba(0, 0, 0, 0.35);
        background: #333;
        color: #fff;
        z-index: 1000;
    }

    /* Make the tooltips respond to hover */
    [tooltip]:hover::before,
    [tooltip]:hover::after {
        display: block;
    }

/* don't show empty tooltips */
[tooltip='']::before,
[tooltip='']::after {
    display: none !important;
}

/* FLOW: UP */
[tooltip]:not([flow])::before,
[tooltip][flow^="up"]::before {
    bottom: 100%;
    border-bottom-width: 0;
    border-top-color: #333;
}

[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::after {
    bottom: calc(100% + 5px);
}

[tooltip]:not([flow])::before,
[tooltip]:not([flow])::after,
[tooltip][flow^="up"]::before,
[tooltip][flow^="up"]::after {
    left: 50%;
    transform: translate(-50%, -.5em);
}

/* FLOW: DOWN */
[tooltip][flow^="down"]::before {
    top: 100%;
    border-top-width: 0;
    border-bottom-color: #333;
}

[tooltip][flow^="down"]::after {
    top: calc(100% + 5px);
}

[tooltip][flow^="down"]::before,
[tooltip][flow^="down"]::after {
    left: 50%;
    transform: translate(-50%, .5em);
}

/* FLOW: LEFT */
[tooltip][flow^="left"]::before {
    top: 50%;
    border-right-width: 0;
    border-left-color: #333;
    left: calc(0em - 5px);
    transform: translate(-.5em, -50%);
}

[tooltip][flow^="left"]::after {
    top: 50%;
    right: calc(100% + 5px);
    transform: translate(-.5em, -50%);
}

/* FLOW: RIGHT */
[tooltip][flow^="right"]::before {
    top: 50%;
    border-left-width: 0;
    border-right-color: #333;
    right: calc(0em - 5px);
    transform: translate(.5em, -50%);
}

[tooltip][flow^="right"]::after {
    top: 50%;
    left: calc(100% + 5px);
    transform: translate(.5em, -50%);
}

/* KEYFRAMES */
@keyframes tooltips-vert {
    to {
        opacity: .9;
        transform: translate(-50%, 0);
    }
}

@keyframes tooltips-horz {
    to {
        opacity: .9;
        transform: translate(0, -50%);
    }
}

/* FX All The Things */
[tooltip]:not([flow]):hover::before,
[tooltip]:not([flow]):hover::after,
[tooltip][flow^="up"]:hover::before,
[tooltip][flow^="up"]:hover::after,
[tooltip][flow^="down"]:hover::before,
[tooltip][flow^="down"]:hover::after {
    animation: tooltips-vert 300ms ease-out forwards;
}

[tooltip][flow^="left"]:hover::before,
[tooltip][flow^="left"]:hover::after,
[tooltip][flow^="right"]:hover::before,
[tooltip][flow^="right"]:hover::after {
    animation: tooltips-horz 300ms ease-out forwards;
}

.perform-circle-chart-dual-pie .circular-chart {
    margin: 0px auto;
    width: 200px;
}

.perform-circle-chart-2 {
    padding-right: 0px;
    width: 100%;
}

.perform-circle-chart-overall .circular-chart {
    display: block;
    margin: 0px auto;
    width: 200px;
    max-height: 250px;
}

.perform-circle-chart-dual {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    gap: 0rem;
    width: 100%;
}

.perform-circle-chart {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 1rem;
}

.ann-unread-dropdown-title {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 20rem;
    padding: 0px 6px;
    font-weight: 500;
    color: #000000;
}

.performance-item-ul {
    display: flex;
    gap: 10px;
}

.performance-item-li {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 57px;
    flex: 1 1 auto;
    box-shadow: 2px 2px 13px 0px #0000001c;
    border: 1px solid #fff;
    border-radius: 8px;
    overflow: hidden;
}

.performance-item-icon {
    height: 100%;
    width: 57px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #46bd8436;
    color: #46bd84;
    border-radius: 4px 0px 0px 4px;
}

.performance-item-li.per-top .performance-item-icon {
    background-color: #46bd8424;
    color: #69c498;
}

.performance-item-li.per-low .performance-item-icon {
    background-color: #d0383814;
    color: #d03838;
}

.performance-item-icon svg {
    width: 26px;
    height: 26px;
}

.performance-item-label {
    font-weight: 500;
    font-size: 16px;
}

.card1 {
    min-height: 100px;
}
/*.unread-user-ul {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}*/

.unread-user-li {
    border-radius: 4px;
    cursor: default;
    background-color: #F7F7F7;
    width: 200px;
    display: flex;
    align-items: center;
}

.unread-user-li-icon {
    width: 26px;
    height: 26px;
    margin-right: 4px;
    background-color: #E4E6E7;
    color: #AEB4B7;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px 0px 0px 4px;
}

    .unread-user-li-icon svg {
        width: 18px;
        height: 18px;
    }

.unread-user-li-name {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 180px;
}


.sideinfobar {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 999;
    top: 0;
    right: 0;
    background-color: #fff;
    overflow-x: hidden;
    box-shadow: 0 .1rem 1rem .25rem #0000000d !important;
    transition: all .3s ease 0s !important;
}

    .sideinfobar.sideinfobar--on {
        width: 50% !important;
    }

div#unreadsidebar.sideinfobar--on {
    width: 40% !important;
}

div#storeclosesidebar.sideinfobar--on {
    width: 30% !important;
}

.sideinfobar-portlet {
    display: flex;
    flex-direction: column;
    box-shadow: 0 0 13px #523f690d;
    background-color: #fff;
    border-radius: 4px;
}

.sideinfobar-portlet-head {
    min-height: 50px;
    background-color: #F9F5F1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0px 1.25rem;
}

    .sideinfobar-portlet-head h5 {
        font-weight: 500;
        font-size: 1.3rem;
        color: #48465B;
    }

.sideinfobar-portlet-head-close {
    height: 2rem;
    width: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    color: #333;
    background-color: transparent;
    border: 0px;
    border-radius: 4px;
}

    .sideinfobar-portlet-head-close:hover {
        color: #fff;
        background-color: #F5A33B;
        border-color: #F5A33B;
    }

    .sideinfobar-portlet-head-close svg {
        width: 24px;
        height: 24px;
    }

.sideinfobar-portlet-body {
    display: flex;
    flex-direction: column;
    padding: 1.25rem;
    border-radius: 4px;
    height: calc(100vh - 80px);
    overflow: auto;
    position: relative;
}

.sideinfobar-overlay {
    background-color: #323a4633;
    position: absolute;
    inset: 0;
    display: none;
    z-index: 998;
    transition: all .2s ease-out;
}

.unread-user-ul {
    /*    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;*/
}

.unread-user-li {
    border-radius: 4px;
    cursor: default;
    background-color: #F7F7F7;
    width: 100%;
    display: flex;
    align-items: center;
    margin-bottom: 0.5rem;
}

.unread-user-li-icon {
    min-width: 40px;
    height: 40px;
    margin-right: 8px;
    background-color: #E4E6E7;
    color: #AEB4B7;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px 0px 0px 4px;
}

    .unread-user-li-icon svg {
        width: 18px;
        height: 18px;
    }

.unread-user-li-name {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 90%;
    font-size: 13px;
    font-weight: 500;
}

.unread-user-li-control {
    flex: 1;
    line-height: 1.3;
    padding-top: 4px;
}

.unread-user-li-id {
    font-size: 12px;
    color: #6B6767;
}


.reload-btn.cursor-pointer {
    padding-left: 1rem;
}

.reload-btn svg {
    width: 26px;
    height: 26px;
    color: #c7c7c7;
}

button.theme-muted {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0px;
    min-width: auto;
}

    button.theme-muted.muted {
        cursor: default;
    }

        button.theme-muted.muted svg {
            color: #CCD !important;
            fill: #ccc !important;
        }

.unread-user-li-group {
    display: flex;
    align-items: end;
    width: 100%;
    padding-right: 8px;
}

.unread-user-li-control {
    flex: 1;
}

div#unreadsidebar .notice-board-view-media {
    height: 240px;
}

    div#unreadsidebar .notice-board-view-media video {
        height: 240px;
    }

.noticeboard-title {
    padding-left: 12px;
    position: relative;
}

    .noticeboard-title:before {
        content: "";
        width: 4px;
        height: 18px;
        background-color: #f3a03a;
        position: absolute;
        top: 2px;
        left: 2px;
        border-radius: 4px;
    }

    .noticeboard-title h5 {
        margin-bottom: 0.85rem;
    }

.noticeboard-users-date {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 8px;
    margin-top: 0.5rem;
}

.noticeboard-users {
    display: flex;
    align-items: center;
    gap: 6px;
}

.noticeboard-users-icon {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f3f3f3;
    border-radius: 4px;
}

.noticeboard-users-date-hr {
    height: 20px;
    border-left: 1px solid #ccc;
}

.noticeboard-date {
    display: flex;
    align-items: center;
    gap: 4px;
}

.noticeboard-date-icon {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f3f3f3;
    border-radius: 4px;
}

.noticeboard-description label {
    font-weight: 500;
    font-size: 16px;
}

#unreadsidebar .nav-tabs {
    margin-bottom: 0px;
    border-bottom: 2px solid #f6a33b;
}

    #unreadsidebar .nav-tabs .nav-link {
        border: 1px solid transparent;
        background-color: transparent;
        margin-bottom: -1px;
    }

        #unreadsidebar .nav-tabs .nav-link.active {
            color: #f3a03a;
            background-color: #f3a03a1a;
            border-color: #f3a03a;
        }

        #unreadsidebar .nav-tabs .nav-link:hover, #unreadsidebar .nav-tabs .nav-link:focus {
            border-color: #f6a33b;
        }

#unreadsidebar .tab-content {
    padding: 1rem;
    min-height: 460px;
    max-height: 460px;
    overflow: auto;
}

    #unreadsidebar .tab-content::-webkit-scrollbar {
        width: 5px;
    }

    #unreadsidebar .tab-content::-webkit-scrollbar-thumb {
        background: #c1c1c1;
    }

    #unreadsidebar .tab-content::-webkit-scrollbar-track {
        background: #ebe9f2;
    }

.expired-notice-bd {
    background-color: #ffe0e0;
    color: #d50000;
    border-radius: 4px;
    padding: 0px 4px 2px 4px;
    font-weight: 500;
    font-size: 12px;
}

.yellow-notice-bd {
    background-color: #ffc03d;
    color: #d50000;
    border-radius: 4px;
    padding: 0px 4px 2px 4px;
    font-weight: 500;
    font-size: 12px;
}

.green-notice-bd {
    background-color: #3fa473;
    color: #d50000;
    border-radius: 4px;
    padding: 0px 4px 2px 4px;
    font-weight: 500;
    font-size: 12px;
}

.expired-notice-bd {
    background-color: #ffe0e0;
    color: #d50000;
    border-radius: 4px;
    padding: 0px 4px 2px 4px;
    font-weight: 500;
    font-size: 12px;
}


.active-notice-bd {
    background-color: #ebeeff;
    color: #3548e2;
    border-radius: 4px;
    padding: 0px 4px 2px 4px;
    font-weight: 500;
    font-size: 12px;
}

.store-w-p {
    margin-top: 10px;
    background-color: #f6f6f6;
    padding: 10px;
    border-radius: 8px;
}

.store-w-p-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.store-w-p-item {
    width: 100%;
    box-shadow: 0px 0px 10px #e7e7e7;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 1rem 1rem;
    background-color: #fff;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

    .store-w-p-item:hover {
        background-color: #fffdfa;
        transform: scale(0.96);
    }

.store-w-p-item-icon {
    /*    background-color: #ebebeb;
    border-radius: 50%;
    width: 42px;
    height: 42px;*/
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    font-weight: 500;
}

    .store-w-p-item-icon svg {
        width: 32px;
        height: 32px;
    }

.store-w-p-item-control {
    line-height: 16px;
}

.store-count {
    /*    color: #404040;
    font-size: 22px;
    font-weight: 500;*/
    color: #404040;
    font-size: 11px;
    font-weight: 500;
}

    .store-count small {
        font-size: 12px;
        margin-left: 4px;
    }

.store-p-range {
    color: #818181;
    font-size: 12px;
}

.store-w-p-item.store-green .store-w-p-item-icon {
    /*background-color: #e5f6ee;*/
    color: #3fa473;
}

.store-w-p-item.store-blue .store-w-p-item-icon {
    /*background-color: #e6f4ff;*/
    color: #2196F3;
}

.store-w-p-item.store-yellow .store-w-p-item-icon {
    /*background-color: #fff4e7;*/
    color: #eb9c39;
}

.store-w-p-item.store-red .store-w-p-item-icon {
    /*background-color: #ffeef3;*/
    color: #fd397a;
}

.no-checklist-div {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: calc(100vh - 376px);
}

    .no-checklist-div img {
        width: 300px;
    }

    .no-checklist-div p {
        font-size: 14px;
        font-weight: 500;
        color: #7e8283;
    }

ul#checklist-tab {
    margin-bottom: 0px;
}

    ul#checklist-tab.nav-pills .nav-item .nav-link {
        font-size: 1rem;
        font-weight: 400;
        transition: all 0.3s;
        font-size: 1rem;
        font-weight: 400;
        border: none;
    }

.checklist-nav-div {
    width: 100%;
    min-width: 400px;
    margin: 0 auto;
    border-bottom: 2px solid #2786fb;
    overflow: hidden;
    transition: border 250ms ease;
}

    .checklist-nav-div .nav-pills {
        margin: 0px;
        padding: 0px;
        overflow: hidden;
        display: flex;
        padding-left: 48px;
        list-style-type: none;
    }

        .checklist-nav-div .nav-pills .nav-link {
            padding: 10px 24px 8px;
            background-color: #FFF;
            margin-right: 46px;
            z-index: 2;
            position: relative;
            cursor: pointer;
            color: #777;
            text-transform: uppercase;
            font-weight: 600 !important;
        }

            .checklist-nav-div .nav-pills .nav-link:before,
            .checklist-nav-div .nav-pills .nav-link:after {
                display: block;
                content: " ";
                position: absolute;
                top: 0;
                height: 100%;
                width: 44px;
                background-color: #FFF;
                transition: all 250ms ease;
            }

            .checklist-nav-div .nav-pills .nav-link:before {
                right: -24px;
                transform: skew(30deg, 0deg);
                box-shadow: rgba(0, 0, 0, .1) 3px 2px 5px, inset rgba(255, 255, 255, .09) -1px 0;
            }

            .checklist-nav-div .nav-pills .nav-link:after {
                left: -24px;
                transform: skew(-30deg, 0deg);
                box-shadow: rgba(0, 0, 0, .1) -3px 2px 5px, inset rgba(255, 255, 255, .09) 1px 0;
            }

            .checklist-nav-div .nav-pills .nav-link:hover,
            .checklist-nav-div .nav-pills .nav-link:hover:before,
            .checklist-nav-div .nav-pills .nav-link:hover:after {
                background-color: #F4F7F9;
                color: #444;
            }

        .checklist-nav-div .nav-pills .nav-item .nav-link:active,
        .checklist-nav-div .nav-pills .nav-item .nav-link.active,
        .checklist-nav-div .nav-pills .nav-item .nav-link.active:hover {
            background-color: #2786fb;
            color: #ffffff;
        }

        .checklist-nav-div .nav-pills .nav-link.active {
            z-index: 3;
        }

            .checklist-nav-div .nav-pills .nav-link.active,
            .checklist-nav-div .nav-pills .nav-link.active:before,
            .checklist-nav-div .nav-pills .nav-link.active:after {
                background-color: #2786fb;
                color: #fff;
            }

        .checklist-nav-div .nav-pills .nav-link {
            border-radius: 8px 8px 0 0;
        }

            .checklist-nav-div .nav-pills .nav-link:before {
                border-radius: 0 8px 0 0;
            }

            .checklist-nav-div .nav-pills .nav-link:after {
                border-radius: 8px 0 0 0;
            }

/* tabs design */



.storeteamlist-ul {
    display: grid;
    gap: 1rem;
    padding: 2px 1rem;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.storeteamlist-li {
    box-shadow: 0px 0px 4px #d0d0d0;
    border-radius: 4px;
    padding: 0.5rem;
    cursor: default;
    transition: all 0.15s ease-in-out;
    margin-bottom: 1rem;
}

    .storeteamlist-li:hover {
        transform: scale(1.01);
    }

    .storeteamlist-li .fw-bold {
        font-weight: 700;
        font-size: 14px;
    }

.storeteamlist-control {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
}

.storeteamlist-name {
    display: flex;
    align-items: center;
    gap: 4px;
}

.storeteamlist-name-icon {
    background-color: #efefef;
    color: #453c3c;
    border-radius: 4px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .storeteamlist-name-icon svg {
        width: 20px;
        height: 20px;
    }

.storeteamlist-name-info {
    font-size: 16px;
    font-weight: 500;
    color: #323232;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    overflow: hidden;
    -webkit-box-orient: vertical;
}

.storeteamlist-percentage {
    font-size: 12px;
    font-weight: 500;
    background-color: #ccc;
    border-radius: 4px;
    padding: 0px 4px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.storeteamlist-bg-red {
    background-color: #fd498426;
    color: #fd4984;
}

.storeteamlist-bg-yellow {
    background-color: #ffc03d26;
    color: #ffac00;
}

.storeteamlist-bg-blue {
    background-color: #4ca6f726;
    color: #2698ff;
}

.storeteamlist-bg-green {
    background-color: #31bdab26;
    color: #00ac96;
}

.storeteamlist-bg-critical {
    color: #5867dd;
    background-color: rgba(79, 70, 229, 0.1);
}

.assign-team-count {
    background-color: #ddf0ff;
    color: #03A9F4;
    padding: 0px 4px;
    border-radius: 4px;
    margin-bottom: 0px;
    font-size: 18px;
    margin-left: 6px;
}

.area-manager b {
    width: 88px;
    display: inline-flex;
}

#storedetailsoverview .min-h-table {
    max-height: 100%;
}

.img-popup {
    z-index: 1000;
}

.sd-font {
    font-size: 100%;
}

#storedetailsoverview .svg-open svg {
    transform: none;
}

.card-control-info-item.c {
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

.v-card-text.overvs:hover {
    background-color: #fffcf8;
    border: 1px solid #ffe6c8;
    /*transform: scale(1.005);*/
}

.get-st-dt-side {
    width: 28px;
    height: 28px;
    background-color: #ededed;
    border: 1px solid #dddddd;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 6px;
}

    .get-st-dt-side.mt-3 svg {
        width: 22px;
        height: 22px;
    }

.close-ribbon {
    width: 150px;
    height: 150px;
    overflow: hidden;
    position: absolute;
    z-index: 9;
}

    .close-ribbon::before,
    .close-ribbon::after {
        position: absolute;
        z-index: -1;
        content: '';
        display: block;
        border: 5px solid #b92929;
    }

    .close-ribbon span {
        position: absolute;
        display: block;
        width: 225px;
        padding: 15px 0;
        background-color: #db3434;
        box-shadow: 0 5px 10px rgba(0,0,0,.1);
        color: #fff;
        text-shadow: 0 1px 1px rgba(0,0,0,.2);
        text-transform: uppercase;
        text-align: center;
    }

/* top right*/
.close-ribbon-top-right {
    top: -10px;
    right: -10px;
}

    .close-ribbon-top-right::before,
    .close-ribbon-top-right::after {
        border-top-color: transparent;
        border-right-color: transparent;
    }

    .close-ribbon-top-right::before {
        top: 1px;
        left: 0;
    }

    .close-ribbon-top-right::after {
        bottom: 0;
        right: 1px;
    }

    .close-ribbon-top-right span {
        left: -25px;
        top: 30px;
        transform: rotate(45deg);
    }

.kt-badge.kt-badge--xl {
    height: auto;
    width: auto;
    padding: 4px 6px;
    font-size: 1.1rem;
    font-weight: 500;
}

.card.overchecklist-card {
    border: 1px solid #e9ebf0;
    border-radius: 4px;
    box-shadow: none;
    margin-bottom: 12px;
}

.overchecklist-card .card-header {
    background-color: transparent;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.25rem !important;
}

.overchecklist-card-count {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

    .overchecklist-card-count svg {
        width: 28px;
        height: 28px;
        transition: all 0.15s ease-in-out;
        color: #bfbfbf;
    }

.overchecklist-card .card-header[aria-expanded="true"] .overchecklist-card-count svg {
    transform: rotate(180deg);
    transition: all 0.15s ease-in-out;
}

.overchecklist-card-body {
    border-top: 1px solid #e9ebf0 !important;
}

.card-location {
    position: relative;
}

.store-close-bdg {
    background-color: #ffd5d5;
    color: #cf0000;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 6px;
    position: absolute;
    right: 0;
    top: 10px;
    font-size: 12px;
    border-radius: 4px 0px 0px 4px;
}

    .store-close-bdg svg {
        width: 16px;
        height: 16px;
    }

span.bclose {
    cursor: pointer;
}
/*.checklistdetails-item-progress-text {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 4px;
}*/
.btn.btn-store-not {
    background-color: #ffe7e5;
    color: #f44336;
    padding: 0px 6px;
    width: 100%;
    font-size: 11px;
    font-weight: 600;
}

.managesch-warn {
    background-color: #dbefff;
    border-left: 6px solid #2196F3;
    width: 100%;
    border-radius: 4px;
    padding: 1rem;
    color: #005ca5;
}

    .managesch-warn ul {
        padding: 0px;
        margin: 0px;
        padding-left: 20px;
    }

.card-location {
    background-color: #d6edff;
}

.card-check {
    background-color: #dbffec;
}

.card-team {
    background-color: #fff9e5;
}

.card.justify-content-center.p-3.mb-3.card-tile.card1.card-bs.card-ticket.h-100 {
    background-color: #f8e4ff;
}

.card-control {
    background-color: #fff;
    flex: 1;
    border-radius: 6px;
    padding: 8px 12px;
    margin: 0px 8px 0px 0px;
}

.card-location .card-control {
    border: 1px solid #cce8fe;
}

.card-check .card-control {
    border: 1px solid #73ffb6;
}

.card-team .card-control {
    border: 1px solid #ffefbd;
}

.card-ticket .card-control {
    border: 1px solid #f4d6ff;
}

.card-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.card-out-det {
    line-height: 1.1;
    text-align: center;
}

.card-out-det-val {
    font-size: 1.75rem;
    font-weight: 600;
    color: #000;
}

.card-out-det-lab {
    font-size: 11px;
}

.card-control-info-item {
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid #c8e7ff;
    border-radius: 6px;
    padding: 4px;
}

.card-control-info-item-count {
    background-color: #ededed;
    font-size: 16px;
    font-weight: 500;
    min-width: 34px;
    padding: 0px 8px;
    border-radius: 4px;
    text-align: center;
}

.card-control-info-item-value {
    font-weight: 500;
}

.card-control-info-item:first-child {
    margin-bottom: 6px;
}

.card-icn svg {
    margin-bottom: auto;
}

.noticeboard-announce-user {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 160px;
}

.card-team .card-control-info-item {
    border: 1px solid #ffecac;
}

.iscom-check {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem 1rem;
    border-top: 1px solid #ebebeb;
    width: 100%;
    padding-top: 2rem;
}

    .iscom-check .kt-checkbox-inline .kt-checkbox {
        margin-bottom: 0px;
        padding-left: 26px;
    }


/*#viewreasonsidebar .sideinfobar-portlet-body {
    height: calc(100vh - 112px);
}
.sideinfobar-portlet-footer {
    border-top: 1px solid #ccc;
    padding: 1rem 1.25rem;
}*/

#viewreasonsidebar.sideinfobar.sideinfobar--on {
    width: 30% !important;
}

.order-tracking.skipped:before {
    background-color: #c3c3c3;
}

.order-tracking .is-complete.is-skipped {
    display: flex;
    position: relative;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    height: 30px;
    width: 30px;
    border: 0px solid #afafaf;
    background-color: #f9ecdb;
    margin: 0 auto;
    transition: background 0.25s linear;
    -webkit-transition: background 0.25s linear;
    z-index: 2;
    background-image: url("data:image/svg+xml,%3Csvg fill='%23ea9b39' xmlns='http://www.w3.org/2000/svg' width='18px' height='18px' viewBox='0 0 52 52' enable-background='new 0 0 52 52' xml:space='preserve'%3E%3Cg id='SVGRepo_bgCarrier' stroke-width='0'%3E%3C/g%3E%3Cg id='SVGRepo_tracerCarrier' stroke-linecap='round' stroke-linejoin='round'%3E%3C/g%3E%3Cg id='SVGRepo_iconCarrier'%3E%3Cg%3E%3Cpath d='M39.5,32.3V33c0,1,0.7,1,1.3,0.4l4.9-4.9c0.5-0.6,1.5-0.6,2.1,0l2.1,2.1c0.6,0.5,0.6,1.5,0,2.1L37,45.6 c-0.5,0.5-1.3,0.5-1.8,0l-13-13c-0.5-0.6-0.5-1.3,0.1-1.9l2.2-2.2c0.6-0.6,1.5-0.7,2.1-0.1l4.9,4.9c0.7,0.7,1.3,0.9,1.7,0.1 c0.1-0.3,0.1-1.1,0.1-1.1v-7.3c0-7.1-5.7-12.8-12.8-12.8S7.7,17.8,7.7,24.9v13.3c0,0.8-0.7,1.4-1.5,1.4H3c-0.8,0-1.4-0.5-1.4-1.3 V24.9C1.6,14.5,10,6,20.5,6s18.9,8.5,18.9,18.9L39.5,32.3z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.reason {
    font-size: 11px;
    color: #4a4a4a;
}

.reason-list-group .list-group-item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.reason-list-group .list-item-control {
    flex: 1;
}

.list-item-action {
    display: flex;
    align-items: center;
    gap: 4px;
}

.list-item-action-btn {
    cursor: pointer;
    width: 28px;
    height: 28px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f5f5f5;
    transition: all 0.15s ease-in-out;
}

    .list-item-action-btn:hover {
        background-color: #e7e7e7;
    }

    .list-item-action-btn svg {
        width: 20px;
        height: 20px;
    }

#viewreasonsidebar .sideinfobar-portlet-body {
    height: calc(100vh - 116px);
}

.sideinfobar-portlet-footer {
    padding: 1.25rem;
    border-top: 1px solid #e5e5e5;
}

.reason-radio-div {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.sb-form-check {
    height: calc(1.5em + 1.3rem + 2px);
    flex: 1;
    display: flex;
    align-items: center;
}

.sb-form-check-input[type="radio"]:checked,
.sb-form-check-input[type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}

    .sb-form-check-input[type="radio"]:checked + label,
    .sb-form-check-input[type="radio"]:not(:checked) + label {
        position: relative;
        padding-left: 22px;
        cursor: pointer;
        display: flex;
        color: #666;
        margin-bottom: 0px;
        flex: 1;
        padding: 0.65rem 1rem;
        padding-left: 32px;
        border: 1px solid #e9e9e9;
        border-radius: 4px;
    }

    .sb-form-check-input[type="radio"]:checked + label {
        background-color: #fff6eb;
        border: 1px solid #ffe3c1;
    }

        .sb-form-check-input[type="radio"]:checked + label:before,
        .sb-form-check-input[type="radio"]:not(:checked) + label:before {
            content: '';
            position: absolute;
            left: 10px;
            top: 10px;
            width: 18px;
            height: 18px;
            border: 1px solid #ddd;
            border-radius: 100%;
            background: #fff;
        }

        .sb-form-check-input[type="radio"]:checked + label:after,
        .sb-form-check-input[type="radio"]:not(:checked) + label:after {
            content: '';
            width: 12px;
            height: 12px;
            background: #eb9c39;
            position: absolute;
            top: 13px;
            left: 13px;
            border-radius: 100%;
            -webkit-transition: all 0.2s ease;
            transition: all 0.2s ease;
        }

    .sb-form-check-input[type="radio"]:not(:checked) + label:after {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    .sb-form-check-input[type="radio"]:checked + label:after {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
    }
/*ul#reasonsListContainer.specific-scroll {
    height: calc(100vh - 720px);
    overflow: auto;
}
ul#reasonsListContainer.all-scroll {
    height: calc(100vh - 520px);
    overflow: auto;
}*/

.btn-outline-brand {
    color: #1b1b28;
    border-color: #1b1b28;
}

    .btn-outline-brand:hover {
        color: #ffffff;
        background-color: #1b1b28;
        border-color: #1b1b28;
    }

.order-track-status {
    margin-bottom: 0px !important;
    position: absolute;
    top: 32px;
    left: 0;
    white-space: nowrap;
    background-color: #fff;
    z-index: 1;
    padding: 0px 6px;
}

.order-tracking.completed .order-track-status {
    left: -24px;
    color: #049f6d;
}

.order-tracking.is-danger .order-track-status {
    left: -40px;
    color: #f1155f;
}

.order-tracking.skipped .order-track-status {
    left: -28px;
    color: #717070;
}

.order-tracking.completed.is-danger.is-late .order-track-status {
    left: -26px;
    color: #f55424;
}

.kt-badge.kt-badge--unified-yellow {
    color: #eb9c39;
    background: rgb(249 236 219);
}

.ck.ck-powered-by {
    display: none !important;
}


.side-open-close {
    top: 22px;
    right: -40px;
    bottom: 99%;
    width: 60px;
    height: 20px;
    position: absolute;
    clip-path: url(#menu);
    will-change: transform;
    background-color: #1e1e2d;
    transform: rotate(90deg);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #d1cfcf;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

    .side-open-close:hover {
        color: #fff;
    }

.toggled svg.toggle-arrow-svg {
    width: 20px;
    height: 20px;
    transform: rotate(90deg);
    margin-bottom: -8px;
    transition: all 0.15s ease-in-out;
}

svg.toggle-arrow-svg {
    transform: rotate(270deg);
    width: 20px;
    height: 20px;
    margin-bottom: -8px;
    transition: all 0.15s ease-in-out;
}

.view-notice-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.view-notice-header-action {
    display: flex;
    align-items: center;
    gap: 8px;
}

.view-notice-header-search svg {
    color: #a6a6a6;
    width: 20px;
    height: 20px;
}

.view-notice-header-search .form-control.kt-quick-search__input {
    height: calc(1.3em + 1rem + 7px);
    padding-left: 1rem !important;
}

.view-notice-header-title h4 {
    margin-bottom: 0px;
}

.view-notice-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.view-notice-header-action .btn {
    border-radius: 6px;
}

.view-notice-header-title {
    display: flex;
    align-items: center;
    gap: 8px;
}

.view-notice-tiles {
    margin: 2rem 0px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 2fr;
    gap: 1.8rem;
}

.view-notice-tile-item {
    background-color: #fff;
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    cursor: pointer;
}

    .view-notice-tile-item.notice-read {
        cursor: default;
    }

.view-notice-tile-icon {
    width: 48px;
    height: 48px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .view-notice-tile-icon svg {
        width: 34px;
        height: 34px;
    }

.view-notice-tile-control {
    flex: 1;
}

.view-notice-tile-title {
    font-size: 16px;
    font-weight: 500;
}

.view-notice-tile-count {
    font-size: 24px;
    font-weight: 600;
    line-height: 1;
}

.view-notice-tile-item.notice-total .view-notice-tile-icon {
    background-color: #d3f3e6;
    color: #0da258;
}

.view-notice-tile-item.notice-active .view-notice-tile-icon {
    background-color: #e0f3ff;
    color: #008df2;
}

.view-notice-tile-item.notice-expired .view-notice-tile-icon {
    background-color: #ffe4e4;
    color: #d03838;
}

.view-notice-tile-item.notice-read .view-notice-tile-icon {
    background-color: #ffefdc;
    color: #ff7049;
}

.view-notice-tile-item.notice-total .view-notice-tile-count {
    color: #0da258;
}

.view-notice-tile-item.notice-active .view-notice-tile-count {
    color: #008df2;
}

.view-notice-tile-item.notice-expired .view-notice-tile-count {
    color: #d03838;
}

.view-notice-tile-item.notice-read .view-notice-tile-read-percentage {
    color: #ff7049;
}

.view-notice-tile-read {
    flex: 1;
}

.view-notice-tile-read-group {
    display: flex;
    align-items: center;
    gap: 2rem;
}

.view-notice-tile-progress {
    margin-top: 8px;
}

    .view-notice-tile-progress .progress {
        border-radius: 8px;
        height: 8px;
    }

        .view-notice-tile-progress .progress .progress-bar {
            border-radius: 8px;
            background-color: #ff7049;
        }

.view-notice-tile-read-percentage {
    font-size: 40px;
    font-weight: 600;
    line-height: 1;
}

.view-notice-li {
    background-color: #fff;
    border-radius: 8px;
    padding: 1rem;
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    position: relative;
}

    .view-notice-li:hover {
        transform: scale(0.985);
        background-color: #fffbf6;
    }

.view-notice-badge {
    background-color: #ffeae3;
    color: #FF5722;
    padding: 2px 8px;
    position: absolute;
    top: 0;
    right: 0;
    font-size: 11px;
    line-height: 1;
    border-radius: 0px 8px 0px 0px;
}

.view-notice-preview {
    position: relative;
}

.view-play-svg {
    width: 26px;
    height: 26px;
    background-color: #0000008f;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
}

    .view-play-svg svg {
        width: 18px;
        height: 18px;
    }

.view-notice-preview img {
    width: 50px;
    height: 50px;
    border-radius: 6px;
    border: 2px solid #d3d3d3;
    object-fit: cover;
}

.view-notice-control {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 16px;
    color: #777777;
    justify-content: space-between;
}

.view-notice-title {
    font-size: 16px;
    color: #4e4e4e;
    font-weight: 600;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.view-notice-decription {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin-top: 2px;
}

.view-notice-validity {
    display: flex;
    align-items: center;
    gap: 2px;
    margin-top: 6px;
}

.view-notice-validity-icon {
    background-color: #d9d9d9;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
}

.view-notice-validity-control {
    display: flex;
    gap: 12px;
}

.view-notice-right {
    display: flex;
    flex-direction: column;
    align-items: end;
    gap: 4px;
}

.view-notice-status {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 4px;
}

.view-notice-status-dot {
    width: 8px;
    height: 8px;
    background-color: currentColor;
    border-radius: 50%;
}

.view-notice-status.view-notice-active {
    color: #3e50d8;
}

.view-notice-status.view-notice-inactive {
    color: #d03838;
}

.view-notice-users-status {
    background-color: #eeeeee;
    display: flex;
    align-items: center;
    border-radius: 8px;
    width: fit-content;
    justify-content: end;
}

.view-notice-users-count {
    padding: 0px 6px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.view-notice-user-count-icon {
    width: 32px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 2px solid #d0d0d0;
}

    .view-notice-user-count-icon svg {
        width: 18px;
        height: 18px;
    }

.view-notice-user-count-value {
    color: #656565;
    font-weight: 600;
    font-size: 14px;
}

.view-notice-users-percentage {
    height: 100%;
    padding: 2px 8px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 0px 8px 8px 0px;
}

    .view-notice-users-percentage.low {
        background-color: #ffe4e4;
        color: #d03939;
    }

    .view-notice-users-percentage.good {
        background-color: #e4ffe4;
        color: #0ea820;
    }

    .view-notice-users-percentage.medium {
        background-color: #ffefdb;
        color: #e58838;
    }

    .view-notice-users-percentage.moderate {
        background-color: #e0f3ff;
        color: #008df2;
    }

.view-notice-created {
    white-space: nowrap;
}

.created-by {
    color: #1b1b28;
    margin-left: 4px;
    font-weight: 600;
}

.view-notice-ul {
    height: calc(100vh - 360px);
    overflow: auto;
}

    .view-notice-ul::-webkit-scrollbar {
        background: transparent;
        height: 8px;
        width: 16px;
    }


    .view-notice-ul::-webkit-scrollbar-thumb {
        border: 4px solid #f4f4f4;
        background: #dadce0;
        border-radius: 8px;
        min-height: 40px;
    }

.view-notice-footer {
    padding-top: 10px;
}

.view-notice-tile-item.notice-total.active {
    background-color: #d3f3e6;
}

.view-notice-tile-item.notice-active.active {
    background-color: #e0f3ff;
}

.view-notice-tile-item.notice-expired.active {
    background-color: #ffe4e4;
}

.noticeboard-users-date .view-notice-users-percentage {
    font-size: 11px;
    border-radius: 4px;
}

.v-card-text {
    position: relative;
}

    .v-card-text .reason {
        font-size: 12px;
        color: #db0f00;
        background-color: #fdf1f0;
        padding: 0px 8px;
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius: 0px 0px 4px 4px;
    }

.view-notice-preview img {
    object-fit: contain;
}

.view-notice-filterby {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.view-notice-filter {
    display: flex;
    align-items: center;
    gap: 8px;
}

.view-notice-filter-label {
    font-weight: 700;
    color: #1b1b28;
}

.view-notice-filter-item {
    padding: 0px 14px;
    border: 1px solid #b5b5b5;
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

    .view-notice-filter-item:hover {
        background-color: #efefef;
    }

    .view-notice-filter-item.active {
        border: 1px solid #eb9c39;
        background-color: #f9ecdb;
    }

.view-notice-tile-item {
    padding: 0.75rem 1rem;
}

.view-notice-tiles {
    margin: 1rem 0px;
}

.view-notice-li {
    padding: 8px 8px;
}

.view-notice-control {
    line-height: 1.2;
}

.view-notice-users-status-con {
    display: flex;
    align-items: center;
    gap: 6px;
}

.view-notice-decription {
    display: none;
}

.view-no-notice {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    gap: 12px;
}

    .view-no-notice img {
        width: 300px;
    }

    .view-no-notice p {
        font-size: 20px;
        font-weight: 600;
        color: #7b7b7b;
    }

.btn-filter-notice-date {
    background: #fff;
    border: 1px solid #e8eaed;
    border-radius: 6px;
    width: auto;
}

.organization-list-menu {
    transform: translate3d(-238px, 0px, 0px);
    top: 0px;
    left: 0px;
    padding: 12px 8px !important;
    max-width: 230px;
    min-width: 230px;
    cursor: default;
}

.kt-user-card {
    padding: 1rem 1rem !important;
    background-color: #fff8f2 !important;
    border-bottom: 0px solid #d7e3fa !important;
}

.company-list {
    max-height: 236px;
    overflow: auto;
}

    .company-list::-webkit-scrollbar-thumb {
        background-color: #d1d1d1;
    }

.kt-notification .company-list .kt-notification__item:after {
    display: none;
}

.org-li {
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    padding: 6px 13px;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
}

    .org-li:hover {
        background-color: #fff8f2;
    }
    .org-li a {
        color: #000;
    }
.kt-notification .kt-notification-scroll .kt-notification__item:after {
    display: none;
}
.org-ul {
    position: relative;
}
    .org-ul:after {
        bottom: 100%;
        right: -24px;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
        border-left-color: #ffffff;
        border-width: 8px;
        margin-left: -8px;
    }

.t-d-count {
    background-color: #dff1ff;
    color: #0085c1;
    border-radius: 4px;
    padding: 2px 6px;
}
span.storeteamlist-name-info-small {
    font-size: 12px;
    color: #5a5a5a;
}