/*================common css================*/
/*================common css================*/

:root {
    --orange: #fe944f;
    --dark-orange: #ff5e38;
    --dark: #1c524d;
    --white: #ffffff;
    --black: #000000;
    --orange-light: #fab22b;
    --cream: #fef0e7;
    --black-light: #2c2c2b;
    --gray-light: rgba(229, 233, 242, 0.5);
    --gray: #e9f1fc;
    --yellow: #fab22b;
    --bg-lightgreen: #3ab795;
    --bg-light-theme: #93e8bf;

    --gray-light2: #f2f2f2;
    --shimmer-dark: #000;
    --shimmer-light: #fff;
    --shimmer-bg: #222;
    --pink: #f07a9f;

    --shimmer-text-opacity: rgba(255, 255, 255, 0.1);
    --lore-regular: "LORERegular", serif;
}

/* ========================= LORE ================================================= */
@font-face {
    font-family: "LORERegular";
    src: url("../../assets/fonts/lore/LORERegular.eot");
    src: url("../../assets/fonts/lore/LORERegular.eot")
            format("embedded-opentype"),
        url("../../assets/fonts/lore/LORERegular.woff2") format("woff2"),
        url("../../assets/fonts/lore/LORERegular.woff") format("woff"),
        url("../../assets/fonts/lore/LORERegular.ttf") format("truetype"),
        url("../../assets/fonts/lore/LORERegular.svg#LORERegular") format("svg");
}

/*==============================LORE=================================*/

body {
    overflow-x: hidden;
}

/*=============== Common Css Start ================*/

.btn-orange {
    --bs-btn-color: #fff;
    --bs-btn-bg: #fe944f;
    --bs-btn-border-color: #fe944f;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #fa9c5e;
    --bs-btn-hover-border-color: #fa9c5e;
    --bs-btn-focus-shadow-rgb: 48, 154, 94;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #fa9c5e;
    --bs-btn-active-border-color: #fa9c5e;
    --bs-btn-active-shadow: none;
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: #fa9c5e;
    --bs-btn-disabled-border-color: #fa9c5e;
}

.ff-lore {
    font-family: var(--lore-regular);
}

.text-light-green {
    color: #3ab795;
}

.bg-light-theme {
    background: var(--bg-light-theme);
}

.tx-light-theme {
    color: var(--bg-lightgreen);
    font-weight: bold;
}

.bg-light-theme:hover {
    background: var(--bg-light-theme);
}

.tx-thm {
    color: var(--dark);
}

.border-orange {
    border: 1px solid var(--orange);
}

.bg-dark-green {
    background: var(--dark);
}

.border-orange:hover {
    border-color: var(--orange);
}

.a-hover {
    color: var(--dark);
}
.a-hover:hover {
    color: var(--bg-lightgreen);
}

.yellow {
    color: var(--yellow);
}

.add-new-task .round:hover {
    background-color: #d88c01;
}

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

.bg-lightgreen {
    background-color: var(--bg-lightgreen);
}

.bg-yellow:hover {
    background-color: #f19c00 !important;
    transition: all 0.2s linear;
}

.bg-yellow:active {
    background-color: #f19c00 !important;
    border-color: #f19c00 !important;
    transition: all 0.2s linear;
}

.txx-5 {
    font-size: 5px;
}

.object-contain {
    object-fit: contain;
}

.icon-size-1 {
    width: 15px;
    height: 15px;
}

.flex-gap-10 {
    gap: 10px;
}

.fs-14 {
    font-size: 14px;
}

.fs-16 {
    font-size: 16px !important;
}

.object-cover {
    object-fit: cover;
}

.card {
    box-shadow: 0 0 5px rgba(26, 108, 225, 0.1);
}

.bg-hover:hover {
    background-color: #f4f5f8;
    transition: 0.2s linear;
}

.form-check-input:checked {
    background-color: #1c524d !important;
    border-color: #1c524d !important;
}

.shadow1:hover {
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.25) !important;
    transition: all 0.2s linear;
}

.logo-dark img {
    filter: brightness(0) invert(1);
}

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

.tx-orange {
    color: var(--orange) !important;
}

.tx-yellow {
    color: var(--yellow) !important;
}

.pointer {
    cursor: pointer;
}

.rounded-t-none {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.rounded-b-none {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

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

.bg-hover:hover {
    background-color: var(--gray-light);
}

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

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

.text-orange {
    color: var(--orange) !important;
}

.text-dark {
    color: var(--dark) !important;
}

.text-white {
    color: var(--white) !important;
}

.text-black {
    color: var(--black) !important;
}

.text-green {
    color: var(--dark);
}

.content-body {
    height: calc(100% - 60px);
}

.bg-gray-light {
    background-color: var(--gray-light);
}

.bg-gray {
    background-color: #acacac;
}

.bg-green {
    background-color: var(--dark);
}

.wd-12 {
    width: 12px;
}

.ht-12 {
    height: 12px;
}

.wd-10 {
    width: 10px;
}

.ht-10 {
    height: 10px;
}

.link-thm {
    color: var(--dark) !important;
}

.link-thm:hover {
    color: var(--black-light) !important;
}

.box-hover:hover {
    box-shadow: 0px 14px 14px 3px rgba(0, 0, 0, 0.03);
}

.bg-cream {
    background-color: var(--cream);
}

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

.disabled {
    opacity: 0.5;
}

.before-after-none::before,
.before-after-none::after {
    content: none !important;
}

.shadow1 {
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.25) !important;
}

.shadow2 {
    box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.07) !important;
}

.BtnhoverGreen:hover {
    background-color: var(--dark);
    color: var(--white);
}

.CardHover:hover {
    box-shadow: 0px 14px 14p 3px rgba(0, 0, 0, 0.03);
}

.BorderLeft10px {
    border-left: 10px solid var(--orange) !important;
}

.BtnOutline:hover {
    background-color: var(--gray-light);
}

.BgGreenlight {
    background: #3ab795;
}

.BorderGrennlight {
    border: 2px solid #3ab795 !important;
}

.BorderGrennlight:hover {
    border: 2px solid #1c8164 !important;
    box-shadow: none;
}

.InputTranparent {
    background-color: transparent;
}

.EditIcon {
    border: 1px solid #3ab795;
    color: #3ab795;
}

.bdLeft2pxGreen {
    border-left: 2px solid var(--dark);
}

.OutlineGreen {
    border: 1px solid var(--dark) !important;
}

.OutlineGreen:hover {
    background-color: var(--dark);
    color: var(--white);
}

.ObjectCover {
    object-fit: cover;
}

.linevertical::before {
    position: absolute;
    height: 100%;
    width: 1px;
    content: "";
    left: 30px;
    top: 0;
    background-color: #e2e5ed;
    z-index: 0;
}

.z-1 {
    z-index: 1;
}

.CardHover2:hover {
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px,
        rgba(27, 31, 35, 0.15) 0px 0px 0px 1px !important;
    transition: all 0.1s linear;
}

.FitContent {
    width: fit-content;
}

.border-color {
    color: var(--gray);
}

.raduis-bottom {
    border-radius: 0 0 8px 8px;
}

.card-cust {
    border-radius: 14px;
    border: 1px solid rgba(0, 0, 0, 0.135);
    border-color: rgba(0, 0, 0, 0.135);
    margin-bottom: 20px;
}

.ui-datepicker .ui-datepicker-title {
    color: #001737 !important;
}

.campaign-seg-option,
.campaign-seg-option-add {
    position: relative;
    margin-bottom: 30px;
    z-index: 2;
}

.campaign-seg-option {
    border: 1px solid rgba(0, 0, 0, 0.175);
    border-radius: 10px;
    padding: 15px;
    box-shadow: 0 0 25px rgba(26, 108, 225, 0.1);
}

.campaign-seg-option:last-child,
.campaign-seg-option-add:last-child {
    margin-bottom: 0px;
}

/* .campaign-seg-option:not(.campaign-seg-option:last-child)::after {
    content: "";
    border: none;
    border-right: 2px dashed rgba(0, 0, 0, 0.135);
    height: 66px;
    position: absolute;
    top: 105%;
    left: 70px;
    z-index: 1;
} */

.campaign-seg-option-add:not(.campaign-seg-option-add:last-child)::before {
    content: "AND";
    border: none;
    background-color: #fff;
    width: fit-content;
    position: absolute;
    bottom: -25px;
    right: 50%;
    color: #12604b;
    z-index: 3;
    font-size: 12px;
    font-weight: 600;
}

.campaign-seg-option:not(.campaign-seg-option:last-child)::before {
    content: "OR";
    border: none;
    background-color: #fff;
    width: fit-content;
    position: absolute;
    bottom: -25px;
    right: 50%;
    color: #9d9d9d;
    z-index: 3;
    font-size: 12px;
}

.segment-add-list {
    position: relative;
    margin-bottom: 50px;
    z-index: 2;
}

.segment-add-list:not(.segment-add-list:last-child)::after {
    content: "";
    border: none;
    border-right: 2px dashed rgba(0, 0, 0, 0.135);
    height: 50px;
    position: absolute;
    top: 100%;
    left: 50px;
    z-index: 1;
}

.segment-add-list:not(.segment-add-list:last-child)::before {
    content: "AND";
    border: none;
    background-color: #fff;
    width: fit-content;
    position: absolute;
    bottom: -36px;
    left: 37px;
    color: #9d9d9d;

    z-index: 3;
}

.segment-row {
    position: relative;
    margin-bottom: 50px;
    z-index: 2;
}

.segment-row:last-child {
    margin-bottom: 0;
}

.segment-row:not(.segment-row:last-child)::after {
    content: "";
    border: none;
    border-right: 2px dashed rgba(0, 0, 0, 0.135);
    height: 117%;
    position: absolute;
    top: 100%;
    left: 50px;
    z-index: 1;
}

.segment-row:not(.segment-row:last-child)::before {
    content: "OR";
    border: none;
    background-color: #fff;
    width: fit-content;
    position: absolute;
    bottom: -45px;
    left: 40px;
    color: #9d9d9d;

    z-index: 3;
}

/*=============== Common Css End ================*/

/*================START : dashboad ================*/
.dashboard .card-counter {
    right: -10px;
    top: -10px;
}

.dashboard .box-hover img {
    -o-object-fit: contain;
    object-fit: contain;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.dashboard .box-hover:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.dashboard .disabled.box-hover:hover img {
    -webkit-transition: inherit;
    transition: inherit;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.dashboard .disabled.box-hover:hover {
    box-shadow: none;
    cursor: not-allowed;
}

.cursor-pointer {
    cursor: pointer;
}

/*================END : dashboad ================*/

.navbar-right .dropdown .dropdown-menu {
    margin-top: 22px !important;
    margin-right: -20px !important;
}

.navbar-right .dropdown.dropdown-profile .dropdown-menu.dropdown-menu-end {
    margin-right: -10px !important;
    margin-top: 15px !important;
}

/* .select2-container,
.sp-container {
    z-index: 99999;
} */

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

.theme-light-dark-mode .df-mode {
    display: block !important;
}

.theme-light-dark-mode .df-mode.active {
    display: none !important;
    box-shadow: none !important;
}

.theme-light-dark-mode .df-mode::before {
    content: none !important;
}

.navbar-right {
    padding: 0 15px;
    margin-left: auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    order: 2;
}

.navbar-right .dropdown {
    margin-left: 15px;
}

.dropdown-profile .dropdown-menu::before {
    opacity: 1 !important;
}

.TabChange {
    max-width: 200px;
}

body {
    background-color: var(--cream) !important;
}

.content-header {
    background-color: var(--cream);
}

/* Page header Start--------------------------------*/
.headerSearch {
    background-color: var(--white);
}

.dropdown-message .dropdown-link.new-indicator span,
.dropdown-notification .dropdown-link.new-indicator span {
    top: -13px;
    right: -7px;
}

.dropdown-message .dropdown-link svg,
.dropdown-notification .dropdown-link svg {
    color: var(--white);
}

.dropdown-message .dropdown-link:hover svg,
.dropdown-notification .dropdown-link:hover svg {
    color: var(--white);
}

.dropdown-message:hover,
.dropdown-notification:hover {
    background-color: #12604b;
}

.headerSearch svg {
    color: var(--black-light);
}

.headerSearch input::placeholder {
    color: var(--black-light);
}

.dropdown-header {
    color: var(--dark) !important;
}

/* Page header End---------------------------------------*/

/* Sidemenu Start -------------------------------------------*/
.aside-header {
    background-color: var(--dark);
}

.aside-logo img {
    margin-top: 26px;
    max-width: 140px;
    height: auto;
}

.aside-body {
    background-color: var(--dark);
    padding: 20px 20px 20px 20px !important;
    height: calc(100% - 150px);
}

.nav-aside .nav-item.active span {
    color: var(--orange-light);
}

.nav-aside .nav-item.active img {
    filter: initial;
}

.nav-aside .nav-item img {
    filter: brightness(0) invert(1);
    width: 20px;
    height: 20px;
}

.profileMenu .nav-item {
    padding: 0 0 18px 0;
    margin: 0;
}

.profileSubmenu .nav-item {
    padding-bottom: 0px;
}

.profileMenu .nav-item .nav-link {
    font-size: 20px;
}

.profileSubmenu .nav-item .nav-link {
    font-size: 12px;
}

.tx-gray {
    color: rgb(160, 160, 160);
}

.nav-aside .nav-item:hover span,
.aside-footer a:hover,
.aside-footer a:hover p {
    color: var(--orange-light);
}

.nav-aside .nav-item span {
    color: var(--white);
    padding-left: 15px;
}

.nav-aside .nav-item:hover img {
    filter: none;
}

.nav-aside .nav-item.active .nav-link::before {
    border: none;
}

.aside-alert-link a {
    color: #c0ccda;
}

.aside-loggedin-user a:hover,
.aside-alert-link a:hover {
    color: var(--white);
}

.profileSubmenu svg {
    color: var(--white);
}

.profileSubmenu svg {
    font-size: 12px;
}

.profileSubmenu .nav-item:hover svg {
    color: var(--orange-light);
}

.aside-footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    background: var(--dark);
    padding: 15px 15px 15px 20px;
    z-index: 999;
    border-top: 1px solid #666;
}

.aside-menu-link {
    color: #262525;
}

/* Sidemenu End ---------------------------------------- */

/* Dashboard Page  Start -----------------------------------*/

.dashboard .box-hover img {
    max-width: 140px;
    height: 96px;
}

/* Dashboard Page End --------------------------------- */

/* Notification Page Start ----------------------------- */

.notificationCard {
    border-left: 10px solid var(--orange) !important;
}

/* Notification Page End----------------------------------- */

/* EventList Page Start-------------------------------- */

.eventlist-card .cardbox-bglight {
    background-color: var(--cream);
}

/* EventList Page End --------------------------------------*/

/* EventDetail Page Start------------------------------------ */
.event-detail-card .event-chat .avatar img {
    width: 40px;
    height: 40px;
}

.StatusCard .view-btn[aria-expanded="true"].view-less {
    display: block !important;
}

.StatusCard .view-btn[aria-expanded="true"].view-more {
    display: none !important;
}

.StatusCard .view-less {
    display: none !important;
}

.EventDetail-sidebar .last-msg button {
    border-radius: 0 0 8px 8px;
}

/* EventDetail Page End----------------------------------*/

/* Login Page Start-----------------------------------------*/
.loginPageogo {
    filter: invert();
    height: 30px;
    margin-top: 10px;
    max-width: auto;
}

/* Login Page End----------------------------------------------*/

/* Guest Profile Page Start----------------------------------- */

.activity-box {
    position: relative;
}

.activity-box-icon {
    position: absolute;
    left: -36px;
    top: -3px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.profile-activity-tab .activity-details .activity-box-icon {
    border: none;
}

.profile-tags .bootstrap-tagsinput {
    border: none !important;
    background-color: transparent;
}

.profile-tags .bootstrap-tagsinput .tag {
    color: #000;
    border-radius: 5px;
    background: var(--gray-light);
    padding: 4px 8px;
    margin: 5px 5px 5px 0;
}

.profile-tags .bootstrap-tagsinput input {
    display: none;
}

.review-activity-tab .ReviewListcard {
    max-height: 470px;
    min-height: 470px;
    overflow-y: auto;
    scrollbar-width: thin;
}

.review-activity-tab .ReviewListcard::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #f1f1f1;
    overflow-x: auto;
}

.review-activity-tab .ReviewListcard::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    background-color: #f1f1f1;
    overflow-x: auto;
}

.review-activity-tab .ReviewListcard::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: #f4f5f8;
    overflow-x: auto;
}

/* Edit Model */
.OrderLandmarkbtn {
    display: flex;
    align-items: center;
    justify-content: center;
}

.OrderLandmarkbtn:hover {
    background-color: var(--black);
    color: var(--white);
}

.OrderLandmarkbtn input {
    display: none;
}

/* Guest Profile Page End ----------------------------------- */

/* Task Detail Page Start -------------------------------------------*/

.TaskHistorycard .activity-box-icon {
    width: 40px;
    height: 40px;
    left: -40px;
}

.TaskInfolist {
    gap: 20px;
    margin-bottom: 15px;
}

.TaskInfolist p {
    width: 50%;
}

/* Task Detail Page End------------------------------------ */

/* Pos Page Start -------------------------------------------*/

.PosProductCard {
    height: calc(100vh - 185px);
    position: relative;
}

.product-wrapper {
    overflow: auto;
    height: calc(90vh - 220px);
    width: 100%;
}

.PosProductCardLeft {
    position: relative;
}

.PosRadio {
    display: none;
}

.PosRadio:checked + .MainFood {
    background-color: #00b8d4;
    color: var(--white);
}

.PosRadio:checked + .MainFood img {
    filter: invert(1);
}

.PosRadio:checked + .MainFood h5 {
    color: var(--white);
}

.PosRadio:checked + .SubFood {
    background-color: var(--orange-light) !important;
    color: var(--white) !important;
}

.PosRadio:checked + .SubFood span {
    color: var(--white);
}

.PosProductCard .button-minus,
.PosProductCard .button-plus {
    background: #ffffff;
    border: 1px solid #e3e3e3;
    box-shadow: 0px 6px 10px 2px rgb(0 0 0 / 3%);
    font-weight: 500;
    line-height: 46px;
    border-radius: 50% !important;
    width: 50px;
    font-size: 24px;
    font-family: "Barlow", sans-serif;
}

.PosProductCard .quantity-field {
    font-family: "Barlow", sans-serif;
    font-weight: 500;
    font-size: 24px;
    line-height: 31px;
    border: none;
    background: none;
    width: 54px;
    text-align: center;
}

.PosProductCard .ButtonOrder {
    font-size: 15px;
    margin-right: 15px;
}

.PosProductCard .ButtonOrder.Pay:hover,
.PosProductCard .ButtonOrder.Hold:hover,
.PosProductCard .DiscountBtn:hover {
    background-color: #1c524d;
    color: var(--white);
}

.DiscountBtn:hover i {
    color: #fff;
}

.PosProductCard .DiscountBtn {
    background-color: var(--white);
}

.FoodList {
    display: flex;
    overflow-x: auto;
    gap: 20px;
}

.SubFoodList {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.SubFoodList .FoodItems {
    height: 100%;
    padding: 15px 15px !important;
}

.SubFoodList .Childflex {
    width: calc(25% - 20px);
}

.FooditemImg {
    width: 40px;
    height: 40px;
    padding-bottom: 10px;
}

.FoodList .Foodlistchild {
    min-width: 130px;
    max-width: 200px;
    width: 100%;
}

.FoodItems {
    padding: 10px;
    font-size: 16px;
    color: var(--black);
    font-weight: 500;
    overflow: hidden;
}

.FoodItems.active h5,
.FoodItems.active span {
    color: var(--white);
}

.FoodItems h5,
.FoodItems span {
    font-size: 16px;
}

.ProductToalBottom {
    position: absolute;
    bottom: 0;
    width: 100%;
    background-color: #fff;
}

.TotalDownbtn {
    padding: 0px 40px;
    border-radius: 9px 10px 0 0;
    position: absolute;
    right: 0;
    top: -20px;
    color: var(--white);
}

.TotalDownbtn[aria-expanded="true"] .Showdown {
    display: block !important;
}

.TotalDownbtn[aria-expanded="true"] .Showup {
    display: none !important;
}

.TotalDownbtn .Showdown {
    display: none !important;
}

.OverflowLineone {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: break-spaces;
}

.OverflowLinethree {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    white-space: break-spaces;
}

.line-clamp-1 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.line-clamp-2,
.dis-sub {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.line-clamp-3 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.line-clamp-4 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
}

.hover-none:hover {
    color: initial !important;
}

.wd-14 {
    width: 14px;
}

.ht-14 {
    height: 14px;
}

/* Pos Page End --------------------------------------------------------------*/

/* Message Page Start --------------------------------------------------------------*/

.mail-group-header {
    display: initial;
    height: 120px !important;
}

.mail-wrapper {
    top: 130px;
    background-color: var(--white);
}

.MsgList {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.MsgList p {
    white-space: nowrap;
}

.mail-content-header {
    height: 70px;
}

.mail-group-body {
    top: 120px;
}

@media (min-width: 768px) {
    .mail-group {
        left: 0;
    }
}

@media (min-width: 991px) {
    .mail-wrapper {
        left: 240px !important;
        margin: 20px;
        background-color: var(--white);
    }
}

@media (min-width: 1200px) {
    .mail-content {
        left: 320px;
    }

    .mail-content-body {
        top: 80px;
    }
}

/* Message Page End--------------------------------------------------*/

/* Kot Page Start ------------------------------------------------*/
.KotItemsname {
    min-height: 200px;
}

.KotItemsname th,
.KotItemsname td {
    padding: 5px 15px;
}

.KotlslitDropdown {
    list-style: none;
    display: flex;
    padding: 15px;
    background-color: #fff;
    gap: 20px;
    border-radius: 5px;
}

.KotlslitDropdown li a {
    color: #000;
}

.kot-server .s2 {
    text-align: center;
}

.kot-server .s1 {
    color: #8392a5;
}

.kot-server .icon-s {
    font-size: 18px;
    color: #1c524d;
    margin-right: 6px;
    margin-top: 5px;
    width: 18px;
}

.KotviewCard ul.Kot-items-ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    margin-top: 10px;
    margin-bottom: 0;
}

.KotviewCard ul.Kot-items-ul li {
    padding-right: 20px;
    padding-left: 15px;
    padding-bottom: 10px;
    color: #1c524d;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.KotviewCard ul.Kot-items-ul li svg {
    width: 18px;
    height: 18px;
    margin-right: 2px;
}

.KotItems .edit-icon {
    width: 18px;
    height: 18px;
    margin-right: 5px;
}

.KotItemsHead .table-icon {
    color: #1c524d;
}

.KotItemsHead .ready-btn {
    font-size: 16px;
    display: flex;
    gap: 5px;
    align-items: center;
}

.KotItemsHead .ready-btn .ready-icon {
    width: 18px;
    height: 18px;
}

/* Kot Page End ----------------------------------------------------------*/

/* Reporting Page Start ------------------------------------------------------ */

.ReportList {
    list-style: none;
    padding: 0;
}

.ReportList li {
    border-bottom: 1px solid var(--gray-light);
    width: 100%;
    display: inline-block;
}

.ReportList li:last-child {
    border-bottom: none;
}

.ReportList li a {
    color: var(--black);
    padding: 10px 15px;
    width: 100%;
    display: inline-block;
}

.ReportList li.active a {
    background-color: var(--dark);
}

.ReportList li:hover a {
    background-color: #3ab795;
    transition: all 0.1s linear;
}

.ReportList li.active a,
.ReportList li:hover a {
    color: var(--white);
}

/* Jquery toggle class Reportlist Show*/
.reportshow {
    display: block !important;
}

/* Reporting Page End --------------------------------------- */

/* Experience Create Page Start ------------------------*/

.ExperinceSteps span.StepIcon {
    background-color: var(--dark);
    color: var(--white);
    border: none;
}

.ExperinceSteps span.StepIcon {
    display: none;
}

.ExperinceSteps .step-link.active span.StepIcon {
    display: flex;
}

.ExperinceSteps .step-link.active span.StepNum {
    display: none;
}

.LocationBtn {
    margin: 15px 15px 0 0;
    border-radius: 5px;
}

.LocationBtn {
    position: relative;
}

.LocationBtn input {
    position: absolute !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 99;
    cursor: pointer;
}

.ExpCreate input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-right: 10px;
}

.LocationBtn span {
    background: #fff;
    border: 1px solid #f0f1f5;
    border-radius: 5px;
    color: #000;
    font-size: 13px;
    padding: 13px 35px;
}

.LocationBtn input:checked + span {
    color: var(--dark);
    border: 2px solid var(--dark);
    font-weight: 500;
}

.PaidFreelabel span {
    background: #fff;
    border: 1px solid #f0f1f5;
    border-radius: 5px;
    color: #000;
    font-size: 13px;
    padding: 13px 35px;
}

.PaidFreelabel input:checked + span {
    border: 1px solid var(--dark) !important;
    color: #fff;
    background: var(--dark) !important;
}

.PaidFreelabel {
    padding: 0px 0px;
    position: relative;
    text-align: center;
    display: inline-block;
    margin: 0;
    margin-right: 15px;
}

.PaidFreelabel input {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 99;
    cursor: pointer;
}

.FileNoimage {
    width: 150px;
    height: 150px;
    border: 1px solid #e4e4e4;
    border-radius: 3px;
    margin-top: 15px;
}

.TicketTab .modal .form-group {
    text-align: left;
}

#settings input {
    width: 18px;
    height: 18px;
    margin-right: 10px;
}

.dropzone {
    border-radius: 11px;
    min-height: 150px;
    border: 1px solid rgba(0, 0, 0, 0.3);
    background: white;
    padding: 20px 20px;
}

.dropzone.dz-clickable .dz-message,
.dropzone.dz-clickable .dz-message * {
    cursor: pointer;
}

.secGallery .dropzone .dz-message {
    margin: 3.2em 0 2em 0;
}

.dropzone .dz-message {
    text-align: center;
    margin: 2em 0;
}

.dropzone .dz-message .dz-button {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
    outline: inherit;
}

.PublishTab .input[type="checkbox"],
.PublishTab input[type="radio"] {
    width: 18px;
    height: 18px;
    margin-right: 10px;
}

.PublishTab .timet {
    background-color: #f3f3f3;
    padding: 8px 15px;
    position: relative;
    border-radius: 2px;
    display: flex;
    align-items: center;
}

.PublishTab .timet2 {
    background-color: #f3f3f3;
    padding: 8px 15px;
    position: relative;
    border-radius: 2px;
}

.custom-control-label {
    cursor: pointer;
}

.custom-control-label {
    position: relative;
    margin-bottom: 0;
    vertical-align: top;
}

.ExpCratag .bootstrap-tagsinput .tag {
    align-items: center;
    background-color: #e3e3e3;
    border-radius: 2px;
    color: var(--black);
}

.TicketTab .AdmissionUL {
    display: flex;
    gap: 50px;
    list-style: none;
    padding: 0;
    flex-wrap: wrap;
    width: 100%;
}

.AdmissionUL .ActionBtn {
    margin-left: auto;
}

input[type="radio"] {
    position: relative;
    border: 1px solid #1c524d;
    appearance: none;
    border-radius: 50%;
    margin-top: 3px;
}

input[type="radio"]:checked::after {
    position: absolute;
    width: 16px;
    height: 16px;
    top: 0px;
    left: 0px;
    border-radius: 50%;
    position: relative;
    background-color: var(--dark);
    content: "";
    display: inline-block;
    visibility: visible;
    border: 2px solid #fff;
}

.form-check-input:checked {
    background-color: #1c524d !important;
    border-color: #1c524d !important;
}

/* Experience Create Page End -----------------------*/

/* Experience Book Page Start -----------------------*/
figure.Expbookimg {
    width: 100%;
    height: 160px;
    overflow: hidden;
}

figure.Expbookimg img {
    max-width: 100%;
    height: 160px;
    object-fit: cover;
}

.FeatherSmall {
    width: 18px;
    height: 18px;
}

.FeatherMedium {
    width: 30px;
    height: 30px;
}

.ExpBook .checkout-review-order-table td {
    text-align: right;
}

/* Experience Book Page End -----------------------------------------------------------------------*/

/* Reservation Page Start ------------------------------------------------------------------------*/

.RessideCard .ReserRow:not(:last-child) {
    border-bottom: 1px solid #e9f1fc;
}

.RessideCard {
    height: 100%;
}

.ResrightCard {
    height: calc(100vh - 185px);
}

.RessideCard .ResFooter {
    position: absolute;
    bottom: 0;
}

.ResCards {
    height: 100%;
}

/* Toggle Swipe */
.toggle-swipe {
    background-color: var(--white);
    width: 180px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 30px;
    padding: 5px 10px;
    gap: 10px;
}

.toggle-swipe input {
    display: none;
}

.toggle-swipe input:checked + label {
    color: var(--white);
    background-color: #3ab795;
    border-radius: 30px;
    padding: 5px 10px;
}

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

.RessideCard .dropdown-menu {
    transform: translate(0px, 0px) !important;
    left: 84px !important;
    top: 0px !important;
    position: relative;
}

.TableDropdown {
    position: relative;
}

.TableDropdown .dropdown-toggle:hover {
    box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px,
        rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
    transition: all 0.2s linear;
}

.RessideCard .dropdown-menu::after {
    content: "";
    position: absolute;
    top: 7px;
    left: 4px;
    margin-left: -15px;
    border-right: 11px solid #fff;
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
}

.RessideCard .dropdown-menu::before {
    content: "";
    position: absolute;
    top: 6px;
    left: -3px;
    margin-left: -10px;
    border-right: 13px solid rgba(72, 94, 144, 0.16);
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
}

.RessideCard .dropdown-item:hover {
    background-color: var(--dark);
    color: var(--white);
}

.CollapsCard .collapse.show {
    background-color: #efefef;
    transition: all 0.1s linear;
}

.review-activity-tab .ReviewListcard {
    max-height: 470px;
    min-height: 470px;
    overflow-y: auto;
    scrollbar-width: thin;
}

.ResCards::-webkit-scrollbar-track,
.CollapsCard::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #f1f1f1;
    overflow-x: auto;
}

.ResCards::-webkit-scrollbar,
.CollapsCard::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    background-color: #f1f1f1;
    overflow-x: auto;
}

.ResCards::-webkit-scrollbar-thumb,
.CollapsCard::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    background-color: #f4f5f8;
    overflow-x: auto;
}

/* Jquery Add Classes */
.SideActivetab {
    display: none;
}

.CardNone {
    display: none;
}

.Sideupcomingtab {
    display: none;
}

/* Reservation Page End -----------------------------------*/

/* Split By Item Page Start --------------------------------------------*/

.SpitItmpg .CheckBox {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.SpitItmpg .Checkboxitem {
    border-radius: 4px;
    padding: 5px 18px;
    border: 1px solid #bababa;
    background-color: var(--white);
}

.SpitItmpg .CheckBox input {
    display: none;
}

.SpitItmpg input:checked + .Checkboxitem {
    background-color: var(--dark);
    color: var(--white);
}

.SpitItmpg .SpitTotals {
    display: flex;
    gap: 15px;
    flex-wrap: nowrap;
    overflow-x: auto;
    white-space: nowrap;
    align-items: center;
    padding: 10px 15px;
}

.SpitItmpg .SpitTotalitem {
    width: 33.33%;
}

.SpitItmpg .SplitFooter {
    position: sticky;
    bottom: -20px;
    border-radius: 10px;
    margin-top: 10px;
    border: 1px solid #d9dde7;
}

.content-auth {
    min-height: initial;
}

.penso-login {
    background: var(--dark) !important;
}

.logo-penso img {
    filter: invert();
    height: 30px;
    margin-top: 10px;
    max-width: auto;
}

/* Split By Item Page End --------------------------------------------*/

/* Create Invoice Start-------------*/
.InvoiceItem.table th,
.AddItem.table th,
.InvoictItemsum.table th {
    font-weight: 600 !important;
}

.InvoiceItem.table th:nth-child(2),
.InvoiceItem.table th:nth-child(3) {
    text-align: right;
}

.InvoiceItem.table td:nth-child(2),
.InvoiceItem.table td:nth-child(3) {
    text-align: right;
}

.InvoictItemsum td:last-child {
    text-align: right;
}

.AddItem.table th:nth-child(2) {
    text-align: center;
}

.AddItem.table th:nth-child(3) {
    text-align: center;
}

.AddItem.table th:nth-child(4) {
    text-align: center;
}

.AddItem.table td:nth-child(2) {
    text-align: center;
}

.AddItem.table td:nth-child(3) {
    text-align: center;
}

.AddItem.table td:nth-child(4) {
    text-align: right;
}

.AddItem.table td:nth-child(5) {
    text-align: right;
}

.TabelInvoice tr:last-child td {
    border-bottom: none;
}

.sum-items p {
    margin-bottom: 10px;
}

/* Create Invoice End-------------*/

/*Kot View ------------- */

.gap-10 {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

/* Grid Plugin */
.grid {
    height: 75%;
    position: relative;
}

.grid-item {
    float: left;
    width: calc(33% - 10px);
    margin-bottom: 10px;
}

.grid:after {
    content: "";
    display: block;
    clear: both;
}

/* Grid Css */
.grid-layout {
    /* height: calc(100vh - 200px); */
    columns: 3;
    column-gap: 15px;
}

.grid-layout-item {
    width: 100%;
    margin-bottom: 15px;
    break-inside: avoid;
}

/*Kot View ------------- */

/* Admin Pages Start*/
.table-hover tbody tr:hover {
    background-color: initial;
}

/* Admin Pages End*/

/* Pos Page start*/
.poscusclr {
    color: #8fbdf7;
}

.pos-cutomize-tr th {
    height: 30px !important;
    font-size: 14px;
    border: 0;
}

.pos-cutomize-tr th,
.pos-cutomize-tr td {
    padding: 0;
}

.pos-cutomize-tr th {
    padding-left: 30px !important;
}

.pos-cutomize-tr td {
    padding-right: 20px !important;
}

.pos-cutomize-tr th a,
.pos-cutomize-tr td a {
    font-size: 13px;
}

.pos-cutomize-tr td {
    border: 0;
}

.extra-table-span {
    color: #3ab795;
}

.pos-cutomize-tr .table-img {
    margin-top: -2px;
}

.pos-cutomize-tr {
    background-color: #fdfbff;
}

.pos-modifier-tab.nav-pills .nav-link.active,
.pos-modifier-tab.nav-pills .show > .nav-link {
    background: transparent;
    border-radius: 0;
    border-bottom: 1px solid #fe944f;
}

.pos-modifier-tab .nav-link:hover,
.pos-modifier-tab .nav-link.active,
.pos-modifier-tab .nav-link:focus {
    color: var(--black);
}

.pos-modifier-tab .nav-link {
    padding: 4px 0;
}

.pos-modifier-tab.nav-pills .nav-link:not(.active):hover,
.pos-modifier-tab.nav-pills .nav-link:not(.active):focus {
    background-color: initial;
    color: initial;
}

.pos-modifier-tab.nav-pills .nav-link {
    position: relative;
}

.pos-modifier-tab.nav-pills .nav-link::before {
    position: absolute;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: gray;
    content: "";
    left: -14px;
    top: 13px;
}

.pos-modifier-tab li.nav-item {
    padding: 0px 20px;
}

.select-size input[type="checkbox"]:checked + label {
    background: var(--dark) !important;
    color: var(--white) !important;
    transition: 0.3s !important;
}

.gap-cutomize {
    margin-left: 40px;
}

/*============manage_tables================*/

.table-type label {
    position: relative;
    cursor: pointer;
}

.table-type label input {
    display: none;
}

.table-type label span {
    position: relative;
    display: inline-block;
    margin: 0 15px;
    font-size: 14px;
    padding: 0px;
    width: 50px;
    height: 50px;
    background: none;
    border: 1px solid #444;
    color: #444;
}

.table-type label.round span {
    border-radius: 50%;
}

.table-type label input:checked ~ span {
    color: var(--dark);
    border: 1px solid var(--yellow);
    background: var(--yellow);
}

.table-type label input:checked ~ span:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #008eff;
    z-index: -1;
    filter: blur(10px);
}

.table-type label input:checked ~ span:after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: #008eff;
    z-index: -1;
    filter: blur(15px);
}

.table-type label span.yes {
    padding-right: 0;
    margin-right: 0;
}

.table-type label input:checked ~ span.yes:before,
.table-type label input:checked ~ span.yes:after {
    background: #62ff00;
}

.table-type label input:checked ~ span.no:before,
.table-type label input:checked ~ span.no:after {
    background: #ff0000;
}

.barrier1 {
    background: #040404;
    height: 35px;
    display: inline-block;
    cursor: pointer;
}

.barrier2 {
    border: 2px solid #000000;
    height: 35px;
    display: inline-block;
    cursor: pointer;
}

/* Pos Page end*/

/* Start Calender*/

.UserEmployees .calendar-wrapper {
    top: 150px;
    overflow: auto;
}

.UserEmployees .calendar-content {
    left: 266px;
    border-radius: 5px;
    right: 20px;
}

/* End Calender */

/* Start reservatgion type */

.DownbgArrow svg {
    width: 20px;
    height: 20px;
}

/* Etart reservatgion type */

/* admin changes */

.ui-datepicker .ui-datepicker-calendar .ui-datepicker-today a,
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-today a:hover,
.ui-datepicker .ui-datepicker-calendar .ui-datepicker-today a:focus {
    background-color: var(--dark);
    color: white;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    background-color: #3ab795;
    color: white !important;
}

.swal-footer {
    text-align: center;
}

.swal-footer .swal-button--cancel {
    color: #fff;
    background-color: #dc3545;
    border-color: #dc3545;
}

.swal-footer .swal-button--cancel:focus {
    box-shadow: none;
}

.swal-button--confirm {
    color: #fff;
    background-color: #1c524d;
    border-color: #1c524d;
}

.swal-button--confirm:focus {
    background-color: #1c524d;
    box-shadow: none;
}

.swal-footer .swal-title {
    font-size: 24px;
    color: #000;
}

.daterangepicker .ranges li.active {
    background-color: #1c524d !important;
}

.btn.btn-primary.btn-xs {
    text-transform: capitalize;
}

.btn.btn-success.btn-xs {
    text-transform: capitalize;
}

.btn.btn-danger.btn-xs {
    text-transform: capitalize;
}

.btn.btn-warning.btn-xs {
    text-transform: capitalize;
}

.assignees .select2-container,
.task_filter_form .sp-container {
    z-index: 0 !important;
}

/* admin changes */

.demo-forms .select2-container {
    z-index: 1 !important;
}

.bootstrap-tagsinput .tag {
    background-color: #1c524d;
}

.nav-aside .with-sub .nav-link::after {
    position: absolute;
    right: 0px;
}

.nav-aside .nav-link::before {
    border-left: 3px solid #8392a5 !important;
}

table.dataTable thead > tr > th.sorting[aria-sort="ascending"]::after {
    opacity: 1 !important;
}

table.dataTable thead > tr > th.sorting[aria-sort="ascending"]::before {
    opacity: 0.5 !important;
}

table.dataTable thead > tr > th.sorting[aria-sort="descending"]::after {
    opacity: 0.5 !important;
}

table.dataTable thead > tr > th.sorting[aria-sort="descending"]::before {
    opacity: 1 !important;
}

.GuestProfilecard .GuestProfile .main_user_profile div.rounded-circle {
    width: 100%;
    height: 100%;
}

/* reservation */

.ExpCrtform .list-inline-skills .list-inline-item a.comboselection {
    color: #1c524d;
    font-size: 15px;
    font-weight: 500;
}

.ExpCrtform .list-inline-skills .list-inline-item {
    margin-right: 0.5rem;
    background: #ededed;
    padding: 10px 10px;
    border-radius: 30px;
    margin-bottom: 15px;
}

.ExpCrtform .list-inline-skills .list-inline-item:hover {
    background: #1c524d;
}

.ExpCrtform .list-inline-skills .list-inline-item:hover a.comboselection {
    color: #fff;
}

.ExpCrtform .list-inline-skills {
    margin-bottom: 0;
}

.ExpCrtform .list-inline-skills .list-inline-item.active {
    background: #1c524d;
}

.ExpCrtform .list-inline-skills .list-inline-item.active a.comboselection {
    color: #fff;
}

/* new-step */
.new-step-tag {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
}

.new-step-tag span {
    background-color: #ededed;
    padding: 6px 10px;
    border-radius: 2px;
    display: flex;
    white-space: nowrap;
}

.new-step-tag span a {
    color: #000;
}

.new-step-tag span svg {
    width: 14px;
    height: 14px;
    margin-left: 5px;
}

/* .pay-img-div>div {
    margin: 0 !important;
} */

/* start no message */

.nomsg-div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    padding: 15px;
}

.nomsg-div .no-msgicon {
    margin-bottom: 5px;
}

.nomsg-div .no-msgicon i {
    font-size: 30px;
    opacity: 0.3;
}

.nomsg-div p {
    font-size: 14px;
    margin-bottom: 0;
}

.nomsg-div span {
    font-size: 13px;
}

/* end no message */

/* start light dark mode */

.mode-icon i {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin-top: 8px;
}

/* end light dark mode */

/* start no-data img */

.No-data {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 100px;
    margin-bottom: 100px;
}

.no-data-icon {
    margin-bottom: 15px;
}

.no-data-icon i {
    font-size: 80px;
    opacity: 0.4;
}

.no-task-title {
    margin-bottom: 0;
    font-size: 20px;
    color: #808080;
    text-align: center;
}

.no-task-title span {
    word-break: break-all;
}

/* end no-data img */

/* Start task add */

.inputdltbtn {
    height: 94%;
    right: 13px;
    top: 1px;
    border-radius: 0 2px 2px 0;
}

.ui-widget.ui-widget-content {
    border: 1px solid #c5c5c5;
    max-height: 320px;
    overflow-y: scroll;
    overflow-x: hidden;
    border-radius: 4px;
}

.ui-menu-item-wrapper.ui-state-active {
    border: none;
}

.content-search svg {
    margin-right: 0;
}

/* end task add */

.attach-file:hover a,
.attach-file:hover i {
    color: #9fa1a1;
    transition: 0.3s linear;
}

.cmnt-name {
    font-weight: 500;
    text-transform: capitalize;
}

.cmnt-date {
    font-size: 14px;
}

.select2-container--default .select2-results > .select2-results__options {
    margin: 0;
}

.dataTables_wrapper .dataTables_length select {
    outline: none;
}

.dataTables_wrapper .dataTables_filter input {
    outline: none;
}

.single_task_status label {
    padding: 5px 10px;
    white-space: nowrap;
}

.KotItems .wd-40 > p {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.KotItems .ready.border-orange {
    white-space: nowrap;
}

.dd-handle {
    padding: 5px 35px !important;
    font-size: 14px;
    background: #fff !important;
}

.dd-handle:hover {
    color: #333 !important;
    background: #f1f1f1 !important;
}

.dd-item > button {
    background: #3ab795 !important;
}

.manage-tabel1 {
    height: 100% !important;
}

.manage-tabel2 {
    height: 100% !important;
    overflow: hidden;
}

.manage-tabel2 .canvas-container {
    height: 70vh !important;
}

.mark-all-as-read-message:hover {
    color: #8392a5;
}

.status-history .status-his-grp a.tx-success {
    text-transform: capitalize;
}

.swal-icon--success__ring {
    border: 4px solid hsl(98.37deg 55.13% 69.41%);
}

.mail-group-label {
    background: #f5f6fa;
}

.mail-content {
    background-color: #fff;
}

.mail-content-header {
    background-color: #fff;
}

.file-caption .btn-file {
    background-color: #1c524d !important;
    border: 1px solid #1c524d !important;
}

.file-caption .btn-file:hover {
    background-color: #3ab795 !important;
    border: 1px solid #3ab795 !important;
}

/* gallery */

.GalleryTab .exp-brows-gallery {
    height: 100%;
    object-fit: cover;
}

.GalleryTab .delete-image i {
    display: flex;
    position: absolute;
    top: 2px;
    background: #ebebeb;
    right: 18px;
    z-index: 100;
    height: 30px;
    width: 30px;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.step-item:hover .step-title {
    color: var(--dark);
}

.file-preview {
    margin-bottom: 25px !important;
}

.krajee-default.file-preview-frame {
    border: 1px solid #3e3f41 !important;
    border-radius: 5px;
}

.file-drop-zone {
    border: 1px dashed #3e3f41;
}

.experience_checkout_html > div {
    font-size: 20px;
    /* margin-top: 50px; */
}

.textarea-ht {
    height: 40px;
}

.or-line {
    position: relative;
    text-align: center;
    font-weight: 500;
    font-size: 15px;
}

.or-line::before {
    position: absolute;
    content: "";
    width: 45%;
    height: 1px;
    left: 0;
    background-color: #dddcdc;
    top: 50%;
}

.or-line::after {
    position: absolute;
    content: "";
    width: 45%;
    height: 1px;
    right: 0;
    background-color: #dddcdc;
    top: 50%;
}

.subcat-list .subcat-link {
    word-break: break-word;
    border-bottom: 1px solid #dddddd;
}

.subcat-list .subcat-link:last-child {
    border-bottom: none;
    border-radius: 0 0 5px 5px;
}

.subcat-list .subcat-link:first-child {
    border-radius: 5px 5px 0px 0px;
}

.subcat-list .subcat-link.active {
    color: #fff;
    background-color: #1a4d48 !important;
}

.subcat-list .subcat-link:hover,
.subcat-list .subcat-link:active,
.subcat-list .subcat-link:focus {
    color: #fff;
    background-color: #3ab795 !important;
}

.subcat-list {
    position: sticky;
    top: 0;
    background: #fff;
    border-radius: 5px;
}

.button-edit {
    right: 40px !important;
}

.button-copy {
    right: 80px !important;
}

.dd-item > button {
    border-radius: 5px 0 0 5px;
}

.button-delete,
.button-edit,
.button-copy {
    width: 20px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pdf-list:last-child {
    border-bottom: 0;
}

/* help support -------------------*/

.dash-helpicon {
    position: fixed;
    margin-left: auto;
    bottom: 15px;
    right: 10px;
    margin-top: 10px;
    width: 60px;
    height: 60px;
    text-align: center;
    background: black;
    border-radius: 50%;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
    transition: all 0.2s linear;
}

.dash-helpicon:hover {
    background-color: #696969;
    transition: all 0.2s linear;
}

.dash-helpicon a {
    border: 2px solid white;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    width: 28px;
    height: 28px;
}

.new-help {
}

.new-help span {
    /* border: 2px solid white; */
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    width: 25px;
    height: 25px;
}

.new-help:hover {
}

.new-help a {
    padding: 5px;
}

.modal-help .modal.fade .modal-dialog {
    transition: transform 0.3s ease-out;
    transform: translate(0, 50px);
}

@media (min-width: 768px) {
    .modal-help .modal-dialog {
        position: fixed;
        top: 30px;
        right: 55px;
        margin-bottom: 0;
        width: 400px;
    }
}

@media (max-width: 768px) {
    .dash-helpicon {
        display: none;
    }
}

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

.list-items .divround {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.list-items .divround svg {
    width: 18px;
    height: 18px;
    color: var(--dark);
}

.list-items h6 {
    font-size: 16px;
}

.modal-help .title {
    font-size: 18px;
}

.modal-help .helplist .list-items {
    margin-bottom: 15px;
    align-items: flex-start;
}

.que-circle {
    width: 18px;
    height: 18px;
    margin-left: 5px;
}

.upload-btn svg {
    width: 18px;
    height: 18px;
    margin-right: 10px;
}

.tx-underline {
    text-decoration: underline;
}

.print-logo img {
    max-width: 300px;

    filter: invert();
}

.print-headvalue tr.item-venue {
    background-color: #f7f7f7;
}

.print-total tr {
    background-color: #f7f7f7;
}

.item-venue th:nth-child(2) {
    text-align: center;
}

.item-venue th:nth-child(3) {
    text-align: center;
}

.item-venue th:last-child,
.item-venue-td td:last-child {
    text-align: right;
}

.purchase-print {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    width: 100%;
}

.purchase-print .header-div {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.purchase-print .header-text ul {
    list-style: none;
}

.ivu-btn-primary {
    color: #fff;
}

@media print {
    .purchase-print {
        margin: 0;
        width: 100%;
        margin: 0 auto;
        position: fixed;
        top: 0;
        left: 0;
        padding: 0;
        display: block;
    }

    .ivu-btn-primary {
        display: none;
    }
}

/* action btn */
.dataTable .dropdown-toggle {
    position: relative;
}

/* admin product item */

.ExperinceSteps .steps-vertical {
    position: relative;
}

.ExperinceSteps .steps-vertical::before {
    content: "";
    background: #cdd4e0;
    height: 100%;
    height: 1px;
    left: 16px;
    position: absolute;
    height: 100%;
    width: 1px;
    z-index: -1;
}

.ExperinceSteps .step-number {
    background-color: #fff;
}

.ExperinceSteps .StepIcon svg {
    width: 20px;
    height: 20px;
}

.ExpCrtform .bootstrap-tagsinput {
    padding: 6px !important;
}

.login-role .role-menu {
    list-style: none;
    padding: 0;
    width: 100%;
}

.login-role .role-menu li {
    margin-bottom: 15px;
}

.filter-invert {
    filter: invert();
}

.border-green {
    border-color: var(--dark);
}

.login-role .role-menu li a {
    transition: all 0.1s linear;
}

.login-role .role-menu li a:hover {
    background-color: var(--dark);
    color: var(--white);
    transition: all 0.1s linear;
}

.login-role .role-menu li a:hover span {
    color: #fff !important;
}

.login-role .role-menu li a:hover span i {
    color: #fff !important;
}

#floor-plans {
    position: absolute;
    top: 60px;
}

div#calender {
    position: relative;
}

/* new */

.reser-tab-ul .nav-link.active,
.reser-tab-ul .nav-link:focus {
    font-weight: 600;
}

.reser-tab-ul {
    position: sticky;
    top: 0;
    z-index: 999;
    background: var(--white);
}

.reservation-right-col {
    overflow-y: auto;
    /* height: calc(100vh - 100px); */
    overflow-x: hidden;
}

.reservation-right-col .table-left-items .text-decoration-underline {
    text-decoration: none !important;
}

@media only screen and (max-width: 1399px) and (min-width: 768px) {
    .reservation-right-col .canvas-container {
        width: 600px !important;
    }
}

@media only screen and (max-width: 767px) and (min-width: 576px) {
    .reservation-right-col .canvas-container {
        width: 500px !important;
    }
}

.tab-content-flor {
    overflow-x: auto;
}

.pos-absolute.t-27 {
    top: 27px;
}

/* Invite guest */

.leave-tabs .nav-line .nav-link.active::after {
    background-color: #1c524d !important;
}

.leave-tabs .nav-link:hover,
.leave-tabs .nav-link.active,
.leave-tabs .nav-link:focus {
    color: #1c524d !important;
}

.leave-tabs .nav-link.active {
    font-weight: 600;
}

.leave-tabs .nav-line .nav-link {
    opacity: 1 !important;
}

/* start working logs ----*/

/* .history-list .h-card > div:hover{
    background: #f1f1f1;
    transition: all 0.2s linear;
} */

.history-list .h-card {
    position: relative;
    padding-bottom: 15px;
}

.history-list .h-card::before {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    left: -20px;
    top: 40%;
    transform: translateY(-50%);
    background-color: var(--dark);
    content: "";
    position: absolute;
}

.history-list .h-card::after {
    width: 1px;
    height: 100%;
    left: -16px;
    background-color: var(--dark);
    content: "";
    position: absolute;
    top: 40%;
}

.history-list .h-card:last-child::after {
    height: 0;
}

/* end working logs --------*/

/* start recipe  modal*/

.recipe-steps .progressbar {
    counter-reset: step;
}

.recipe-steps .progressbar li {
    position: relative;
    list-style: none;
    float: left;
    width: 33.33%;
    text-align: center;
    font-weight: 600;
}

/* Circles */
.recipe-steps .progressbar li::before {
    content: counter(step);
    counter-increment: step;
    width: 30px;
    height: 30px;
    border: 1px solid rgb(228, 228, 228);
    display: block;
    text-align: center;
    margin: 0 auto 10px auto;
    border-radius: 50%;
    background-color: rgb(228, 228, 228);
    position: relative;
    color: var(--dark);
    z-index: 5;
    line-height: 30px;
}

.recipe-steps .progressbar li::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background: rgb(228, 228, 228);
    top: 15px;
    /*half of height Parent (li) */
    left: -50%;
    z-index: 0;
}

.recipe-steps .progressbar li:first-child::after {
    content: none;
}

.recipe-steps .progressbar li.active::before {
    background: var(--dark);
    content: "✔";
    color: #fff !important;
}

.recipe-steps .progressbar li.active + li::after {
    background: var(--dark);
}

.form-switch .form-check-input {
    width: 40px;
    height: 20px;
}

.tx-yellow {
    color: #f5b72e;
}

/* end recipe  modal*/

.tab-active {
    background-color: #1c524d;
    color: #fff;
}

.tab-active:hover,
.tab-active:active {
    color: #fff !important;
    background-color: #1c524d !important;
}

/* strat slack integration tab */

.slack-int-tab .nav-link {
    display: flex;
    border-radius: 0 !important;
    padding: 30px 15px;
    font-weight: 600;
    background-color: #f4f5f8;
    justify-content: start;
    border-right: 1px solid #d8dde7 !important;
    border-top: 0 !important;
    border-left: 0 !important;
}

.slack-int-tab .nav-link.active {
    border-left: 3px solid #1c524d !important;
    border-right: 0 !important;
    background-color: #fafbfc !important;
}

/* .slack-int-tab .nav-tabs{
    border: 0 !important;
} */

.slack-int-tab .nav-tabs.flex-column .nav-item + .nav-item {
    margin-top: 0;
}

.tab-arrow {
    position: absolute;
    top: 50%;
    z-index: 10;
    opacity: 0.5;
    transform: translateY(-50%);
}

.tab-left-arrow {
    left: 5px;
}

.tab-right-arrow {
    right: 5px;
}

/* end slack integration tab */

/* reservation */

.CollapsCard .upcoming_html {
    /* height: 300px;
    overflow-y: auto;
    overflow-x: hidden; */
    padding-right: 15px;
    padding-left: 15px;
}

.TableDropdown {
    position: absolute;
    right: 100px;
}

.CollapsCard .content-search {
    width: 95% !important;
    margin: 0 auto;
}

/* shift */

.work-calendar {
    height: calc(100vh - 174px);
}

/* receipe list */

.leave-dropdown .fa-chevron-down {
    opacity: 0.7;
}

.leave-dropdown .dropdown-item:focus {
    color: #000 !important;
    font-size: 14px;
}

.t-search-form input:focus {
    border-color: #f4f5f8 !important;
}

.t-search-form button {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.t-search-form .form-control:focus + button,
.t-search-form .form-control:active + button {
    border-color: #f4f5f8 !important;
}

/* dashboard admin message */

.d-msg-card li.media:last-child {
    border-bottom: none !important;
}

.da-card {
    max-height: 400px;
    min-height: 400px;
    overflow-y: auto;
}

.da-card2 {
    max-height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
}

.bd-b-last-3:not(:last-child) {
    border-bottom: 1px solid rgba(72, 94, 144, 0.16);
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.customer-img img {
    margin-right: 0.5rem;
}

/* shift tab */

.slack-int-tab .shift-body {
    height: calc(100vh - 165px);
    overflow: auto;
}

/* reservation tab */

.ResActivetab,
.UpcomingTab {
    height: 100%;
}

/* card border bottom */

.card.order-list-detail .col-lg-12.col-12:last-child {
    border-bottom: none !important;
}

/* ordrers */

.PosProductCard .ProductTotal {
    width: 100%;
    overflow-y: hidden;
    overflow-x: hidden;
}

.kot-row .select2-container,
.kot-row .sp-container {
    z-index: 999 !important;
}

.trash-btn {
    position: absolute;
    right: 0;
    top: 0;
    height: 39px;
}

/* .beta-tag {
    color: var(--dark) !important;
    padding: 1px !important;
    background: #fff;
    font-size: 12px;
    height: fit-content;
    display: flex;
    align-items: center;
    border-radius: 8px !important;
    line-height: 1;
} */
.beta-tag {
    color: var(--dark) !important;
    padding: 1px !important;
    background: #fff;
    font-size: 12px;
    height: fit-content;
    display: flex;
    align-items: center;
    border-radius: 7px !important;
    line-height: 1;
    padding-left: 2px !important;
    padding-right: 2px !important;
    padding-bottom: 3px !important;
}

/* genrate AI */
/*
  .genrateal-btn {
    --border-size: 3px;
    --border-angle: 0turn;
    width: 110px;

    height: 30px;
    line-height: 30px;
    border: 1px solid #d7d7d7;
    border-radius: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #1c524d;
    animation: bg-spin 3s linear infinite;
    background-image: conic-gradient(
        from var(--border-angle),
        #fff,
        #fff 50%,
        #fff
      ),
      conic-gradient(from var(--border-angle), transparent 10%, #1c524d, #3ab795);
    background-size: calc(100% - (var(--border-size) * 1))
        calc(100% - (var(--border-size) * 1)),
      cover;
    background-position: center center;
    background-repeat: no-repeat;


  }



  @property --border-angle {
    syntax: "<angle>";
    inherits: true;
    initial-value: 0turn;
  }



  @keyframes bg-spin {
    to {
        --border-angle: 1turn;
    }
  }
   */

/* new one */

/* .ai-btn {
    position: relative;
    color: #1c524d;
    text-decoration: none;
    overflow: hidden;
    font-size: 14px;
    padding: 4px 10px;
    border: 1px solid #d7d7d7;
    border-radius: 2px;
}

.ai-btn span:nth-child(1) {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 1px;
	background: linear-gradient(to right, #3ab795, #1c524d);
	animation: animate1 2s linear infinite;
}

@keyframes animate1 {
	0% {
		transform: translateX(-100%);
	}
	100% {
		transform: translateX(100%);
	}
}

.ai-btn span:nth-child(2) {
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	width: 2px;
	background: linear-gradient(to bottom, #3ab795, #1c524d);
	animation: animate2 2s linear infinite;
	animation-delay: 1s;
}
@keyframes animate2 {
	0% {
		transform: translateY(-100%);
	}
	100% {
		transform: translateY(100%);
	}
}

.ai-btn span:nth-child(3) {
	position: absolute;
	bottom: 0;
	right: 0;
	width: 100%;
	height: 2px;
	background: linear-gradient(to left, #3ab795, #1c524d);
	animation: animate3 2s linear infinite;
}

@keyframes animate3 {
	0% {
		transform: translateX(100%);
	}
	100% {
		transform: translateX(-100%);
	}
}

.ai-btn span:nth-child(4) {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 2px;
	background: linear-gradient(to top, #3ab795, #1c524d);
	animation: animate4 2s linear infinite;
	animation-delay: 1s;
}

@keyframes animate4 {
	0% {
		transform: translateY(100%);
	}
	100% {
		transform: translateY(-100%);
	}
} */

/* new one */

/* new two */

.upsale-button {
    position: relative;
    z-index: 0;
    height: 40px;
    overflow: hidden;
    border: none !important;
    padding: 0 !important;
    background: #ffffff !important;
    border-radius: 4px;
    width: 100px;
    text-align: center;
    font-size: 14px;
    font-weight: 400;
    transition: 0.2s all linear;
    text-decoration: initial;
}

.upsale-button span {
    position: relative;
    z-index: 1;
    height: calc(100% - 4px);
    width: calc(100% - 4px);
    top: 2px;
    left: 2px;
    align-items: center;
    display: flex;
    justify-content: center;
    border-radius: 4px;
    color: #3ab795;
    background: #ffffff;
    border: 1px solid #ededed;
    font-weight: 500;
}

.upsale-button:after {
    content: "";
    position: absolute;
    z-index: -2;
    left: -50%;
    top: -50%;
    width: 200%;
    height: 200%;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: 50% 50%, 50% 50%;
    background-position: 0 0, 100% 0, 100% 100%, 0 100%;
    background-image: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0) 0%,
        #1c524d 50%,
        #3ab795 100%
    );
    -webkit-animation: rotate 2s linear infinite;
    animation: rotate 3s linear infinite;
}

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

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

/* new two */

/* Responsvie Media  Query---------------------------------------------- */

@media (min-width: 1200px) {
    .aside-menu-link {
        /* display: none; */
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .asidemenuadmin .aside-header svg {
        color: #fff !important;
    }

    .minimize .aside-menu-link svg:last-child {
        display: none;
    }
}

@media (max-width: 991px) {
    .eventlist-card .order--1 {
        order: -1 !important;
    }

    .eventlist-card .order--2 {
        order: -1 !important;
    }

    .dashboard .box-hover img {
        height: 50px;
    }

    .dashboard .box-hover .card-text {
        font-size: 16px;
    }

    .aside-header {
        background-color: var(--cream);
    }

    .show-aside .aside-header {
        background-color: var(--dark);
    }

    .show-aside .aside-menu-link {
        color: var(--white);
    }

    .SubFoodList .FoodItems {
        min-height: auto;
    }

    .ProductTotal {
        padding-bottom: 100px;
    }

    .ProductToalBottom {
        position: initial;
    }

    .SubFoodList .Childflex {
        width: calc(50% - 10px);
        min-height: auto;
    }

    .PosProductCard {
        height: 100%;
    }

    .mail-content-body {
        top: 130px;
    }

    .ExpCratag .bootstrap-tagsinput .tag {
        margin: 5px;
    }

    .ExperinceSteps .steps-vertical {
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        gap: 30px;
    }

    .ExperinceSteps {
        padding: 10px;
    }

    .ExperinceSteps .step-number {
        width: 30px;
        height: 30px;
    }

    .TicketTab .AdmissionUL {
        gap: 35px;
    }

    .ExperinceSteps .steps-vertical .step-item + .step-item::before {
        background-color: transparent;
    }

    .ExperinceSteps .steps-vertical .step-item + .step-item {
        margin-top: initial;
    }

    .LocationBtn {
        margin: 15px 15px 25px 0;
    }

    .ExperinceSteps .step-title {
        display: none;
    }

    .RessideCard .ResFooter {
        position: initial;
    }

    .RessideCard {
        height: initial;
    }

    .ResCards {
        margin-bottom: 10px;
    }

    .SplitFooter {
        border-radius: 0;
    }

    .SpitItmpg .CheckBox {
        gap: 10px;
    }

    .RessideCard .dropdown-menu {
        left: -90px !important;
        top: 55px !important;
    }

    .RessideCard .dropdown-menu::after {
        top: -14px;
        left: 140px;
        rotate: 90deg;
    }

    .RessideCard .dropdown-menu::before {
        top: -17px;
        left: 134px;
        rotate: 90deg;
    }
}

@media (min-width: 992px) {
    .ExperinceSteps {
        position: sticky;
        width: auto;
        top: 0;
    }

    .aside-header {
        height: 80px !important;
        padding: 0 20px !important;
    }
}

@media (max-width: 767px) {
    .sales-report .table {
        min-width: 800px;
    }

    .bk-ticket,
    .addnew-exp,
    .exp-status {
        width: 100%;
    }

    .exp-status button {
        width: 100%;
        margin-left: -8px;
    }

    .slack-int-tab .nav.nav-tabs {
        width: 89%;
        flex-direction: row !important;
        white-space: nowrap;
        flex-wrap: nowrap;
        overflow: auto;
        margin: 0 auto;
    }

    .slack-int-tab .nav-link {
        padding: 30px 10px;
    }
}

@media (max-width: 575px) {
    .SpitItmpg .SpitTotalitem {
        width: initial;
    }
}

/* start add employe modal */

.invisible-checkboxes {
    display: flex;
}

.checkbox-alias {
    background-color: #dadada;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    z-index: 1;
    position: relative;
    transition: all 250ms ease-out;
    cursor: pointer;
    border-radius: 50%;
    color: #000;
    line-height: 45px;
}

.invisible-checkboxes input[type="checkbox"] {
    display: none;
}

.invisible-checkboxes input[type="checkbox"]:checked + .checkbox-alias {
    background-color: #1c524d;
    color: #fff;
}

/* End add employe modal */

.modal-shift {
    border: 1px solid var(--gray-light);
    /* background-color: #fbfbfb; */
    border-radius: 5px;
}

.modal-shift p {
    margin-bottom: 2px;
}

@media only screen and (min-width: 360px) and (max-width: 770px) {
    .shift-menu {
        border-radius: 5px;
        padding: 5px 25px;
        background-color: var(--black-light);
        color: var(--white);
    }
}

.shift-menu {
    border-radius: 5px;
    padding: 5px 40px;
    background-color: #4b4b4b;
    color: var(--white);
}

.shift-menu:hover {
    border-radius: 5px;
    padding: 5px 40px;
    background-color: var(--dark);
    color: var(--white);
    cursor: pointer;
}

.shift-menu img {
    height: 20px;
    width: 20px;
}

.shift-menu img:hover {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

/* Date & Time Picker */

.bootstrap-datetimepicker-widget.dropdown-menu {
    /* border: 1px solid #34495e; */
    border-radius: 0;
    box-shadow: none;
    margin: 10px 0 0 0;
    padding: 0;
    min-width: 300px;
    max-width: 100%;
    width: auto;
}

.bootstrap-datetimepicker-widget.dropdown-menu.bottom:before,
.bootstrap-datetimepicker-widget.dropdown-menu.bottom:after {
    display: none;
}

.bootstrap-datetimepicker-widget.dropdown-menu table td,
.bootstrap-datetimepicker-widget.dropdown-menu table th {
    border-radius: 0;
}

.bootstrap-datetimepicker-widget.dropdown-menu table td.old,
.bootstrap-datetimepicker-widget.dropdown-menu table td.new {
    color: #bbb;
}

.bootstrap-datetimepicker-widget.dropdown-menu table td.today:before {
    border-bottom-color: #0095ff;
}

.bootstrap-datetimepicker-widget.dropdown-menu table td.active,
.bootstrap-datetimepicker-widget.dropdown-menu table td.active:hover,
.bootstrap-datetimepicker-widget.dropdown-menu table td span.active {
    background-color: #0095ff;
    text-shadow: none;
}

.bootstrap-datetimepicker-widget.dropdown-menu table td.active.today:before,
.bootstrap-datetimepicker-widget.dropdown-menu
    table
    td.active:hover.today:before,
.bootstrap-datetimepicker-widget.dropdown-menu
    table
    td
    span.active.today:before {
    border-bottom-color: #fff;
}

.bootstrap-datetimepicker-widget.dropdown-menu table th {
    height: 40px;
    padding: 0;
    width: 40px;
}

.bootstrap-datetimepicker-widget.dropdown-menu table th.picker-switch {
    width: auto;
}

.bootstrap-datetimepicker-widget.dropdown-menu table tr:first-of-type th {
    border-bottom: 1px solid #34495e;
}

.bootstrap-datetimepicker-widget.dropdown-menu table td.day {
    height: 32px;
    line-height: 32px;
    padding: 0;
    width: auto;
}

.bootstrap-datetimepicker-widget.dropdown-menu table td span {
    border-radius: 0;
    height: 77px;
    line-height: 77px;
    margin: 0;
    width: 25%;
}

.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-months tbody tr td,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-years tbody tr td,
.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-decades tbody tr td {
    padding: 0;
}

.bootstrap-datetimepicker-widget.dropdown-menu .datepicker-decades tbody tr td {
    height: 27px;
    line-height: 27px;
}

.bootstrap-datetimepicker-widget.dropdown-menu
    .datepicker-decades
    tbody
    tr
    td
    span {
    display: block;
    float: left;
    width: 50%;
    height: 46px;
    line-height: 46px !important;
    padding: 0;
}

.bootstrap-datetimepicker-widget.dropdown-menu
    .datepicker-decades
    tbody
    tr
    td
    span:not(.decade) {
    display: none;
}

.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td {
    padding: 0;
    width: 30%;
    height: 20px;
    line-height: 20px;
}

.bootstrap-datetimepicker-widget.dropdown-menu
    .timepicker-picker
    table
    td:nth-child(2) {
    width: 10%;
}

.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td a,
.bootstrap-datetimepicker-widget.dropdown-menu .timepicker-picker table td span,
.bootstrap-datetimepicker-widget.dropdown-menu
    .timepicker-picker
    table
    td
    button {
    border: none;
    border-radius: 0;
    height: 56px;
    line-height: 56px;
    padding: 0;
    width: 100%;
}

.bootstrap-datetimepicker-widget.dropdown-menu
    .timepicker-picker
    table
    td
    span {
    color: #333;
    margin-top: -1px;
}

.bootstrap-datetimepicker-widget.dropdown-menu
    .timepicker-picker
    table
    td
    button {
    background-color: #fff;
    color: #333;
    font-weight: bold;
    font-size: 1.2em;
}

.bootstrap-datetimepicker-widget.dropdown-menu
    .timepicker-picker
    table
    td
    button:hover {
    background-color: #eee;
}

.bootstrap-datetimepicker-widget.dropdown-menu .picker-switch table td {
    border-top: 1px solid #34495e;
}

.bootstrap-datetimepicker-widget.dropdown-menu .picker-switch table td a,
.bootstrap-datetimepicker-widget.dropdown-menu .picker-switch table td span {
    display: block;
    height: 40px;
    line-height: 40px;
    padding: 0;
    width: 100%;
}

.clock-position {
    position: absolute;
    top: 13px;
    right: 11px;
}

.clock-position:hover {
    position: absolute;
    top: 13px;
    right: 11px;
    cursor: pointer;
}

.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n + 3),
.input-group:not(.has-validation)
    > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.input-group {
    position: relative;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
}

.shift-time .input-group {
    position: relative;
    display: inline-block;
    align-items: stretch;
    width: 100%;
}

.new-table-pad tr th {
    border-bottom-width: 1px;
}

.new-table-pad th,
.new-table-pad td {
    padding: 8px 15px;
}

/* Date & Timepicker End */

.approve-hours {
    font-weight: 700;
    font-size: 17px;
}

.appovetime {
    color: var(--bg-lightgreen);
    font-size: 14px;
    font-weight: 400;
}

.reserve-usericon {
    height: 40px;
    width: 40px;
    line-height: 32px;
    border-radius: 50%;
    background-color: var(--dark);
    color: var(--white);
    text-align: center;
    position: relative;
}

.reserve-content h6 {
    font-weight: 600;
    margin-bottom: 0px;
}

.reserve-content p {
    font-size: 14px;
    margin-bottom: -1px;
}

.read-inputtags {
    border: 1px solid #97a3b9;
    border-radius: 0.25rem;
    padding: 5px;
}

.read-inputtags p {
    line-height: 20px;
}

.min-navh {
    min-height: 585px;
}

.col-minh {
    min-height: 585px;
    border-right: 1px solid #97a3b9;
}

.role-guest .nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    color: var(--black) !important;
    background-color: #efeff5;
}

.role-guest .nav-link {
    display: block;
    padding: 9px 9px;
    font-size: var(--bs-nav-link-font-size);
    font-weight: var(--bs-nav-link-font-weight);
    color: var(--black);
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out;
}

.role-guest .nav-pills .nav-link {
    background: none;
    border: 0;
    border-radius: none;
    border-bottom: 0.55px solid #97a3b9;
}

.guest-name {
    margin-bottom: -6px;
}

.bg-gray-150 {
    background-color: var(--dark);
    color: var(--white);
}

.bootstrap-tagsinput .tag {
    margin-right: 2px;
    color: white;
    margin-bottom: 7px;
}

input.bg-transparent:focus {
    box-shadow: none;
}

#discussion-sort .search-form .form-control:focus + button,
#discussion-sort .search-form .form-control:active + button {
    border-color: #e2e5ed;
}

#discussion-sort .search-form .form-control:focus,
#discussion-sort .search-form .form-control:active {
    border-color: #e2e5ed;
    box-shadow: none !important;
}

/* employe month */

/* tr:nth-child(1) td.fc-event-container .fc-day-grid-event {
    background-color: transparent ;
    padding: 0;
    border-color: transparent;
}

tr:nth-child(1) td.fc-event-container .fc-day-grid-event .fc-title {
    color: #000;
}

tr:nth-child(2) td.fc-event-container .fc-day-grid-event {
    background-color: #3ab795 !important;
    padding: 3px;
}

tr:nth-child(2) td.fc-event-container .fc-day-grid-event .fc-title {
    color: #fff !important;
}

.fc-day-top.fc-thu.fc-today .fc-day-number {
    background-color: #1c524d !important;
}

.calendar-content-body .fc-toolbar .fc-center h2 {
    color: #000;
} */

/* event invoices */

.event-invoices {
    gap: 10px;
}

.event-invoices .items {
    width: 33.33%;
}

.eventinadd td .numbersOnly {
    margin-left: auto !important;
}

/* evnent packages */

.inquiry-package-list .dropdown-item:hover,
.inquiry-package-list .dropdown-item:active,
.inquiry-package-list .dropdown-item:focus {
    color: #000 !important;
}

.a-link {
    word-break: break-all;
}

/* help desk */

.all-ticket-icon {
    background-color: #0017371f;
}

.active-ticket-icon {
    background-color: #0c884229;
}

.resolved-ticket-icon {
    background-color: #6f3ef326;
}

.closed-ticket-icon {
    background-color: #dc354530;
}

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

.bg-sec-tags {
    display: flex;
    gap: 10px;
    align-items: center;
    padding-left: 15px;
    list-style: none;
}

.bg-sec-tags li {
    background: var(--gray-light2);
    font-size: 12px;
    color: var(--gray-color);
    padding: 3px 5px;
}

/* .modal-dialog #map div{
    position: relative !important;
    overflow:unset  !important;
}
.modal-dialog #map div{
    position: relative !important;
    overflow:unset  !important;
} */
.print-invoice-img img {
    max-height: 110px;
}

.print-invoice-table td {
    vertical-align: top;
}

.print-total-pay.total-final-pay .print-bal-due {
    background-color: #f7f7f7;
}

.qty-input {
    border: none;
    text-align: center;
    background-color: transparent;
    max-width: 35%;
    outline: none;
}

.qty-input:focus {
    border: none;
    outline: none;
}

.btn-sm-icon {
    padding: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.btn-sm-icon svg,
.btn-sm-icon img,
.btn-sm-icon .fa {
    flex-shrink: 0;
}

@media only screen and (min-width: 360px) and (max-width: 915px) {
    .min-navh {
        min-height: 610px;
    }
}

@media only screen and (min-width: 360px) and (max-width: 915px) {
    .col-minh {
        min-height: auto;
    }
}

/* map */
#map {
    height: 300px;
}

#map #infowindow-content {
    display: inline;
}

.pac-container {
    z-index: 999999;
}

.cust-nav.nav-tabs {
    border: none;
}

.cust-nav.nav-tabs .nav-link {
    background-color: #f7f7f7;
    border: none;
    color: #000;
    border-radius: 0.25rem;
}

.cust-nav.nav-tabs .nav-link.active,
.cust-nav.nav-tabs .nav-item.show .nav-link {
    background-color: #cbd6d5;
    color: var(--dark) !important;
}

.new-status {
    border: 2px solid;
}

.Closedbox {
    border-color: #ffdf7f;
}

.Lostbox {
    border-color: #6d5d55;
}

.Finalizedbox {
    border-color: #80da7d;
}

.Pendingbox {
    border-color: #ff6b7a;
}

.Contractedbox {
    border-color: #89baff;
}

.Leadbox {
    border-color: #bb695f;
}

.Bookedbox {
    border-color: #f8a36a;
}

.no-found {
    display: flex;
    align-items: center;
    justify-content: center;
    height: calc(100vh - 300px);
}

.image-note p {
    margin-bottom: 0;
    font-size: 12px;
}

.image-note {
    margin-top: 5px;
}

.allFoodlist {
    height: calc(100vh - 100px);
    position: relative;
}

.firstFoodlist {
    max-height: 20%;
    overflow-y: hidden;
}

.midFoodlist {
    max-height: 35%;
    overflow-y: auto;
}

.lastFoodlist {
    max-height: calc(60% - 20px);
    overflow-y: auto;
}

.food-total {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.product-extra-items .food-size span {
    padding: 4px 5px;
    margin: 3px;
    font-size: 13px;
}

.food-size {
    display: flex;
    flex-wrap: wrap;
}

.product-extra-items .food-modifier span {
    background-color: #f4f5f8;
    border: 1px solid #f4f5f8;
    border-radius: 5px;
    padding: 4px 5px;
    margin: 5px;
    font-size: 13px;
}

.food-modifier {
    display: flex;
    flex-wrap: wrap;
}

.fs-7 {
    font-size: 17px;
}

.customer-order-info {
    display: flex;
    flex: auto;
    justify-content: space-between;
}

.customer-info-box {
    width: 100%;
    border-left: 1px solid #dfdfdf;
    padding: 10px;
}

.customer-info-box:first-child {
    border-left: 0px;
}

.customer-info-box a {
    color: var(--black);
}

.customer-info-box svg {
    height: 16px;
    width: 16px;
}

.Product-size .select-size label {
    border-radius: 20px;
    padding: 4px 14px;
}

.product-modal .PosProductCard .button-minus,
.PosProductCard .button-plus {
    background-color: #fff !important;
}

.product-modal .skin-2 .num-in input {
    height: 40px;
    width: 40px;
    line-height: 35px !important;
}

.product-modal .pos-modifier-tab.nav-pills .nav-link::before {
    content: none;
}

.product-modal .pos-modifier-tab li.nav-item {
    padding: 2px;
}

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

.cust-tooltip.tooltip {
    position: relative;

    display: inline-block;

    opacity: 1;

    font-size: 17px;

    cursor: pointer;
    z-index: 2;
}

.cust-tooltip.tooltip .tooltiptext {
    visibility: hidden;

    width: 250px;

    background-color: black;

    color: #fff;

    text-align: start;

    border-radius: 6px;

    padding: 5px 14px;

    position: absolute;

    z-index: 1;

    top: 50%;

    left: 110%;

    transform: translateY(-50%);

    font-size: 12px;
}

.cust-tooltip.tooltip .tooltiptext::after {
    content: "";

    position: absolute;

    top: 50%;

    right: 100%;

    margin-top: -5px;

    border-width: 5px;

    border-style: solid;

    border-color: transparent black transparent transparent;
}

.cust-tooltip.tooltip:hover .tooltiptext {
    visibility: visible;
}

.cust-tooltip.tooltip .fa-exclamation-circle {
    vertical-align: sub;
}

.bd-primary {
    border-color: #0168fa;
}

.bd-success {
    border-color: #0c8842;
}

.collapse-bg-color {
    background-color: rgba(58, 183, 149, 10%);
}

.collapse-bg-color:has(.collapsed),
.collapse-bg-color.collapsed {
    background-color: transparent;
}

.event-space-list
    .custom-control.custom-checkbox
    .form-check-input:disabled
    + .custom-control-label {
    opacity: 0.7;
    color: #b1b1b1;
}

.blockerButton {
    -webkit-animation: attention-red 1s infinite;
    -moz-animation: attention-red 1s infinite;
    -o-animation: attention-red 1s infinite;
    animation: attention-red 1s infinite;
}

@-webkit-keyframes attention-red {
    0%,
    49% {
        background-color: #f02a3e;
    }

    50%,
    100% {
        background-color: #b42130;
    }
}

.couponCheckBox,
.couponCheckBox ~ label {
    opacity: 0.7;
    color: #b1b1b1;
}

.report-ul {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
}

.cust-search {
    position: relative;
}

.cust-search input[type="search"] {
    padding-left: 34px;
    background: #fff;
    border-radius: 10px;
    border: 1px solid rgba(0, 0, 0, 0.25);
}

.cust-search .search-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 10px;
    color: #ccc;
    width: 16px;
}

.modal-search {
    background: #ebf8f4;
}

.modal-search .cust-search {
    width: 100%;
}

.search-modal {
    border-radius: 14px;
}

.dot-after {
    position: relative;
    padding-right: 30px;
}

.dot-after::after {
    content: "";
    width: 5px;
    height: 5px;
    background: #ccc;
    border: 1px solid #ccc;
    border-radius: 100%;
    display: inline-block;
    position: absolute;
    top: 40%;
    right: 10px;
}

.cust-marquee {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: 100%;
    overflow-x: hidden;
}

.track {
    position: absolute;
    height: 100%;
    white-space: nowrap;
    will-change: transform;
    animation: marquee 5s linear infinite;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }

    50% {
        transform: translateX(-100%);
    }

    100% {
        transform: translateX(0);
    }
}

.new-card-sty {
    position: relative;
}

.new-card-sty .card-footer-cust {
    position: absolute;
    transition: all 0.3s ease-in-out;
    top: 8px;
    right: 0;
}

.card-hover:hover {
    background: #f1f1f1b4;
}

.footer-cta {
    position: sticky;
    bottom: 0;
    padding: 0px 0 10px;
    background: var(--cream);
    z-index: 3;
}

.stick-nav-tabs ul li {
    position: relative;
    padding: 0px 5px;
}

.stick-nav-tabs ul li:after {
    content: "";
    position: absolute;
    top: 10px;
    bottom: 0px;
    background-color: #ddd;
    height: 48%;
    width: 2px;
    right: -13px;
}

.stick-nav-tabs ul li:last-child::after {
    content: none;
}

.evestick-nav-tabs .nav-line .nav-item + .nav-item:first-child {
    margin-left: 0px !important;
}

.ui-timepicker-container {
    z-index: 5;
}

/* Loading text css */
.step-loader-wrapper {
    /* background: #fff; */
    height: calc(100vh - 70px);
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(256, 256, 256, 0.8);
    backdrop-filter: blur(1px);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
}

.step-loader-area {
    text-align: center;
}

.step-loader-area .spinner-border {
    width: 80px;
    height: 80px;
    border-color: #1c524d;
    border-width: 5px;
    border-right-color: transparent;
    margin-bottom: 30px;
}

.loading-text {
    position: relative;
    top: 26%;
    left: 0;
    color: #000;
    width: 400px;
    margin: auto;
    text-align: center;
}

.loading-text .words-wrapper {
    display: inline-block;
    position: relative;
    text-align: start;
    font-size: 30px;
}

.loading-text .words-wrapper b {
    opacity: 0;
    display: inline-block;
    position: absolute;
    white-space: nowrap;
    left: 0;
    top: 0;
    font-weight: 200;
}

.loading-text .words-wrapper .is-visible {
    position: relative;
    opacity: 1;
    -webkit-animation: push-in 0.5s;
    -moz-animation: push-in 0.5s;
    animation: push-in 0.5s;
}

.loading-text .words-wrapper .is-hidden {
    -webkit-animation: push-out 0.5s;
    -moz-animation: push-out 0.5s;
    animation: push-out 0.5s;
}

.words-wrapper {
    font-size: 30px;
    font-weight: 600;
}

.letter.space {
    display: inline-block;
    /* Ensure it takes space in the flow */
}

@-webkit-keyframes push-in {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
    }

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

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

@-moz-keyframes push-in {
    0% {
        opacity: 0;
        -moz-transform: translateY(-100%);
    }

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

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

@keyframes push-in {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-100%);
        -moz-transform: translateXY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%);
    }

    60% {
        opacity: 1;
        -webkit-transform: translateY(10%);
        -moz-transform: translateY(10%);
        -ms-transform: translateY(10%);
        -o-transform: translateY(10%);
        transform: translateY(10%);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
    }
}

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

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

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

@-moz-keyframes push-out {
    0% {
        opacity: 1;
        -moz-transform: translateY(0);
    }

    60% {
        opacity: 0;
        -moz-transform: translateY(110%);
    }

    100% {
        opacity: 0;
        -moz-transform: translateY(100%);
    }
}

@keyframes push-out {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -o-transform: translateY(0);
        transform: translateY(0);
    }

    60% {
        opacity: 0;
        -webkit-transform: translateX(110%);
        -moz-transform: translateY(110%);
        -ms-transform: translateY(110%);
        -o-transform: translateY(110%);
        transform: translateY(110%);
    }

    100% {
        opacity: 0;
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -ms-transform: translateY(100%);
        -o-transform: translateY(100%);
        transform: translateY(100%);
    }
}

/* loading text style2 */
.load-text-sty2 {
    position: relative;
    /* Ensure container is positioned relatively */
}

.load-text-sty2 .words-wrapper {
    position: relative;
    /* Ensure the wrapper is positioned relatively */
    overflow: hidden;
    /* Hide overflow to avoid unwanted scrollbars */
}

.load-text-sty2 .word {
    position: absolute;
    opacity: 0;
    display: inline-block;
    /* Ensure each word is treated as a block */
    white-space: nowrap;
    /* Prevent wrapping */
    z-index: 1;
    /* Ensure words stack correctly */
}

.load-text-sty2 .letter {
    display: inline-block;
    position: relative;
    float: none;
    /* Removed float to ensure proper alignment */
    transform: translateZ(25px);
    transform-origin: 50% 50% 25px;
}

.load-text-sty2 .letter.out {
    transform: rotateX(90deg);
    transition: transform 0.32s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.load-text-sty2 .letter.behind {
    transform: rotateX(-90deg);
}

.load-text-sty2 .letter.in {
    transform: rotateX(0deg);
    transition: transform 0.38s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.wisteria {
    color: #8e44ad;
}

.belize {
    color: #2980b9;
}

.pomegranate {
    color: #c0392b;
}

.green {
    color: #16a085;
}

.midnight {
    color: #2c3e50;
}

.temp-img {
    max-width: 150px;
    width: 110px;
    height: 130px;
    border-radius: 14px;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.175);
    margin-right: 15px;
    margin-top: 5px;
    margin-bottom: 5px;
    border: 1px solid rgba(0, 0, 0, 0.175);
}

.temp-img img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 14px;
    object-position: top;
}

.temp-dec {
    margin: 5px 0;
}

.template-card-dec {
    position: relative;
    border: 1px solid rgba(0, 0, 0, 0.175);
    cursor: pointer;
}

.card-img-wrapper {
    position: relative;
}

.card-temp-img {
    border-radius: 0.5rem 0.5rem 0 0;
}

.card-temp-img img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 0.5rem 0.5rem 0 0;
    object-position: top;
}

.template-card-dec:hover .card-temp-img img {
    /* transform: scale(0.9); */
}

.card-btn-group {
    position: absolute;
    opacity: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(5px);
    transition: all 0.3s ease-in-out;
}

.temp-label-wrapper .card-btn-group {
    border-radius: 0.5rem 0.5rem 0 0;
}

.template-card-dec:hover .card-btn-group,
.temp-label-wrapper:hover .card-btn-group {
    opacity: 1;
}

.card-temp-option {
    position: absolute;
    top: 10px;
    right: 10px;
}

ul.tab-nav-ul {
    display: flex;
    align-items: center;
    list-style: none;
    border: 1px solid rgba(0, 0, 0, 0.02);
    border-radius: 50px;
}

ul.tab-nav-ul .nav-link {
    background-color: transparent;
    border: 1px solid #000;
    color: #000 !important;
    position: relative;
    padding: 15px 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    transition: background-color 0.2s;
}

ul.tab-nav-ul .nav-link.tab-1 {
    border-radius: 10px 0 0 10px;
}

ul.tab-nav-ul .nav-link.tab-2 {
    border-radius: 0px 10px 10px 0px;
}

.tab-nav-ul .nav-item:hover .nav-link {
    background-color: #3ab795;
    color: #fff !important;
}

.tab-nav-ul .nav-item.active .nav-link,
.tab-nav-ul .nav-item.active:hover .nav-link {
    background-color: #12604b;
    color: #fff !important;
}

.temp-checkbox .temp-label-wrapper {
    display: inline-block;
    text-align: start;
    border-radius: 5px;
    padding: 0;
    color: #333;
    width: 100%;
    position: relative;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
    /* height: 386px; */
    overflow: hidden;
}

.temp-checkbox .card-input-element {
    display: none;
}

.temp-checkbox .temp-card-input {
    margin: 0px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #adadad;
    border-radius: 10px;
    height: 100%;
    position: relative;
}

.temp-checkbox .temp-label-wrapper .temp-card-input::before {
    content: "\f00c";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    right: 0;
    top: 0px;
    position: absolute;
    color: #fff;
    background: var(--bg-lightgreen);
    border-radius: 0 14px 0 100px;
    padding: 0px 0px 6px 11px;
    z-index: 1;
    font-size: 15px;
    width: 30px;
    height: 30px;
    line-height: 30px;
    opacity: 0;
}

.temp-checkbox .temp-label-wrapper:hover .temp-card-input {
    background-color: #f7f7f7;
}

.temp-checkbox .card-input-element:checked + .temp-card-input {
    border: 2px solid var(--bg-lightgreen);
}

.temp-checkbox .card-input-element:checked + .temp-card-input::before {
    opacity: 1;
}

.footer-temp-fix {
    position: fixed;
    width: 425px;
    height: 50px;
    background-color: rgb(238, 238, 238);
    bottom: 0;
    right: 0;
    padding: 0 20px;
}

.segment-details-list {
    height: 196px;
    overflow-y: auto;
}

.segment-or:not(.segment-or:last-child),
.segment-and:not(.segment-and:last-child) {
    position: relative;
    margin-bottom: 30px;
}

.segment-or:not(.segment-or:last-child)::before {
    content: "OR";
    border: none;
    width: fit-content;
    position: absolute;
    bottom: -25px;
    left: 15px;
    color: #9d9d9d;
    z-index: 3;
}

.segment-and:not(.segment-and:last-child)::before {
    content: "AND";
    border: none;
    width: fit-content;
    position: absolute;
    bottom: -25px;
    left: 10px;
    color: #12604b;
    z-index: 3;
    font-weight: 600;
}

.temp-logo-text {
    position: relative;
}

.temp-logo-text::before {
    content: "";
    position: absolute;
    height: 100%;
    border: none;
    border-right: 2px solid #fff;
    left: -10px;
    top: 0;
}

.tag-input {
    position: relative;
    /* flex-shrink: 0; */
    flex-grow: 1;
}

.tag-input .bootstrap-tagsinput {
    display: flex;
    /* width: 332px; */
    flex-shrink: 0;
    /* max-width: 200px; */
    flex-wrap: wrap;
    gap: 3px;
}

.date-wrapper {
    position: relative;
}

.date-selected {
    position: absolute;
    top: 6px;
    right: 15px;
}

.text-decoration-link {
    text-decoration: 1px underline var(--bg-lightgreen);
    text-underline-offset: 5px;
    transition: all 0.3s ease-in-out;
    opacity: 1;
}

.order-summery-list ul li {
    list-style-type: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 0px;
}

.order-summery-list ul li p {
    margin-bottom: 0px;
}

.order-summery-list ul li:last-child {
    border-top: 1px dashed #adadad;
    border-bottom: 1px solid #adadad;
    padding: 11px 0px;
    margin-top: 5px;
}

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

.bg-uniqueClicks {
    background: #a1d6b2;
}

.bg-clickers {
    background: #cedf9f;
}

.bg-complaints {
    background: #f1f3c2;
}

.bg-delivered {
    background: #e8b86d;
}

.bg-sent {
    background: #8eaccd;
}

.bg-softBounces {
    background: #c2d5fa;
}

.bg-hardBounces {
    background: #fcf3ba;
}

.bg-uniqueViews {
    background: #e0ffb6;
}

.bg-unsubscriptions {
    background: #ff8a8a;
}

.bg-viewed {
    background: #ffbb70;
}

.bg-trackableViews {
    background: #ffd1e3;
}

.bg-trackableViewsRate {
    background: #fec7b4;
}

.bg-opensRate {
    background: #9cf3d1;
}

.bg-appleMppOpens {
    background: #ba9cf3;
}
.icon-size {
    width: 20px;
    /* Adjust the size to your preference */
    height: 20px;
    /* Keep the aspect ratio */
    vertical-align: middle;
    /* Align the icon properly with text */
    margin-right: 10px;
}

.bg-estimatedViews {
    background: #c3acd0;
}

/* Browser Color */
.bg-android {
    background: #a1d6b2;
}

.bg-chrome {
    background: #ffc96f;
}

.bg-edge {
    background: #caf4ff;
}

.bg-firefox {
    background: #ff8080;
}

.bg-internetExplorer {
    background: #c7b7a3;
}

.bg-opera {
    background: #ffc5c5;
}

.bg-safari {
    background: #d1e9f6;
}

.bg-electron {
    background: #b4e380;
}

.bg-mailChannelsScanner {
    background: #fdde55;
}

.bg-microsoft {
    background: #ffe4c9;
}

.bg-mozilla {
    background: #f875aa;
}

.bg-outlookExpress {
    background: #d2e0fb;
}

.bg-thunderbird {
    background: #dfccfb;
}

.bg-yahooMailProxy {
    background: #aec3ae;
}

.bg-unknown {
    background: #a4907c;
}

/* Device Color */
.bg-desktop {
    background: #00ffab;
}

.bg-mobile {
    background: #ccf3ee;
}

.bg-tablet {
    background: #ffb72b;
}

.cust-icon-input {
    position: relative;
}

.cust-icon-input input[type="text"] {
    padding-right: 14px;
}

.icon-set {
    position: absolute;
    top: calc(50% - 11px);
    right: 6px;
}

.toggle-drop-icon {
    font-size: 12px;
}

.emp-password {
    position: absolute;
    right: 9px;
    top: 13px;
    cursor: pointer;
}

.iti {
    width: 100% !important;
}

.iti__search-input {
    /* height: 35px !important; */
    outline: none;
    border: 1px solid #ddd;
    transition: border-color 0.3s;
    padding: 5px 10px !important;
}

.iti__search-input:focus {
    border: 2px solid #000;
}

.cust-input-lg {
    width: 24px;
    height: 24px;
    border: 2px solid var(--dark);
}

.new-tag-lable {
    position: relative;
}

.corne-status {
    border-radius: 0.5rem 0 0.5rem 0;
    padding: 0px 15px;
    position: absolute;
    top: -1px;
    left: -1px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: fit-content;
    font-size: 12px;
    min-width: 85px;
}

.status-yellow {
    background: #fab22b;
    color: #fff;
}

.status-green {
    background: #0c8842;
    color: #fff;
}

.status-blue {
    background: #3f83d9;
    color: #fff;
}

input[type="checkbox"].switch-control {
    position: absolute;
    visibility: hidden;
    opacity: 0;
}

input[type="checkbox"].switch-control + label {
    display: flex;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    width: fit-content;
}

input[type="checkbox"].switch-control + label .switch-label {
    position: relative;
    display: inline-block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background: #fff;
    border: 1px solid var(--bg-lightgreen);
    display: flex;
    align-items: center;
    padding: 5px 15px;
    color: var(--bg-lightgreen);
    transition: all 0.3s;
}

input[type="checkbox"].switch-control + label .switch-label-left {
    background: var(--green);
    border-color: var(--black);
    color: #fff;
    border-radius: 5px 0 0 5px;
}

input[type="checkbox"].switch-control:checked + label .switch-label-left {
    background: #fff;
    color: var(--bg-lightgreen);
    border-color: var(--bg-lightgreen);
}

input[type="checkbox"].switch-control + label .switch-label-right {
    background: #fff;
    color: var(--bg-lightgreen);
    border-color: var(--bg-lightgreen);
    border-radius: 0 5px 5px 0;
}

input[type="checkbox"].switch-control:checked + label .switch-label-right {
    border-color: var(--black);
    background: var(--green);
    color: #fff;
}

.scroll-search {
    max-height: 420px;
    overflow-y: auto;
    overflow-x: hidden;
}

.check-input-lg {
    width: 1.2em;
    height: 1.2em;
}

.search-nofound {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 40vh;
}

.nolast-last-border:not(:last-of-type) {
    border-bottom: 1px solid;
}

.copy-text {
    border: none;
    outline: none;
    padding: 0;
    background: transparent;
}

.universal-calendar .modal-title {
    color: #fff !important;
}

.ml-50 {
    margin-left: 50px;
}

@media (max-width: 991px) {
    /* Tablets and smaller */
    .ml-50 {
        margin-left: 0;
    }
}

@media (max-width: 767px) {
    /* Mobile devices */
    .ml-50 {
        margin-left: 0;
    }
}

/* Default: Show first link, hide second link */
.aside-menu-link.desktop {
    display: block;
}

.aside-menu-link.mobile {
    display: none;
}

/* For tablets and mobile (max-width: 991px) */
@media (max-width: 991px) {
    .aside-menu-link.desktop {
        display: none;
        /* Hide first link */
    }

    .aside-menu-link.mobile {
        display: block;
        /* Show second link */
    }
}

.chat-content-body {
    bottom: 0 !important;
}

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

.content-body .chat-group .media:last-child {
    margin-bottom: 4rem !important;
}

.custom-date input {
    display: inline-block !important;
}

@media (min-width: 1024px) and (max-width: 1550px) {
    .inquiry-discussions-list .wd-500 {
        width: 80% !important;
    }
}

/* For screens larger than 1550px */
@media (min-width: 1551px) {
    .inquiry-discussions-list .wd-500 {
        width: 50% !important;
    }
}

.invalid-feedback {
    text-align: left;
}

.px-16 {
    padding: 0 10px !important;
}

.UserEmployees .eventOccasion {
    white-space: break-spaces;
}

.new-calendar .fc-day-grid-event .fc-content,
.fc-icon,
.fc-row.fc-rigid,
.fc-time-grid-event {
    overflow: visible !important;
}

.fc-event .fc-content {
    position: relative;
    z-index: auto !important;
}

@media (min-width: 768px) {
    .w-md-25 {
        width: 25% !important;
    }
}

@media (min-width: 768px) {
    .w-md-75 {
        width: 75% !important;
    }
}

.new-calendar .eventSpaceName {
    white-space: break-spaces;
}

.new-calendar .tooltip {
    align-items: end;
    display: flex;
}

.plus-hover:hover {
    border: 1px solid black;
}

.cust-menu-sec {
    height: 80vh;
    overflow-y: auto;
    scrollbar-width: thin;
}

.cust-menu-sec .dropdown-menu .dropdown-item label {
    color: #676f75;
}

.cust-menu-sec .dropdown-menu .dropdown-item.select-all-item label {
    color: #212529;
}

/* cat css */

.menu-cat button {
    background: white !important;
    color: #000 !important;
    font-size: 26px !important;
    border: 1px solid rgb(179, 179, 179) !important;
}

.main-cat > div:nth-of-type(1) {
    font-size: 20px;
    height: 40px;
    display: flex;
    align-items: center;
    padding: 5px 10px !important;
    color: var(--dark);
    margin: 40px 0 10px;
    border-color: var(--bg-lightgreen) !important;
}

.main-cat > button:nth-of-type(1) {
    height: 40px !important;
    background: white !important;
    color: var(--dark) !important;
    font-size: 26px !important;
    border: 1px solid var(--bg-lightgreen) !important;
    border-right: none !important;
}

.main-cat > button:nth-of-type(2) {
    height: 40px !important;
    background: white !important;
    color: var(--dark) !important;
    font-size: 26px !important;
    border: 1px solid var(--bg-lightgreen) !important;
    border-right: none !important;
}

.main-cat > div:nth-of-type(2) {
    top: 10px !important;
}

.main-cat > span:nth-of-type(1) {
    top: 5px !important;
}

.main-cat > span:nth-of-type(2) {
    top: 5px !important;
}

.main-cat > span:nth-of-type(3) {
    top: 5px !important;
}

/* Hide by default */
/* .menu-cat .custom-control,
.menu-cat .button-edit,
.menu-cat .button-delete {
    display: none !important;
} */

/* Show only when parent is hovered */
/* .menu-cat:hover .custom-control,
.menu-cat:hover .button-edit,
.menu-cat:hover .button-delete {
    display: flex !important;
} */

.dd-item > button {
    font-size: 26px !important;
    background: white !important;
    color: #000 !important;
    border: 1px solid rgb(179, 179, 179) !important;
}

.fix-event-new-height {
    max-height: 450px;
    overflow-y: auto;
    scrollbar-width: thin;
}

#eventListModal .event-booked-wraper {
    margin-top: 20px;
    max-height: 450px;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    border: 1px solid #d4d9df;
    border-radius: 3px;
}

.main-cat .button-plus {
    position: absolute;
    right: 80px;
    top: 0;
    width: 20px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Step 1: Hide all buttons initially */
.sort-cat-btn {
    display: none !important;
}

.sortableCatList li .sort-cat-btn {
    opacity: 0;
}

.sortableCatList li:hover > .sort-cat-btn {
    display: inline-flex !important;
    opacity: 1;
}

.alert-dismissible .close {
    position: absolute;
    top: 2px;
    right: 2px !important;
}

#modalCreateEvent .alert-dismissible .close svg {
    width: 20px !important;
}

.calendar-modal .step-block {
    display: flex;
    align-items: flex-start;
    position: relative;
    padding-left: 50px;
}

.calendar-modal .step-icon {
    position: absolute;
    left: 0;
    top: 0;
    background-color: #16514e;
    color: #fff !important;
    width: 30px;
    height: 30px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
    border: none !important;
}

.calendar-modal .step-block::before {
    content: "";
    position: absolute;
    left: 16px;
    top: 30px;
    width: 2px;
    height: calc(100% - 10px);
    background-color: #16514e;
}

.calendar-modal .step-block:last-child::before {
    display: none;
}

.calendar-modal .step-content {
    margin-left: 20px;
}

.calendar-modal .step-content strong {
    display: block;
    margin-bottom: 5px;
}

.calendar-exports .event-row {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

.calendar-exports .event-name {
    width: 180px;
    font-size: 18px;
    font-weight: 600;
}

.calendar-exports .event-link {
    flex: 1;
    background: #f1f1f1;
    border: none;
    padding: 10px 12px;
    border-radius: 5px;
    margin-right: 10px;
    font-size: 13px;
    color: #666;
}

.calendar-exports .btn-icon {
    background: var(--bg-lightgreen);
    color: #fff;
    border: none;
    padding: 8px;
    border-radius: 5px;
    margin-right: 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

.calendar-exports .btn-icon:hover {
    background: var(--dark);
}

.calendar-exports .btn-icon {
    transition: background 0.3s ease;
}

.calendar-exports .btn-icon i {
    font-size: 24px;
}

.calendar-exports .btn-copy {
    background: var(--dark);
    color: #fff;
    padding: 8px 12px;
    border-radius: 5px;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    font-size: 14px;
}

.calendar-exports .btn-copy {
    transition: background 0.3s ease;
}

.calendar-exports .btn-copy:hover {
    background: var(--bg-lightgreen);
}

.calendar-exports .btn-copy svg {
    width: 20px;
}

.calendar-exports .btn-copy img {
    margin-right: 6px;
    width: 16px;
    height: 16px;
}

@media (max-width: 600px) {
    .calendar-exports .event-row {
        flex-direction: column;
        align-items: flex-start;
    }

    .calendar-exports .event-name {
        margin-bottom: 5px;
    }

    .calendar-exports .btn-copy {
        margin-top: 5px;
    }
}

@media (max-width: 1575px) {
    .integrations-img {
        width: 50%;
        max-width: 100%;
    }
}

.span-btn span {
    border: none !important;
    padding: 7px 13px;
    font-size: 13px;
    margin-right: 10px;
}

.event-space-list .capacity {
    font-size: 14px;
    font-style: italic;
}

.event-space
    .event-space-list
    .text-danger
    .form-check-input:disabled
    + .custom-control-label {
    opacity: 1;
    color: #dc3545 !important;
}

.event-space .event-space-list .border-red {
    border: 1px solid #dc3545 !important;
}

.d-rubby-100 {
    width: 100%;
    display: ruby;
}

#enable2faForm label.error {
    position: absolute;
    left: -90px;
    bottom: -20px;
    color: red;
    font-size: 0.85rem;
    display: block;
    width: 100%;
    text-align: center;
}

#eventForm label.error {
    position: absolute;
    bottom: -20px;
    color: red;
    font-size: 0.85rem;
    display: block;
}

.qr-svg svg {
    width: 120px;
}

@media (max-width: 991.98px) {
    .inquiries-btn .btn {
        margin-bottom: 1rem;
    }
}

.border-right {
    border-right: 1px solid rgb(216, 216, 216);
}

.profile-event-tag .tag-list .tag img {
    width: 15px;
    margin-right: 5px;
}

.profile-event-tag .tag-list .tag {
    height: 31px;
}

.white-img {
    filter: brightness(0) invert(1);
}

.profile-event-tag .tag-list .tag-gray img {
    filter: brightness(0) invert(1);
}

.profile-event-tag .tag-list .tag-green img {
    filter: brightness(0) invert(1);
}

.otherContactCard .user-action-wrapper {
    display: none;
}

.otherContactCard:hover .user-action-wrapper {
    display: inline-block;
}

.otherContactCard:hover {
    cursor: pointer;
}

.otherContactCard.selected > .card {
    background-color: rgba(58, 183, 149, 10%);
    border: 1px solid rgba(58, 183, 149, 10%);
}

.managerCard .user-action-wrapper {
    display: none;
}

.managerCard:hover .user-action-wrapper {
    display: inline-block;
}

.managerCard:hover {
    cursor: pointer;
}

.managerCard.selected > .card {
    background-color: rgba(58, 183, 149, 10%);
    border: 1px solid rgba(58, 183, 149, 10%);
}

input[name="primary_user"]:checked + label.card-label {
    display: none;
}

input[name="primary_manager"]:checked + label.card-label {
    display: none;
}

/* Hide Remove button when the radio is checked */
.card-radio:checked ~ #remove_other_contact {
    display: none;
}

/* Optional: You can fine-tune spacing, if needed */
.permission-main {
    margin-top: 10px;
    border-bottom: 1px solid rgb(194, 194, 194);
}

.permission-main p {
    margin-bottom: 0;
}

.main-head p {
    width: 20%;
}

.inner-body div {
    width: 20%;
}

.shimmer-html {
    font-size: 16px;
    font-weight: 600;
    color: var(--shimmer-text-opacity);
    background: -webkit-linear-gradient(
        -45deg,
        var(--shimmer-dark),
        var(--shimmer-light),
        var(--shimmer-dark)
    );
    background-size: 50px 100%;
    background-clip: text;
    animation: shimmer 4s cubic-bezier(0.77, 0, 0.175, 1) infinite;
    background-repeat: no-repeat;
    background-position: 0 0;
    background-color: var(--shimmer-bg);
    user-select: none;
}

@keyframes shimmer {
    0% {
        background-position: top left;
    }

    100% {
        background-position: top right;
    }
}

/* .permission-main {
  transition: all 0.3s ease;
  overflow: hidden;
}

.hide-permission-wrapper {
  padding: 0 !important;
  height: 0 !important;
  opacity: 0;
  pointer-events: none;
} */

@media (max-width: 767.98px) {
    .inner-body div {
        width: 100% !important;
        align-items: start !important;
    }
}

@media (max-width: 767.98px) {
    .mobile-inline {
        display: flex;
        align-items: center;
        /* justify-content: center; */
    }

    .mobile-toggle-group .toggle-item {
        display: flex;
        flex-direction: row;
        align-items: center;
        /* justify-content: center; */
        gap: 0.25rem;
    }

    .mobile-toggle-group .toggle-item label {
        margin-bottom: 0;
    }
}

.offcanvas-panso-terms .offcanvas-body {
    font-size: 16px;
    line-height: 1.5;
}

.offcanvas-panso-terms h6 {
    margin-top: 1.5rem;
    font-weight: 600;
    color: #333;
    font-size: 20px;
}

.offcanvas-trigger:focus {
    outline: none !important;
    box-shadow: none !important;
}

.aside.minimize.hovered {
    width: 240px;
    padding: 20px;
    transition: none;
}

.aside-footer-bottom {
    width: 100%;
    bottom: 30px;
    background: var(--dark);
    padding: 15px 15px 15px 20px;
    z-index: 999;
    border-top: 1px solid #666;
}

.permissionWrapper {
    transition: opacity 0.3s ease, height 0.3s ease;
    overflow: hidden;
}

.permissionWrapper.hidden {
    opacity: 0;
    height: 0;
    pointer-events: none;
}

.permissionWrapper.visible {
    opacity: 1;
    height: auto;
    pointer-events: auto;
}

.permissionWrapper .form-check-input:checked[type="checkbox"] {
    width: 20px;
    height: 20px;
}

.password-wrapper {
    position: relative;
}

.toggle-password-icon {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    transition: opacity 0.2s ease;
    z-index: 9999;
}

.password-wrapper:focus-within .toggle-password-icon {
    opacity: 0;
    pointer-events: none;
}

/* Already inside .new-login context */

.new-login {
    height: 100vh;
    background-color: var(--dark);
    display: flex;
    align-items: center;
    justify-content: center;
}

.new-login .login-container {
    background-color: #fff1e9;
    display: flex;
    width: 900px;
    border-radius: 4px;
    overflow: hidden;
    flex-direction: row;
    /* default for desktop */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

@media (max-width: 768px) {
    .new-login {
        height: auto !important;
        padding: 40px 0;
        overflow: scroll;
        position: relative;
        min-height: 100vh;
    }

    .new-login .container {
        flex-direction: column;
    }

    .new-login .left-panel {
        order: 2;
    }

    .new-login .right-panel {
        order: 1;
    }

    .new-login .footer {
        bottom: 0 !important;
    }
}

.new-login .footer {
    display: block;
}

@media (max-width: 767.98px) {
    .new-login .login-container {
        width: 100%;
        flex-direction: column;
    }

    /* .new-login{
         height: auto;
    } */

    .new-login .left-panel,
    .new-login .right-panel {
        width: 100%;
        padding: 20px;
    }

    .new-login .left-panel {
        border-bottom: 1px solid #ddd;
    }

    .new-login .left-panel img {
        max-width: 50% !important;
    }

    .border-bottom-sm {
        border-bottom: var(--bs-border-width) var(--bs-border-style)
            var(--bs-border-color) !important;
    }
}

.new-login .left-panel {
    background-color: #fff1e9;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 30px;
}

.new-login .left-panel img {
    max-width: 100%;
    width: 70%;
    margin-bottom: 20px;
}

.new-login .right-panel {
    flex: 1;
    background-color: #fff1e9;
    padding: 40px 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
}

.new-login .input-group-text {
    border: 1px solid #ccc;
    border-right: none;
}

.new-login .form-control {
    background-color: #fff !important;
    border: 1px solid #ccc;
    border-left: none;
}

.new-login .form-control:focus {
    box-shadow: none;
}

.new-login .btn-custom {
    background-color: var(--orange-light);
    color: #fff;
    border: none;
}

.new-login .btn-custom:hover {
    background-color: var(--orange-light);
}

.new-login .footer {
    font-size: 10px;
    text-align: center;
    margin-top: 30px;
    color: #fff;
    background: transparent;
    position: absolute;
    bottom: 60px;
}

@media (min-width: 1200px) {
    .new-login .footer {
        bottom: 0px !important;
    }
}

.new-login .footer a {
    color: #fff;
    text-decoration: underline;
}

.login-container .ff-lore {
    font-size: 24px;
}

.login-container .back-btn {
    position: absolute;
    top: 20px;
    left: 25px;
}

.new-login .password-input {
    padding-right: 40px;
}

.new-login .toggle-password-icon {
    position: absolute;
    right: 10px;
    top: 53%;
}

.main-box .step-item-2 .dot-line {
    width: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.main-box .step-item-2 .dot {
    width: 10px;
    height: 10px;
    background-color: var(--dark);
    border-radius: 50%;
    z-index: 1;
    margin-top: 5px;
}

.main-box .step-item-2 .line {
    flex-grow: 1;
    width: 2px;
    background-color: var(--dark);
    margin-top: 4px;
}

.dataTables_wrapper .dataTables_length .select2-container--default {
    width: 51px !important;
}

.right-panel #one_time_password-error {
    position: absolute;
    left: 0 !important;
    width: auto !important;
}

.tooltip-custom-dark {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.tooltip-custom-dark .tooltip-content-dark {
    visibility: hidden;
    width: max-content;
    max-width: 250px;
    background-color: #000;
    color: #fff;
    text-align: left;
    border-radius: 4px;
    padding: 6px 10px;
    position: absolute;
    z-index: 10;
    bottom: 125%;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    white-space: normal;
}

.tooltip-custom-dark:hover .tooltip-content-dark {
    visibility: visible;
    opacity: 1;
}

.tooltip-custom-dark .tooltip-content-dark::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #000 transparent transparent transparent;
}

.customer-bio .tag img {
    width: 15px;
    margin-right: 5px;
}

.customer-bio .tag {
    color: #000;
    border-radius: 5px;
    background: #e3e3e3;
    padding: 4px 8px;
    margin: 5px 5px 5px 0;
    height: 31px;
}

.customer-bio .tag-green img {
    filter: brightness(0) invert(1);
}

.cust-delete-size svg {
    width: 18px;
    height: 18px;
}

.select-avatar {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    margin-right: 6px;
}

/* Fix caret position */
.bs-multicheck .bootstrap-select .dropdown-toggle::after {
    content: "\f078";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);
    border: none !important;
}

/* Optional: Remove default arrow */
.bs-multicheck .bootstrap-select .dropdown-toggle::after {
    border: none !important;
}

.bs-multicheck .btn.dropdown-toggle {
    background: white !important;
    outline: none !important;
    height: 42px;
}

.bs-multicheck .filter-option-inner-inner {
    color: #000;
}

.dropzone:hover {
    animation: stripes 2s linear infinite;
    background-image: linear-gradient(
        -45deg,
        #f6f6f6 25%,
        transparent 0,
        transparent 50%,
        #f6f6f6 0,
        #f6f6f6 75%,
        transparent 0,
        transparent
    );
    background-size: 30px 30px;
}

@keyframes stripes {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 30px 0;
    }
}

.opacity-1 {
    opacity: 1 !important;
}

.no-hover:hover {
    background-color: inherit !important;
    color: inherit !important;
    text-decoration: none !important;
    box-shadow: none !important;
    border-color: inherit !important;
}

.m-w-750 {
    min-width: 50%;
}

@media (max-width: 991.98px) {
    .m-w-750 {
        min-width: 100% !important;
        width: 100% !important;
    }
}

.w-70 {
    width: 70%;
}

@media (max-width: 767px) {
    .w-70 {
        width: 100%;
    }
}

.w-edit-svg {
    width: 18px !important;
}

#dashboard .guest-dashboard-tab h3 {
    font-size: 18px !important;
}

.circle {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 50%;
}

.bg-light-yellow {
    background: #ffc107;
}

.tx-light-yellow {
    color: #ffc107;
}

.dropdown-menu .inner.show {
    max-height: 450px !important;
    overflow: auto;
    padding-bottom: 30px;
}

.segmentDataTable th {
    color: var(--dark) !important;
    font-weight: bold !important;
    background-color: #f5f5f5;
}

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

.pagination .page-link {
    color: var(--dark) !important;
}

.pagination .page-link:focus {
    box-shadow: none !important;
}

.segment-responsive {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.segment-responsive table {
    width: max-content;
    min-width: 100%;
    border-collapse: collapse;
}

.segment-responsive th,
.segment-responsive td {
    white-space: nowrap;
    padding: 0.75rem;
    text-align: left;
    border: 1px solid #dee2e6;
}

.hover-saffron:hover {
    color: var(--orange) !important;
}

.segment-tab .nav-tabs .nav-link {
    background-color: transparent;
    z-index: 5;
    border: none;
    color: #000;
    font-size: 16px;
}

.segment-tab .nav-tabs .nav-link.active {
    background-color: transparent;
    z-index: 5;
    color: var(--dark) !important;
    border: none;
    border-bottom: 2px solid var(--dark);
    font-weight: bold;
}

.bg-dark-orange {
    background: var(--dark-orange);
}

.border-dark-orange {
    border: 1px solid var(--dark-orange);
}

.text-dark-orange {
    color: var(--dark-orange);
}

.overflow-x-hidden {
    overflow-x: hidden;
}

.panso-btn-outline-success:hover {
    color: var(--bs-btn-hover-color) !important;
    background-color: var(--bs-btn-hover-bg) !important;
    border-color: var(--bs-btn-hover-border-color) !important;
}

.min-h-45 {
    min-height: 45px !important;
}

/* new bg color class */
.bg-1 {
    background: #daf7e2;
}

.bg-2 {
    background: #eaf5d0;
}

.bg-3 {
    background: #f6f7d6;
}

.bg-4 {
    background: #ebe5dc;
}

.bg-5 {
    background: #e9eef5;
}

.bg-6 {
    background: #e6eefd;
}

.bg-7 {
    background: #fefbe7;
}

.bg-8 {
    background: #e6ecdf;
}

.bg-9 {
    background: #f5d5d5;
}

.bg-10 {
    background: #fcdebe;
}

.bg-11 {
    background: #fae3ed;
}

.bg-12 {
    background: #f7e8e3;
}

.custom-radio-card {
    position: relative;
}

.custom-radio-input {
    display: none;
}

.custom-radio-label {
    cursor: pointer;
    transition: background-color 0.3s ease, border-color 0.3s ease;
    border: 2px solid #dee2e6;
    border-radius: 6px;
}

.custom-radio-input:checked + .custom-radio-label {
    background-color: #d5f3eb;
    border-color: #28a772;
}

.bg-color-03 {
    background: #efefef;
}

.week-scroll-container {
    width: 100%;
    overflow-x: auto;
    padding: 10px 0;
    scrollbar-width: thin;
}

.week-scroll {
    width: max-content;
    gap: 10px;
}

.week-scroll .day-card {
    width: 80px;
    min-width: 80px;
    background: white;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 10px 5px;
    text-align: center;
    flex-shrink: 0;
}

.week-scroll .day {
    font-weight: bold;
    font-size: 14px;
    color: #000;
}

.week-scroll .value {
    font-size: 14px;
    margin-top: 4px;
    font-weight: 600;
}

.week-scroll .value.red {
    color: var(--pink);
}

.week-scroll .value.green {
    color: var(--bg-lightgreen);
}

.tx-dark-orange {
    color: var(--dark-orange);
}

.b-dark-orange {
    border: 2px solid var(--dark-orange) !important;
}

/* profile-container */
.profile-tabs {
    border: none;
    overflow-x: auto;
    width: 100%;
    display: flex;
    flex-wrap: nowrap !important;
    scrollbar-width: thin;
}

.profile-tabs .nav-link.active {
    background-color: var(--orange);
    z-index: 5;
    color: white !important;
}

.profile-tabs .nav-link {
    background-color: white;
    z-index: 5;
    color: gray;
    border-radius: 20px !important;
    width: max-content !important;
}

.profile-tabs .nav-item {
    margin-bottom: 5px !important;
}

.bg-light-blue-2 {
    background: #c9e8ff;
}

.bg-light-pink-2 {
    background: #ffe0e8;
}

.text-light-blue-2 {
    color: #c9e8ff;
}

.bg-light-seffron {
    background: #ffd18c;
}

.text-light-seffron {
    color: #ffd18c;
}

.pink-btn {
    background: white;
    padding: 10px;
    color: var(--pink);
    font-weight: bold;
    text-align: center;
    width: 100%;
    border-radius: 5px;
    display: inline-block;
}

.tx-pink {
    color: var(--pink);
}

.bd-pink {
    border-color: #f10075 !important;
}

.bg-pink {
    color: #f10075;
}

.text-pink {
    color: #f10075;
}

.slide-btn {
    border-radius: 100%;
    padding: 2px;
}

.profile-info .badge {
    font-size: 14px !important;
}

.profile-info .badge img {
    width: 18px;
    margin-right: 5px;
}

.bg-light-orange {
    background: #ffd3c9;
}

.profile-info .badge {
    color: #000;
    border-radius: 5px;
    background: #e3e3e3;
    padding: 4px 8px;
}

.right-panel .tab-content .btn {
    width: max-content;
}

.right-panel .card .d-flex .text-truncate {
    max-width: 90% !important;
}

.step-indicator {
    margin-top: 30px;
    display: flex;
    align-items: center;
    padding: 0 40px;
}

.step {
    display: flex;
    align-items: center;
    flex-direction: column;
    position: relative;
    z-index: 1;
}

.step-indicator .step-icon {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    background: white;
    color: #000;
    font-size: 10px;
    text-align: center;
    color: #000;
    position: relative;
    line-height: 50px;
    font-size: 20px;
}

.step.active .step-icon {
    background: var(--pink);
    border: none;
    color: white;
}

.step p {
    text-align: center;
    position: absolute;
    bottom: -40px;
    color: #000;
    font-size: 14px;
    font-weight: bold;
    width: max-content;
}

.step.active p {
    color: var(--pink);
}

.step.step2 p,
.step.step3 p {
    left: 50%;
    transform: translateX(-50%);
}

.indicator-line {
    width: 100%;
    height: 2px;
    background: #c2c2c2;
    flex: 1;
}

.indicator-line.active {
    background: var(--pink);
}

@media screen and (max-width: 500px) {
    .step p {
        font-size: 11px;
        bottom: -20px;
    }
}

.ticket-container {
    display: flex;
    align-items: center;
    margin-right: 20px;
    cursor: pointer;
}

.ticket-checkbox {
    display: none;
    /* Hide the default checkbox */
}

.ticket-text {
    padding: 10px;
    border-radius: 5px;
    color: var(--orange);
    transition: background-color 0.3s;
    border: 1px solid var(--orange);
}

/* Change background color when checkbox is checked */
.ticket-checkbox:checked + .ticket-text {
    background-color: var(--orange);
    color: var(--white);
}

.reservations_html .ticket-text {
    padding: 5px 10px !important;
}
.ProfileList
    .container-fluid
    > .row.align-items-center.border-bottom:last-child {
    border-bottom: 0 !important;
}

.progress-modal {
    height: 15px !important;
    border-radius: 10px !important;
}

.fixed-h {
    height: 80vh;
    overflow: auto !important;
    scrollbar-width: thin;
}
.icon-hover-1 {
    border: 1px solid var(--bg-lightgreen);
    border-radius: 4px;
    padding: 4px;
    transition: all 0.2s;
    cursor: pointer;
}
.icon-hover-2 {
    border: 1px solid red; 
    border-radius: 4px;
    padding: 4px;
    transition: all 0.2s;
    cursor: pointer;
}

.icon-hover-1:hover {
    background-color: var(--bg-lightgreen); 
}
.icon-hover-2:hover {
    background-color: red;
}


.icon-hover-1:hover svg {
    color: #fff !important;
}
.icon-hover-2:hover svg {
    color: #fff !important; 
}

.w-49 {
    width: 49%;
}
.w-48 {
    width: 48%;
}

.mx-w-70 {
    max-width: 70%;
}

@media (max-width: 1200px) {
    .mx-w-70 {
        max-width: 100%;
    }
}

.toggle-arrow i {
    transition: transform 0.3s ease;
}

.toggle-arrow.collapsed i {
    transform: rotate(0deg);
}

.toggle-arrow:not(.collapsed) i {
    transform: rotate(180deg); 
}
.h-min-c {
    height: min-content;
}
.m-content {
    width: max-content;
}

.limit-meesage{
        background-color: #ffe0e0; 
      color: #b00000; 
      padding: 6px 12px; 
      border-radius: 5px; 
      font-size: 14px;
      box-shadow: 0 1px 3px rgba(0,0,0,0.1);
      border-left: 3px solid #b00000;
}