.bredCram {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 4px;
    background-color: #fff;
    padding: 4px 8px;
}

    .bredCram .breadcrumb {
        margin: 0px;
    }

.offCanVasCustom {
    height: auto !important;
}

.text-left {
    text-align: left !important;
}

.white-spaceno {
    white-space: nowrap;
}

.btnEnd {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
}

.mandatory::after {
    content: " *";
    color: #e32;
    position: absolute;
    margin: 0px 0px 0px 6px;
    font-size: large;
    padding: 0 5px 0 0;
}

.form-label,
.col-form-label {
    text-transform: capitalize !important;
}

.btn-outline-success {
    color: #6A961F;
    border-color: #6A961F;
}

    .btn-outline-success:hover {
        color: #107562 !important;
        border-color: #107562 !important;
    }

.bg-label-primary2 {
    background-color: #e7f3f1 !important;
    color: #6A961F !important;
}
/* confirmatiom msg */
.confirmationMessage {
    display: none;
    background-color: #4caf50;
    color: white;
    text-align: center;
    padding: 15px;
    position: fixed;
    top: 10px;
    z-index: 999999999;
    right: 10px;
    /* transform: translateX(-50%); */
    border-radius: 5px;
}

.d-block {
    display: block;
}

.bg-menu-theme.menu-vertical .menu-item.active > .menu-link:not(.menu-toggle) {
    background: linear-gradient( 72.47deg, #6A961F 22.16%, #6A961F 76.47% ) !important;
    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.48) !important;
}

.form-controlCmHight {
    height: 119px;
}

.nav-pills .nav-link.active svg path {
    fill: #fff;
}

.nav-link.active:hover svg path {
    fill: #fff;
}

.nav-link.active:focus svg path {
    fill: #fff;
}

.nav-pills .nav-link.active:hover svg path {
    fill: #fff;
}

.nav-pills .nav-link:not(.active):hover svg path {
    fill: #6A961F;
}

.tableTitle {
    font-size: 16px;
    font-weight: 500;
    line-height: 22px;
    color: #2d2d2d;
    margin: 12px 0 17px;
}

.app-brand {
    padding: 22px 0 21px;
}

    .app-brand .app-brand-link svg {
        max-width: 185px;
    }

.titleH4 {
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: #2d2d2d;
    margin: 0px 0 10px;
}

.titleH42 {
    font-size: 24px;
    font-weight: 600;
    line-height: 24px;
    color: #2D2D2D;
    margin: 0px 0 10px;
}

.dropzone .dz-message {
    font-size: 16px !important;
    span

{
    font-size: 12px !important;
}

}

body::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    margin-left: 5px;
    left: 5px;
}

body::-webkit-scrollbar-track {
    background: #f1f1f1;
}

body::-webkit-scrollbar-thumb {
    background: #c1c1c1;
}

.table-responsive::-webkit-scrollbar {
    height: 8px;
    width: 8px;
    margin-top: 5px;
    top: 5px;
}

.table-responsive::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.table-responsive::-webkit-scrollbar-thumb {
    background: #c1c1c1;
    cursor: pointer;
}

.nav-pillsCustom .nav-pills {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    margin-bottom: 17px !important;
}

    .nav-pillsCustom .nav-pills::-webkit-scrollbar {
        height: 8px;
        margin-top: 5px;
        top: 5px;
    }

    .nav-pillsCustom .nav-pills::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .nav-pillsCustom .nav-pills::-webkit-scrollbar-thumb {
        background: #c1c1c1;
    }

    .nav-pillsCustom .nav-pills .nav-item {
        white-space: nowrap;
        text-align: left;
        display: contents;
        margin-bottom: 4px;
    }

        .nav-pillsCustom .nav-pills .nav-item.navItemSec {
            white-space: nowrap;
            text-align: left;
            /* display: contents; */
            margin-bottom: 4px;
            display: block;
        }

        .nav-pillsCustom .nav-pills .nav-item button {
            width: auto;
        }

.nav-pillsCustom .nav-tabs {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
}

    .nav-pillsCustom .nav-tabs::-webkit-scrollbar {
        height: 8px;
        margin-top: 5px;
        top: 5px;
        width: 0;
    }

    .nav-pillsCustom .nav-tabs::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .nav-pillsCustom .nav-tabs::-webkit-scrollbar-thumb {
        background: #c1c1c1;
    }

    .nav-pillsCustom .nav-tabs .nav-item {
        white-space: nowrap;
        text-align: left;
        display: contents;
    }

        .nav-pillsCustom .nav-tabs .nav-item button {
            width: auto;
        }

.spcTablBtm table tbody tr:last-child td {
    border-bottom: none;
}

.bs-stepper-headerSpc {
    min-width: 850px;
}

.bs-stepper-headerSpcTop::-webkit-scrollbar {
    height: 8px;
    margin-top: 5px;
    top: 5px;
}

.bs-stepper-headerSpcTop::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.bs-stepper-headerSpcTop::-webkit-scrollbar-thumb {
    background: #c1c1c1;
}

.tableTdDis {
    background-color: #e7e7e7;
    pointer-events: none;
}

.spclCheckBox .form-check-label {
    display: grid;
    grid-template-columns: 18px 1fr 38px;
    grid-gap: 6px;
}

    .spclCheckBox .form-check-label .custom-option-body {
        display: flex;
        flex-direction: column;
        margin-bottom: 0;
        align-items: baseline;
    }
    /* .spclCheckBox .form-check-label .custom-option-body small{
    margin-left: 15px;
} */
    .spclCheckBox .form-check-label .icon {
        width: 38px;
        height: 38px;
        border-radius: 2px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #707070;
    }

.spclCheckBox.checked .form-check-label .icon {
    border: 1px solid #6A961F;
}

.accoBorderBtm .table tbody tr:last-child td {
    border-bottom: none;
}

.exp {
    background-color: #f9f3f3;
}

    .exp .expDt {
        color: #e58383;
    }

    .exp .tableSticky {
        background-color: #f9f3f3 !important;
    }

.borderDiv {
    border: 1px solid #dbdade;
    border-radius: 5px;
    padding: 30px 11px;
}

    .borderDiv .titleHeadTop {
        margin-top: -42px;
    }

    .borderDiv .titleHead {
        background-color: #fff;
        display: inline;
        padding: 5px 10px 5px 16px;
        margin-left: -13px;
    }

    .borderDiv .titleHeadTop .form-check {
        background-color: #fff;
        padding: 5px 10px 5px 40px;
        margin-right: -13px;
        display: inline;
    }

.akkePayTableBdr {
    border: 1px solid #dddddd;
    border-radius: 6px;
    padding: 12px;
}

.akkePayTblClr tr td {
    font-size: 16px;
    font-size: 500 !important;
    color: #434343;
}

.akkePayTblClr tr th {
    font-size: 14px;
    font-size: 400 !important;
    color: #434343;
}

.section2 .no-select {
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.section2 .no-wrap {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.section2 #dragRoot {
    cursor: default;
    /* border: 1px solid black; */
    margin: 10px;
    padding: 10px;
    width: 600px;
    /* overflow-y: scroll; */
    white-space: nowrap;
}

    .section2 #dragRoot ul {
        display: block;
        margin: 0;
        padding: 0 var(--IndentSize);
    }

    .section2 #dragRoot li {
        display: block;
        margin: 10px;
        padding: 6px 2px 6px 0;
    }

    .section2 #dragRoot [class*="node"] {
        display: inline-block;
    }

    .section2 #dragRoot .node-facility {
        color: var(--Color_Facility);
        font-weight: bold;
    }

    .section2 #dragRoot .node-cpe {
        color: var(--Color_Equipment);
        cursor: pointer;
        font-size: 16px;
        font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
        font-weight: 400;
        min-width: 100px;
        width: fit-content;
        text-align: center;
        border: 1px solid #ffffff;
        box-shadow: 0 0 10px rgba(184, 183, 183, 0.5);
        border-radius: 5px;
        background-color: rgb(246, 246, 249);
        padding: 8px 5px;
        margin-right: 10px;
    }

    .section2 #dragRoot li li {
        border-left: 1px solid #c0c0c0;
    }

        .section2 #dragRoot li li:before {
            color: #c0c0c0;
            font-weight: 300;
            content: "— ";
        }

    .section2 #dragRoot [class*="node"].hover {
        background-color: var(--Color_DropBackground);
        color: var(--Color_DropForeground);
    }

.section2 .addmember {
    background-color: #6A961F;
}

.add-node-btn,
.delete-node-btn,
.edit-node-btn {
    border: none;
    border-radius: 3px;
    color: #fff;
    cursor: pointer;
    /* padding: 0px 6px; */
    margin-right: 6px;
}

.section2 .image-add {
    width: 40px;
    height: 40px;
    border-radius: 5px;
}

.section2 .image-add-child {
    width: 15px;
    height: 15px;
    border-radius: 3px;
    margin: 0 6px;
}

.section2 .image-add-main {
    width: 20px;
    height: 20px;
}

.textValue {
    font-size: 16px;
    font-weight: 400;
    text-align: right;
}

.invTable tr th {
    font-size: 12px;
    font-weight: 600;
    padding-top: 11px;
    padding-bottom: 11px;
    color: #434343;
}

    .invTable tr th.spcwth {
        padding-left: 34px;
    }

    .invTable tr th.spcwthRgt {
        padding-right: 34px;
    }

.invTable tr td {
    font-size: 12px;
    font-weight: 500;
    color: #434343;
}

    .invTable tr td.spcwth {
        padding-left: 34px;
    }

    .invTable tr td.spcwthRgt {
        padding-right: 34px;
    }

.form-control::-webkit-outer-spin-button,
.form-control::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.invTable tr td .input-group {
    box-shadow: none;
}

.invTable tr td .form-control {
    font-size: 12px;
    font-weight: 500;
    color: #434343;
}

    .invTable tr td .form-control:hover {
        border-color: #6A961F !important;
    }

.imageListDiv {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-gap: 12px;
}

    .imageListDiv .imageList {
        border: 1px solid #dddddd;
        border-radius: 8px;
        overflow: hidden;
        padding-top: 100%;
        margin-bottom: 0;
        position: relative;
        display: flex;
    }

        .imageListDiv .imageList img {
            position: absolute;
            margin: auto;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            max-width: 100%;
            max-height: 100%;
            vertical-align: top;
            transition: opacity 1s, transform 1s;
            backface-visibility: hidden;
        }

.inputdtMob .dob-picker {
    border-left: var(--bs-border-width) solid #dddddd !important;
    padding-left: 10px !important;
    border-top-left-radius: 5px !important;
    border-bottom-left-radius: 5px !important;
}

.fxdSec {
    background-color: #f9f9f9;
    border: 1px solid #f5f5f5;
    pointer-events: none;
    border-radius: 4px;
}

    .fxdSec label {
        color: #434343;
    }

    .fxdSec .form-control {
        background-color: #f9f9f9;
        border-color: #f9f9f9;
        padding-left: 16px;
        color: #2d2d2d;
    }

    .fxdSec .form-label {
        padding-left: 16px;
        margin-bottom: 0;
        padding-top: 7px;
    }

.invoiceSect p {
    font-size: 16px;
    font-weight: 500;
    color: #2d2d2d;
    text-align: right;
}

    .invoiceSect p span {
        font-size: 18px;
        display: block;
    }

.light-style .imgdropdwn .tagify__tag > div::before {
    box-shadow: 0 0 0 1.1em rgb(255 255 255 / 0%) inset !important;
}

.imgdropdwn .tagify__tag__removeBtn {
    display: none;
}

.imgdropdwn {
    position: relative;
}

    .imgdropdwn i {
        position: absolute;
        right: 11px !important;
        top: 36px;
    }

    .imgdropdwn.imgdropdwnSec i {
        right: 4px !important;
        top: 33px;
    }

.tagify__tag > div {
    padding: 0 0 0 5px !important;
}

.imgdropdwn .tagify.form-control {
    padding-right: 40px;
    height: 38px;
    overflow: hidden;
}

.imgdropdwn.imgdropdwnLgHgt .tagify.form-control {
    height: 62px;
}

.imgdropdwn.imgdropdwnLgHgt i {
    position: absolute;
    right: 0;
    top: 45px;
}

.imgdropdwn.imgdropdwnLgHgt2 .tagify__tag__removeBtn {
    display: flex;
}

.imgdropdwn.imgdropdwnLgHgt2 .tagify.form-control {
    height: 63px;
}

.imgdropdwn.imgdropdwnLgHgt2 i {
    position: absolute;
    right: 0;
    top: 49px;
}

.imgdropdwn.imgdropdwnLgHgt2 .tagify__tag__removeBtn {
    display: flex;
}

.adrsedtr .title {
    font-size: 14px;
    font-weight: 600;
    color: #2d2d2d;
    padding: 0 0 6px 0;
}

.adrsedtr .adrsedtrSec {
    padding: 6px 12px;
    border: 1px solid #c5c5c5;
    /* border-color: transparent; */
    border-radius: 6px;
    position: relative;
}

    .adrsedtr .adrsedtrSec .edit {
        cursor: pointer;
        position: absolute;
        right: 5px;
        top: 5px;
        display: none;
    }

    .adrsedtr .adrsedtrSec:hover {
        border: 1px solid #c5c5c5;
        border-radius: 6px;
    }

        .adrsedtr .adrsedtrSec:hover .edit {
            display: flex;
        }

    .adrsedtr .adrsedtrSec p {
        font-size: 12px;
        font-weight: 500;
        color: #707070;
        margin: 0;
    }

    .adrsedtr .adrsedtrSec ul {
        margin: 11px 0 0;
        padding: 0;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
    }

        .adrsedtr .adrsedtrSec ul li {
            font-size: 12px;
            font-weight: 500;
            color: #2d2d2d;
            display: flex;
            align-items: center;
            margin-right: 64px;
        }

            .adrsedtr .adrsedtrSec ul li:last-child {
                margin-right: 0px;
            }

            .adrsedtr .adrsedtrSec ul li span {
                margin-right: 6px;
            }

.light-style .smlUpld .dz-message:before {
    display: none;
}

.smlUpld .dz-message {
    font-size: 12px;
    font-weight: 500;
    color: #2d2d2d;
    margin: 7px 16px;
}

.smlUpld .dropzone {
    padding: 0;
    width: 119px;
}

.f-group .f-dropdown {
    --max-scroll: 3;
    position: relative;
    z-index: 10;
}

    .f-group .f-dropdown select {
        display: none;
    }

    .f-group .f-dropdown > span {
        cursor: pointer;
        border-radius: 6px;
        display: flex;
        align-items: center;
        position: relative;
        color: #bbb;
        background: #fff;
        transition: color 0.2s ease, border-color 0.2s ease;
    }

        .f-group .f-dropdown > span > span {
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
            padding-right: 12px;
        }

.f-dropdown > span img {
    width: 24px;
    margin-right: 10px;
}

.f-group .f-dropdown > span:before,
.f-group .f-dropdown > span:after {
    content: "";
    display: block;
    position: absolute;
    width: 8px;
    height: 2px;
    border-radius: 1px;
    top: 50%;
    right: 12px;
    background: #afafaf;
    transition: all 0.3s ease;
}

.f-group .f-dropdown > span:before {
    margin-right: 4px;
    transform: scale(0.96, 0.8) rotate(50deg);
}

.f-group .f-dropdown > span:after {
    transform: scale(0.96, 0.8) rotate(-50deg);
}

.f-group .f-dropdown ul {
    margin: 0;
    padding: 0;
    list-style: none;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    max-height: calc(var(--max-scroll) * 46px);
    top: 18px;
    left: 0;
    z-index: 1;
    right: 0;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 6px;
    overflow-x: hidden;
    overflow-y: auto;
    transform-origin: 0 0;
    transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.3s cubic-bezier(0.4, 0.6, 0.5, 1.32);
    transform: translate(0, 5px);
    display: none;
}

    .f-group .f-dropdown ul li {
        padding: 0;
        margin: 0;
    }

        .f-group .f-dropdown ul li a {
            cursor: pointer;
            display: block;
            padding: 8px 12px;
            color: #8f8b99;
            text-decoration: none;
            outline: none;
            position: relative;
            transition: all 0.2s ease;
            display: flex;
            align-items: center;
        }

            .f-group .f-dropdown ul li a img {
                width: 30px;
                margin-right: 10px;
            }

            .f-group .f-dropdown ul li a:hover {
                color: #5c6bc0;
            }

        .f-group .f-dropdown ul li.active a {
            color: #8f8b99;
            background: #ececec;
        }

            .f-group .f-dropdown ul li.active a:before,
            .f-dropdown ul li.active a:after {
                --scale: 0.6;
                content: "";
                display: block;
                width: 10px;
                height: 2px;
                position: absolute;
                right: 12px;
                top: 50%;
                opacity: 0;
                background: #fff;
                transition: all 0.2s ease;
            }

            .f-group .f-dropdown ul li.active a:before {
                transform: rotate(45deg) scale(var(--scale));
            }

            .f-group .f-dropdown ul li.active a:after {
                transform: rotate(-45deg) scale(var(--scale));
            }

            .f-group .f-dropdown ul li.active a:hover:before,
            .f-dropdown ul li.active a:hover:after {
                --scale: 0.9;
                opacity: 1;
            }

        .f-group .f-dropdown ul li:first-child a {
            border-radius: 6px 6px 0 0;
        }

        .f-group .f-dropdown ul li:last-child a {
            border-radius: 0 0 6px 6px;
        }

.f-group .f-dropdown.disabled {
    opacity: 0.7;
}

    .f-group .f-dropdown.disabled > span {
        cursor: not-allowed;
    }

.f-group .f-dropdown.filled > span {
    color: #6f6b7d;
}

.f-group .f-dropdown.open {
    z-index: 15;
}

    .f-group .f-dropdown.open > span {
        border-color: #aaa;
    }

        .f-group .f-dropdown.open > span:before,
        .f-dropdown.open > span:after {
            background: #000;
        }

        .f-group .f-dropdown.open > span:before {
            transform: scale(0.96, 0.8) rotate(-50deg);
        }

        .f-group .f-dropdown.open > span:after {
            transform: scale(0.96, 0.8) rotate(50deg);
        }

    .f-group .f-dropdown.open ul {
        opacity: 1;
        visibility: visible;
        transform: translate(0, 12px);
        transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s cubic-bezier(0.4, 0.6, 0.5, 1.32);
        display: block;
    }
/* --------------------------- */
.f-group {
    max-width: 250px;
    margin: 0 auto;
    text-align: left;
}

    .f-group select {
        width: 100%;
    }

    .f-group .f-control {
        font-size: 14px;
        line-height: normal;
        color: #000;
        display: inline-block;
        background-color: #fff;
        border: #ccc 1px solid;
        border-radius: 6px;
        padding: 8px 12px;
        outline: none;
        max-width: 250px;
    }

.boxfntsize .col-form-label {
    font-size: 14px;
    padding-top: 7px;
    padding-bottom: 7px;
}

.boxfntsize .col-form-labelMd {
    font-size: 14px;
}

.boxfntsize .col-form-labelLg {
    font-size: 16px;
}

.boxfntsize .textValue {
    font-size: 14px;
    text-align: right;
}

.boxfntsize .textValueMd {
    font-size: 14px;
    text-align: right;
}

.boxfntsize .textValueLg {
    font-size: 16px;
    text-align: right;
}

.boxfntsize .form-control {
    font-size: 12px;
}

.cstmToolTipHead .cstmToolTip .toolSec {
    top: auto;
    bottom: -42px;
}

.cstmToolTip {
    position: relative;
}

    .cstmToolTip:hover .toolSec {
        opacity: 1;
        pointer-events: all;
    }

    .cstmToolTip .toolSec {
        font-size: 12px;
        font-weight: 500;
        padding: 7px 16px;
        height: 37px;
        border-radius: 6px;
        position: absolute;
        right: 0;
        top: -42px;
        color: #fafafa;
        background-color: #707070;
        display: flex;
        align-items: center;
        justify-content: center;
        width: fit-content;
        z-index: 1;
        opacity: 0;
        pointer-events: none;
    }

.btmStkyTp {
    position: sticky;
    bottom: 0;
    z-index: 10;
}

.btmStky {
    background-color: #ffffff;
    padding: 13px;
    margin-left: -23px;
    margin-right: -24px;
    margin-bottom: -7px;
    -webkit-box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.07);
    -moz-box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.07);
    box-shadow: 0px 0px 10px 3px rgba(0, 0, 0, 0.07);
}

.rightSecDrop {
    display: flex;
    align-items: center;
    width: fit-content;
    justify-content: center;
    white-space: nowrap;
    background-color: #fff;
    height: 40px;
    border-radius: 4px;
    padding: 7px 9px;
    font-size: 12px;
    font-weight: 600;
    color: #434343;
    border: 1px solid #dddddd;
    position: relative;
}

    .rightSecDrop img {
        margin-right: 7px;
    }

    .rightSecDrop .dropdown .dropdown-toggle {
        padding: 0 22px 0 0;
        border: none !important;
        margin-left: 6px;
        font-size: 12px;
        font-weight: 700;
        color: #434343;
    }

    .rightSecDrop .bootstrap-select .dropdown-toggle:after {
        right: 13px;
        top: 37%;
    }

    .rightSecDrop .dropValue {
        font-weight: 700;
        margin-left: 6px;
        cursor: pointer;
    }

        .rightSecDrop .dropValue .dropValueArrow {
            padding: 0 5px;
        }

    .rightSecDrop .dropValueListSec {
        min-width: 205px;
        border: 1px solid #dddddd;
        border-radius: 4px;
        padding: 16px 10px;
        background-color: #ffffff;
        position: absolute;
        right: 0;
        top: 42px;
        display: none;
        transition: ease-in-out 0.4s;
        max-height: 195px;
        overflow-y: auto;
        overflow-x: hidden;
    }

        .rightSecDrop .dropValueListSec::-webkit-scrollbar {
            width: 4px;
            margin-top: 5px;
            top: 5px;
        }

        .rightSecDrop .dropValueListSec::-webkit-scrollbar-track {
            background: #f1f1f1;
        }

        .rightSecDrop .dropValueListSec::-webkit-scrollbar-thumb {
            background: #c1c1c1;
        }

        .rightSecDrop .dropValueListSec.open {
            display: block;
        }

        .rightSecDrop .dropValueListSec .dropValueList {
            margin-bottom: 11px;
            font-size: 14px;
            font-weight: 500;
            color: #434343;
        }

            .rightSecDrop
            .dropValueListSec
            .dropValueList.active
            .form-check-inline
            .form-check-label {
                color: #107562;
            }

            .rightSecDrop .dropValueListSec .dropValueList:last-child {
                margin-bottom: 0px;
            }

            .rightSecDrop .dropValueListSec .dropValueList .form-check-inline {
                padding: 0;
                width: 100%;
            }

                .rightSecDrop
                .dropValueListSec
                .dropValueList
                .form-check-inline
                .form-check-label {
                    font-size: 14px;
                    font-weight: 500;
                    color: #434343;
                }

                .rightSecDrop
                .dropValueListSec
                .dropValueList
                .form-check-inline
                .form-check-input {
                    float: right;
                    margin-left: auto;
                    margin-right: 0;
                    width: 20px;
                    height: 20px;
                    position: relative;
                    border: 2px solid #dddddd;
                }

        .rightSecDrop .dropValueListSec .form-check-input:checked,
        .form-check-input[type="checkbox"]:indeterminate {
            background-color: #6A961F;
            border-color: #6A961F !important;
        }

        .rightSecDrop
        .dropValueListSec
        .dropValueList
        .form-check-inline
        .form-check-input:checked[type="radio"] {
            --bs-form-check-bg-image: none;
        }

            .rightSecDrop
            .dropValueListSec
            .dropValueList
            .form-check-inline
            .form-check-input:checked[type="radio"]::after {
                content: "";
                display: block;
                position: absolute;
                top: 3px;
                left: 6px;
                width: 5px;
                height: 9px;
                border: solid #ffffff;
                border-width: 0 2px 2px 0;
                transform: rotate(45deg);
            }

    .rightSecDrop.rightSecDropGrp .dropValue {
        font-size: 12px;
        font-weight: 600;
        color: #09590e;
        background-color: #e1eae2;
        border-radius: 4px;
        height: 20px;
        display: flex;
        padding: 2px 10px;
    }

    .rightSecDrop.rightSecDropGrp i {
        font-size: 21px;
        color: #107562;
        margin-right: 8px;
    }

    .rightSecDrop.rightSecDropGrp .dropValueListSec {
        background-color: #fafafa;
        min-width: 432px;
        /* width: max-content; */
        max-height: 630px;
        height: auto;
        overflow-y: inherit;
        overflow-x: inherit;
        z-index: 1;
    }

        .rightSecDrop.rightSecDropGrp .dropValueListSec.dashboarddropValueListSec {
            background-color: #fafafa;
            max-width: 354px;
            min-width: 354px;
            max-height: 459px;
            padding: 0;
        }

            .rightSecDrop.rightSecDropGrp .dropValueListSec.dashboarddropValueListSec .dropValueList .listSEcArea.listSEcArea2 {
                max-height: 404px;
            }

                .rightSecDrop.rightSecDropGrp .dropValueListSec.dashboarddropValueListSec .dropValueList .listSEcArea.listSEcArea2 .form-check-inline:hover .form-check-label {
                    color: #107562;
                }

                .rightSecDrop.rightSecDropGrp .dropValueListSec.dashboarddropValueListSec .dropValueList .listSEcArea.listSEcArea2 .form-check-inline .form-check-label.active {
                    color: #107562;
                }

                .rightSecDrop.rightSecDropGrp .dropValueListSec.dashboarddropValueListSec .dropValueList .listSEcArea.listSEcArea2::-webkit-scrollbar {
                    width: 0px;
                }

        .rightSecDrop.rightSecDropGrp .dropValueListSec .dropValueList .headTitle {
            font-size: 12px;
            font-weight: 600;
            color: #1f4820;
        }

        .rightSecDrop.rightSecDropGrp .dropValueListSec .dropValueList .searchArea {
            background-color: #ffffff;
            border-radius: 4px 4px 0 0;
            padding: 12px 12px 0;
            position: relative;
            margin-top: 6px;
        }

            .rightSecDrop.rightSecDropGrp
            .dropValueListSec
            .dropValueList
            .searchArea
            .form-control {
                height: 40px;
                padding-right: 35px;
            }

            .rightSecDrop.rightSecDropGrp
            .dropValueListSec
            .dropValueList
            .searchArea
            .iconDiv {
                position: absolute;
                right: 23px;
                top: 20px;
            }

        .rightSecDrop.rightSecDropGrp .dropValueListSec .dropValueList .listSEcArea {
            display: flex;
            flex-direction: column;
            background-color: #ffffff;
            border-radius: 4px;
            padding: 12px;
            margin-top: 6px;
            margin-bottom: 12px;
            overflow-y: auto;
            overflow-x: hidden;
            max-height: 190px;
        }

            .rightSecDrop.rightSecDropGrp
            .dropValueListSec
            .dropValueList
            .listSEcArea::-webkit-scrollbar {
                width: 4px;
                margin-top: 5px;
                top: 5px;
            }

            .rightSecDrop.rightSecDropGrp
            .dropValueListSec
            .dropValueList
            .listSEcArea::-webkit-scrollbar-track {
                background: #f1f1f1;
            }

            .rightSecDrop.rightSecDropGrp
            .dropValueListSec
            .dropValueList
            .listSEcArea::-webkit-scrollbar-thumb {
                background: #c1c1c1;
            }

            .rightSecDrop.rightSecDropGrp
            .dropValueListSec
            .dropValueList
            .listSEcArea.listSEcArea2 {
                margin-top: 0;
                border-radius: 0 0 4px 4px;
                padding-top: 0;
                overflow-y: auto;
                overflow-x: hidden;
                max-height: 302px;
            }

                .rightSecDrop.rightSecDropGrp
                .dropValueListSec
                .dropValueList
                .listSEcArea.listSEcArea2::-webkit-scrollbar {
                    width: 4px;
                    margin-top: 5px;
                    top: 5px;
                }

                .rightSecDrop.rightSecDropGrp
                .dropValueListSec
                .dropValueList
                .listSEcArea.listSEcArea2::-webkit-scrollbar-track {
                    background: #f1f1f1;
                }

                .rightSecDrop.rightSecDropGrp
                .dropValueListSec
                .dropValueList
                .listSEcArea.listSEcArea2::-webkit-scrollbar-thumb {
                    background: #c1c1c1;
                }

                .rightSecDrop.rightSecDropGrp
                .dropValueListSec
                .dropValueList
                .listSEcArea.listSEcArea2
                .form-check-inline {
                    padding: 12px 0;
                    border-bottom: 1px solid #f3f3f3;
                    min-height: 58px;
                    display: flex;
                    justify-content: space-between;
                }

                    .rightSecDrop.rightSecDropGrp
                    .dropValueListSec
                    .dropValueList
                    .listSEcArea.listSEcArea2
                    .form-check-inline:last-child {
                        border-bottom: none;
                        padding-bottom: 0;
                        min-height: 48px;
                    }

        .rightSecDrop.rightSecDropGrp
        .dropValueListSec
        .dropValueList
        .form-check-inline {
            padding: 0 0 16px;
            width: 100%;
            margin: 0;
            min-height: 37px;
        }

            .rightSecDrop.rightSecDropGrp
            .dropValueListSec
            .dropValueList
            .form-check-inline:last-child {
                padding-bottom: 0px;
                min-height: 18px;
            }

        .rightSecDrop.rightSecDropGrp
        .dropValueListSec
        .dropValueList
        .listSEcArea
        .form-check-inline
        .form-check-label {
            font-size: 14px;
            font-weight: 500;
            color: #434343;
            margin-right: 10px;
        }

            .rightSecDrop.rightSecDropGrp
            .dropValueListSec
            .dropValueList
            .listSEcArea
            .form-check-inline
            .form-check-label
            span {
                font-size: 12px;
                font-weight: 400;
                color: #2d2d2d;
                display: block;
            }

.dropTopHead .dropdown-toggle {
    font-size: 12px;
    font-weight: 600;
    color: #707070;
    min-width: 140px;
    border: 1px solid #dddddd;
    border-radius: 4px;
    height: 40px;
    background-color: #fafafa;
}

    .dropTopHead .dropdown-toggle .filter-option {
        display: flex;
        align-items: center;
    }

.dropTopHead .filter-option-inner-inner {
    display: flex;
    align-items: center;
}

.customerPicSec {
    border: 1px solid #eeeeee;
    border-radius: 8px;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}

    .customerPicSec.customerPicSec2 {
        border: 1px solid #c5c5c5;
        background-color: #f9f9f9;
    }

    .customerPicSec .picArea {
        display: grid;
        grid-template-columns: 42px 1fr;
        grid-gap: 8px;
        margin-right: 10px;
    }

        .customerPicSec .picArea img {
            width: 100%;
            border-radius: 50%;
        }

        .customerPicSec .picArea .titleArea .title {
            font-size: 14px;
            font-weight: 500;
            color: #2d2d2d;
        }

        .customerPicSec .picArea .titleArea .slnum {
            font-size: 12px;
            font-weight: 500;
            color: #707070;
            margin-top: 7px;
            display: block;
        }

    .customerPicSec .custStatus {
        font-size: 16px;
        font-weight: 600;
        color: #ffffff;
        height: 36px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 5px 29px;
        border-radius: 4px;
    }

        .customerPicSec .custStatus.org {
            background-color: #ef9700;
        }

.customerPopCard {
    background-color: #f9f9f9;
    padding: 10px 7px;
    border-radius: 4px;
    border: 1px solid #f5f5f5;
}

    .customerPopCard h6 {
        font-size: 14px;
        font-weight: 500;
        color: #434343;
    }

    .customerPopCard small {
        font-size: 16px;
        font-weight: 500;
        color: #2d2d2d;
    }

    .customerPopCard .avatar-initial {
        width: 40px;
        height: 40px;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #ffffff;
    }

        .customerPopCard .avatar-initial .ti {
            font-size: 24px;
        }

.customerPopCard2 {
    border: 1px solid #c4c4c4;
    border-radius: 4px;
    padding: 8px 15px;
    box-shadow: none;
}

    .customerPopCard2 h5 {
        font-size: 14px;
        font-weight: 500;
        color: #2d2d2d;
    }

    .customerPopCard2 p {
        font-size: 14px;
        font-weight: 400;
        color: #2d2d2d;
    }

.customerMdlLabel {
    font-size: 14px;
    font-weight: 500;
    color: #2d2d2d;
}

.custmModTable {
    background-color: #f9f9f9;
    border-radius: 6px;
    padding: 15px 17px;
}

    .custmModTable .title {
        font-size: 16px;
        font-weight: 600;
        color: #2d2d2d;
        margin-bottom: 14px;
    }

    .custmModTable ul {
        margin: 0;
        padding: 0;
    }

        .custmModTable ul li {
            display: grid;
            grid-template-columns: 215px 1fr;
            grid-gap: 26px;
            list-style: none;
            font-size: 14px;
            font-weight: 500;
            color: #707070;
            justify-content: space-between;
            margin-bottom: 19px;
        }

            .custmModTable ul li .cln {
                color: #2d2d2d;
            }

            .custmModTable ul li .dtvalue {
                color: #2d2d2d;
            }

.borderRed {
    border-color: #ea5455;
}

.accoActiveMc {
    border: 1px solid #ebeef1;
    border-bottom: none;
}

.spclGrn .form-control {
    background-color: #e4ede4;
    border-color: #e4ede4 !important;
}

    .spclGrn .form-control:hover {
        background-color: #ffffff;
    }

.light-style .spclTableclrsec thead tr th {
    color: #434343;
    border-color: #ebeef1 !important;
}

.light-style .spclTableclrsec tbody tr td {
    color: #434343;
    border-color: #ebeef1 !important;
    height: 30px;
}

.light-style .spclTableclrsec tbody tr th {
    color: #434343;
    border-color: #ebeef1 !important;
    height: 30px;
}

.spclBdrDiv {
    border-radius: 4px;
    border: 1px solid #dddddd;
}

.totalValue {
    font-size: 12px;
    font-weight: 600;
    color: #434343;
}

    .totalValue span {
        font-size: 14px;
        font-weight: 500;
        margin-left: 16px;
    }
/* .uploadAreaBtn {
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    flex-direction: column;
    justify-content: center;
} */
.uploadAreaBtn input[type="file"] {
    cursor: pointer;
    font-size: 100px;
    height: 100%;
    filter: alpha(opacity=1);
    -moz-opacity: 0.01;
    opacity: 0.01;
    position: absolute;
    right: 0;
    top: 0;
}

.uploadAreaBtn.dropzone:not(.dz-clickable) {
    opacity: 1;
    cursor: pointer;
}

.spclTblHdTd td {
    font-size: 14px !important;
    font-weight: 500;
    color: #434343 !important;
}

.spclTblHdTd .form-control {
    font-size: 14px !important;
    font-weight: 500;
    color: #434343 !important;
}

.spclTblHdTdHst td {
    font-size: 14px !important;
    font-weight: 500;
    color: #434343 !important;
    padding-top: 20px;
    padding-bottom: 20px;
}

.spclTblHdTdHst .form-control:hover {
    border: 1px solid #6A961F !important;
}

.spclTblHdTdHst th {
    font-size: 14px !important;
    font-weight: 500;
    color: #434343 !important;
    padding-top: 18px;
    padding-bottom: 18px;
}

.inputdtMob .form-select {
    border-radius: 4px !important;
}
/* .dz-thumbnail.SuccessCrl{
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    margin-left: -1.875rem;
    margin-top: -1.875rem;
    height: 3.75rem;
    width: 3.75rem;
    border-radius: 50%;
    background-position: center center;
    background-size: 1.875rem 1.875rem;
    background-repeat: no-repeat;
    box-shadow: 0 0 1.25rem rgba(0, 0, 0, 0.06);
    background-image: url();
}
.dz-thumbnail.FailureCrl{
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    margin-left: -1.875rem;
    margin-top: -1.875rem;
    height: 3.75rem;
    width: 3.75rem;
    border-radius: 50%;
    background-position: center center;
    background-size: 1.875rem 1.875rem;
    background-repeat: no-repeat;
    box-shadow: 0 0 1.25rem rgba(0, 0, 0, 0.06);
    background-image: url();
} */
.input-validation-error {
    border-color: #ea5455;
}

.salesinvoiceSpc {
    padding-right: 108px;
}

.salesinvoiceSpcInner {
    padding-right: 50px;
}

.dz-remove {
    z-index: 1;
    position: relative;
}

.form-selectSales {
    font-size: 12px;
    font-weight: 500;
}

    .form-selectSales .input-group-text {
        padding-left: 5px;
    }

.imageList:hover > .dz-filename {
    cursor: pointer;
    opacity: 1 !important;
}

.form-label .mandatory {
    position: relative;
}

.mouheadTitleSec {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
}

    .mouheadTitleSec .mouIcnListRight ul {
        margin: 0;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .mouheadTitleSec .mouIcnListRight ul li {
            list-style: none;
            width: 36px;
            height: 36px;
            border-radius: 4px;
            display: flex;
            align-self: center;
            justify-content: center;
            border: 1px solid #dddddd;
            margin-right: 8px;
            background-color: #ffffff;
            cursor: pointer;
        }

            .mouheadTitleSec .mouIcnListRight ul li:last-child {
                margin-right: 0;
            }

            .mouheadTitleSec .mouIcnListRight ul li i {
                display: flex;
                align-items: center;
            }

.mouTopListBar {
    margin: 0;
    padding: 0;
    display: grid;
    /* grid-template-columns: 1fr 1fr 180px 190px 168px 202px; */
    grid-template-columns: 1fr 1fr 200px 160px;
    align-items: center;
}

    .mouTopListBar li {
        list-style: none;
        display: flex;
        border-right: 1px solid #dddddd;
    }

        .mouTopListBar li:last-child {
            border-right: none;
        }
        /* .mouTopListBar li:nth-last-child(2){
    border-right: none;
} */
        /* .mouTopListBar li:nth-last-child(3){
    border-right: none;
} */
        .mouTopListBar li .iconDiv {
            width: 42px;
            height: 42px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 8px;
        }

            .mouTopListBar li .iconDiv img {
                border-radius: 50%;
                width: 100%;
            }

        .mouTopListBar li .icnUp {
            font-size: 12px;
            line-height: 12px;
            font-weight: 400;
            color: #2d2d2d;
            height: 36px;
            border-radius: 4px;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 5px 12px;
            background-color: #f3f3f3;
            cursor: pointer;
            margin-right: 10px;
        }

        .mouTopListBar li .print {
            cursor: pointer;
            position: relative;
            transition: ease-in-out 0.4s;
            width: 40px;
            height: 34px;
            background-color: #f3f3f3;
            border-radius: 4px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 24px;
            overflow: initial;
        }

            .mouTopListBar li .print.sevNonIcns {
                width: 36px;
                height: 36px;
                background-color: #ffffff;
                border: 1px solid #dddddd;
                border-right-color: #dddddd !important;
                border-left-color: #dddddd !important;
            }

                .mouTopListBar li .print.sevNonIcns:hover {
                    background-color: #f3f3f3;
                    border-color: #f3f3f3;
                    border-right-color: #f3f3f3 !important;
                    border-left-color: #f3f3f3 !important;
                }

            .mouTopListBar li .print:last-child {
                margin-right: 0;
            }

            .mouTopListBar li .print:hover span {
                opacity: 1;
                pointer-events: all;
            }

            .mouTopListBar li .print::after {
                display: none;
            }

            .mouTopListBar li .print span {
                font-size: 12px;
                font-weight: 400;
                line-height: normal;
                color: #fafafa;
                height: 26px;
                border-radius: 6px;
                padding: 2px 11px;
                display: flex;
                align-items: center;
                justify-content: center;
                background-color: #707070;
                width: max-content;
                position: absolute;
                right: 0;
                top: -45px;
                opacity: 0;
                pointer-events: none;
                transition: ease-in-out 0.4s;
            }

                .mouTopListBar li .print span:after {
                    position: absolute;
                    bottom: -4px;
                    right: 12px;
                    content: "";
                    background: #707070;
                    height: 10px;
                    width: 10px;
                    transform: rotate(45deg);
                    border-bottom: 1px solid #707070;
                    border-right: 1px solid #707070;
                    box-shadow: 0 0px 10px #707070;
                }

            .mouTopListBar li .print.esigned {
                background-color: #e6f1ef;
            }

                .mouTopListBar li .print.esigned svg path {
                    fill: #107562;
                }

        .mouTopListBar li .icnUp i {
            margin-right: 6px;
        }

        .mouTopListBar li .textArea {
            font-size: 14px;
            line-height: 16px;
            font-weight: 500;
            color: #434343;
        }

            .mouTopListBar li .textArea.textArea2 {
                color: #707070;
                font-weight: 400;
            }

                .mouTopListBar li .textArea.textArea2 span {
                    margin-top: 0;
                    margin-bottom: 7px;
                    font-size: 18px;
                    line-height: 20px;
                    font-weight: 500;
                    color: #2d2d2d;
                }

            .mouTopListBar li .textArea span {
                font-size: 16px;
                line-height: 18px;
                color: #2d2d2d;
                display: flex;
                align-items: center;
                margin-top: 5px;
                font-weight: 500;
            }

        .mouTopListBar li .status {
            font-size: 10px;
            line-height: 10px;
            font-weight: 600;
            padding: 4px 11px;
            height: 22px;
            border-radius: 4px;
            display: flex;
            align-items: center;
            justify-content: center;
            width: max-content;
            margin-left: 9px;
        }

            .mouTopListBar li .status.org {
                color: #ffffff;
                background-color: #ef9700;
            }

.mousubSecTop .dropdown {
    display: none;
    position: absolute;
    right: 13px;
    top: 20px;
    background-color: #efefef;
    width: 26px;
    height: 26px;
    border-radius: 4px;
    align-items: center;
    justify-content: center;
}

    .mousubSecTop .dropdown .icnUp {
        font-size: 12px;
        line-height: 12px;
        font-weight: 400;
        color: #2d2d2d;
        height: 36px;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        padding: 5px 12px;
        background-color: #f3f3f3;
        cursor: pointer;
    }

    .mousubSecTop .dropdown a {
        background-color: transparent;
        margin-bottom: 0;
        padding: 0px 4px 5px;
    }

    .mousubSecTop .dropdown .status {
        font-size: 10px;
        line-height: 10px;
        font-weight: 600;
        padding: 4px 11px;
        height: 22px;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: max-content;
    }

        .mousubSecTop .dropdown .status.org {
            color: #ffffff;
            background-color: #ef9700;
        }

    .mousubSecTop .dropdown .dropdown-item {
        background-color: transparent;
    }

.mousubSecTopAction {
    display: none !important;
}

.mouprevTable .prevTableList {
    display: grid;
    grid-template-columns: 310px 1fr;
    margin-bottom: 24px;
}

    .mouprevTable .prevTableList:last-child {
        margin-bottom: 0;
    }

    .mouprevTable .prevTableList .title {
        font-size: 14px;
        line-height: 16px;
        font-weight: 500;
        color: #707070;
    }

        .mouprevTable .prevTableList .title .icon {
            min-width: 24px;
        }

    .mouprevTable .prevTableList .valeSec {
        font-size: 14px;
        line-height: 21px;
        font-weight: 400;
        color: #2d2d2d;
        display: flex;
    }

        .mouprevTable .prevTableList .valeSec span {
            margin-right: 15px;
        }

.mouprevHovSec .edit {
    display: none;
    position: absolute;
    right: 20px;
    transition: ease-in-out 0.4s;
    cursor: pointer;
}

.mouprevHovSec:hover .edit {
    display: block;
    color: #a5a5a5;
}

.mousideList .btn {
    width: 86px;
    height: 28px;
    border-radius: 4px;
}

.mousideList .uploadHeight {
    width: 86px;
    height: 28px;
    border-radius: 4px;
    border: 1px solid #707070 !important;
}

    .mousideList .uploadHeight .needsclick {
        margin-top: 3px;
        margin-left: 3px;
    }

.mouManinTitleRgt {
    font-size: 16px;
    line-height: 18px;
    font-weight: 600;
    color: #2d2d2d;
    margin-bottom: 10px;
    margin-top: 10px;
}

.moutableaUn a:hover {
    text-decoration: underline;
}

.hovereffect .abt .edit {
    position: absolute;
    right: 20px;
    transition: ease-in-out 0.4s;
    cursor: pointer;
}

.hovereffect:hover .abt .edit {
    display: block !important;
}

.hovereffect .abt .edit i {
    color: #a5a5a5;
}

.goldPurchAgree p {
    font-size: 14px;
    color: #434343;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 16px;
    margin-top: 0;
}

.goldPurchAgree h4 {
    font-size: 16px;
    color: #2d2d2d;
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 13px;
}

.goldPurchAgree ul li {
    list-style: none;
    display: flex;
    margin-bottom: 13px;
    font-size: 14px;
    color: #434343;
    font-weight: 500;
    line-height: 24px;
}

    .goldPurchAgree ul li span {
        margin-right: 10px;
    }

.tableSticky {
    background-color: #fff !important;
    position: sticky !important;
    right: 0;
}

.tableArrow thead tr th::before {
    display: none !important;
}

.tableArrow thead tr th::after {
    display: none !important;
}

.tableArrow thead tr th {
    cursor: default !important;
}

    .tableArrow thead tr th svg {
        position: absolute;
        right: 3px;
        cursor: pointer;
        width: 20px;
        height: 30px;
        top: 0;
        bottom: 0;
        margin: auto;
    }

.table thead tr th {
    font-weight: 600;
    color: #2d2d2d !important;
}

.table tbody tr td {
    color: #434343;
    transition: ease-in-out 0.4s;
}

    .table tbody tr td a {
        color: #434343;
        transition: ease-in-out 0.4s;
    }

.table tbody tr .tableSticky {
    padding-top: 5px;
    padding-bottom: 5px;
    z-index: 3;
}

    .table tbody tr .tableSticky.clicked {
        z-index: 99;
    }

.table tbody tr:hover .tableSticky {
    background-color: #f5f6fe !important;
}

.table tbody tr .invNum {
    cursor: pointer;
}

.table tbody tr:hover .invNum {
    color: #6A961F;
}

.table tbody tr:hover td {
    background-color: #f5f6fe;
}

.table tbody tr td .form-control {
    color: #434343;
}

.table tbody tr .tableSticky .dropdown .dropdown-toggle {
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    padding: 0;
}

    .table tbody tr .tableSticky .dropdown .dropdown-toggle i {
        color: #ffffff;
    }

.table tbody tr:hover .tableSticky .dropdown .dropdown-toggle {
    background-color: #6A961F;
    border-color: #6A961F;
}

.modalWidet {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    z-index: 9995;
    pointer-events: none;
    -webkit-transition: opacity 0.6s, -webkit-transform 0.5s;
    transition: opacity 0.6s, transform 0.5s;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    box-shadow: 0 3px 5px 0 rgba(32, 33, 36, 0.2);
    opacity: 0;
}

    .modalWidet .modalRowBg {
        border-radius: 0;
        max-width: 100%;
        width: 100%;
        z-index: 1;
        position: relative;
    }

    .modalWidet .modalRow {
        padding: 25px;
        background-color: #fff;
        border-radius: 0;
    }

        .modalWidet .modalRow .modcloseBtn {
            cursor: pointer;
            width: 30px;
            height: 30px;
            background-color: #f2f2f2;
            display: flex;
            align-items: center;
            justify-content: center;
            position: absolute;
            border-radius: 50%;
            right: 16px;
            top: 16px;
            transition: ease-in-out 0.4s;
        }

    .modalWidet .modalBg {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background-color: #4b465c;
        opacity: 0;
        -webkit-transition: opacity 0.6s, -webkit-transform 0.5s;
        transition: opacity 0.6s, transform 0.5s;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .modalWidet.open {
        opacity: 1;
        pointer-events: visible;
    }

        .modalWidet.open .modalBg {
            opacity: 0.5;
        }

    .modalWidet.modalWidetRgt {
        justify-content: flex-end;
    }

        .modalWidet.modalWidetRgt .modalRowBg .modalRow {
            width: 100%;
            height: 100vh;
        }

.spclTableclrsec .table tbody tr td .form-control:hover {
    padding-right: 15px !important;
    border: 1px solid #6A961F !important;
    border-radius: 4px !important;
}

.spclTableclrsec .table tbody tr td .spclGrn .form-control:hover {
    padding-right: 15px !important;
    border: 1px solid #6A961F !important;
    border-radius: 4px !important;
}

.offcanvas-title {
    font-size: 20px;
    color: #2d2d2d;
    font-weight: 600;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
}

    .offcanvas-title span {
        font-size: 16px;
        color: #707070;
        margin-left: 24px;
    }

.badge.blue {
    color: #007fef;
    background-color: #e5f2fe;
}

.badge.green {
    color: #009519;
    background-color: #e4f3e6;
}

.badge.lgtgrn {
    color: #009519;
    background-color: #e5f4e7;
}

.badge.yel {
    color: #E8AA3D;
    background-color: #FDF6EB;
}

.badge.org {
    color: #eca10b;
    background-color: #f5f0e6;
}

.badge.grn {
    color: #107562;
    background-color: #ebf5f3;
}

.badge.red {
    color: #C60608;
    background-color: #f6ebeb;
}

.badge.red2 {
    color: #C60608;
    background-color: #f6ebeb;
}

.badge.blu {
    color: #085DBE;
    background-color: #ecf1f6;
}

.badge.mer {
    color: #590d22;
    background-color: #f7eef1;
}

/* .table-responsive{
    margin-bottom: 15px;
} */
.customerPicSec2Sm .picArea img {
    width: 100%;
    height: auto;
}

.customerPicSec2Sm .picArea .titleArea .slnum {
    margin-top: 0;
}

.customerPicSec2Sm {
    padding: 2px 16px;
    border-radius: 4px;
}

    .customerPicSec2Sm .picArea .titleArea .title {
        line-height: 16px;
    }

    .customerPicSec2Sm .picArea {
        grid-template-columns: 22px 1fr;
        align-items: center;
    }

        .customerPicSec2Sm .picArea .pic {
            display: flex;
            max-width: 22px;
            width: 100%;
            height: 22px;
        }

.subTitleHead {
    font-size: 14px;
    font-weight: 500;
    color: #2d2d2d;
    margin-bottom: 9px;
}

.btnTooltip .toolTip {
    max-width: 690px;
    border-radius: 6px;
    padding: 8px 20px;
    display: none;
    position: absolute;
    bottom: 60px;
    width: max-content;
    right: 0;
    text-align: left;
    background-color: #ffffff;
    -webkit-box-shadow: 0px 0px 8px -2px rgba(0, 0, 0, 0.23);
    -moz-box-shadow: 0px 0px 8px -2px rgba(0, 0, 0, 0.23);
    box-shadow: 0px 0px 8px -2px rgba(0, 0, 0, 0.23);
}

.btnTooltip:hover .toolTip {
    display: flex;
}

.btnTooltip .toolTip p {
    font-size: 16px;
    font-weight: 400;
    color: #000000;
    margin: 0;
}

    .btnTooltip .toolTip p span {
        font-weight: 600;
    }

.btnTooltip .toolTip i {
    color: #6A961F;
    margin-right: 25px;
}

.btnTooltipovrly {
    background-color: #86b9af;
    border-color: #86b9af;
}

.invoiceVieLeft .user {
    display: grid;
    grid-template-columns: 52px 1fr;
    grid-gap: 12px;
}

    .invoiceVieLeft .user .pic {
        max-width: 52px;
        width: 100%;
    }

        .invoiceVieLeft .user .pic img {
            width: 100%;
            border-radius: 50%;
        }

.invoiceVieLeft .textarea {
    font-size: 20px;
    font-weight: 600;
    color: #5d596c;
}

    .invoiceVieLeft .textarea span {
        font-size: 14px;
        font-weight: 400;
        display: block;
    }

.invoiceVieLeft .statusBar {
    display: flex;
    background-color: #f8f9fa;
    min-height: 38px;
    padding: 5px 16px;
    align-items: center;
    margin-top: 16px;
}

    .invoiceVieLeft .statusBar .title {
        font-size: 12px;
        font-weight: 400;
        color: #434343;
    }

.invoiceVieLeft .listSecArea .listSec {
    display: flex;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid #f3f3f3;
}

    .invoiceVieLeft .listSecArea .listSec:hover {
        background-color: #f5f6fe;
    }

    .invoiceVieLeft .listSecArea .listSec.active {
        background-color: #f5f6fe;
    }

    .invoiceVieLeft .listSecArea .listSec .dateArea {
        font-size: 14px;
        font-weight: 400;
        color: #5d596c;
    }

        .invoiceVieLeft .listSecArea .listSec .dateArea .date {
            font-size: 14px;
            font-weight: 500;
            color: #434343;
            display: block;
            margin-bottom: 5px;
        }

    .invoiceVieLeft .listSecArea .listSec .priceArea {
        font-size: 16px;
        font-weight: 500;
        color: #434343;
        text-align: right;
    }

        .invoiceVieLeft .listSecArea .listSec .priceArea .status {
            font-size: 14px;
            font-weight: 400;
            display: block;
        }

            .invoiceVieLeft .listSecArea .listSec .priceArea .status.org {
                color: #eca10b;
            }

            .invoiceVieLeft .listSecArea .listSec .priceArea .status.grn {
                color: #107562;
            }

            .invoiceVieLeft .listSecArea .listSec .priceArea .status.lgtgrn {
                color: #06AB06;
            }

            .invoiceVieLeft .listSecArea .listSec .priceArea .status.red {
                color: #C60608;
            }

            .invoiceVieLeft .listSecArea .listSec .priceArea .status.blu {
                color: #085DBE;
            }

            .invoiceVieLeft .listSecArea .listSec .priceArea .status.mer {
                color: #590d22;
            }

.light-style
.invoiceVieLeft
.statusBar
.select2-container--default
.select2-selection--single
.select2-selection__clear {
    display: none;
}

.light-style .invoiceVieLeft .statusBar .select2-container {
    min-width: 154px;
}

.light-style
.invoiceVieLeft
.statusBar
.select2-container--default
.select2-selection {
    background-color: #f8f9fa !important;
    border: 1px solid #f8f9fa !important;
    height: 32px !important;
}

.light-style
.invoiceVieLeft
.statusBar
.select2-container--default
.select2-selection--single
.select2-selection__rendered {
    line-height: 28px;
    font-size: 12px;
    font-weight: 600;
    color: #434343;
}

.light-style
.invoiceVieLeft
.statusBar
.select2-container--default
.select2-selection--single
.select2-selection__arrow
b {
    top: 16%;
}

.light-style
.invoiceVieLeft
.statusBar
.select2-results__option[role="option"] {
    font-size: 12px;
    font-weight: 600;
}

.invoiceMainCntViewRgt .titleTop {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
}

    .invoiceMainCntViewRgt .titleTop .leftSec {
        margin-right: 15px;
    }

        .invoiceMainCntViewRgt .titleTop .leftSec .subTitle {
            font-size: 18px;
            font-weight: 500;
            line-height: normal;
            color: #2d2d2d;
            display: flex;
            align-items: center;
            margin-bottom: 8px;
        }

            .invoiceMainCntViewRgt .titleTop .leftSec .subTitle i {
                color: #2c3e50;
                margin-right: 9px;
            }

        .invoiceMainCntViewRgt .titleTop .leftSec .title {
            font-size: 24px;
            font-weight: 500;
            color: #434343;
            display: flex;
            flex-wrap: wrap;
        }

            .invoiceMainCntViewRgt .titleTop .leftSec .title span {
                font-size: 14px;
                font-weight: 500;
                height: 32px;
                border-radius: 3px;
                display: flex;
                align-items: center;
                justify-content: center;
                margin-left: 16px;
                width: max-content;
                min-width: 72px;
                padding: 5px 15px;
            }

                .invoiceMainCntViewRgt .titleTop .leftSec .title span.lgtgrn {
                    color: #009519;
                    background-color: #e5f4e7;
                }

                .invoiceMainCntViewRgt .titleTop .leftSec .title span.org {
                    color: #eca10b;
                    background-color: #f5f0e6;
                }

                .invoiceMainCntViewRgt .titleTop .leftSec .title span.grn {
                    color: #107562;
                    background-color: #ebf5f3;
                }

                .invoiceMainCntViewRgt .titleTop .leftSec .title span.red {
                    color: #C60608;
                    background-color: #f6ebeb;
                }

                .invoiceMainCntViewRgt .titleTop .leftSec .title span.blu {
                    color: #085DBE;
                    background-color: #ecf1f6;
                }

                .invoiceMainCntViewRgt .titleTop .leftSec .title span.mer {
                    color: #590d22;
                    background-color: #f7eef1;
                }


    .invoiceMainCntViewRgt .titleTop .rightBtnSec ul {
        padding: 0;
        margin: 0;
        list-style-type: none !important;
    }

        .invoiceMainCntViewRgt .titleTop .rightBtnSec ul li {
            list-style: none;
            font-size: 12px;
            font-weight: 500;
            color: #2d2d2d;
            display: inline-block;
            margin-right: 8px;
            padding: 5px 13px 5px 7px;
            cursor: pointer;
            border-radius: 4px;
            transition: ease-in-out 0.4s;
        }

            .invoiceMainCntViewRgt .titleTop .rightBtnSec ul li:hover {
                background-color: #f3f8f7;
            }

            .invoiceMainCntViewRgt .titleTop .rightBtnSec ul li svg {
                margin-right: 8px;
            }

.invoiceMainCntViewRgt .icnListRow {
    background-color: #FAFAFA;
    border-radius: 4px;
    padding: 0 12px 0 24px;
    min-height: 44px;
    display: flex;
    justify-content: space-between;
    margin-top: 14px;
    border: 1px solid #EEEEEE;
}

    .invoiceMainCntViewRgt .icnListRow ul {
        padding: 0;
        margin: 0;
        list-style-type: none !important;
        display: flex;
        flex-wrap: wrap;
    }

        .invoiceMainCntViewRgt .icnListRow ul li {
            list-style: none;
            font-size: 14px;
            font-weight: 400;
            color: #2d2d2d;
            align-items: center;
            display: flex;
            margin: 12px 13px 12px 0;
            cursor: pointer;
            border-right: 1px solid #a5a5a5;
            padding-right: 18px;
        }

            .invoiceMainCntViewRgt .icnListRow ul li:last-child {
                border-right: none;
                padding-right: 0;
                margin-right: 0;
            }

            .invoiceMainCntViewRgt .icnListRow ul li i {
                margin-right: 8px;
                color: #a5a5a5;
            }

.invoiceMainCntViewRgt .accordion-item {
    box-shadow: none !important;
    border: 1px solid #eeeeee;
}

    .invoiceMainCntViewRgt .accordion-item.active {
        box-shadow: none !important;
        border: 1px solid #eeeeee;
    }

.invoiceMainCntViewRgt .accordion-button {
    font-size: 16px;
    font-weight: 400;
    color: #2d2d2d !important;
}

.invoiceMainCntViewRgt .printViewSec .topSec {
    display: flex;
    justify-content: space-between;
    position: relative;
}

    .invoiceMainCntViewRgt .printViewSec .topSec .tag {
        width: 106px;
        height: 106px;
        position: relative;
    }

        .invoiceMainCntViewRgt .printViewSec .topSec .tag svg {
            position: absolute;
            left: -26px;
            top: -28px;
        }

        .invoiceMainCntViewRgt .printViewSec .topSec .tag span {
            font-size: 12px;
            font-weight: 600;
            color: #ffffff !important;
            position: absolute;
            left: -23px;
            top: -30px;
            display: flex;
            right: 0;
            bottom: 0;
            align-items: center;
            justify-content: center;
            z-index: 1;
            transform: rotate(-404deg);
        }

    .invoiceMainCntViewRgt .printViewSec .topSec .headTitle {
        text-align: right;
        padding-top: 109px;
        padding-right: 32px;
    }

        .invoiceMainCntViewRgt .printViewSec .topSec .headTitle .mainTitle {
            font-size: 24px;
            font-weight: 500;
            color: #707070;
            text-transform: uppercase;
        }

            .invoiceMainCntViewRgt .printViewSec .topSec .headTitle .mainTitle span {
                color: #434343;
                margin-left: 14px;
            }

.invoiceMainCntViewRgt .printViewSec .addressArea .address {
    min-width: 310px;
}

    .invoiceMainCntViewRgt .printViewSec .addressArea .address h4 {
        font-size: 18px;
        font-weight: 500;
        color: #2d2d2d;
        margin-bottom: 5px;
    }

    .invoiceMainCntViewRgt .printViewSec .addressArea .address p {
        font-size: 16px;
        font-weight: 400;
        color: #707070;
        margin: 0;
    }

        .invoiceMainCntViewRgt .printViewSec .addressArea .address p span {
            font-weight: 500;
            color: #2d2d2d;
            display: block;
        }

.invoiceMainCntViewRgt .printViewSec .addressArea .contactSec ul {
    margin: 0;
    padding: 0;
}

    .invoiceMainCntViewRgt .printViewSec .addressArea .contactSec ul li {
        font-size: 14px;
        font-weight: 400;
        color: #2d2d2d;
        display: flex;
        align-items: center;
        margin-bottom: 20px;
    }

        .invoiceMainCntViewRgt .printViewSec .addressArea .contactSec ul li i {
            margin-right: 8px;
        }

.invoiceMainCntViewRgt .printViewSec .invTableSpc {
    padding: 0 32px 12px;
}

    .invoiceMainCntViewRgt .printViewSec .invTableSpc .totalBtm {
        background-color: #f5f6fe;
    }

        .invoiceMainCntViewRgt .printViewSec .invTableSpc .totalBtm td {
            font-size: 14px;
            font-weight: 500;
            color: #434343;
            border-bottom: none;
        }

.invoiceMainCntViewRgt .printViewSec .btmcal {
    padding: 0 44px 12px;
}

    .invoiceMainCntViewRgt .printViewSec .btmcal .borderDiv {
        border: none;
        border-radius: 4px;
    }

.invoiceMainCntViewRgt .printViewSec .invTable table {
    border: 1px solid #f3f3f3;
}

.invoiceMainCntViewRgt .printViewSec .invTable tr th {
    border-bottom: none;
    border-right: 1px solid #f3f3f3;
    padding: 8px;
    text-transform: capitalize;
    letter-spacing: normal;
}

    .invoiceMainCntViewRgt .printViewSec .invTable tr th .tbleHedTitle {
        display: flex;
        flex-direction: column;
        justify-content: center;
        min-height: 35px;
    }

    .invoiceMainCntViewRgt .printViewSec .invTable tr th ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

        .invoiceMainCntViewRgt .printViewSec .invTable tr th ul li {
            font-size: 12px;
            font-weight: 400;
            color: #434343;
            display: inline-block;
        }

.invoiceMainCntViewRgt .printViewSec .invTable tr td {
    border-bottom: none;
    border-right: 1px solid #f3f3f3;
    padding: 8px;
}

    .invoiceMainCntViewRgt .printViewSec .invTable tr td ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

        .invoiceMainCntViewRgt .printViewSec .invTable tr td ul li {
            font-size: 12px;
            font-weight: 400;
            color: #434343;
            display: inline-block;
        }

.invoiceMainCntViewRgt .printViewSec .btmAmountInWordPd {
    padding: 0 32px 18px;
}

    .invoiceMainCntViewRgt .printViewSec .btmAmountInWordPd .btmAmountInWord {
        padding: 10px 16px;
        font-size: 14px;
        line-height: 16px;
        font-weight: 600;
        color: #2d2d2d;
        border: 1px solid #dddddd;
        border-radius: 2px;
    }

        .invoiceMainCntViewRgt
        .printViewSec
        .btmAmountInWordPd
        .btmAmountInWord
        .topSec {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 10px;
            margin-bottom: 6px;
        }

            .invoiceMainCntViewRgt
            .printViewSec
            .btmAmountInWordPd
            .btmAmountInWord
            .topSec
            .leftArea {
                font-size: 14px;
                font-weight: 400;
                color: #2d2d2d;
            }

            .invoiceMainCntViewRgt
            .printViewSec
            .btmAmountInWordPd
            .btmAmountInWord
            .topSec
            .rightArea {
                font-size: 12px;
                font-weight: 400;
                color: #2d2d2d;
                text-transform: uppercase;
            }

.invoiceMainCntViewRgt .printViewSec .invoiceBtmArea {
    padding: 0 32px 31px;
}

    .invoiceMainCntViewRgt .printViewSec .invoiceBtmArea h4 {
        font-size: 14px;
        font-weight: 600;
        color: #2d2d2d;
        margin-bottom: 5px;
    }

    .invoiceMainCntViewRgt .printViewSec .invoiceBtmArea p {
        font-size: 14px;
        font-weight: 400;
        color: #2d2d2d;
        margin-bottom: 21px;
    }

    .invoiceMainCntViewRgt .printViewSec .invoiceBtmArea h5 {
        font-size: 14px;
        font-weight: 500;
        color: #2d2d2d;
        margin-bottom: 31px;
    }

        .invoiceMainCntViewRgt .printViewSec .invoiceBtmArea h5 span {
            letter-spacing: -3px;
        }

.invoiceMainCntViewRgt .printViewSec .invoiceTermsSpc {
    padding: 0 32px;
    margin-bottom: 60px;
}

.invoiceMainCntViewRgt .printViewSec .invoiceTerms {
    border-radius: 2px;
    background-color: #f3f3f3;
    padding: 12px 16px;
}

    .invoiceMainCntViewRgt .printViewSec .invoiceTerms p {
        font-size: 12px;
        font-weight: 500;
        color: #434343;
        margin: 0;
    }

    .invoiceMainCntViewRgt .printViewSec .invoiceTerms span {
        font-size: 14px;
        font-weight: 600;
        color: #2d2d2d;
        margin-bottom: 9px;
    }

.custSearchDropDwnSales {
    position: relative;
}

    .custSearchDropDwnSales .searchArea .form-control {
        font-size: 12px;
        font-weight: 400;
        line-height: 18px;
        color: #2d2d2d;
    }

    .custSearchDropDwnSales .searchArea {
        position: relative;
    }

        .custSearchDropDwnSales .searchArea .pic {
            width: 24px;
            height: 24px;
            position: absolute;
            top: 5px;
            left: 8px;
        }

            .custSearchDropDwnSales .searchArea .pic img {
                width: 100%;
            }

        .custSearchDropDwnSales .searchArea .arrow {
            position: absolute;
            top: 8px;
            right: 8px;
        }

    .custSearchDropDwnSales.active .searchArea .arrow svg {
        transform: rotate(-180deg);
    }

    .custSearchDropDwnSales.active .custmDrop {
        /* opacity: 1;
  pointer-events: all; */
    }

    .custSearchDropDwnSales .custmDrop.highlight {
        display: block !important;
        opacity: 1 !important;
        pointer-events: all !important;
        top: auto !important;
        bottom: 35px !important;
    }

    .custSearchDropDwnSales .custmDrop {
        position: absolute;
        z-index: 1;
        background-color: #ffffff;
        border: 1px solid #dddddd;
        border-radius: 4px;
        padding: 8px;
        margin-top: 6px;
        opacity: 0;
        pointer-events: none;
        display: none;
        top: 35px;
        bottom: auto;
        visibility: visible;
    }

        .custSearchDropDwnSales .custmDrop .table-responsive {
            margin-bottom: 0px;
        }

            .custSearchDropDwnSales .custmDrop .table-responsive .pic {
                width: 24px;
                height: 24px;
            }

                .custSearchDropDwnSales .custmDrop .table-responsive .pic img {
                    width: 100%;
                }

            .custSearchDropDwnSales .custmDrop .table-responsive tr:last-child td {
                border-bottom: none;
            }

.custmrSpclDropSec {
    position: relative;
}

    .custmrSpclDropSec .searchField {
        position: relative;
    }

        .custmrSpclDropSec .searchField .form-control {
            border: 1px solid #eeeeee;
            border-radius: 8px;
            height: 62px;
            padding: 5px 15px 5px 57px;
        }

        .custmrSpclDropSec .searchField .searchIcn {
            position: absolute;
            left: 22px;
            top: 20px;
            display: flex;
            width: 20px;
            height: 20px;
            align-items: center;
            justify-content: center;
        }

            .custmrSpclDropSec .searchField .searchIcn i {
                color: #707070;
                font-size: 21px;
            }

    .custmrSpclDropSec .dropListSec {
        background-color: #ffffff;
        padding: 20px 14px;
        border-radius: 8px;
        border: 1px solid #eeeeee;
        margin-top: 0px;
        position: absolute;
        width: 100%;
        display: none;
        transition: ease-in-out 0.4s;
        box-shadow: 0 0.125rem 0.25rem rgba(165, 163, 174, 0.3);
        z-index: 11;
    }

    .custmrSpclDropSec.active .dropListSec {
        display: block;
        transition: ease-in-out 0.4s;
        margin-top: 6px;
    }

    .custmrSpclDropSec .dropListSec .dropListAdd .addBtn {
        font-size: 16px;
        font-weight: 600;
        color: #6A961F;
        display: flex;
        align-items: center;
        background-color: transparent;
        border: none;
        cursor: pointer;
        padding: 0;
    }

        .custmrSpclDropSec .dropListSec .dropListAdd .addBtn .icn {
            width: 32px;
            height: 32px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: #107562;
            margin-right: 11px;
        }

            .custmrSpclDropSec .dropListSec .dropListAdd .addBtn .icn i {
                color: #ffffff;
                font-size: 14px;
            }

    .custmrSpclDropSec .dropListSec .dropListSecArea {
        margin-top: 18px;
        max-height: 184px;
        overflow-y: auto;
    }

        .custmrSpclDropSec .dropListSec .dropListSecArea::-webkit-scrollbar {
            width: 4px;
            height: 4px;
            margin-left: 5px;
            left: 5px;
        }

        .custmrSpclDropSec .dropListSec .dropListSecArea::-webkit-scrollbar-track {
            background: #ffffff;
        }

        .custmrSpclDropSec .dropListSec .dropListSecArea::-webkit-scrollbar-thumb {
            background: #ffffff;
        }

        .custmrSpclDropSec .dropListSec .dropListSecArea .dropList {
            display: grid;
            grid-template-columns: 31px 1fr;
            grid-gap: 13px;
            align-items: center;
            margin-bottom: 8px;
            cursor: pointer;
        }

            .custmrSpclDropSec .dropListSec .dropListSecArea .dropList:last-child {
                margin-bottom: 0px;
            }

            .custmrSpclDropSec .dropListSec .dropListSecArea .dropList .pic {
                width: 31px;
                height: 31px;
                border-radius: 50%;
            }

                .custmrSpclDropSec .dropListSec .dropListSecArea .dropList .pic img {
                    width: 100%;
                    border-radius: 50%;
                }

            .custmrSpclDropSec .dropListSec .dropListSecArea .dropList .textARea {
                font-size: 16px;
                font-weight: 600;
                color: #707070;
            }

                .custmrSpclDropSec .dropListSec .dropListSecArea .dropList .textARea span {
                    font-size: 12px;
                    font-weight: 400;
                    display: block;
                }

.custmrSpclDropSecAdded {
    /* border: 1px solid #EEEEEE; */
    border: 1px solid #dddddd;
    border-radius: 8px;
    height: 62px;
    padding: 5px 30px 5px 30px;
    position: relative;
    display: flex;
    align-items: center;
}

    .custmrSpclDropSecAdded .addPrev {
        display: grid;
        grid-template-columns: 42px 1fr;
        grid-gap: 8px;
    }

        .custmrSpclDropSecAdded .addPrev .pic {
            width: 42px;
            height: 42px;
            border-radius: 50%;
        }

            .custmrSpclDropSecAdded .addPrev .pic img {
                width: 100%;
                border-radius: 50%;
            }

        .custmrSpclDropSecAdded .addPrev .textARea {
            font-size: 14px;
            font-weight: 500;
            color: #2d2d2d;
            white-space: nowrap;
            overflow: hidden;
        }

            .custmrSpclDropSecAdded .addPrev .textARea span {
                font-size: 12px;
                font-weight: 500;
                color: #707070;
                display: block;
            }

    .custmrSpclDropSecAdded .changeBtn {
        position: absolute;
        right: 30px;
        top: 11px;
    }

    .custmrSpclDropSecAdded .changeBtn {
        background-color: #ffffff;
    }

.custmrSpclDropSec.custmrSpclDropSml .searchField .form-control {
    border-radius: 6px;
    height: 38px;
    padding: 5px 40px 5px 15px;
}

.custmrSpclDropSec.custmrSpclDropSml .searchField .searchIcn {
    left: auto;
    top: 10px;
    right: 14px;
}

.custmrSpclDropSecAdded2 {
    border-radius: 6px;
    height: 38px;
    padding: 5px 30px 5px 7px;
}

    .custmrSpclDropSecAdded2 .addPrev {
        grid-template-columns: 30px 1fr;
    }

        .custmrSpclDropSecAdded2 .addPrev .pic {
            width: 30px;
            height: 30px;
        }

        .custmrSpclDropSecAdded2 .addPrev .textARea {
            font-size: 13px;
            line-height: initial;
        }

            .custmrSpclDropSecAdded2 .addPrev .textARea span {
                font-size: 12px;
                line-height: initial;
            }

    .custmrSpclDropSecAdded2 .changeBtn {
        right: 4px;
        top: 3px;
    }

        .custmrSpclDropSecAdded2 .changeBtn button {
            height: 31px;
        }

.bg-menu-theme
.menu-inner
.menu-sub
.menu-item:not(.active) > .menu-link::before {
    display: none;
}

.bg-menu-theme .menu-sub > .menu-item > .menu-link:before {
    display: none;
}

.divShowScrl {
    background-color: #ffffff;
    border-radius: 6px;
    padding: 9px;
    width: 346px;
    margin: auto;
    position: sticky;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 20px;
    box-shadow: 0 0.125rem 0.25rem rgba(165, 163, 174, 0.3);
}

    .divShowScrl.divShowScrl2 {
        width: 450px;
    }

    .divShowScrl ul {
        margin: 0;
        padding: 0 !important;
        display: flex;
    }

        .divShowScrl ul li {
            list-style: none;
            display: flex;
            margin-right: 12px;
            margin-bottom: 0 !important;
        }

            .divShowScrl ul li:last-child {
                margin-right: 0px;
            }

    .divShowScrl li .icnUp {
        font-size: 12px;
        line-height: 12px;
        font-weight: 400;
        color: #2d2d2d;
        height: 36px;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 5px 12px;
        background-color: #f3f3f3;
        cursor: pointer;
        transition: ease-in-out 0.4s;
    }

        .divShowScrl li .icnUp:hover {
            color: #ffffff;
            background-color: #6A961F;
        }

            .divShowScrl li .icnUp:hover i {
                color: #ffffff;
            }

        .divShowScrl li .icnUp i {
            margin-right: 6px;
        }

.cstTableScrl::-webkit-scrollbar {
    height: 4px;
    width: 4px;
    margin-top: 5px;
    top: 5px;
}

.cstTableScrl::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.cstTableScrl::-webkit-scrollbar-thumb {
    background: #c1c1c1;
}

.cstTableCl6 {
    margin-bottom: 10px;
}

    .cstTableCl6 .cstTableList {
        display: grid;
        grid-template-columns: 251px 1fr;
    }

        .cstTableCl6 .cstTableList:last-child {
            border-bottom: none;
        }

        .cstTableCl6 .cstTableList .txtLeft {
            font-size: 16px;
            color: #2d2d2d;
            font-weight: 600;
            padding: 10px 0;
        }

        .cstTableCl6 .cstTableList .txtRight {
            font-size: 16px;
            color: #434343;
            font-weight: 500;
            padding: 10px 0;
        }

.dashboardCss .topRowCard .badge {
    width: 58px;
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .dashboardCss .topRowCard .badge.org {
        color: #ef9700;
        background-color: #fce9c9;
    }

    .dashboardCss .topRowCard .badge.vio {
        color: #b358d9;
        background-color: #efdbf7;
    }

    .dashboardCss .topRowCard .badge.blu {
        color: #007fef;
        background-color: #c9e4fc;
    }

    .dashboardCss .topRowCard .badge.grn {
        color: #009519;
        background-color: #c9e9ce;
    }
/* .dashboardCss .topRowCard p.org {
  color: #ef9700;
}
.dashboardCss .topRowCard p.vio {
  color: #b358d9;
}
.dashboardCss .topRowCard p.blu {
  color: #007fef;
}
.dashboardCss .topRowCard p.grn {
  color: #009519;
} */

.dashboardCss .topRowCard .card-title.org {
    color: #ef9700;
}

.dashboardCss .topRowCard .card-title.vio {
    color: #b358d9;
}

.dashboardCss .topRowCard .card-title.blu {
    color: #007fef;
}

.dashboardCss .topRowCard .card-title.grn {
    color: #009519;
}


.dashboardCss .topRowCard h5 {
    font-size: 16px;
    color: #2d2d2d;
    font-weight: 600;
}

.dashboardCss .topRowCard p {
    font-size: 15px;
    font-weight: 500;
    color: #2d2d2d;
}

.dashboardCss .topRowCard .viewDetailLink {
    font-size: 14px;
    color: #707070;
    font-weight: 400;
}

.dashboardCss .goldRateDiv h5 {
    font-size: 18px;
    font-weight: 600;
    line-height: 20px;
    color: #2d2d2d;
}

.dashboardCss .goldRateDiv .colSplt {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 12px;
    margin-top: 22px;
}

    .dashboardCss .goldRateDiv .colSplt .cardSEc {
        padding: 14px 17px;
        border-radius: 5px;
    }

        .dashboardCss .goldRateDiv .colSplt .cardSEc.bluesh {
            background-color: #ebf7f9;
        }

            .dashboardCss .goldRateDiv .colSplt .cardSEc.bluesh h4 {
                color: #39b2c1;
            }

        .dashboardCss .goldRateDiv .colSplt .cardSEc.org {
            background-color: #fef4e5;
        }

            .dashboardCss .goldRateDiv .colSplt .cardSEc.org h4 {
                color: #ef9700;
            }

        .dashboardCss .goldRateDiv .colSplt .cardSEc h4 {
            font-size: 24px;
            font-weight: 600;
            line-height: 24px;
        }

        .dashboardCss .goldRateDiv .colSplt .cardSEc p {
            font-size: 16px;
            color: #2d2d2d;
            font-weight: 600;
            margin: 0 0 5px;
        }

        .dashboardCss .goldRateDiv .colSplt .cardSEc .purity {
            font-size: 14px;
            color: #2d2d2d;
            font-weight: 600;
        }

.dashboardCss .chart-container {
    position: relative;
    /* max-width: 800px; */
    /* margin: auto; */
    margin-top: 33px;
}

    .dashboardCss .chart-container canvas {
        height: 223px !important;
    }

.dashboardCss .mainProgressBar h5 {
    font-size: 18px;
    color: #2d2d2d;
    font-weight: 600;
    line-height: 24px;
}

.dashboardCss .mainProgressBar small {
    font-size: 14px;
    color: #a8a8a8;
    font-weight: 400;
    line-height: 19px;
}

.dashboardCss .mainProgressBar h6 {
    font-size: 14px;
    color: #2d2d2d;
    font-weight: 500;
    line-height: 16px;
}

.dashboardCss .mainProgressBar .widget-nav-tabs::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    margin-left: 5px;
    left: 5px;
}

.dashboardCss .mainProgressBar .widget-nav-tabs::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.dashboardCss .mainProgressBar .widget-nav-tabs::-webkit-scrollbar-thumb {
    background: #c1c1c1;
}

.dashboardCss .goldRateLst h5 {
    font-size: 18px;
    color: #2d2d2d;
    font-weight: 600;
    line-height: 24px;
}

.dashboardCss .goldRateLst small {
    font-size: 14px;
    color: #a8a8a8;
    font-weight: 400;
    line-height: 19px;
}

.dashboardCss .chart-statisticsChart {
    padding: 37px 0 41px;
}

    .dashboardCss .chart-statisticsChart svg {
        padding: 37px 0 41px;
    }

.dashboardCss .goldRateLst h3 {
    font-size: 20px;
    color: #2d2d2d;
    font-weight: 600;
    line-height: 22px;
    margin-bottom: 15px;
}

.dashboardCss .goldRateLst span {
    font-size: 14px;
    color: #2d2d2d;
    font-weight: 400;
    line-height: 16px;
    height: 27px;
    padding: 2px 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    color: #009519;
    background-color: #e5f4e7;
}

.uploadAreaSec {
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
    flex-direction: column;
    justify-content: center;
}

    .uploadAreaSec input[type="file"] {
        cursor: pointer;
        font-size: 100px;
        height: 100%;
        filter: alpha(opacity=1);
        -moz-opacity: 0.01;
        opacity: 0.01;
        position: absolute;
        right: 0;
        top: 0;
    }

.commnBtnExpt {
    color: #707070;
    background-color: #f1f1f1;
}

.cstmGrnBtn {
    font-size: 12px;
    font-weight: 400;
    color: #168973;
    background-color: #e7f3f1;
    height: 28px;
    border-radius: 4px;
    padding: 2px 9px;
    line-height: initial;
}

    .cstmGrnBtn:hover {
        color: #168973 !important;
        background-color: #e0eeec !important;
    }

    .cstmGrnBtn i {
        font-size: 18px;
        margin-right: 4px;
    }

    .cstmGrnBtn.cstmGrnBtn2 {
        height: 36px;
    }

        .cstmGrnBtn.cstmGrnBtn2.cstmGrnBtn2Clr {
            color: #168973;
            background-color: #F9F9F9;
        }

.spclBox {
    background-color: #f9f9f9;
}

    .spclBox .textValue {
        background-color: #f9f9f9;
        margin-right: 16px;
        font-size: 16px;
        font-weight: 600;
    }

    .spclBox .form-control {
        font-size: 16px;
        font-weight: 600;
    }

    .spclBox label {
        font-size: 14px;
        font-weight: 600;
        color: #434343;
    }

.light-style
.invMagTable
.select2-container--default
.select2-selection--single {
    background-color: #ffffff;
    border-color: #ffffff;
}

.invMagTable .form-control:disabled {
    background-color: #ffffff;
    border-color: #ffffff;
}

.tableMinHgt {
    min-height: 400px;
}

.pdfviewer iframe {
    min-height: 700px;
}

.form-select {
    color: #434343;
}

.cstmRgtModal {
    height: calc((100vh) - 127px);
    overflow: auto;
}

    .cstmRgtModal::-webkit-scrollbar {
        height: 4px;
        width: 4px;
        margin-top: 5px;
        top: 5px;
    }

    .cstmRgtModal::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .cstmRgtModal::-webkit-scrollbar-thumb {
        background: #c1c1c1;
    }

.cmnLeftTab .nav-pills {
    background-color: #ffffff;
    box-shadow: 0 0.25rem 1.125rem rgba(75, 70, 92, 0.1);
    min-width: 324px;
    border-radius: 8px;
    max-height: calc((100vh) - 250px);
    overflow-y: auto;
    display: block;
    overflow-x: hidden;
}

    .cmnLeftTab .nav-pills::-webkit-scrollbar {
        height: 4px;
        width: 4px;
        margin-top: 5px;
        top: 5px;
    }

    .cmnLeftTab .nav-pills::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .cmnLeftTab .nav-pills::-webkit-scrollbar-thumb {
        background: #c1c1c1;
    }

    .cmnLeftTab .nav-pills .nav-item {
        font-size: 16px;
        font-weight: 600;
        color: #434343;
    }

        .cmnLeftTab .nav-pills .nav-item .nav-link {
            box-shadow: none;
            border-radius: 0;
            padding: 14px 16px;
            min-height: 47px;
        }

            .cmnLeftTab .nav-pills .nav-item .nav-link.active {
                color: #107562;
                background-color: #e4ede4;
            }

.cmnLeftTab .tab-content .tab-pane .title {
    font-size: 18px;
    font-weight: 600;
    color: #434343;
    margin-bottom: 30px;
}

    .cmnLeftTab .tab-content .tab-pane .title i {
        font-size: 24px;
        color: #107562;
    }

.cmnLeftTab .tab-content .tab-pane .listSec {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 20px;
    grid-row-gap: 0;
    justify-content: space-between;
}

    .cmnLeftTab .tab-content .tab-pane .listSec .list {
        font-size: 14px;
        font-weight: 500;
        color: #434343;
        max-width: 367px;
        padding: 14px 0;
        border-bottom: 1px dashed #dddddd;
    }

        .cmnLeftTab .tab-content .tab-pane .listSec .list i {
            font-size: 19px;
            color: #a5a5a5;
        }

.cmnLeftAcco {
    display: none;
}

    .cmnLeftAcco .accordion-collapse .accordion-body {
        border-top: 1px solid #dddddd;
        padding-top: 18px;
    }

        .cmnLeftAcco .accordion-collapse .accordion-body .listSec {
            display: grid;
            grid-template-columns: 1fr 1fr;
            grid-gap: 20px;
            grid-row-gap: 0;
            justify-content: space-between;
        }

            .cmnLeftAcco .accordion-collapse .accordion-body .listSec .list {
                font-size: 14px;
                font-weight: 500;
                color: #434343;
                max-width: 367px;
                padding: 10px 0;
                border-bottom: 1px dashed #dddddd;
            }

                .cmnLeftAcco .accordion-collapse .accordion-body .listSec .list i {
                    font-size: 19px;
                    color: #a5a5a5;
                }

        .cmnLeftAcco .accordion-collapse .accordion-body .title {
            font-size: 18px;
            font-weight: 600;
            color: #434343;
            margin-bottom: 10px;
        }

            .cmnLeftAcco .accordion-collapse .accordion-body .title i {
                font-size: 24px;
                color: #107562;
            }

    .cmnLeftAcco .accordion-item .accordion-button {
        font-size: 16px;
        font-weight: 600;
        color: #434343;
    }

    .cmnLeftAcco .accordion-item.active .accordion-button {
        color: #107562;
    }

.spinnerPos {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.reportSubMenuTop {
    flex-direction: column;
    height: auto;
    padding: 4px 0 !important;
}

    .reportSubMenuTop .navbar-nav-right {
        width: 100%;
        padding: 0 1.5rem;
    }

    .reportSubMenuTop .cmnSubmenuTop {
        width: 100%;
        border-top: 1px solid #eeeeee;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .reportSubMenuTop .hndBrIcn {
        width: 44px;
        height: 36px;
        border-radius: 4px;
        padding: 0;
        border: none;
    }

        .reportSubMenuTop .hndBrIcn::after {
            display: none;
        }

    .reportSubMenuTop .innerHndBr {
        border-right: 1px solid #dddddd;
        padding: 8px 28px 8px 12px;
        width: 84px;
        margin-top: 4px;
    }

        .reportSubMenuTop .innerHndBr .dropdown-menu {
            width: 340px;
            padding: 20px;
            border-radius: 4px;
        }

            .reportSubMenuTop .innerHndBr .dropdown-menu li .searchSec {
                margin-bottom: 12px;
            }

                .reportSubMenuTop .innerHndBr .dropdown-menu li .searchSec .form-control {
                    height: 44px;
                    border-radius: 4px;
                    padding: 4px 29px 4px 38px;
                }

                .reportSubMenuTop .innerHndBr .dropdown-menu li .searchSec .searchIcn {
                    position: absolute;
                    top: 30px;
                    left: 34px;
                    pointer-events: none;
                }

                    .reportSubMenuTop .innerHndBr .dropdown-menu li .searchSec .searchIcn i {
                        font-size: 20px;
                        color: #707070;
                    }

                .reportSubMenuTop .innerHndBr .dropdown-menu li .searchSec .closeIcn {
                    position: absolute;
                    top: 30px;
                    right: 30px;
                    cursor: pointer;
                }

                    .reportSubMenuTop .innerHndBr .dropdown-menu li .searchSec .closeIcn i {
                        font-size: 14px;
                        color: #707070;
                    }

            .reportSubMenuTop .innerHndBr .dropdown-menu li ul {
                padding: 0;
            }

                .reportSubMenuTop .innerHndBr .dropdown-menu li ul span {
                    font-size: 16px;
                    font-weight: 600;
                    color: #434343;
                    padding-bottom: 30px;
                }

                .reportSubMenuTop .innerHndBr .dropdown-menu li ul li {
                    list-style: none;
                }

                    .reportSubMenuTop .innerHndBr .dropdown-menu li ul li a {
                        font-size: 14px;
                        font-weight: 500;
                        color: #434343;
                        padding-left: 11px;
                    }

    .reportSubMenuTop .dateDropSec {
        margin-left: 18px;
        margin-top: 4px;
    }

        .reportSubMenuTop .dateDropSec .dropdown-menu {
            width: 222px;
        }

            .reportSubMenuTop .dateDropSec .dropdown-menu li a {
                font-size: 12px;
                font-weight: 500;
                color: #434343;
                padding-left: 5px;
            }

        .reportSubMenuTop .dateDropSec .btn {
            height: 36px;
            border-radius: 4px;
            border: 1px solid #dddddd !important;
            padding: 9px 10px;
            font-size: 12px;
            font-weight: 500;
            color: #434343;
            line-height: normal;
            min-width: 143px;
            justify-content: flex-start;
        }

            .reportSubMenuTop .dateDropSec .btn::after {
                display: none;
            }

        .reportSubMenuTop .dateDropSec .dropdown-menu li .dateSec {
            padding: 13px 13px 0;
            border-top: 1px solid #e6e6e6;
        }

            .reportSubMenuTop .dateDropSec .dropdown-menu li .dateSec .form-control {
                padding-left: 38px;
            }

        .reportSubMenuTop .dateDropSec .dropdown-menu .col-form-label {
            font-size: 12px;
            font-weight: 500;
            color: #434343;
        }

        .reportSubMenuTop .dateDropSec .dropdown-menu .form-control {
            font-size: 12px;
            font-weight: 500;
            color: #434343;
        }

        .reportSubMenuTop .dateDropSec .dropdown-menu .saveBtn {
            font-size: 12px;
            font-weight: 600;
            color: #fafafa;
            background-color: #107562;
            width: 100%;
            justify-content: center;
            margin-top: 8px;
        }

        .reportSubMenuTop .dateDropSec .dropdown-menu li .dateSec .searchFld {
            position: relative;
        }

            .reportSubMenuTop .dateDropSec .dropdown-menu li .dateSec .searchFld i {
                position: absolute;
                top: 6px;
                left: 24px;
            }

    .reportSubMenuTop .cmnSubmenuTop .dreportDiv {
        font-size: 14px;
        font-weight: 400;
        color: #107562;
        margin-left: 16px;
    }

        .reportSubMenuTop .cmnSubmenuTop .dreportDiv i {
            font-size: 24px;
        }

    .reportSubMenuTop .cmnSubmenuTop .printSec {
        margin-right: 6px;
    }

        .reportSubMenuTop .cmnSubmenuTop .printSec .printHead {
            width: 79px;
            height: 36px;
            border-radius: 4px;
            border: 1px solid #dddddd;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

            .reportSubMenuTop .cmnSubmenuTop .printSec .printHead .icn {
                padding: 6px 12px 6px 14px;
                border-right: 1px solid #c5c5c5;
            }

            .reportSubMenuTop .cmnSubmenuTop .printSec .printHead .arrowSec {
                padding: 6px 8px 6px 10px;
            }

    .reportSubMenuTop .cmnSubmenuTop .exportSec {
        margin-right: 24px;
    }

        .reportSubMenuTop .cmnSubmenuTop .exportSec .exportHead {
            width: 104px;
            height: 36px;
            border-radius: 4px;
            border: 1px solid #dddddd;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

            .reportSubMenuTop .cmnSubmenuTop .exportSec .exportHead .text {
                padding: 10px 10px 10px 12px;
                font-size: 14px;
                font-weight: 400;
                color: #707070;
            }

            .reportSubMenuTop .cmnSubmenuTop .exportSec .exportHead .arrowSec {
                padding: 6px 10px 6px 0px;
            }

.content-wrapperspc {
    margin-top: 59px;
}

.reportSubMenuTop .cmnSubmenuTop h4 {
    font-size: 16px;
    font-weight: 600;
    color: #434343;
    margin-left: 19px;
    margin-bottom: 0;
    margin-top: 4px;
}

.reportSubMenuTop .cmnSubmenuTop .close {
    font-size: 25px;
    color: #707070;
    margin-right: 25px;
    cursor: pointer;
}

.reportSubMenuTop .cmnSubmenuTopCntViw {
    border-top: 1px solid #eeeeee;
    width: 100%;
}

    .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftTab .nav-pills {
        min-width: 243px;
        border-radius: 0;
        background-color: #fafafa;
        box-shadow: none;
        /* min-height: 698px; */
    }

        .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftTab .nav-pills .nav-item {
            font-size: 16px;
            font-weight: 400;
            color: #434343;
        }

            .reportSubMenuTop
            .cmnSubmenuTopCntViw
            .cmnLeftTab
            .nav-pills
            .nav-item
            .nav-link {
                min-height: 60px;
            }

                .reportSubMenuTop
                .cmnSubmenuTopCntViw
                .cmnLeftTab
                .nav-pills
                .nav-item
                .nav-link.active {
                    color: #107562;
                    background-color: #ffffff;
                    border-right: 4px solid #107562;
                }

    .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftTab .tab-content {
        box-shadow: none;
    }

        .reportSubMenuTop
        .cmnSubmenuTopCntViw
        .cmnLeftTab
        .tab-content
        .tab-pane
        .dropSEc {
            max-width: 427px;
            display: flex;
            flex-direction: column;
        }

            .reportSubMenuTop
            .cmnSubmenuTopCntViw
            .cmnLeftTab
            .tab-content
            .tab-pane
            .dropSEc
            .dateDropSec {
                margin-left: 0px;
            }

            .reportSubMenuTop
            .cmnSubmenuTopCntViw
            .cmnLeftTab
            .tab-content
            .tab-pane
            .dropSEc
            .form-label {
                font-size: 14px;
                font-weight: 500;
                color: #2d2d2d;
            }

            .reportSubMenuTop
            .cmnSubmenuTopCntViw
            .cmnLeftTab
            .tab-content
            .tab-pane
            .dropSEc
            .dropdown-toggle {
                height: 38px;
            }

            .reportSubMenuTop
            .cmnSubmenuTopCntViw
            .cmnLeftTab
            .tab-content
            .tab-pane
            .dropSEc
            .dateDropSec
            .dropdown-menu {
                width: 100%;
            }

            .reportSubMenuTop
            .cmnSubmenuTopCntViw
            .cmnLeftTab
            .tab-content
            .tab-pane
            .dropSEc
            .dateDropSec
            .dwnArrow {
                position: absolute;
                right: 10px;
                top: 5px;
            }

        .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftTab .tab-content .tab-pane hr {
            height: 1px;
            background-color: #eeeeee;
            width: 100%;
            margin: 32px 0;
        }

    .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftAcco {
        padding: 0 20px;
        margin-bottom: 20px;
    }

        .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftAcco .dropSEc {
            max-width: 427px;
            display: flex;
            flex-direction: column;
        }

            .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftAcco .dropSEc .dateDropSec {
                margin-left: 0px;
            }

            .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftAcco .dropSEc .form-label {
                font-size: 14px;
                font-weight: 500;
                color: #2d2d2d;
            }

            .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftAcco .dropSEc .dropdown-toggle {
                height: 38px;
            }

            .reportSubMenuTop
            .cmnSubmenuTopCntViw
            .cmnLeftAcco
            .dropSEc
            .dateDropSec
            .dropdown-menu {
                width: 100%;
            }

            .reportSubMenuTop
            .cmnSubmenuTopCntViw
            .cmnLeftAcco
            .dropSEc
            .dateDropSec
            .dwnArrow {
                position: absolute;
                right: 10px;
                top: 5px;
            }

        .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftAcco .tab-content .tab-pane hr {
            height: 1px;
            background-color: #eeeeee;
            width: 100%;
            margin: 32px 0;
        }

.dropTopHeadMd2Mda {
    display: none;
    flex-direction: column;
}

.dropdown-menuMedia {
    overflow: initial !important;
}

.dropTopHeadMdVsble {
    display: none;
}

.mouBox .col-form-label {
    font-size: 14px;
    font-weight: 500;
    color: #2d2d2d;
    display: flex;
    justify-content: space-between;
}

    .mouBox .col-form-label.clr707070 {
        color: #707070 !important;
    }

.mouBox .textValue {
    font-size: 14px;
    font-weight: 600;
    color: #2d2d2d !important;
}
/* .reportSubMenuTop .cmnSubmenuTopCntViw .cmnLeftAcco .accordion-item.active{
box-shadow: none;
} */
.mouCreationVerifyAadhaarNumber .adhrNumVerySEcBdr {
    padding: 2px 0;
    border-top: 1px solid #c5c5c5;
    border-bottom: 1px solid #c5c5c5;
}

    .mouCreationVerifyAadhaarNumber .adhrNumVerySEcBdr .adhrNumVerySEc {
        background-color: #e4ede4;
        padding: 28px;
        width: 100%;
        text-align: center;
        position: relative;
        font-size: 16px;
        font-weight: 400;
        color: #434343;
        display: block;
    }

        .mouCreationVerifyAadhaarNumber
        .adhrNumVerySEcBdr
        .adhrNumVerySEc
        .invalid-OTP {
            font-size: 16px;
            font-weight: 400;
            color: #c60608;
            display: flex;
            align-items: center;
            justify-content: center;
            max-width: 334px;
            width: 100%;
            border-radius: 8px;
            height: 49px;
            margin-bottom: 24px;
            background-color: #ffffff;
            margin-left: auto;
            margin-right: auto;
        }

            .mouCreationVerifyAadhaarNumber
            .adhrNumVerySEcBdr
            .adhrNumVerySEc
            .invalid-OTP
            i {
                font-size: 19px;
                color: #c60608;
                margin-right: 7px;
            }

        .mouCreationVerifyAadhaarNumber .adhrNumVerySEcBdr .adhrNumVerySEc .editIcn {
            position: absolute;
            right: 14px;
            top: 14px;
            cursor: pointer;
        }

            .mouCreationVerifyAadhaarNumber .adhrNumVerySEcBdr .adhrNumVerySEc .editIcn i {
                font-size: 24px;
                color: #107562;
            }

        .mouCreationVerifyAadhaarNumber
        .adhrNumVerySEcBdr
        .adhrNumVerySEc
        .form-control {
            text-align: center;
            border: none;
            background-color: transparent;
            font-size: 37px;
            font-weight: 500;
            color: #2d2d2d;
            padding: 0;
            line-height: normal;
            margin-top: 12px;
        }

.mouCreationVerifyAadhaarNumber .adhrNumVerySecBtnSec {
    margin-top: 20px;
    padding: 0;
    flex-wrap: wrap;
}

    .mouCreationVerifyAadhaarNumber .adhrNumVerySecBtnSec a {
        font-size: 14px;
        font-weight: 400;
        color: #107562;
        text-decoration: underline;
    }

        .mouCreationVerifyAadhaarNumber .adhrNumVerySecBtnSec a span {
            font-size: 14px;
            font-weight: 400;
            color: #107562;
            text-decoration: underline;
        }

    .mouCreationVerifyAadhaarNumber .adhrNumVerySecBtnSec .adhrNumVerySecOtp {
        color: #434343;
        text-decoration: none;
    }

        .mouCreationVerifyAadhaarNumber .adhrNumVerySecBtnSec .adhrNumVerySecOtp span {
            font-weight: 600;
            color: #107562;
            text-decoration: none;
        }

.mouCreationVerifyAadhaarNumber .adhrNumVerySEcBdr .adhrNumVeryOtpSEc {
    padding: 18px;
    width: 100%;
    text-align: center;
    position: relative;
    font-size: 16px;
    font-weight: 400;
    color: #434343;
    display: block;
}

    .mouCreationVerifyAadhaarNumber
    .adhrNumVerySEcBdr
    .adhrNumVeryOtpSEc
    .otpInputSec {
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .mouCreationVerifyAadhaarNumber
        .adhrNumVerySEcBdr
        .adhrNumVeryOtpSEc
        .otpInputSec
        .form-control {
            width: 60px;
            height: 60px;
            border: 1px solid #dddddd;
            margin: 18px 12px 0;
            text-align: center;
            padding: 14px;
            font-size: 37px;
            font-weight: 400;
            color: #a5a5a5;
        }

    .mouCreationVerifyAadhaarNumber
    .adhrNumVerySEcBdr
    .adhrNumVeryOtpSEc
    .invalid-OTP {
        font-size: 16px;
        font-weight: 400;
        color: #c60608;
        display: flex;
        align-items: center;
        justify-content: center;
        max-width: 334px;
        width: 100%;
        border-radius: 8px;
        height: 49px;
        margin-bottom: 24px;
        background-color: #f9e5e5;
        margin-left: auto;
        margin-right: auto;
    }

        .mouCreationVerifyAadhaarNumber
        .adhrNumVerySEcBdr
        .adhrNumVeryOtpSEc
        .invalid-OTP
        i {
            font-size: 19px;
            color: #c60608;
            margin-right: 7px;
        }

.mouCreationVerifyAadhaarData .subTitleArea {
    background-color: #f9f9f9;
    padding: 14px 24px;
    display: grid;
    grid-template-columns: 1fr 72px 1fr;
    grid-gap: 10px;
}

    .mouCreationVerifyAadhaarData .subTitleArea .subTitle {
        font-size: 18px;
        font-weight: 500;
        color: #2d2d2d;
    }

.mouCreationVerifyAadhaarData .colSplit {
    display: grid;
    grid-template-columns: 1fr 72px 1fr;
}

    .mouCreationVerifyAadhaarData .colSplit .colSplistSec {
        padding-top: 16px;
    }

    .mouCreationVerifyAadhaarData .colSplit .iconDiv {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
    }

        .mouCreationVerifyAadhaarData .colSplit .iconDiv .iconDivSec {
            width: 32px;
            height: 32px;
            border-radius: 4px;
            display: flex;
            align-items: center;
            justify-content: center;
            background-color: #fff;
            top: 18px;
            position: relative;
            z-index: 1;
            -webkit-box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.17);
            -moz-box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.17);
            box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.17);
            cursor: pointer;
        }

            .mouCreationVerifyAadhaarData .colSplit .iconDiv .iconDivSec i {
                font-size: 20px;
                color: #6A961F;
            }

        .mouCreationVerifyAadhaarData .colSplit .iconDiv::after {
            position: absolute;
            content: "";
            left: 0;
            right: 0;
            top: 0;
            margin: auto;
            width: 1px;
            height: 100%;
            background-color: #dddddd;
        }

    .mouCreationVerifyAadhaarData .colSplit:first-child .iconDiv::after {
        top: 16px;
    }

    .mouCreationVerifyAadhaarData .colSplit .form-control:disabled {
        background-color: #fafafa;
    }

    .mouCreationVerifyAadhaarData .colSplit .iconDiv .iconDivSec span {
        height: 30px;
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 2px 8px;
        position: absolute;
        right: 0;
        bottom: 40px;
        font-size: 12px;
        font-weight: 400;
        color: #f6f6f6;
        background-color: #707070;
        width: max-content;
        opacity: 0;
        pointer-events: none;
        transition: ease-in-out 0.4s;
        -webkit-box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.3);
        -moz-box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.3);
        box-shadow: 0px 0px 11px 0px rgba(0, 0, 0, 0.3);
    }

    .mouCreationVerifyAadhaarData .colSplit .iconDiv .iconDivSec:hover span {
        opacity: 1;
        pointer-events: all;
    }

    .mouCreationVerifyAadhaarData .colSplit .iconDiv .iconDivSec span:after {
        position: absolute;
        bottom: -4px;
        right: 12px;
        content: "";
        background: #707070;
        height: 10px;
        width: 10px;
        transform: rotate(45deg);
        border-bottom: 1px solid #707070;
        border-right: 1px solid #707070;
        box-shadow: 0 0px 10px #707070;
    }

.esign {
    font-size: 14px;
    font-weight: 500;
    width: 103px;
    height: 36px;
}

    .esign:hover {
        color: #ffffff !important;
        background-color: #107562 !important;
    }

.esignedModal .modal-content {
    padding: 24px 32px;
}

    .esignedModal .modal-content .modal-body {
        padding: 0;
    }

        .esignedModal .modal-content .modal-body h3 {
            font-size: 20px;
            font-weight: 500;
            line-height: normal;
            color: #2d2d2d;
            text-align: left;
            padding-bottom: 15px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            width: 57%;
        }

        .esignedModal .modal-content .modal-body hr {
            background-color: #dddddd;
            width: 100%;
            margin: 0 0 24px;
        }

        .esignedModal .modal-content .modal-body .btn-close {
            right: -23px;
            top: -13px;
        }

        .esignedModal .modal-content .modal-body span {
            font-size: 16px;
            font-weight: 400;
            color: #434343;
            float: right;
            margin-top: 8px;
        }

        .esignedModal .modal-content .modal-body .cntARea {
            background-color: #f9f9f9;
            border-radius: 6px;
            border: 1px solid #dddddd;
            min-height: 614px;
        }

.mobSubSecCmndiv {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
}

/* css for report5 */

.reportList5 {
    /* display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px; */

    max-width: 1344px;
    margin: 0 auto;
    column-count: 3;
}

    .reportList5 .listItem .head {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .reportList5 .listItem {
        /* display: flex;
  align-items: start;
  flex-direction: column;
  width: 33%; */
        break-inside: avoid;
        margin-bottom: 16px;
    }

        .reportList5 .listItem .head .svg {
            display: flex;
            align-items: center;
        }

        .reportList5 .listItem .head .headLab {
            font-size: 16px;
            color: #434343;
            font-weight: 600;
        }

        .reportList5 .listItem ul {
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            align-items: self-start;
            margin-bottom: 8px;
            flex-direction: column;
        }

            .reportList5 .listItem ul li {
                font-size: 14px;
                font-weight: 400;
                padding: 10px 25px 0px;
                color: #434343;
            }

                .reportList5 .listItem ul li a {
                    color: #434343;
                }

                    .reportList5 .listItem ul li a:hover {
                        color: #6A961F;
                    }

.tabViewreportList {
    display: none;
}

.lapViewreportList {
    display: block;
}

.rightSecDrop.dashrightSecDropGrp {
    font-size: 14px;
    font-weight: 500;
    color: #09590E;
}

    .rightSecDrop.dashrightSecDropGrp .dropValue {
        font-size: 14px;
        font-weight: 500;
        color: #2D2D2D;
        min-width: 53px;
        background-color: transparent;
        padding-right: 0;
        padding-top: 0;
    }

.carIcnList {
    height: 36px;
    width: 88px;
    min-width: 88px;
    border-radius: 4px;
    background-color: #ffffff;
    border: 1px solid #dddddd;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .carIcnList ul {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 0;
        padding: 0;
    }

        .carIcnList ul li {
            list-style: none;
            border-right: 1px solid #dddddd;
            padding-right: 11px;
            margin-right: 11px;
            cursor: pointer;
        }

            .carIcnList ul li:last-child {
                border-right: none;
                padding-right: 0;
                margin-right: 0;
            }

            .carIcnList ul li.active svg path {
                fill: #107562;
            }

.dashboardInnerCardSec {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 24px;
}

    .dashboardInnerCardSec .cardlist {
        background-color: #ffffff;
        padding: 20px 24px;
        border-radius: 8px;
        border: 1px solid #EEEEEE;
    }

        .dashboardInnerCardSec .cardlist .title {
            font-size: 18px;
            font-weight: 600;
            color: #2D2D2D;
            margin-bottom: 9px;
        }

        .dashboardInnerCardSec .cardlist p {
            font-size: 12px;
            font-weight: 400;
            line-height: 14px;
            color: #2D2D2D;
            margin: 0 0 23px;
            max-width: 239px;
            min-height: 42px;
        }

        .dashboardInnerCardSec .cardlist .priceSec {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

            .dashboardInnerCardSec .cardlist .priceSec .num {
                font-size: 18px;
                font-weight: 500;
                color: #09590E;
            }

            .dashboardInnerCardSec .cardlist .priceSec a {
                font-size: 12px;
                font-weight: 400;
                line-height: 14px;
                color: #707070;
                text-decoration: underline;
            }

.dashboardInnerCardListTable {
    background-color: #ffffff;
    padding: 0 24px 39px;
    border-radius: 8px;
}

    .dashboardInnerCardListTable .tableHead {
        display: grid;
        /* grid-template-columns: 107px 269px 1fr 308px 172px; */
        grid-template-columns: 107px 269px 1fr 308px;
        padding: 24px 0 12px;
    }

        .dashboardInnerCardListTable .tableHead .headTitle {
            font-size: 16px;
            font-weight: 500;
            color: #2D2D2D;
            padding-left: 40px;
        }

    .dashboardInnerCardListTable .tableBody .tableBodyListSec {
        display: grid;
        /* grid-template-columns: 107px 269px 1fr 308px 172px; */
        grid-template-columns: 107px 269px 1fr 308px;
        border-radius: 8px;
        border: 1px solid #DDDDDD;
        align-items: center;
        margin-bottom: 6px;
        width: 100%;
    }

    .dashboardInnerCardListTable .tableBody .tableBodyList {
        font-size: 16px;
        font-weight: 500;
        color: #2D2D2D;
        padding: 8px 0 8px 40px;
    }

    .dashboardInnerCardListTable .tableBody .tableBodyListSec .tableBodyList a {
        opacity: 0;
        pointer-events: none;
        font-size: 14px;
        font-weight: 400;
        color: #2D2D2D;
        text-decoration: underline;
        transition: ease-in-out 0.4s;
    }

    .dashboardInnerCardListTable .tableBody .tableBodyListSec:hover .tableBodyList a {
        opacity: 1;
        pointer-events: all;
    }

    .dashboardInnerCardListTable .tableBody .tableBodyListSec .tableBodyList.num {
        color: #09590E;
    }

.dashboardInnerCardListTablescrl {
    overflow-x: auto;
}

    .dashboardInnerCardListTablescrl::-webkit-scrollbar {
        height: 8px;
        margin-top: 5px;
        top: 5px;
    }

    .dashboardInnerCardListTablescrl::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .dashboardInnerCardListTablescrl::-webkit-scrollbar-thumb {
        background: #c1c1c1;
    }

.barCodeDiv {
    border: 1px solid #dbdade;
    border-radius: 8px;
    padding: 12px;
    text-align: center;
    max-width: 210px;
    width: fit-content;
}

    .barCodeDiv .code {
        font-family: "Libre Barcode 128", system-ui;
        font-weight: 400;
        font-size: 64px;
        line-height: 65px;
        color: #2d2d2d;
        margin-bottom: -13px;
    }

    .barCodeDiv .codeNumber {
        font-size: 16px;
        font-weight: 700;
        color: #2d2d2d;
        line-height: normal;
        margin-bottom: 4px;
    }

    .barCodeDiv .title {
        font-size: 15px;
        font-weight: 600;
        color: #707070;
        line-height: normal;
        margin-bottom: 11px;
    }

    .barCodeDiv ul {
        margin: 0;
        padding: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
    }

        .barCodeDiv ul li {
            font-size: 14px;
            font-weight: 700;
            color: #707070;
            line-height: normal;
            list-style: none;
            display: flex;
            align-items: center;
            margin-right: 15px;
            margin-bottom: 6px;
        }

            .barCodeDiv ul li:last-child {
                margin-right: 0px;
            }

.cancelTransPop {
    max-width: 840px;
}

    .cancelTransPop .modal-content {
        padding: 20px 24px 32px;
    }

        .cancelTransPop .modal-content .modal-body {
            padding: 0;
        }

            .cancelTransPop .modal-content .modal-body h3 {
                font-size: 20px;
                font-weight: 600;
                line-height: 24px;
                color: #2D2D2D;
                padding: 8px 0 0;
            }

            .cancelTransPop .modal-content .modal-body .cntArea .icnSec {
                background-color: #F9F9F9;
                border-radius: 8px;
                padding: 16px;
                display: grid;
                grid-template-columns: 1fr 1fr;
                grid-gap: 16px;
                margin: 21px 0 16px;
            }

                .cancelTransPop .modal-content .modal-body .cntArea .icnSec .icnCard {
                    display: grid;
                    grid-template-columns: 40px 1fr;
                }

                    .cancelTransPop .modal-content .modal-body .cntArea .icnSec .icnCard .icn {
                        font-size: 24px;
                        color: #707070;
                        background-color: #EEEEEE;
                        border-radius: 4px;
                        width: 40px;
                        height: 40px;
                        display: flex;
                        align-items: center;
                        justify-content: center;
                    }

                    .cancelTransPop .modal-content .modal-body .cntArea .icnSec .icnCard .textARea {
                        font-size: 14px;
                        font-weight: 400;
                        line-height: 16px;
                        color: #2D2D2D;
                        margin-left: 12px;
                    }

                        .cancelTransPop .modal-content .modal-body .cntArea .icnSec .icnCard .textARea span {
                            font-size: 16px;
                            font-weight: 500;
                            line-height: 19px;
                            display: block;
                            margin-top: 6px;
                        }

                            .cancelTransPop .modal-content .modal-body .cntArea .icnSec .icnCard .textARea span.grn {
                                color: #107562;
                            }

            .cancelTransPop .modal-content .modal-body .cntArea .form-label {
                font-size: 16px;
                font-weight: 500;
                color: #2D2D2D;
            }

.printViewSecMain {
    zoom: .7;
    padding-top: 24px;
}

.printViewSecMainPar::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    margin-left: 5px;
    left: 5px;
}

.printViewSecMainPar::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.printViewSecMainPar::-webkit-scrollbar-thumb {
    background: #c1c1c1;
}

.expant {
    position: absolute;
    right: 10px;
    cursor: pointer;
}

.app-brand {
    max-width: 230px;
    width: 100%;
}

    .app-brand img {
        width: 100%;
    }

.mdaSettingDrop {
    box-shadow: 0 0.25rem 1rem rgba(165, 163, 174, 0.45);
    background-color: #fff;
    border-radius: 4px;
    top: 40px;
    position: absolute;
    width: max-content;
    right: 0;
    min-width: 200px;
    opacity: 0;
    pointer-events: none;
}

    .mdaSettingDrop.show {
        opacity: 1;
        pointer-events: all;
        top: 45px;
    }

.dropShowDiv {
    display: none;
}

.bdySelect2cls {
    overflow: hidden;
    overflow-y: auto;
}

    .bdySelect2cls .select2-dropdown {
        z-index: 9999 !important;
    }

.borderDivActual .col-form-label.text-danger {
    color: rgba(var(--bs-danger-rgb), var(--bs-text-opacity)) !important;
}

.form-label {
    font-size: 14px;
    font-weight: 500;
    color: #2D2D2D;
    line-height: 16px;
    margin-bottom: 7px;
}

.actualLabel .form-select {
    font-size: 12px;
    font-weight: 500;
    color: #434343;
}

.actualLabel .subTitleHead {
    font-size: 16px;
    color: #2d2d2d;
    position: relative;
}

.light-style .dropzone {
    border: 1px dashed #AFAFAF !important;
    border-radius: 4px;
}

.light-style .dz-message .note {
    font-weight: 500;
    color: #2d2d2d !important;
}

    .light-style .dz-message .note i {
        color: #808080 !important;
    }


.menu-vertical .menu-inner::-webkit-scrollbar {
    width: 4px;
    height: 4px;
    margin-left: 5px;
    left: 5px;
}

.menu-vertical .menu-inner::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.menu-vertical .menu-inner::-webkit-scrollbar-thumb {
    background: #c1c1c1;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    top: 24% !important;
}

.textDots {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}























@media only screen and (max-width: 767px) {
    .reportList5 {
        /* grid-template-columns: 1fr 1fr; */
    }

    .lapViewreportList {
        display: none !important;
    }

    .tabViewreportList {
        display: block !important;
    }

    .deoDashboardHead {
        flex-direction: column;
        align-items: flex-start !important;
        margin-bottom: 15px;
    }

        .deoDashboardHead .topHeadTitle {
            margin: 16px 0 6px;
        }

    .reportList5 {
        column-count: 2;
    }
}

@media only screen and (max-width: 1625px) {
    /* .mouTopListBar {
        grid-template-columns: 1fr 1fr 170px 360px;
    } */
    .dashboardCss .topRowCard {
        padding: 19px;
    }

    .dashboardCss .goldRateDiv {
        padding: 19px;
    }

    .dashboardCss .topRowCard p {
        font-size: 15px;
    }

    .dashboardCss .topRowCard h5 {
        font-size: 15px;
    }

    .dashboardCss .goldRateDiv .colSplt {
        margin-top: 14px;
    }
}

@media only screen and (max-width: 1450px) {

    .dropShowDiv {
        display: list-item;
    }

    .mouTopListBar {
        grid-template-columns: 1fr 1fr;
        grid-row-gap: 20px;
    }
        /* .mouTopListBar li:nth-last-child(2){
        border-right: none;
    } */
        .mouTopListBar li:last-child {
            border-right: 1px solid #dddddd;
        }
    /* .dropTopHeadMd2 {
    display: none !important; 
  } */
    .dropTopHeadMd2Mda {
        display: flex !important;
    }

        .dropTopHeadMd2Mda .rightSecDropGrp {
            width: 100%;
        }

    .rightSecDrop.rightSecDropGrp .dropValueListSec .dropValueList .listSEcArea {
        max-height: 150px;
    }

        .rightSecDrop.rightSecDropGrp
        .dropValueListSec
        .dropValueList
        .listSEcArea.listSEcArea2 {
            max-height: 232px;
        }

    .rightSecDrop.rightSecDropGrp .dropValueListSec {
        max-height: 519px;
    }

    .mouTopListBarLstUl {
        margin-left: 20px;
    }
}

@media only screen and (max-width: 1400px) {
    .salesinvoiceSpc {
        padding-right: 48px;
    }

    .salesinvoiceSpcInner {
        padding-right: 20px;
    }

    .sevNonMob {
        min-width: auto !important;
    }

    .mouTopListBarLstUl li {
        border: none !important;
    }

    .mouTopListBar li {
        padding-right: 10px;
    }

    .dashboardInnerCardSec {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .invoiceMainCntViewRgt .titleTop .leftSec .title {
        font-size: 20px;
    }
}

@media only screen and (max-width:1366px) {
    .printViewSecMain {
        width: 1100px;
    }

    .dashboardInnerCardListTable .tableBody .tableBodyListSec {
        width: fit-content;
        grid-template-columns: 107px 269px 1fr 218px;
    }

    .dashboardInnerCardListTable .tableHead {
        grid-template-columns: 107px 269px 1fr 218px;
    }
}

@media only screen and (max-width:1279px) {
    .custSearchDropDwnSales .custmDrop .table-responsive .dataTables_wrapper {
        max-width: 760px !important;
        width: 100%;
    }

    .rightSecDrop.rightSecDropGrp .dropValue {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        display: block;
        width: 145px;
    }
}

@media only screen and (max-width: 1199px) {
    .mouprevTable .prevTableList {
        grid-template-columns: 240px 1fr;
    }

    .mouTopListBar {
        grid-template-columns: 1fr 1fr;
    }
}

@media only screen and (max-width: 991px) {
    .custSearchDropDwnSales .custmDrop .table-responsive .dataTables_wrapper {
        max-width: 610px !important;
        width: 100%;
    }

    .mouprevTable .prevTableList {
        grid-template-columns: 210px 1fr;
    }

    .salesinvoiceSpc {
        padding-right: 15px;
    }

    .salesinvoiceSpcInner {
        padding-right: 0px;
    }

    .bs-stepper-headerSpc {
        flex-direction: row !important;
        padding-bottom: 0px !important;
        margin-bottom: 10px;
    }

        .bs-stepper-headerSpc .step-trigger {
            flex-direction: column !important;
        }

    .imageListDiv {
        grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    }

    .dashboardInnerCardSec {
        grid-gap: 10px;
    }

        .dashboardInnerCardSec .cardlist {
            padding: 15px 16px;
            border-radius: 5px;
        }
    /* .dropTopHead{
        padding: 0 30px 10px;
    } */
    .cmnLeftTab .nav-pills {
        min-width: 264px;
    }

    .invoiceMainCntViewRgt .printViewSec .topSec .headTitle .mainTitle {
        font-size: 22px;
    }

    .dropTopHeadMd {
        display: none !important;
    }

    .dropTopHeadMd2 {
        display: block !important;
    }

    .dropTopHeadMdVsble {
        display: flex !important;
    }

    .rightSecDrop.rightSecDropGrp .dropValueListSec {
        max-width: 500px;
        width: max-content;
    }

        .rightSecDrop.rightSecDropGrp .dropValueListSec .dropValueList .listSEcArea .form-check-inline .form-check-label {
            white-space: break-spaces;
        }

        .rightSecDrop.rightSecDropGrp .dropValueListSec .dropValueList .listSEcArea.listSEcArea2 .form-check-inline {
            min-height: auto;
        }
}

@media only screen and (max-width: 767px) {
    .dropTopHeadMdVsble {
        display: flex !important;
    }

        .dropTopHeadMdVsble .rightSecDrop {
            width: 100%;
            justify-content: flex-start;
        }

    .btnTooltip .toolTip {
        max-width: 380px;
    }

    .salesinvoiceSpc {
        padding-right: 0px;
    }

    .salesinvoiceSpcInner {
        padding-right: 0px;
    }

    .advFldTop {
        justify-content: space-between !important;
    }

    .advFldBtm {
        justify-content: space-between !important;
    }

        .advFldBtm input {
            margin-left: 9px !important;
        }

        .advFldBtm .dt-buttons {
            text-align: right !important;
        }

    .borderDiv .titleHeadTop {
        align-items: flex-start !important;
        margin-top: -46px !important;
    }

        .borderDiv .titleHeadTop .form-check {
            padding: 5px 10px 5px 28px;
        }

    .divSep {
        flex-direction: column;
        align-items: flex-start !important;
    }

        .divSep.divSep2 {
            flex-direction: row;
        }

    .imageListDiv {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }

    .mouTopListBar {
        grid-template-columns: 1fr 1fr;
    }

    .cstmToolTipHead .cstmToolTip .toolSec {
        display: none;
    }

    .goldPurchAgree ul {
        padding-left: 15px;
    }

    .cstTableScrl {
        overflow: auto;
    }

        .cstTableScrl .cstTableCl6 {
            min-width: 500px;
        }
    /* .mousubSecTop{
        padding-right: 10px !important;
    } */
    .mousubSecTop .dropdown {
        display: flex;
    }

    .sevNon {
        display: none !important;
    }

    .mouTopListBar li {
        border-right: none;
    }

    .custSearchDropDwnSales .custmDrop .table-responsive .dataTables_wrapper {
        max-width: 386px !important;
        width: 100%;
    }

    .cmnLeftTab {
        display: none;
    }

    .cmnLeftAcco {
        display: block;
    }

    .reportSubMenuTop .innerHndBr {
        padding: 8px 8px 8px 12px;
        width: 70px;
    }

    .reportSubMenuTop .dateDropSec {
        margin-left: 11px;
    }

    .reportSubMenuTop .cmnSubmenuTop .dreportDiv {
        margin-left: 6px;
    }

    .mouCreationVerifyAadhaarNumber
    .adhrNumVerySEcBdr
    .adhrNumVerySEc
    .form-control {
        font-size: 30px;
    }

    .mouCreationVerifyAadhaarNumber
    .adhrNumVerySEcBdr
    .adhrNumVeryOtpSEc
    .otpInputSec
    .form-control {
        width: 50px;
        height: 50px;
        margin: 13px 5px 0;
        font-size: 27px;
    }

    .dropdown-menuMedia {
        left: auto !important;
        min-width: auto !important;
        width: 92% !important;
        max-width: 280px !important;
        right: 70px !important;
    }

    .esign {
        margin: 0 11px;
        width: 90%;
    }

    .esignedModal .modal-content .modal-body h3 {
        width: 100%;
    }

    .esignedModal .modal-content {
        padding: 24px 20px;
    }

        .esignedModal .modal-content .modal-body h3 {
            font-size: 18px;
        }

            .esignedModal .modal-content .modal-body h3 img {
                width: 100px;
            }

    .mouTopListBar li:last-child {
        border-right: none;
    }

    .mouTopListBarLstUl {
        display: none !important;
    }

    .mousubSecTop {
        padding-right: 0 !important;
        display: grid;
        grid-template-columns: 1fr 26px;
    }

    .mobSubSecCmndiv {
        padding-right: 10px;
    }

    .mousubSecTop .dropdown {
        position: initial;
        right: initial;
        top: initial;
    }

    .mouTopListBar li .textArea span {
        flex-wrap: wrap;
    }

    .dashboardInnerCardSec {
        grid-template-columns: 1fr 1fr;
    }

        .dashboardInnerCardSec .cardlist .title {
            font-size: 16px;
        }

        .dashboardInnerCardSec .cardlist p {
            margin: 0 0 15px;
            max-width: 100%;
        }

        .dashboardInnerCardSec .cardlist .priceSec .num {
            font-size: 16px;
        }

    .dashboardInnerCardListTable .tableBody .tableBodyList {
        padding: 8px 0 8px 20px;
    }

    .dashboardInnerCardListTable .tableHead .headTitle {
        padding-left: 20px;
    }

    .dashboardInnerCardListTable .tableBody .tableBodyListSec {
        grid-template-columns: 85px 269px 1fr 190px 122px;
    }

    .dashboardInnerCardListTable .tableHead {
        grid-template-columns: 85px 269px 1fr 190px 122px;
    }

    .expant {
        right: 11px;
        top: 0;
    }

        .expant svg {
            width: 15px;
        }

    .invoiceMainCntViewRgt .titleTop .leftSec .title {
        font-size: 20px;
    }

    .invoiceMainCntViewRgt .icnListRow {
        padding: 0 12px 0 17px;
        margin-top: 11px;
    }
}

@media only screen and (max-width: 680px) {
    .dropTopHeadMd2 {
        display: none !important;
    }

    .mdaSettingDrop {
        width: 327px;
    }

    .invoiceMainCntViewRgt .titleTop .leftSec .title {
        font-size: 18px;
    }
}

@media only screen and (max-width: 600px) {
    .white-spaceno {
        white-space: normal;
    }

    .nav-pillsCustom {
        display: flex;
        flex-direction: column;
    }

    .advFldBtm {
        flex-direction: column !important;
    }

        .advFldBtm .dataTables_filter {
            width: 100%;
        }

            .advFldBtm .dataTables_filter label {
                width: 100%;
            }

                .advFldBtm .dataTables_filter label .form-control {
                    width: 100%;
                }

    .imageListDiv {
        grid-template-columns: 1fr 1fr 1fr;
    }

    .cmnLeftAcco .collapse .accordion-body .listSec {
        grid-template-columns: 1fr;
    }

        .cmnLeftAcco .collapse .accordion-body .listSec .list {
            max-width: 100%;
        }

    .invoiceMainCntViewRgt .printViewSec .topSec .headTitle .mainTitle {
        font-size: 20px;
    }

    .reportSubMenuTop .cmnSubmenuTop {
        flex-direction: column;
        align-items: flex-start;
    }

        .reportSubMenuTop .cmnSubmenuTop .printSec {
            margin-left: 12px;
            margin-top: 10px;
            margin-bottom: 10px;
        }

        .reportSubMenuTop .cmnSubmenuTop .exportSec {
            margin-top: 10px;
            margin-bottom: 10px;
        }

    .content-wrapperspc {
        margin-top: 103px;
    }

    .mouCreationVerifyAadhaarNumber .adhrNumVerySecBtnSec {
        flex-direction: column;
    }

    .rightSecDrop.dashrightSecDropGrp .dropValue {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .deoDashboardHeadInner {
        width: 100%;
    }

        .deoDashboardHeadInner .dashrightSecDropGrp {
            width: 70%;
            justify-content: flex-start;
        }

        .deoDashboardHeadInner .position-relative {
            width: 30%;
        }

    .totalCardViewHead .position-relative {
        width: 67%;
    }
}

@media only screen and (max-width: 580px) {
    .dashboardCss .topRowCard {
        padding: 14px;
    }

    .mousubSecTopAction {
        display: flex !important;
    }

    .sevNonMob {
        display: none !important;
    }

    .custmrSpclDropSecAdded {
        padding: 5px 15px;
    }

        .custmrSpclDropSecAdded .changeBtn {
            right: 15px;
        }

    .btnTooltip .toolTip {
        max-width: 320px;
    }

    .imageListDiv {
        grid-template-columns: 1fr 1fr;
    }

    .custmModTable ul li {
        grid-template-columns: 215px;
        grid-gap: 5px;
    }

        .custmModTable ul li .cln {
            display: none;
        }

    .mouTopListBar li {
        border-right: none;
    }

    .mouTopListBar {
        grid-template-columns: 1fr;
    }

    .mouprevTable .prevTableList {
        grid-template-columns: 1fr;
    }

        .mouprevTable .prevTableList .valeSec {
            padding-left: 20px;
        }

            .mouprevTable .prevTableList .valeSec span {
                display: none;
            }

    .custSearchDropDwnSales .custmDrop {
        left: 40px;
    }

        .custSearchDropDwnSales .custmDrop .table-responsive .dataTables_wrapper {
            max-width: 276px !important;
            width: 100%;
        }

    .divShowScrl ul {
        flex-direction: column;
    }

    .divShowScrl {
        width: 190px !important;
    }

        .divShowScrl ul li {
            margin-right: 0;
            margin-bottom: 10px;
        }

        .divShowScrl li .icnUp {
            width: 100%;
        }

        .divShowScrl ul li:last-child {
            margin-bottom: 0px;
        }

    .mousubSecTop .dropdown .icnUp i {
        margin-right: 10px;
    }

    .mousubSecTop .dropdown .mousubSecTopAction .iconDiv {
        margin-right: 10px;
    }

    .mousubSecTop .dropdown .mousubSecTopAction {
        border-bottom: 1px solid #dddddd;
        border-radius: 0;
    }

        .mousubSecTop .dropdown .mousubSecTopAction:last-child {
            border-bottom: none;
        }

    .spclBox .form-control {
        font-size: 14px;
    }

    .tableMinHgt {
        min-height: 300px;
    }

    .mouCreationVerifyAadhaarNumber
    .adhrNumVerySEcBdr
    .adhrNumVeryOtpSEc
    .otpInputSec
    .form-control {
        width: 45px;
        height: 45px;
        margin: 13px 5px 0;
        font-size: 20px;
    }

    .mouCreationVerifyAadhaarNumber
    .adhrNumVerySEcBdr
    .adhrNumVerySEc
    .invalid-OTP {
        max-width: 200px;
    }

    .dropdown-menuMedia {
        right: 30px !important;
    }

    .cancelTransPop .modal-content .modal-body .cntArea .icnSec {
        grid-template-columns: 1fr;
    }

    .cancelTransPop .modal-content .modal-body h3 {
        font-size: 18px;
        line-height: 22px;
    }

    .cancelTransPop .modal-content .modal-body hr {
        margin-top: 9px;
    }
}

@media only screen and (max-width: 480px) {
    .deoDashboardHeadInner {
        flex-direction: column;
    }

        .deoDashboardHeadInner .dashrightSecDropGrp {
            width: 100%;
            margin-bottom: 15px;
            margin-right: 0 !important;
        }

        .deoDashboardHeadInner .position-relative {
            width: 100%;
        }

    .rightSecDrop.rightSecDropGrp .dropValueListSec.dashboarddropValueListSec {
        max-width: 354px;
        min-width: 328px;
    }

    .dashboardInnerCardSec {
        grid-template-columns: 1fr;
    }

    .totalCardViewHead {
        width: 100%;
    }

    .reportList5 {
        column-count: 1;
    }
}

.clrdddd {
    background-color: #dddddd;
}

.clrf9f9f9 {
    background-color: #f9f9f9;
}

.clr707070 {
    color: #707070;
}

.clr2d2d2d {
    color: #2d2d2d;
}

.text-right {
    text-align: right;
}

.dashCustomerListTableSec .table-responsive .odd td ul {
    padding-left: 0; /* Remove left padding from the <ul> element */
}

.dashCustomerListTableSec .table-responsive table tr td ul {
    padding: 0;
    margin: 0;
}

.dashCustomerListTableSec .table-responsive tbody tr td ul li {
    padding-left: 0;
    font-size: 12px;
    font-weight: 400;
    color: #434343;
    display: inline-block;
}

.dashCustomerListCard .tab-content .card-body {
    padding: 0;
}

.dashCustomerListCard .tab-content .branch-Name {
    display: flex;
    gap: 15px;
}

    .dashCustomerListCard .tab-content .branch-Name .br-icn {
        display: flex;
        width: 40px;
        height: 40px;
        background-color: #EEEEEE;
        justify-content: center;
        align-items: center;
        border-radius: 4px;
    }

    .dashCustomerListCard .tab-content .branch-Name .brnch-icn {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 24px;
        height: 24px;
    }

    .dashCustomerListCard .tab-content .branch-Name .branch-text {
        display: flex;
        flex-direction: column;
    }

        .dashCustomerListCard .tab-content .branch-Name .branch-text h3 {
            font-size: 12px;
            font-weight: 400;
            line-height: 16px;
            margin: 0;
        }

        .dashCustomerListCard .tab-content .branch-Name .branch-text h2 {
            font-size: 16px;
            font-weight: 500;
            line-height: 21px;
            margin: 0;
            max-width: 290px;
        }

.table-responsive .odd td ul {
    padding-left: 0; /* Remove left padding from the <ul> element */
}

.table-responsive table tr td ul {
    padding: 0;
    margin: 0;
}

.table-responsive tbody tr td ul li {
    padding-left: 0;
    font-size: 12px;
    font-weight: 400;
    color: #434343;
    display: inline-block;
}

.bg-SpcBlue {
    color: #007FEF;
    background-color: #E5F2FE;
}



.tableSticky {
    cursor: pointer
}

.bookingTabList .nav-item {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto
}

    .bookingTabList .nav-item .nav-link:hover {
        color: var(--theme-colour1-dark) !important
    }

    .bookingTabList .nav-item .nav-link.active {
        background-color: var(--theme-colour1-dark) !important;
        color: var(--white) !important
    }



@media (max-width: 1720px) {
    .validatePage .picSec .valTicketBtn {
        height: 50px;
        font-size: 16px;
        padding: 2px 20px;
        min-width: 212px;
    }

    .validatePage .formSec .valTicketBtn {
        height: 50px;
        font-size: 16px;
        padding: 2px 20px;
    }

    .valTicket {
        height: 60px;
        font-size: 16px;
        padding: 2px 20px;
        min-width: 215px;
    }
}


.tSoftLoginPage {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    display: grid;
    place-items: center;
    padding-inline: 24px
}

    .tSoftLoginPage .LoginTextArea {
        display: grid;
        gap: 20px
    }

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea {
        gap: 14px
    }
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea {
        gap: 12px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard {
    background: rgba(0,0,0,0.35);
    border-radius: 24px;
    padding: 22px 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 28px
}

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea .singleCard {
        padding: 16px 24px;
        gap: 20px;
        border-radius: 20px
    }
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea .singleCard {
        padding: 16px 20px;
        gap: 16px;
        border-radius: 16px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard .iconDiv {
    min-width: 60px;
    max-width: 80px;
    width: 100%;
    aspect-ratio: 1
}

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea .singleCard .iconDiv {
        max-width: 70px
    }
}

@media (max-width: 1366px) {
    .tSoftLoginPage .LoginTextArea .singleCard .iconDiv {
        max-width: 60px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard .iconDiv img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    height: auto
}

.tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardTitle {
    font-size: 24px;
    font-weight: 600;
    line-height: 32px;
    margin-bottom: 12px;
    color: var(--white)
}

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardTitle {
        line-height: 30px;
        font-size: 21px;
        margin-bottom: 10px
    }
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardTitle {
        line-height: 28px;
        font-size: 18px;
        margin-bottom: 8px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardDesc {
    color: var(--white);
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    margin: 0
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardDesc {
        font-size: 15px;
        line-height: 21px
    }
}

@media (max-height: 550px) {
    .tSoftLoginPage .singleCard {
        padding: 14px 18px !important;
        gap: 12px !important
    }

    .tSoftLoginPage .LoginTextArea {
        gap: 8px !important
    }

    .tSoftLoginPage .cardContent .cardTitle {
        line-height: 22px !important;
        margin-bottom: 4px !important
    }

    .tSoftLoginPage .iconDiv {
        min-width: 54px !important
    }
}

/*# sourceMappingURL=custom.css.map */

:root {
    --white: #ffffff;
    --black: #000000;
    --theme-colour1: #6A961F;
    --theme-colour1-dark: #008035;
    --c2d: #2D2D2D;
    --c70: #707070
}

body {
    font-family: "Open Sans", sans-serif
}

.avatar {
    width: 24px;
    height: 24px
}

body {
    background: #F5FAF7
}

.myProfile .avaname {
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    color: var(--c2d)
}

@media (max-width: 767px) {
    .myProfile .avaname {
        display: none
    }
}

.myProfile .nav-link .arrow {
    transition: ease-in-out 0.2s
}

@media (max-width: 767px) {
    .myProfile .nav-link .arrow {
        display: none
    }
}

.myProfile .nav-link.show .arrow {
    transform: rotate(180deg)
}

.tab-content {
    box-shadow: 0 0.125rem 0.25rem rgba(165,163,174,0.3)
}

.outletDropDown {
    position: relative
}

@media (max-width: 1279px) {
    .outletDropDown {
        display: none
    }
}

.outletDropDown.outletDropDown2 {
    display: none;
    width: fit-content;
    padding-block: 10px
}

@media (max-width: 1279px) {
    .outletDropDown.outletDropDown2 {
        display: block
    }
}

.outletDropDown.open .headSec .dwnArrow {
    transform: rotate(-180deg)
}

.outletDropDown.open .listwrap {
    display: block;
    opacity: 1;
    pointer-events: all
}

.outletDropDown .headSec {
    display: grid;
    grid-template-columns: 22px 1fr 13px;
    grid-gap: 12px;
    row-gap: 0;
    align-items: center
}

    .outletDropDown .headSec .text {
        font-size: 14px;
        font-weight: 600;
        line-height: 19px;
        color: var(--theme-colour1-dark)
    }

    .outletDropDown .headSec .dwnArrow {
        transition: ease-in-out 0.4s;
        display: flex
    }

.outletDropDown .listwrap {
    padding: 15px 18px;
    background-color: var(--white);
    border-radius: 9px;
    border: 1px solid #E8E8E8;
    box-shadow: 0 0.125rem 0.25rem rgba(165,163,174,0.3);
    position: absolute;
    top: 42px;
    min-width: 370px;
    display: none;
    opacity: 0;
    pointer-events: none
}

    .outletDropDown .listwrap .list {
        display: grid;
        grid-template-columns: 22px 1fr;
        grid-gap: 12px;
        row-gap: 0;
        align-items: center;
        cursor: pointer;
        padding-block: 12px;
        border-bottom: 1px solid #EEEEEE
    }

        .outletDropDown .listwrap .list:hover .text {
            color: var(--theme-colour1-dark)
        }

        .outletDropDown .listwrap .list:hover svg path {
            fill: var(--theme-colour1-dark)
        }

        .outletDropDown .listwrap .list.active .text {
            color: var(--theme-colour1-dark)
        }

        .outletDropDown .listwrap .list.active svg path {
            fill: var(--theme-colour1-dark)
        }

        .outletDropDown .listwrap .list:last-child {
            border-bottom: none
        }

        .outletDropDown .listwrap .list .text {
            font-size: 14px;
            font-weight: 600;
            line-height: 19px;
            color: var(--c2d)
        }

        .outletDropDown .listwrap .list svg path {
            transition: ease-in-out 0.4s
        }

.topHeadTitle {
    font-size: 24px;
    font-weight: 600;
    line-height: 33px;
    color: #2d2d2d;
    margin: 16px 0
}

@media (max-width: 991px) {
    .topHeadTitle {
        font-size: 20px;
        line-height: 29px
    }
}

@media (max-width: 680px) {
    .topHeadTitle {
        font-size: 14px;
        line-height: 19px
    }
}

.search-input-wrapper {
    position: absolute;
    left: 48px;
    display: flex;
    align-items: center
}

    .search-input-wrapper .search-toggler {
        top: 6px !important;
        right: 0 !important
    }

.valTicket {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 62px;
    padding: 5px 21px;
    border-radius: 8px;
    background-color: var(--theme-colour1);
    transition: ease-in-out 0.4s;
    border: 1px solid #EEEEEE;
    outline: none;
    min-width: 229px;
    gap: 8px;
    column-gap: 8px
}

@media (max-width: 1720px) {
    .valTicket {
        height: 60px;
        font-size: 16px;
        padding: 2px 20px;
        min-width: 215px
    }
}

@media (max-height: 800px) {
    .valTicket {
        height: 60px;
        font-size: 16px;
        padding: 2px 20px;
        min-width: 215px
    }
}

@media (max-width: 767px) {
    .valTicket {
        padding: 5px 20px;
        min-width: 226px
    }
}

@media (max-width: 680px) {
    .valTicket {
        height: 50px;
        min-width: 49px
    }
}

.valTicket:hover {
    background-color: var(--theme-colour1-dark)
}

@media (max-width: 680px) {
    .valTicket span {
        display: none
    }
}

.valTicket svg {
    width: 18px;
    height: auto
}

.mainSearchTop {
    padding: 0;
    max-width: calc(1440px - 1.5rem* 2);
    box-shadow: none
}

    .mainSearchTop .mainSearchTopInner {
        box-shadow: 0 0.125rem 0.25rem rgba(165,163,174,0.3);
        flex-wrap: nowrap;
        border-radius: 8px
    }

@media (max-width: 767px) {
    .mainSearchTop .mainSearchTopInner {
        padding-block: 7px
    }
}

@media (max-width: 680px) {
    .mainSearchTop .mainSearchTopInner {
        padding-block: 3px
    }
}

.mainSearchTop .topDropSec {
    gap: 41px;
    column-gap: 41px
}

@media (max-width: 1366px) {
    .mainSearchTop .topDropSec {
        gap: 20px;
        column-gap: 20px
    }
}

.validatePage {
    display: grid;
    grid-template-columns: 1fr 61px 1fr;
    grid-gap: 10px;
    align-items: center;
    padding: 15px
}

@media (max-width: 767px) {
    .validatePage {
        grid-template-columns: 1fr;
        grid-gap: 27px
    }
}

@media (max-width: 680px) {
    .validatePage {
        padding: 0;
        grid-gap: 10px
    }
}

.validatePage .picSec {
    text-align: center
}

@media (max-width: 680px) {
    .validatePage .picSec {
        background-color: var(--white);
        box-shadow: 0 0.125rem 0.25rem rgba(165,163,174,0.3);
        border-radius: 8px;
        padding: 20px;
        width: 100%
    }
}

.validatePage .picSec .pic {
    max-width: 312px;
    width: 100%;
    margin: 0 auto 35px
}

@media (max-width: 767px) {
    .validatePage .picSec .pic {
        margin-bottom: 12px
    }
}

@media (max-width: 680px) {
    .validatePage .picSec .pic {
        max-width: 126px
    }
}

.validatePage .picSec .pic img {
    width: 100%
}

.validatePage .picSec .title {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: var(--c2d);
    text-align: center;
    margin-bottom: 24px
}

@media (max-width: 767px) {
    .validatePage .picSec .title {
        margin-bottom: 15px
    }
}

@media (max-width: 767px) {
    .validatePage .picSec .title {
        font-size: 14px;
        font-weight: 600
    }
}

.validatePage .picSec .title span {
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: var(--c2d);
    margin-top: 11px
}

@media (max-width: 767px) {
    .validatePage .picSec .title span {
        margin-top: 6px
    }
}

.validatePage .picSec .valTicketBtn {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 62px;
    padding: 5px 21px;
    border-radius: 8px;
    background-color: var(--theme-colour1-dark);
    transition: ease-in-out 0.4s;
    border: 1px solid #EEEEEE;
    outline: none;
    min-width: 229px;
    gap: 8px;
    column-gap: 8px;
    margin: auto
}

@media (max-width: 1720px) {
    .validatePage .picSec .valTicketBtn {
        height: 50px;
        font-size: 16px;
        padding: 2px 20px;
        min-width: 212px
    }
}

@media (max-width: 767px) {
    .validatePage .picSec .valTicketBtn {
        min-width: 203px;
        height: 45px;
        font-size: 15px;
        padding: 2px 20px
    }
}

@media (max-height: 800px) {
    .validatePage .picSec .valTicketBtn {
        min-width: 203px;
        height: 45px;
        font-size: 15px;
        padding: 2px 20px
    }
}

@media (max-width: 680px) {
    .validatePage .picSec .valTicketBtn {
        min-width: 152px;
        height: 34px;
        font-size: 12px;
        padding: 2px 14px;
        border-radius: 6px
    }
}

.validatePage .picSec .valTicketBtn:hover {
    background-color: var(--theme-colour1)
}

.validatePage .picSec .valTicketBtn svg {
    width: 18px;
    height: auto
}

@media (max-width: 680px) {
    .validatePage .picSec .valTicketBtn svg {
        width: 11px
    }
}

.validatePage .borderSec {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center
}

@media (max-width: 767px) {
    .validatePage .borderSec {
        justify-content: center
    }
}

.validatePage .borderSec span {
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: var(--c2d);
    width: 61px;
    height: 61px;
    border-radius: 50%;
    border: 1px solid #D8D8D8;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--white);
    z-index: 1
}

@media (max-width: 767px) {
    .validatePage .borderSec span {
        width: 49px;
        height: 49px;
        font-size: 16px
    }
}

@media (max-width: 680px) {
    .validatePage .borderSec span {
        width: 31px;
        height: 31px;
        font-size: 12px;
        background-color: #F5FAF7
    }
}

.validatePage .borderSec::after {
    position: absolute;
    content: "";
    left: 31px;
    top: auto;
    background-color: #D8D8D8;
    width: 1px;
    height: 362px
}

@media (max-width: 767px) {
    .validatePage .borderSec::after {
        width: 440px;
        height: 1px;
        left: auto
    }
}

@media (max-width: 680px) {
    .validatePage .borderSec::after {
        width: 212px
    }
}

.validatePage .formSec {
    max-width: 401px;
    width: 100%;
    margin: auto
}

@media (max-width: 680px) {
    .validatePage .formSec {
        background-color: var(--white);
        box-shadow: 0 0.125rem 0.25rem rgba(165,163,174,0.3);
        border-radius: 8px;
        padding: 20px;
        max-width: 100%
    }
}

.validatePage .formSec .title {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: var(--c2d);
    text-align: center;
    margin-bottom: 28px
}

@media (max-width: 767px) {
    .validatePage .formSec .title {
        margin-bottom: 15px
    }
}

@media (max-width: 767px) {
    .validatePage .formSec .title {
        font-size: 14px;
        font-weight: 600;
        margin-bottom: 9px
    }
}

.validatePage .formSec .title span {
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: var(--c2d);
    margin-top: 11px
}

@media (max-width: 767px) {
    .validatePage .formSec .title span {
        margin-top: 6px
    }
}

.validatePage .formSec .input-group {
    height: 54px;
    border: 1px solid #DDDDDD;
    border-radius: 11px;
    display: flex;
    align-items: center;
    padding: 5px 20px;
    gap: 8px;
    margin-bottom: 27px
}

@media (max-width: 767px) {
    .validatePage .formSec .input-group {
        margin-bottom: 20px
    }
}

@media (max-width: 680px) {
    .validatePage .formSec .input-group {
        height: 42px;
        border-radius: 8px;
        padding: 5px 19px;
        max-width: 279px;
        width: 100%;
        margin: 0 auto 14px
    }
}

.validatePage .formSec .input-group .form-label {
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    color: var(--c2d);
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 0
}

@media (max-width: 680px) {
    .validatePage .formSec .input-group .form-label {
        font-size: 12px
    }
}

.validatePage .formSec .input-group .form-control {
    border: none;
    height: auto
}

@media (max-width: 680px) {
    .validatePage .formSec .input-group .form-control {
        font-size: 12px
    }
}

.validatePage .formSec .valTicketBtn {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 62px;
    padding: 5px 21px;
    border-radius: 8px;
    background-color: var(--theme-colour1-dark);
    transition: ease-in-out 0.4s;
    border: 1px solid #EEEEEE;
    outline: none;
    min-width: 145px;
    gap: 8px;
    column-gap: 8px;
    margin: auto
}

@media (max-width: 1720px) {
    .validatePage .formSec .valTicketBtn {
        height: 50px;
        font-size: 16px;
        padding: 2px 20px
    }
}

@media (max-height: 800px) {
    .validatePage .formSec .valTicketBtn {
        height: 50px;
        font-size: 16px;
        padding: 2px 20px
    }
}

@media (max-width: 767px) {
    .validatePage .formSec .valTicketBtn {
        min-width: 203px;
        height: 48px;
        font-size: 16px;
        padding: 2px 20px
    }
}

@media (max-width: 680px) {
    .validatePage .formSec .valTicketBtn {
        min-width: 275px;
        height: 34px;
        font-size: 12px;
        padding: 2px 14px;
        border-radius: 8px
    }
}

.validatePage .formSec .valTicketBtn:hover {
    background-color: var(--theme-colour1)
}

@media (max-width: 680px) {
    .validateBgTranspnt {
        background: transparent !important;
        box-shadow: none;
        padding: 0
    }
}

.modalWidet {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9995;
    pointer-events: none;
    -webkit-transition: opacity 0.6s, -webkit-transform 0.6s;
    transition: opacity 0.6s, transform 0.6s;
    -webkit-transform: translate3d(0, 102%, 0);
    transform: translate3d(0, 102%, 0);
    box-shadow: 0 3px 5px 0 rgba(32,33,36,0.2);
    opacity: 0
}

@media (max-width: 1366px) {
    .modalWidet {
        padding: 10px
    }
}

.modalWidet .modalRow {
    padding: 31px 29px 25px;
    position: relative;
    background-color: #fff;
    border-radius: 30px;
    z-index: 1;
    max-width: 740px;
    width: 100%
}

@media (max-width: 1366px) {
    .modalWidet .modalRow {
        border-radius: 25px
    }
}

@media (max-width: 1279px) {
    .modalWidet .modalRow {
        border-radius: 20px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow {
        border-radius: 20px
    }
}

@media (max-width: 767px) {
    .modalWidet .modalRow {
        border-radius: 12px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow {
        padding: 25px 15px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 19px;
    gap: 10px;
    border-bottom: 1px solid #dddd;
    padding-bottom: 13px;
    width: 100%
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header {
        margin-bottom: 12px;
        padding-bottom: 8px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header {
        gap: 20px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .closeBtn {
    position: absolute;
    right: -20px;
    top: -16px;
    width: 38px;
    height: 38px;
    border-radius: 6px;
    background-color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 3px 5px 0 rgba(32,33,36,0.2)
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .closeBtn {
        right: 10px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .closeBtn svg {
    width: 12px;
    height: auto
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message {
    display: flex;
    align-items: baseline;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    width: 100%
}

    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .date {
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        color: var(--black);
        background-color: #f4f4f4;
        height: 42px;
        padding: 5px 18px;
        border-radius: 7px;
        display: flex;
        align-items: center;
        gap: 10px;
        column-gap: 10px
    }

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .date {
        display: none
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .date .icn {
    display: flex
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .date p {
    margin: 0
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
    width: 131px;
    height: 121px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
        width: 80px;
        height: 80px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
        width: 80px;
        height: 80px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
    font-size: 24px;
    font-weight: 600;
    line-height: 31px;
    color: var(--black)
}

@media (max-width: 1366px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
        font-size: 20px;
        line-height: 28px
    }
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
        font-size: 18px;
        line-height: 26px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .address {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--theme-colour1-dark);
    margin-bottom: 25px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .address {
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 13px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .address .icnDiv {
    display: flex
}

.modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
    display: grid;
    grid-template-columns: 1fr 122px;
    grid-gap: 20px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr 80px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr 70px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr;
        grid-gap: 10px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card hr {
    width: 100%;
    height: 1px;
    background-color: #DBDADE;
    margin: 5px 0 15px
}

.modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
    border: 1px solid #BBBBBB;
    padding: 10px;
    border-radius: 16px;
    width: 122px;
    height: 122px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        padding: 5px;
        border-radius: 10px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        width: 80px;
        height: 80px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        width: 70px;
        height: 70px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        order: 0
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .qr-img .qr-code {
    width: 100%
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details {
        order: 1
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row {
    display: flex;
    gap: 20px;
    column-gap: 20px;
    margin-bottom: 2px;
    font-size: 14px;
    font-weight: 600;
    line-height: 32px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row {
        font-size: 12px;
        line-height: 22px;
        gap: 15px;
        column-gap: 15px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .label {
    color: var(--c2d);
    max-width: 132px;
    width: 100%
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .label {
        max-width: 90px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .value {
    color: var(--c2d);
    font-weight: 400;
    max-width: 200px;
    width: 100%;
    word-break: break-all
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: var(--c2d);
    margin-bottom: 6px
}

@media (max-width: 1366px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
        font-size: 16px;
        line-height: 30px
    }
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
        font-size: 14px;
        line-height: 28px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
    background-color: #eee;
    padding: 12px 41px 16px 24px;
    border-radius: 10px;
    overflow-x: auto
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 28px
    }
}

@media (max-width: 767px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 22px
    }
}

@media (max-width: 480px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 16px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table::-webkit-scrollbar {
    height: 8px;
    margin-left: 5px;
    left: 5px
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table::-webkit-scrollbar-track {
    background: #e9e9e9
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table::-webkit-scrollbar-thumb {
    background: #cfcfcf
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table {
    width: 100%;
    border-collapse: collapse;
    text-align: left
}

    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table thead tr th {
        color: var(--c70);
        font-size: 13px;
        font-weight: 400;
        line-height: 22px;
        text-align: start;
        padding-bottom: 7px
    }

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table thead tr th {
        font-size: 12px;
        line-height: 24px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td {
    padding-bottom: 14px;
    font-size: 14px;
    font-weight: 500;
    line-height: 26px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td {
        font-size: 14px;
        line-height: 22px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td:first-child {
    text-align: left;
    color: #000
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td:not(:first-child) {
    text-align: start;
    color: #000
}

.modalWidet .modalRow .modalCntArea .ticket-card .totalBtm {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    border-top: 1px solid #DBDADE;
    margin-top: 16px;
    padding-top: 13px;
    flex-wrap: wrap
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .totalBtm {
        gap: 10px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn {
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 43px;
    padding: 5px 21px;
    border-radius: 8px;
    background-color: var(--theme-colour1-dark);
    transition: ease-in-out 0.4s;
    border: 1px solid #EEEEEE;
    outline: none;
    min-width: 134px;
    gap: 8px;
    column-gap: 8px;
    margin-left: 0
}

@media (max-width: 767px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn {
        padding: 2px 20px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn {
        height: 34px;
        font-size: 12px;
        padding: 2px 14px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn:hover {
    background-color: var(--theme-colour1)
}

.modalWidet .modalRow .modalCntArea .ticket-card .total-section {
    display: flex;
    justify-content: space-between;
    max-width: 231px;
    width: 100%;
    font-size: 18px !important;
    line-height: 24px !important;
    font-weight: 600 !important;
    color: var(--c2d)
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .total-section {
        font-size: 16px !important;
        line-height: 22px !important
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .total-section span:last-child {
    font-weight: 500
}

.modalWidet .modalBg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #000;
    opacity: 0;
    -webkit-transition: opacity 0.6s, -webkit-transform 0.5s;
    transition: opacity 0.6s, transform 0.5s;
    -webkit-transform: translate3d(0, 102%, 0);
    transform: translate3d(0, 102%, 0);
    box-shadow: 0 3px 5px 0 rgba(32,33,36,0.2)
}

.modalWidet.open {
    opacity: 1;
    pointer-events: visible;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

    .modalWidet.open .modalBg {
        opacity: 0.5;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

img, svg {
    width: 100%;
    height: auto;
    object-fit: cover
}

p, h1, h2, h3, h4, h5, h6 {
    margin: 0
}

@media (max-width: 680px) {
    .tab-content {
        padding-inline: 1rem !important
    }
}

.vaildateCheckingWrapper {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 45px;
    padding-block-end: 26px
}

@media (max-width: 1366px) {
    .vaildateCheckingWrapper {
        gap: 30px
    }
}

@media (max-width: 1279px) {
    .vaildateCheckingWrapper {
        grid-template-columns: 120px 1fr
    }
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper {
        grid-template-columns: 1fr
    }
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper {
        padding-block-end: 16px
    }
}

.vaildateCheckingWrapper .mainImg {
    max-width: 150px;
    max-height: 140px;
    margin: auto
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .mainImg {
        display: none
    }
}

.vaildateCheckingWrapper .calanderDiv {
    display: flex;
    align-items: center;
    gap: 10px
}

    .vaildateCheckingWrapper .calanderDiv .labelSec {
        font-size: 16px;
        font-weight: 500;
        line-height: 19px;
        color: #2d2d2d
    }

.vaildateCheckingWrapper .calander {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 10px;
    border-radius: 7px;
    background-color: #F9F9F9;
    width: fit-content
}

    .vaildateCheckingWrapper .calander span {
        width: 20px;
        height: 20px;
        margin-block-start: -6px
    }

    .vaildateCheckingWrapper .calander p {
        color: var(--c2d);
        font-size: 14px;
        font-weight: 400;
        line-height: 19px
    }

.vaildateCheckingWrapper .rightWrapper .topSec {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-block-end: 16px
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .topSec {
        display: none
    }
}

.vaildateCheckingWrapper .rightWrapper .topSec .bookingTitle {
    color: var(--theme-colour1-dark);
    font-size: 18px;
    font-weight: 600;
    line-height: 24px
}

.vaildateCheckingWrapper .rightWrapper .topSecTabView {
    display: none
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .topSecTabView {
        display: grid;
        grid-template-columns: auto 1fr auto;
        gap: 34px;
        padding-block-end: 24px
    }
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .topSecTabView {
        display: none
    }
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .topSecTabView .mainImg {
        display: flex;
        max-width: 110px;
        max-height: 99px;
        margin: 0
    }

        .vaildateCheckingWrapper .rightWrapper .topSecTabView .mainImg.varified {
            max-height: fit-content
        }
}

.vaildateCheckingWrapper .rightWrapper .topSecTabView .topMidSec .bookingTitle {
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--theme-colour1-dark);
    margin-block-end: 8px
}

.vaildateCheckingWrapper .rightWrapper .topSecTabView .topMidSec .title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-block-end: 20px
}

    .vaildateCheckingWrapper .rightWrapper .topSecTabView .topMidSec .title h4 {
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        color: var(--c2d)
    }

    .vaildateCheckingWrapper .rightWrapper .topSecTabView .topMidSec .title span {
        display: block;
        width: 18px;
        height: auto
    }

.vaildateCheckingWrapper .rightWrapper .topSecMobView {
    display: none
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .topSecMobView {
        display: block
    }

        .vaildateCheckingWrapper .rightWrapper .topSecMobView .mobTop {
            display: flex;
            align-items: center;
            gap: 14px;
            padding-block-end: 14px;
            border-bottom: 1px solid #EEEEEE
        }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .mobTop .mainImg {
                display: flex;
                max-width: 46px;
                max-height: 46px;
                margin: 0
            }

                .vaildateCheckingWrapper .rightWrapper .topSecMobView .mobTop .mainImg.varified {
                    max-height: fit-content
                }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .mobTop .bookingTitle {
                font-size: 14px;
                font-weight: 600;
                line-height: 20px;
                color: var(--c2d)
            }

        .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec {
            display: flex;
            gap: 14px;
            align-items: center;
            padding-block: 12px 20px
        }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .QrDiv {
                width: 80px;
                aspect-ratio: 1
            }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .calanderDiv {
                display: flex;
                align-items: center;
                gap: 5px
            }

                .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .calanderDiv .labelSec {
                    font-size: 12px;
                    font-weight: 500;
                    line-height: 4px;
                    color: #2d2d2d
                }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .calander span {
                width: 14px;
                height: 14px;
                margin-block-start: -10px
            }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .calander p {
                color: var(--c2d);
                font-size: 12px;
                font-weight: 400;
                line-height: 18px
            }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .title {
                display: flex;
                align-items: flex-start;
                gap: 4px;
                margin-block-end: 12px
            }

                .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .title span {
                    display: flex;
                    width: 14px;
                    height: 12px;
                    margin-block-start: 3px
                }

                    .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .title span svg path {
                        fill: var(--theme-colour1-dark)
                    }

                .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .title h4 {
                    font-size: 12px;
                    font-weight: 600;
                    line-height: 18px;
                    color: var(--theme-colour1-dark)
                }
}

.vaildateCheckingWrapper .rightWrapper .midSec {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 24px;
    padding-block-start: 20px;
    border-top: 1px solid #EEEEEE;
    background-image: linear-gradient(to right, #eee 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 35px 1px;
    background-repeat: repeat-x
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .midSec {
        padding-block-start: 24px
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .title {
    display: flex;
    align-items: center;
    gap: 8px
}

    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .title h4 {
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        color: var(--c2d)
    }

    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .title span {
        display: block;
        width: 18px;
        height: auto
    }

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .title {
        display: none
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails {
    max-width: 780px;
    width: 100%;
    display: grid;
    grid-template-columns: 350px 1fr;
    gap: 24px;
    padding-block: 26px 30px;
    align-items: flex-start
}

@media (max-width: 1366px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails {
        grid-template-columns: 290px 1fr
    }
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails {
        padding-block-start: 0;
        grid-template-columns: 340px 1fr
    }
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails {
        display: flex;
        flex-wrap: wrap;
        gap: 26px
    }
}

@media (max-width: 767px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails {
        grid-template-columns: 1fr
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap {
    display: grid;
    gap: 26px;
    position: relative
}

    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec {
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: flex-start;
        gap: 24px
    }

@media (max-width: 480px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec {
        gap: 12px
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .name, .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .value {
    color: var(--c2d);
    font-size: 14px;
    font-weight: 600;
    line-height: 19px
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .name {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 160px;
    max-width: 160px
}

@media (max-width: 1366px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .name {
        min-width: 100px;
        max-width: 100px
    }
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .name {
        min-width: 155px;
        max-width: 155px
    }
}

@media (max-width: 480px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .name {
        min-width: 115px;
        word-break: break-all;
        max-width: 115px
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .value {
    font-weight: 400
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptRight {
    align-self: center
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptRight {
        display: none
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptRight .QrDiv {
    max-width: 110px;
    aspect-ratio: 1
}

.vaildateCheckingWrapper .rightWrapper .btmSec {
    padding-block-start: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec {
        display: block
    }
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec {
        padding-block-start: 16px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap {
    display: flex;
    align-items: center;
    gap: 17px
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap {
        padding-block-end: 20px;
        background-image: linear-gradient(to right, #eee 50%, rgba(255,255,255,0) 0%);
        background-position: bottom;
        background-size: 35px 1px;
        background-repeat: repeat-x
    }
}

@media (max-width: 991px) and (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap {
        gap: 8px;
        padding-block-end: 16px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv {
    width: fit-content;
    padding: 10px 18px;
    display: flex;
    align-items: center;
    gap: 18px;
    background-color: #F8F8F8;
    border: 1px solid #EEEEEE;
    border-radius: 11px
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv {
        padding: 12px 10px;
        gap: 6px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv h4, .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv span {
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
    color: var(--c2d)
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv h4, .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv span {
        font-size: 12px;
        font-weight: 600;
        line-height: 18px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv span {
    background-color: var(--white);
    border-radius: 5px;
    padding: 7px 12px
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv span {
        padding: 4px 8px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table {
    background-color: #F8F8F8;
    border: 1px solid #EEEEEE;
    border-radius: 11px;
    padding: 12px 20px 0 24px;
    overflow-x: auto
}

    .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table::-webkit-scrollbar {
        height: 8px;
        margin-left: 5px;
        left: 5px
    }

    .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table::-webkit-scrollbar-track {
        background: #e9e9e9
    }

    .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table::-webkit-scrollbar-thumb {
        background: #cfcfcf
    }

    .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table table {
        width: 100%;
        border-collapse: collapse;
        text-align: left
    }

        .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table table thead tr th {
            color: var(--c70);
            font-size: 13px;
            font-weight: 400;
            line-height: 22px;
            text-align: start;
            padding-bottom: 7px
        }

        .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table table tbody tr td {
            padding-bottom: 14px;
            font-size: 14px;
            font-weight: 500;
            line-height: 26px;
            color: #000
        }

            .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table table tbody tr td:first-child {
                text-align: left;
                color: #000
            }

.vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap {
    display: flex;
    align-items: center
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap {
        justify-content: space-between;
        padding-block-start: 24px
    }
}

@media (max-width: 991px) and (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap.SuccessMob {
        display: grid;
        place-items: center;
        justify-content: center
    }
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap.SuccessMob .bg {
        max-width: 290px;
        width: 100%
    }

    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap.ticket {
        justify-content: center
    }

        .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap.ticket .cmnButton {
            max-width: 345px;
            width: 100%
        }
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap {
        padding-block-start: 12px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap .cmnButtonSvg {
    background-color: transparent;
    color: var(--theme-colour1-dark);
    display: flex;
    align-items: center;
    gap: 10px
}

    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap .cmnButtonSvg span {
        width: 20px
    }

.vaildateCheckingWrapper .rightWrapper .btmSec .cmnButton {
    border: none;
    background-color: var(--theme-colour1-dark);
    color: var(--white);
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
    padding: 12px 33px
}

    .vaildateCheckingWrapper .rightWrapper .btmSec .cmnButton.bg {
        background-color: var(--theme-colour1)
    }

.iconBooking {
    display: block;
    max-width: 20px;
    height: 18px
}

.viewDetails {
    color: var(--theme-colour1-dark) !important;
    text-decoration: underline;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px
}

.phnNumberdata, .maildata {
    display: flex;
    align-items: center
}

    .phnNumberdata .VerifiedIcn, .phnNumberdata .errorIcn, .maildata .VerifiedIcn, .maildata .errorIcn {
        width: 15px;
        height: 15px;
        display: grid;
        margin-left: 10px
    }

.tableSticky {
    cursor: pointer
}

.bookingTabList .nav-item {
    width: fit-content;
    flex: 0 1 auto
}

    .bookingTabList .nav-item .nav-link:hover {
        color: var(--theme-colour1-dark) !important
    }

    .bookingTabList .nav-item .nav-link.active {
        background-color: var(--theme-colour1-dark) !important;
        color: var(--white) !important
    }

@media (max-width: 767px) {
    .cmnTableTop .searchArea {
        width: 100%
    }
}

@media (max-width: 767px) {
    .cmnTableTop .searchArea .dataTables_filter {
        width: 100%
    }
}

@media (max-width: 767px) {
    .cmnTableTop .searchArea .dataTables_filter label {
        width: 100%;
        padding-left: 9px
    }
}

@media (max-width: 767px) {
    .cmnTableTop .searchArea .dataTables_filter label .form-control {
        width: 100%;
        margin-left: 0
    }
}

.toast {
    background-color: #FFFFFF
}

.modalWidet {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9995;
    pointer-events: none;
    -webkit-transition: opacity 0.6s, -webkit-transform 0.6s;
    transition: opacity 0.6s, transform 0.6s;
    -webkit-transform: translate3d(0, 102%, 0);
    transform: translate3d(0, 102%, 0);
    box-shadow: 0 3px 5px 0 rgba(32,33,36,0.2);
    opacity: 0
}

@media (max-width: 1366px) {
    .modalWidet {
        padding: 10px
    }
}

.modalWidet .modalRow {
    padding: 42px 32px;
    position: relative;
    background-color: #fff;
    border-radius: 25px;
    z-index: 1;
    max-width: 756px;
    width: 100%
}

@media (max-width: 1279px) {
    .modalWidet .modalRow {
        border-radius: 20px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow {
        border-radius: 20px
    }
}

@media (max-width: 767px) {
    .modalWidet .modalRow {
        border-radius: 12px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow {
        padding: 25px 15px
    }
}

.modalWidet .modalRow .closeBtn {
    cursor: pointer
}

.modalWidet .modalRow.confirmationPopup {
    padding: 20px 32px
}

@media (max-width: 680px) {
    .modalWidet .modalRow.confirmationPopup {
        padding: 25px 15px
    }
}

.modalWidet .modalRow.confirmationPopup .header {
    border-bottom: none !important;
    padding-bottom: 0 !important
}

.modalWidet .modalRow.confirmationPopup .pic {
    width: 80px;
    height: 80px;
    margin: 0 auto 15px
}

.modalWidet .modalRow.confirmationPopup h5 {
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    color: var(--c2d);
    text-align: center;
    max-width: 320px;
    margin: auto
}

@media (max-width: 1680px) {
    .modalWidet .modalRow.confirmationPopup h5 {
        font-size: 16px;
        line-height: 21px
    }
}

.modalWidet .modalRow.confirmationPopup .totalBtm {
    margin-top: 40px !important;
    gap: 10px !important
}

.modalWidet .modalRow.confirmationPopup .download-btn.btnBorder {
    background-color: var(--c70) !important
}

    .modalWidet .modalRow.confirmationPopup .download-btn.btnBorder:hover {
        background-color: var(--theme-colour1-dark) !important
    }

.modalWidet .modalRow.confirmationPopup .qrDiv {
    width: 100%;
    height: 100%;
    border: 1px dashed var(--theme-colour1);
    min-height: 360px;
    border-radius: 10px;
    margin: 13px 0px;
    display: flex;
    align-items: center;
    justify-content: center
}

@media (max-width: 680px) {
    .modalWidet .modalRow.confirmationPopup .qrDiv {
        margin: -9px 0px;
        min-height: 290px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket .header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 24px;
    gap: 70px;
    border-bottom: 1px dashed #dddd;
    padding-bottom: 6px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .addTicket .header {
        margin-bottom: 12px;
        padding-bottom: 8px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .addTicket .header {
        gap: 20px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket .header .success-message {
    display: flex;
    align-items: baseline;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap
}

    .modalWidet .modalRow .modalCntArea .addTicket .header .success-message .title {
        font-size: 18px;
        font-weight: 500;
        line-height: 24px;
        color: var(--black)
    }

@media (max-width: 1366px) {
    .modalWidet .modalRow .modalCntArea .addTicket .header .success-message .title {
        font-size: 16px;
        line-height: 22px
    }
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .addTicket .header .success-message .title {
        font-size: 14px;
        line-height: 20px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul {
    padding: 0;
    margin: 0
}

    .modalWidet .modalRow .modalCntArea .addTicket ul li {
        margin-bottom: 10px;
        padding: 12px 15px 12px 15px;
        border-radius: 8px;
        background-color: var(--white);
        border: 1px solid #f5f5f5;
        cursor: pointer;
        transition: ease-in-out 0.4s;
        display: flex;
        align-items: center;
        position: relative
    }

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li {
        padding: 9px 15px 9px 15px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul li p {
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
    color: var(--c2d);
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 5px;
    column-gap: 5px
}

@media (max-width: 1680px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li p {
        font-size: 16px;
        line-height: 20px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li p {
        font-size: 14px;
        line-height: 18px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul li p span {
    font-size: 13px;
    font-weight: 500;
    line-height: 17px;
    color: var(--black)
}

@media (max-width: 1680px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li p span {
        font-size: 10px;
        line-height: 14px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul li span {
    font-size: 13px;
    font-weight: 400;
    line-height: 21px;
    color: var(--c70)
}

@media (max-width: 1680px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li span {
        font-size: 10px;
        line-height: 18px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li span {
        font-size: 10px;
        line-height: 18px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul li:hover {
    color: var(--theme-colour1-dark);
    background-color: #d0eddc;
    border: 1px solid #d0eddc
}

    .modalWidet .modalRow .modalCntArea .addTicket ul li:hover p span {
        color: var(--c2d)
    }

    .modalWidet .modalRow .modalCntArea .addTicket ul li:hover span {
        color: #729982
    }

    .modalWidet .modalRow .modalCntArea .addTicket ul li:hover svg path {
        fill: var(--theme-colour1-dark)
    }

.modalWidet .modalRow .modalCntArea .addTicket ul li.active {
    color: var(--theme-colour1-dark);
    background-color: #d0eddc;
    border: 1px solid #d0eddc
}

    .modalWidet .modalRow .modalCntArea .addTicket ul li.active p span {
        color: var(--c2d)
    }

    .modalWidet .modalRow .modalCntArea .addTicket ul li.active span {
        color: #729982
    }

    .modalWidet .modalRow .modalCntArea .addTicket ul li.active svg path {
        fill: var(--theme-colour1-dark)
    }

.modalWidet .modalRow .modalCntArea .addTicket ul li .icn {
    position: absolute;
    right: 15px;
    top: 24px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li .icn {
        right: 11px;
        top: 19px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul li .icn svg {
    width: 20px
}

.modalWidet .modalRow .modalCntArea .addTicket .totalBtm {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    border-top: 1px dashed #dddd;
    margin-top: 20px;
    padding-top: 12px;
    flex-wrap: wrap
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .addTicket .totalBtm {
        gap: 10px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket .totalBtm .download-btn {
    font-size: 16px;
    font-weight: 500;
    line-height: 15px;
    background: var(--theme-colour1);
    color: white;
    padding: 8px 25px;
    border-radius: 30px;
    border: none;
    cursor: pointer;
    height: 40px;
    min-width: 130px;
    width: fit-content;
    transition: ease-in-out 0.4s
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .addTicket .totalBtm .download-btn {
        white-space: nowrap
    }
}

.modalWidet .modalRow .modalCntArea .addTicket .totalBtm .download-btn:hover {
    background-color: var(--theme-colour1-dark)
}

.modalWidet .modalRow .modalCntArea .ticket-card .header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 24px;
    gap: 70px;
    border-bottom: 2px dashed #dddd;
    padding-bottom: 6px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header {
        margin-bottom: 12px;
        padding-bottom: 8px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header {
        gap: 20px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message {
    display: flex;
    align-items: baseline;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap
}

    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .status {
        background-color: #92E3A9;
        padding: 10px 15px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        gap: 5px;
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
        color: var(--c2d)
    }

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .status {
        font-size: 12px;
        line-height: 20px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .status .icn {
    display: flex
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
    width: 131px;
    height: 121px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
        width: 80px;
        height: 80px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
        width: 80px;
        height: 80px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: var(--black)
}

@media (max-width: 1366px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
        font-size: 16px;
        line-height: 22px
    }
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
        font-size: 14px;
        line-height: 20px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
    display: grid;
    grid-template-columns: 1fr 127px;
    grid-gap: 20px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr 90px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr 70px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr;
        grid-gap: 10px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
    border: 1px solid #BBBBBB;
    padding: 9px;
    border-radius: 16px;
    width: 127px;
    height: 127px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        padding: 5px;
        border-radius: 10px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        width: 90px;
        height: 90px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        width: 70px;
        height: 70px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        order: 0
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .qr-img .qr-code {
    width: 100%
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details {
    margin-bottom: 24px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details {
        margin-bottom: 10px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details {
        order: 1
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row {
    display: flex;
    gap: 20px;
    column-gap: 20px;
    margin-bottom: 2px;
    font-size: 14px;
    font-weight: 400;
    line-height: 32px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row {
        font-size: 12px;
        line-height: 22px;
        gap: 15px;
        column-gap: 15px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .label {
    color: var(--c2d);
    max-width: 132px;
    width: 100%
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .label {
        max-width: 90px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .value {
    color: var(--c2d);
    font-weight: 400;
    max-width: 200px;
    width: 100%;
    word-break: break-all
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: var(--c2d);
    margin-bottom: 6px
}

@media (max-width: 1366px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
        font-size: 16px;
        line-height: 30px
    }
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
        font-size: 14px;
        line-height: 28px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
    background-color: #eee;
    padding: 12px 41px 16px 24px;
    border-radius: 10px
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 28px
    }
}

@media (max-width: 767px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 22px
    }
}

@media (max-width: 480px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 16px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table {
    width: 100%;
    border-collapse: collapse;
    text-align: left
}

    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table thead tr th {
        color: var(--c70);
        font-size: 13px;
        font-weight: 400;
        line-height: 22px;
        text-align: start;
        padding-bottom: 7px
    }

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table thead tr th {
        font-size: 12px;
        line-height: 24px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td {
    padding-bottom: 14px;
    font-size: 14px;
    font-weight: 500;
    line-height: 26px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td {
        font-size: 14px;
        line-height: 22px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td:first-child {
    text-align: left;
    color: #000
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td:not(:first-child) {
    text-align: start;
    color: #000
}

.modalWidet .modalRow .modalCntArea .ticket-card .totalBtm {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    border-top: 2px dashed #ccc;
    margin-top: 20px;
    padding-top: 12px;
    flex-wrap: wrap
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .totalBtm {
        gap: 10px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn {
    font-size: 18px;
    font-weight: 500;
    line-height: 15px;
    background: var(--theme-colour1);
    color: white;
    padding: 8px 25px;
    border-radius: 30px;
    border: none;
    cursor: pointer;
    height: 46px;
    width: fit-content
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn {
        font-size: 16px;
        white-space: nowrap;
        height: 40px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .total-section {
    display: flex;
    justify-content: space-between;
    max-width: 231px;
    width: 100%;
    font-size: 24px;
    font-weight: 400;
    line-height: 32px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .total-section {
        font-size: 18px;
        line-height: 24px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .total-section span:last-child {
    font-weight: 500
}

.modalWidet .modalBg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #000;
    opacity: 0;
    -webkit-transition: opacity 0.6s, -webkit-transform 0.5s;
    transition: opacity 0.6s, transform 0.5s;
    -webkit-transform: translate3d(0, 102%, 0);
    transform: translate3d(0, 102%, 0);
    box-shadow: 0 3px 5px 0 rgba(32,33,36,0.2)
}

.modalWidet.open {
    opacity: 1;
    pointer-events: visible;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

    .modalWidet.open .modalBg {
        opacity: 0.5;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

div.dataTables_wrapper div.dataTables_filter label {
    position: relative
}

    div.dataTables_wrapper div.dataTables_filter label .form-control {
        padding-right: 43px
    }

    div.dataTables_wrapper div.dataTables_filter label .icn {
        position: absolute;
        right: 4px;
        top: 3px;
        background-color: #6a961f;
        cursor: pointer;
        width: 31px;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 32px;
        border-radius: 2px
    }

        div.dataTables_wrapper div.dataTables_filter label .icn i {
            color: #fff
        }

.tSoftLoginPage {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    display: grid;
    place-items: center;
    padding-inline: 24px
}

    .tSoftLoginPage .LoginTextArea {
        display: grid;
        gap: 20px
    }

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea {
        gap: 14px
    }
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea {
        gap: 12px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard {
    background: rgba(0,0,0,0.35);
    border-radius: 24px;
    padding: 22px 30px;
    display: flex;
    align-items: center;
    gap: 28px
}

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea .singleCard {
        padding: 16px 24px;
        gap: 20px;
        border-radius: 20px
    }
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea .singleCard {
        padding: 16px 20px;
        gap: 16px;
        border-radius: 16px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard .iconDiv {
    min-width: 60px;
    max-width: 80px;
    width: 100%;
    aspect-ratio: 1
}

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea .singleCard .iconDiv {
        max-width: 70px
    }
}

@media (max-width: 1366px) {
    .tSoftLoginPage .LoginTextArea .singleCard .iconDiv {
        max-width: 60px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard .iconDiv img {
    width: 100%;
    object-fit: cover;
    height: auto
}

.tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardTitle {
    font-size: 24px;
    font-weight: 600;
    line-height: 32px;
    margin-bottom: 12px;
    color: var(--white)
}

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardTitle {
        line-height: 30px;
        font-size: 21px;
        margin-bottom: 10px
    }
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardTitle {
        line-height: 28px;
        font-size: 18px;
        margin-bottom: 8px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardDesc {
    color: var(--white);
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    margin: 0
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardDesc {
        font-size: 15px;
        line-height: 21px
    }
}

@media (max-height: 550px) {
    .tSoftLoginPage .singleCard {
        padding: 14px 18px !important;
        gap: 12px !important
    }

    .tSoftLoginPage .LoginTextArea {
        gap: 8px !important
    }

    .tSoftLoginPage .cardContent .cardTitle {
        line-height: 22px !important;
        margin-bottom: 4px !important
    }

    .tSoftLoginPage .iconDiv {
        min-width: 54px !important
    }
}

.cmnTableFxng .table-responsive {
    overflow: auto;
    max-height: calc((100vh) - 420px)
}

@media (max-width: 767px) {
    .cmnTableFxng .table-responsive {
        max-height: calc((100vh) - 443px)
    }
}

.cmnTableFxng .tableSticky.tableStickyHead {
    background-color: #f9f9f9 !important
}

.cmnTableFxng .table thead {
    position: sticky;
    background-color: #f9f9f9;
    top: -1px;
    z-index: 4;
    border-top: 1px solid #dbdade;
    border-bottom: 1px solid #dbdade
}

@media (max-width: 767px) {
    .cmnTableFxng .dataTables_filter {
        margin: 10px 0 !important
    }
}
/*# sourceMappingURL=app.css.map */









































:root {
    --white: #ffffff;
    --black: #000000;
    --theme-colour1: #6A961F;
    --theme-colour1-dark: #008035;
    --c2d: #2D2D2D;
    --c70: #707070
}

body {
    font-family: "Open Sans", sans-serif
}

.avatar {
    width: 24px;
    height: 24px
}

body {
    background: #F5FAF7
}

.myProfile .avaname {
    font-size: 16px;
    font-weight: 600;
    line-height: 22px;
    color: var(--c2d)
}

@media (max-width: 767px) {
    .myProfile .avaname {
        display: none
    }
}

.myProfile .nav-link .arrow {
    transition: ease-in-out 0.2s
}

@media (max-width: 767px) {
    .myProfile .nav-link .arrow {
        display: none
    }
}

.myProfile .nav-link.show .arrow {
    transform: rotate(180deg)
}

.tab-content {
    box-shadow: 0 0.125rem 0.25rem rgba(165,163,174,0.3)
}

.outletDropDown {
    position: relative
}

@media (max-width: 1279px) {
    .outletDropDown {
        display: none
    }
}

.outletDropDown.outletDropDown2 {
    display: none;
    width: fit-content;
    padding-block: 10px
}

@media (max-width: 1279px) {
    .outletDropDown.outletDropDown2 {
        display: block
    }
}

.outletDropDown.open .headSec .dwnArrow {
    transform: rotate(-180deg)
}

.outletDropDown.open .listwrap {
    display: block;
    opacity: 1;
    pointer-events: all
}

.outletDropDown .headSec {
    display: grid;
    grid-template-columns: 22px 1fr 13px;
    grid-gap: 12px;
    row-gap: 0;
    align-items: center
}

    .outletDropDown .headSec .text {
        font-size: 14px;
        font-weight: 600;
        line-height: 19px;
        color: var(--theme-colour1-dark)
    }

    .outletDropDown .headSec .dwnArrow {
        transition: ease-in-out 0.4s;
        display: flex
    }

.outletDropDown .listwrap {
    padding: 15px 18px;
    background-color: var(--white);
    border-radius: 9px;
    border: 1px solid #E8E8E8;
    box-shadow: 0 0.125rem 0.25rem rgba(165,163,174,0.3);
    position: absolute;
    top: 42px;
    min-width: 370px;
    display: none;
    opacity: 0;
    pointer-events: none
}

    .outletDropDown .listwrap .list {
        display: grid;
        grid-template-columns: 22px 1fr;
        grid-gap: 12px;
        row-gap: 0;
        align-items: center;
        cursor: pointer;
        padding-block: 12px;
        border-bottom: 1px solid #EEEEEE
    }

        .outletDropDown .listwrap .list:hover .text {
            color: var(--theme-colour1-dark)
        }

        .outletDropDown .listwrap .list:hover svg path {
            fill: var(--theme-colour1-dark)
        }

        .outletDropDown .listwrap .list.active .text {
            color: var(--theme-colour1-dark)
        }

        .outletDropDown .listwrap .list.active svg path {
            fill: var(--theme-colour1-dark)
        }

        .outletDropDown .listwrap .list:last-child {
            border-bottom: none
        }

        .outletDropDown .listwrap .list .text {
            font-size: 14px;
            font-weight: 600;
            line-height: 19px;
            color: var(--c2d)
        }

        .outletDropDown .listwrap .list svg path {
            transition: ease-in-out 0.4s
        }

.topHeadTitle {
    font-size: 24px;
    font-weight: 600;
    line-height: 33px;
    color: #2d2d2d;
    margin: 16px 0
}

@media (max-width: 991px) {
    .topHeadTitle {
        font-size: 20px;
        line-height: 29px
    }
}

@media (max-width: 680px) {
    .topHeadTitle {
        font-size: 14px;
        line-height: 19px
    }
}

.search-input-wrapper {
    position: absolute;
    left: 48px;
    display: flex;
    align-items: center
}

    .search-input-wrapper .search-toggler {
        top: 6px !important;
        right: 0 !important
    }

.valTicket {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 62px;
    padding: 5px 21px;
    border-radius: 8px;
    background-color: var(--theme-colour1);
    transition: ease-in-out 0.4s;
    border: 1px solid #EEEEEE;
    outline: none;
    min-width: 229px;
    gap: 8px;
    column-gap: 8px
}

@media (max-width: 1720px) {
    .valTicket {
        height: 60px;
        font-size: 16px;
        padding: 2px 20px;
        min-width: 215px
    }
}

@media (max-height: 800px) {
    .valTicket {
        height: 60px;
        font-size: 16px;
        padding: 2px 20px;
        min-width: 215px
    }
}

@media (max-width: 767px) {
    .valTicket {
        padding: 5px 20px;
        min-width: 226px
    }
}

@media (max-width: 680px) {
    .valTicket {
        height: 50px;
        min-width: 49px
    }
}

.valTicket:hover {
    background-color: var(--theme-colour1-dark)
}

@media (max-width: 680px) {
    .valTicket span {
        display: none
    }
}

.valTicket svg {
    width: 18px;
    height: auto
}

.mainSearchTop {
    padding: 0;
    max-width: calc(1440px - 1.5rem* 2);
    box-shadow: none
}

    .mainSearchTop .mainSearchTopInner {
        box-shadow: 0 0.125rem 0.25rem rgba(165,163,174,0.3);
        flex-wrap: nowrap;
        border-radius: 8px
    }

@media (max-width: 767px) {
    .mainSearchTop .mainSearchTopInner {
        padding-block: 7px
    }
}

@media (max-width: 680px) {
    .mainSearchTop .mainSearchTopInner {
        padding-block: 3px
    }
}

.mainSearchTop .topDropSec {
    gap: 41px;
    column-gap: 41px
}

@media (max-width: 1366px) {
    .mainSearchTop .topDropSec {
        gap: 20px;
        column-gap: 20px
    }
}

.validatePage {
    display: grid;
    grid-template-columns: 1fr 61px 1fr;
    grid-gap: 10px;
    align-items: center;
    padding: 15px
}

@media (max-width: 767px) {
    .validatePage {
        grid-template-columns: 1fr;
        grid-gap: 27px
    }
}

@media (max-width: 680px) {
    .validatePage {
        padding: 0;
        grid-gap: 10px
    }
}

.validatePage .picSec {
    text-align: center
}

@media (max-width: 680px) {
    .validatePage .picSec {
        background-color: var(--white);
        box-shadow: 0 0.125rem 0.25rem rgba(165,163,174,0.3);
        border-radius: 8px;
        padding: 20px;
        width: 100%
    }
}

.validatePage .picSec .pic {
    max-width: 312px;
    width: 100%;
    margin: 0 auto 35px
}

@media (max-width: 767px) {
    .validatePage .picSec .pic {
        margin-bottom: 12px
    }
}

@media (max-width: 680px) {
    .validatePage .picSec .pic {
        max-width: 126px
    }
}

.validatePage .picSec .pic img {
    width: 100%
}

.validatePage .picSec .title {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: var(--c2d);
    text-align: center;
    margin-bottom: 24px
}

@media (max-width: 767px) {
    .validatePage .picSec .title {
        margin-bottom: 15px
    }
}

@media (max-width: 767px) {
    .validatePage .picSec .title {
        font-size: 14px;
        font-weight: 600
    }
}

.validatePage .picSec .title span {
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: var(--c2d);
    margin-top: 11px
}

@media (max-width: 767px) {
    .validatePage .picSec .title span {
        margin-top: 6px
    }
}

.validatePage .picSec .valTicketBtn {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 62px;
    padding: 5px 21px;
    border-radius: 8px;
    background-color: var(--theme-colour1-dark);
    transition: ease-in-out 0.4s;
    border: 1px solid #EEEEEE;
    outline: none;
    min-width: 229px;
    gap: 8px;
    column-gap: 8px;
    margin: auto
}

@media (max-width: 1720px) {
    .validatePage .picSec .valTicketBtn {
        height: 50px;
        font-size: 16px;
        padding: 2px 20px;
        min-width: 212px
    }
}

@media (max-width: 767px) {
    .validatePage .picSec .valTicketBtn {
        min-width: 203px;
        height: 45px;
        font-size: 15px;
        padding: 2px 20px
    }
}

@media (max-height: 800px) {
    .validatePage .picSec .valTicketBtn {
        min-width: 203px;
        height: 45px;
        font-size: 15px;
        padding: 2px 20px
    }
}

@media (max-width: 680px) {
    .validatePage .picSec .valTicketBtn {
        min-width: 152px;
        height: 34px;
        font-size: 12px;
        padding: 2px 14px;
        border-radius: 6px
    }
}

.validatePage .picSec .valTicketBtn:hover {
    background-color: var(--theme-colour1)
}

.validatePage .picSec .valTicketBtn svg {
    width: 18px;
    height: auto
}

@media (max-width: 680px) {
    .validatePage .picSec .valTicketBtn svg {
        width: 11px
    }
}

.validatePage .borderSec {
    position: relative;
    height: 100%;
    display: flex;
    align-items: center
}

@media (max-width: 767px) {
    .validatePage .borderSec {
        justify-content: center
    }
}

.validatePage .borderSec span {
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: var(--c2d);
    width: 61px;
    height: 61px;
    border-radius: 50%;
    border: 1px solid #D8D8D8;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--white);
    z-index: 1
}

@media (max-width: 767px) {
    .validatePage .borderSec span {
        width: 49px;
        height: 49px;
        font-size: 16px
    }
}

@media (max-width: 680px) {
    .validatePage .borderSec span {
        width: 31px;
        height: 31px;
        font-size: 12px;
        background-color: #F5FAF7
    }
}

.validatePage .borderSec::after {
    position: absolute;
    content: "";
    left: 31px;
    top: auto;
    background-color: #D8D8D8;
    width: 1px;
    height: 362px
}

@media (max-width: 767px) {
    .validatePage .borderSec::after {
        width: 440px;
        height: 1px;
        left: auto
    }
}

@media (max-width: 680px) {
    .validatePage .borderSec::after {
        width: 212px
    }
}

.validatePage .formSec {
    max-width: 401px;
    width: 100%;
    margin: auto
}

@media (max-width: 680px) {
    .validatePage .formSec {
        background-color: var(--white);
        box-shadow: 0 0.125rem 0.25rem rgba(165,163,174,0.3);
        border-radius: 8px;
        padding: 20px;
        max-width: 100%
    }
}

.validatePage .formSec .title {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: var(--c2d);
    text-align: center;
    margin-bottom: 28px
}

@media (max-width: 767px) {
    .validatePage .formSec .title {
        margin-bottom: 15px
    }
}

@media (max-width: 767px) {
    .validatePage .formSec .title {
        font-size: 14px;
        font-weight: 600;
        margin-bottom: 9px
    }
}

.validatePage .formSec .title span {
    display: block;
    font-size: 14px;
    font-weight: 400;
    line-height: 19px;
    color: var(--c2d);
    margin-top: 11px
}

@media (max-width: 767px) {
    .validatePage .formSec .title span {
        margin-top: 6px
    }
}

.validatePage .formSec .input-group {
    height: 54px;
    border: 1px solid #DDDDDD;
    border-radius: 11px;
    display: flex;
    align-items: center;
    padding: 5px 20px;
    gap: 8px;
    margin-bottom: 27px
}

@media (max-width: 767px) {
    .validatePage .formSec .input-group {
        margin-bottom: 20px
    }
}

@media (max-width: 680px) {
    .validatePage .formSec .input-group {
        height: 42px;
        border-radius: 8px;
        padding: 5px 19px;
        max-width: 279px;
        width: 100%;
        margin: 0 auto 14px
    }
}

.validatePage .formSec .input-group .form-label {
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    color: var(--c2d);
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 0
}

@media (max-width: 680px) {
    .validatePage .formSec .input-group .form-label {
        font-size: 12px
    }
}

.validatePage .formSec .input-group .form-control {
    border: none;
    height: auto
}

@media (max-width: 680px) {
    .validatePage .formSec .input-group .form-control {
        font-size: 12px
    }
}

.validatePage .formSec .valTicketBtn {
    font-family: "Open Sans", sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 62px;
    padding: 5px 21px;
    border-radius: 8px;
    background-color: var(--theme-colour1-dark);
    transition: ease-in-out 0.4s;
    border: 1px solid #EEEEEE;
    outline: none;
    min-width: 145px;
    gap: 8px;
    column-gap: 8px;
    margin: auto
}

@media (max-width: 1720px) {
    .validatePage .formSec .valTicketBtn {
        height: 50px;
        font-size: 16px;
        padding: 2px 20px
    }
}

@media (max-height: 800px) {
    .validatePage .formSec .valTicketBtn {
        height: 50px;
        font-size: 16px;
        padding: 2px 20px
    }
}

@media (max-width: 767px) {
    .validatePage .formSec .valTicketBtn {
        min-width: 203px;
        height: 48px;
        font-size: 16px;
        padding: 2px 20px
    }
}

@media (max-width: 680px) {
    .validatePage .formSec .valTicketBtn {
        min-width: 275px;
        height: 34px;
        font-size: 12px;
        padding: 2px 14px;
        border-radius: 8px
    }
}

.validatePage .formSec .valTicketBtn:hover {
    background-color: var(--theme-colour1)
}

@media (max-width: 680px) {
    .validateBgTranspnt {
        background: transparent !important;
        box-shadow: none;
        padding: 0
    }
}

.modalWidet {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9995;
    pointer-events: none;
    -webkit-transition: opacity 0.6s, -webkit-transform 0.6s;
    transition: opacity 0.6s, transform 0.6s;
    -webkit-transform: translate3d(0, 102%, 0);
    transform: translate3d(0, 102%, 0);
    box-shadow: 0 3px 5px 0 rgba(32,33,36,0.2);
    opacity: 0
}

@media (max-width: 1366px) {
    .modalWidet {
        padding: 10px
    }
}

.modalWidet .modalRow {
    padding: 31px 29px 25px;
    position: relative;
    background-color: #fff;
    border-radius: 30px;
    z-index: 1;
    max-width: 740px;
    width: 100%
}

@media (max-width: 1366px) {
    .modalWidet .modalRow {
        border-radius: 25px
    }
}

@media (max-width: 1279px) {
    .modalWidet .modalRow {
        border-radius: 20px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow {
        border-radius: 20px
    }
}

@media (max-width: 767px) {
    .modalWidet .modalRow {
        border-radius: 12px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow {
        padding: 25px 15px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 19px;
    gap: 10px;
    border-bottom: 1px solid #dddd;
    padding-bottom: 13px;
    width: 100%
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header {
        margin-bottom: 12px;
        padding-bottom: 8px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header {
        gap: 20px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .closeBtn {
    position: absolute;
    right: -20px;
    top: -16px;
    width: 38px;
    height: 38px;
    border-radius: 6px;
    background-color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 3px 5px 0 rgba(32,33,36,0.2)
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .closeBtn {
        right: 10px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .closeBtn svg {
    width: 12px;
    height: auto
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message {
    display: flex;
    align-items: baseline;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    flex-wrap: wrap;
    width: 100%
}

    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .date {
        font-size: 16px;
        font-weight: 400;
        line-height: 24px;
        color: var(--black);
        background-color: #f4f4f4;
        height: 42px;
        padding: 5px 18px;
        border-radius: 7px;
        display: flex;
        align-items: center;
        gap: 10px;
        column-gap: 10px
    }

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .date {
        display: none
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .date .icn {
    display: flex
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .date p {
    margin: 0
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
    width: 131px;
    height: 121px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
        width: 80px;
        height: 80px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
        width: 80px;
        height: 80px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
    font-size: 24px;
    font-weight: 600;
    line-height: 31px;
    color: var(--black)
}

@media (max-width: 1366px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
        font-size: 20px;
        line-height: 28px
    }
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
        font-size: 18px;
        line-height: 26px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .address {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--theme-colour1-dark);
    margin-bottom: 25px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .address {
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 13px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .address .icnDiv {
    display: flex
}

.modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
    display: grid;
    grid-template-columns: 1fr 122px;
    grid-gap: 20px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr 80px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr 70px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr;
        grid-gap: 10px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card hr {
    width: 100%;
    height: 1px;
    background-color: #DBDADE;
    margin: 5px 0 15px
}

.modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
    border: 1px solid #BBBBBB;
    padding: 10px;
    border-radius: 16px;
    width: 122px;
    height: 122px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        padding: 5px;
        border-radius: 10px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        width: 80px;
        height: 80px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        width: 70px;
        height: 70px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        order: 0
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .qr-img .qr-code {
    width: 100%
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details {
        order: 1
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row {
    display: flex;
    gap: 20px;
    column-gap: 20px;
    margin-bottom: 2px;
    font-size: 14px;
    font-weight: 600;
    line-height: 32px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row {
        font-size: 12px;
        line-height: 22px;
        gap: 15px;
        column-gap: 15px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .label {
    color: var(--c2d);
    max-width: 132px;
    width: 100%
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .label {
        max-width: 90px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .value {
    color: var(--c2d);
    font-weight: 400;
    max-width: 200px;
    width: 100%;
    word-break: break-all
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: var(--c2d);
    margin-bottom: 6px
}

@media (max-width: 1366px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
        font-size: 16px;
        line-height: 30px
    }
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
        font-size: 14px;
        line-height: 28px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
    background-color: #eee;
    padding: 12px 41px 16px 24px;
    border-radius: 10px;
    overflow-x: auto
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 28px
    }
}

@media (max-width: 767px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 22px
    }
}

@media (max-width: 480px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 16px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table::-webkit-scrollbar {
    height: 8px;
    margin-left: 5px;
    left: 5px
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table::-webkit-scrollbar-track {
    background: #e9e9e9
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table::-webkit-scrollbar-thumb {
    background: #cfcfcf
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table {
    width: 100%;
    border-collapse: collapse;
    text-align: left
}

    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table thead tr th {
        color: var(--c70);
        font-size: 13px;
        font-weight: 400;
        line-height: 22px;
        text-align: start;
        padding-bottom: 7px
    }

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table thead tr th {
        font-size: 12px;
        line-height: 24px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td {
    padding-bottom: 14px;
    font-size: 14px;
    font-weight: 500;
    line-height: 26px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td {
        font-size: 14px;
        line-height: 22px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td:first-child {
    text-align: left;
    color: #000
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td:not(:first-child) {
    text-align: start;
    color: #000
}

.modalWidet .modalRow .modalCntArea .ticket-card .totalBtm {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    border-top: 1px solid #DBDADE;
    margin-top: 16px;
    padding-top: 13px;
    flex-wrap: wrap
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .totalBtm {
        gap: 10px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn {
    font-family: "Open Sans", sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    height: 43px;
    padding: 5px 21px;
    border-radius: 8px;
    background-color: var(--theme-colour1-dark);
    transition: ease-in-out 0.4s;
    border: 1px solid #EEEEEE;
    outline: none;
    min-width: 134px;
    gap: 8px;
    column-gap: 8px;
    margin-left: 0
}

@media (max-width: 767px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn {
        padding: 2px 20px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn {
        height: 34px;
        font-size: 12px;
        padding: 2px 14px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn:hover {
    background-color: var(--theme-colour1)
}

.modalWidet .modalRow .modalCntArea .ticket-card .total-section {
    display: flex;
    justify-content: space-between;
    max-width: 231px;
    width: 100%;
    font-size: 18px !important;
    line-height: 24px !important;
    font-weight: 600 !important;
    color: var(--c2d)
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .total-section {
        font-size: 16px !important;
        line-height: 22px !important
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .total-section span:last-child {
    font-weight: 500
}

.modalWidet .modalBg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #000;
    opacity: 0;
    -webkit-transition: opacity 0.6s, -webkit-transform 0.5s;
    transition: opacity 0.6s, transform 0.5s;
    -webkit-transform: translate3d(0, 102%, 0);
    transform: translate3d(0, 102%, 0);
    box-shadow: 0 3px 5px 0 rgba(32,33,36,0.2)
}

.modalWidet.open {
    opacity: 1;
    pointer-events: visible;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

    .modalWidet.open .modalBg {
        opacity: 0.5;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

img, svg {
    width: 100%;
    height: auto;
    object-fit: cover
}

p, h1, h2, h3, h4, h5, h6 {
    margin: 0
}

@media (max-width: 680px) {
    .tab-content {
        padding-inline: 1rem !important
    }
}

.vaildateCheckingWrapper {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 45px;
    padding-block-end: 26px
}

@media (max-width: 1366px) {
    .vaildateCheckingWrapper {
        gap: 30px
    }
}

@media (max-width: 1279px) {
    .vaildateCheckingWrapper {
        grid-template-columns: 120px 1fr
    }
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper {
        grid-template-columns: 1fr
    }
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper {
        padding-block-end: 16px
    }
}

.vaildateCheckingWrapper .mainImg {
    max-width: 150px;
    max-height: 140px;
    margin: auto
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .mainImg {
        display: none
    }
}

.vaildateCheckingWrapper .calanderDiv {
    display: flex;
    align-items: center;
    gap: 10px
}

    .vaildateCheckingWrapper .calanderDiv .labelSec {
        font-size: 16px;
        font-weight: 500;
        line-height: 19px;
        color: #2d2d2d
    }

.vaildateCheckingWrapper .calander {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 10px;
    border-radius: 7px;
    background-color: #F9F9F9;
    width: fit-content
}

    .vaildateCheckingWrapper .calander span {
        width: 20px;
        height: 20px;
        margin-block-start: -6px
    }

    .vaildateCheckingWrapper .calander p {
        color: var(--c2d);
        font-size: 14px;
        font-weight: 400;
        line-height: 19px
    }

.vaildateCheckingWrapper .rightWrapper .topSec {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-block-end: 16px
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .topSec {
        display: none
    }
}

.vaildateCheckingWrapper .rightWrapper .topSec .bookingTitle {
    color: var(--theme-colour1-dark);
    font-size: 18px;
    font-weight: 600;
    line-height: 24px
}

.vaildateCheckingWrapper .rightWrapper .topSecTabView {
    display: none
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .topSecTabView {
        display: grid;
        grid-template-columns: auto 1fr auto;
        gap: 34px;
        padding-block-end: 24px
    }
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .topSecTabView {
        display: none
    }
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .topSecTabView .mainImg {
        display: flex;
        max-width: 110px;
        max-height: 99px;
        margin: 0
    }

        .vaildateCheckingWrapper .rightWrapper .topSecTabView .mainImg.varified {
            max-height: fit-content
        }
}

.vaildateCheckingWrapper .rightWrapper .topSecTabView .topMidSec .bookingTitle {
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: var(--theme-colour1-dark);
    margin-block-end: 8px
}

.vaildateCheckingWrapper .rightWrapper .topSecTabView .topMidSec .title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-block-end: 20px
}

    .vaildateCheckingWrapper .rightWrapper .topSecTabView .topMidSec .title h4 {
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        color: var(--c2d)
    }

    .vaildateCheckingWrapper .rightWrapper .topSecTabView .topMidSec .title span {
        display: block;
        width: 18px;
        height: auto
    }

.vaildateCheckingWrapper .rightWrapper .topSecMobView {
    display: none
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .topSecMobView {
        display: block
    }

        .vaildateCheckingWrapper .rightWrapper .topSecMobView .mobTop {
            display: flex;
            align-items: center;
            gap: 14px;
            padding-block-end: 14px;
            border-bottom: 1px solid #EEEEEE
        }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .mobTop .mainImg {
                display: flex;
                max-width: 46px;
                max-height: 46px;
                margin: 0
            }

                .vaildateCheckingWrapper .rightWrapper .topSecMobView .mobTop .mainImg.varified {
                    max-height: fit-content
                }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .mobTop .bookingTitle {
                font-size: 14px;
                font-weight: 600;
                line-height: 20px;
                color: var(--c2d)
            }

        .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec {
            display: flex;
            gap: 14px;
            align-items: center;
            padding-block: 12px 20px
        }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .QrDiv {
                width: 80px;
                aspect-ratio: 1
            }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .calanderDiv {
                display: flex;
                align-items: center;
                gap: 5px
            }

                .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .calanderDiv .labelSec {
                    font-size: 12px;
                    font-weight: 500;
                    line-height: 4px;
                    color: #2d2d2d
                }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .calander span {
                width: 14px;
                height: 14px;
                margin-block-start: -10px
            }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .calander p {
                color: var(--c2d);
                font-size: 12px;
                font-weight: 400;
                line-height: 18px
            }

            .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .title {
                display: flex;
                align-items: flex-start;
                gap: 4px;
                margin-block-end: 12px
            }

                .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .title span {
                    display: flex;
                    width: 14px;
                    height: 12px;
                    margin-block-start: 3px
                }

                    .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .title span svg path {
                        fill: var(--theme-colour1-dark)
                    }

                .vaildateCheckingWrapper .rightWrapper .topSecMobView .topMidSec .wrapper .title h4 {
                    font-size: 12px;
                    font-weight: 600;
                    line-height: 18px;
                    color: var(--theme-colour1-dark)
                }
}

.vaildateCheckingWrapper .rightWrapper .midSec {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 24px;
    padding-block-start: 20px;
    border-top: 1px solid #EEEEEE;
    background-image: linear-gradient(to right, #eee 50%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 35px 1px;
    background-repeat: repeat-x
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .midSec {
        padding-block-start: 24px
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .title {
    display: flex;
    align-items: center;
    gap: 8px
}

    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .title h4 {
        font-size: 14px;
        font-weight: 600;
        line-height: 20px;
        color: var(--c2d)
    }

    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .title span {
        display: block;
        width: 18px;
        height: auto
    }

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .title {
        display: none
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails {
    max-width: 780px;
    width: 100%;
    display: grid;
    grid-template-columns: 350px 1fr;
    gap: 24px;
    padding-block: 26px 30px;
    align-items: flex-start
}

@media (max-width: 1366px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails {
        grid-template-columns: 290px 1fr
    }
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails {
        padding-block-start: 0;
        grid-template-columns: 340px 1fr
    }
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails {
        display: flex;
        flex-wrap: wrap;
        gap: 26px
    }
}

@media (max-width: 767px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails {
        grid-template-columns: 1fr
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap {
    display: grid;
    gap: 26px;
    position: relative
}

    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec {
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: flex-start;
        gap: 24px
    }

@media (max-width: 480px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec {
        gap: 12px
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .name, .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .value {
    color: var(--c2d);
    font-size: 14px;
    font-weight: 600;
    line-height: 19px
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .name {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    min-width: 160px;
    max-width: 160px
}

@media (max-width: 1366px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .name {
        min-width: 100px;
        max-width: 100px
    }
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .name {
        min-width: 155px;
        max-width: 155px
    }
}

@media (max-width: 480px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .name {
        min-width: 115px;
        word-break: break-all;
        max-width: 115px
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptLeft .bookingDetails .singleSecWrap .singleSec .value {
    font-weight: 400
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptRight {
    align-self: center
}

@media (max-width: 1199px) {
    .vaildateCheckingWrapper .rightWrapper .midSec .sliptRight {
        display: none
    }
}

.vaildateCheckingWrapper .rightWrapper .midSec .sliptRight .QrDiv {
    max-width: 110px;
    aspect-ratio: 1
}

.vaildateCheckingWrapper .rightWrapper .btmSec {
    padding-block-start: 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec {
        display: block
    }
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec {
        padding-block-start: 16px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap {
    display: flex;
    align-items: center;
    gap: 17px
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap {
        padding-block-end: 20px;
        background-image: linear-gradient(to right, #eee 50%, rgba(255,255,255,0) 0%);
        background-position: bottom;
        background-size: 35px 1px;
        background-repeat: repeat-x
    }
}

@media (max-width: 991px) and (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap {
        gap: 8px;
        padding-block-end: 16px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv {
    width: fit-content;
    padding: 10px 18px;
    display: flex;
    align-items: center;
    gap: 18px;
    background-color: #F8F8F8;
    border: 1px solid #EEEEEE;
    border-radius: 11px
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv {
        padding: 12px 10px;
        gap: 6px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv h4, .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv span {
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
    color: var(--c2d)
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv h4, .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv span {
        font-size: 12px;
        font-weight: 600;
        line-height: 18px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv span {
    background-color: var(--white);
    border-radius: 5px;
    padding: 7px 12px
}

@media (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .countBtnWrap .countDiv span {
        padding: 4px 8px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table {
    background-color: #F8F8F8;
    border: 1px solid #EEEEEE;
    border-radius: 11px;
    padding: 12px 20px 0 24px;
    overflow-x: auto
}

    .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table::-webkit-scrollbar {
        height: 8px;
        margin-left: 5px;
        left: 5px
    }

    .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table::-webkit-scrollbar-track {
        background: #e9e9e9
    }

    .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table::-webkit-scrollbar-thumb {
        background: #cfcfcf
    }

    .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table table {
        width: 100%;
        border-collapse: collapse;
        text-align: left
    }

        .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table table thead tr th {
            color: var(--c70);
            font-size: 13px;
            font-weight: 400;
            line-height: 22px;
            text-align: start;
            padding-bottom: 7px
        }

        .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table table tbody tr td {
            padding-bottom: 14px;
            font-size: 14px;
            font-weight: 500;
            line-height: 26px;
            color: #000
        }

            .vaildateCheckingWrapper .rightWrapper .btmSec .pricing-table table tbody tr td:first-child {
                text-align: left;
                color: #000
            }

.vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap {
    display: flex;
    align-items: center
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap {
        justify-content: space-between;
        padding-block-start: 24px
    }
}

@media (max-width: 991px) and (max-width: 680px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap.SuccessMob {
        display: grid;
        place-items: center;
        justify-content: center
    }
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap.SuccessMob .bg {
        max-width: 290px;
        width: 100%
    }

    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap.ticket {
        justify-content: center
    }

        .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap.ticket .cmnButton {
            max-width: 345px;
            width: 100%
        }
}

@media (max-width: 991px) {
    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap {
        padding-block-start: 12px
    }
}

.vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap .cmnButtonSvg {
    background-color: transparent;
    color: var(--theme-colour1-dark);
    display: flex;
    align-items: center;
    gap: 10px
}

    .vaildateCheckingWrapper .rightWrapper .btmSec .buttonwrap .cmnButtonSvg span {
        width: 20px
    }

.vaildateCheckingWrapper .rightWrapper .btmSec .cmnButton {
    border: none;
    background-color: var(--theme-colour1-dark);
    color: var(--white);
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    line-height: 19px;
    padding: 12px 33px
}

    .vaildateCheckingWrapper .rightWrapper .btmSec .cmnButton.bg {
        background-color: var(--theme-colour1)
    }

.iconBooking {
    display: block;
    max-width: 20px;
    height: 18px
}

.viewDetails {
    color: var(--theme-colour1-dark) !important;
    text-decoration: underline;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px
}

.phnNumberdata, .maildata {
    display: flex;
    align-items: center
}

    .phnNumberdata .VerifiedIcn, .phnNumberdata .errorIcn, .maildata .VerifiedIcn, .maildata .errorIcn {
        width: 15px;
        height: 15px;
        display: grid;
        margin-left: 10px
    }

.tableSticky {
    cursor: pointer
}

.bookingTabList .nav-item {
    width: fit-content;
    flex: 0 1 auto
}

    .bookingTabList .nav-item .nav-link:hover {
        color: var(--theme-colour1-dark) !important
    }

    .bookingTabList .nav-item .nav-link.active {
        background-color: var(--theme-colour1-dark) !important;
        color: var(--white) !important
    }

@media (max-width: 767px) {
    .cmnTableTop .searchArea {
        width: 100%
    }
}

@media (max-width: 767px) {
    .cmnTableTop .searchArea .dataTables_filter {
        width: 100%
    }
}

@media (max-width: 767px) {
    .cmnTableTop .searchArea .dataTables_filter label {
        width: 100%;
        padding-left: 9px
    }
}

@media (max-width: 767px) {
    .cmnTableTop .searchArea .dataTables_filter label .form-control {
        width: 100%;
        margin-left: 0
    }
}

.toast {
    background-color: #FFFFFF
}

.modalWidet {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9995;
    pointer-events: none;
    -webkit-transition: opacity 0.6s, -webkit-transform 0.6s;
    transition: opacity 0.6s, transform 0.6s;
    -webkit-transform: translate3d(0, 102%, 0);
    transform: translate3d(0, 102%, 0);
    box-shadow: 0 3px 5px 0 rgba(32,33,36,0.2);
    opacity: 0
}

@media (max-width: 1366px) {
    .modalWidet {
        padding: 10px
    }
}

.modalWidet .modalRow {
    padding: 42px 32px;
    position: relative;
    background-color: #fff;
    border-radius: 25px;
    z-index: 1;
    max-width: 756px;
    width: 100%
}

@media (max-width: 1279px) {
    .modalWidet .modalRow {
        border-radius: 20px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow {
        border-radius: 20px
    }
}

@media (max-width: 767px) {
    .modalWidet .modalRow {
        border-radius: 12px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow {
        padding: 25px 15px
    }
}

.modalWidet .modalRow .closeBtn {
    cursor: pointer
}

.modalWidet .modalRow.confirmationPopup {
    padding: 20px 32px
}

@media (max-width: 680px) {
    .modalWidet .modalRow.confirmationPopup {
        padding: 25px 15px
    }
}

.modalWidet .modalRow.confirmationPopup .header {
    border-bottom: none !important;
    padding-bottom: 0 !important
}

.modalWidet .modalRow.confirmationPopup .pic {
    width: 80px;
    height: 80px;
    margin: 0 auto 15px
}

.modalWidet .modalRow.confirmationPopup h5 {
    font-size: 18px;
    font-weight: 400;
    line-height: 26px;
    color: var(--c2d);
    text-align: center;
    max-width: 320px;
    margin: auto
}

@media (max-width: 1680px) {
    .modalWidet .modalRow.confirmationPopup h5 {
        font-size: 16px;
        line-height: 21px
    }
}

.modalWidet .modalRow.confirmationPopup .totalBtm {
    margin-top: 40px !important;
    gap: 10px !important
}

.modalWidet .modalRow.confirmationPopup .download-btn.btnBorder {
    background-color: var(--c70) !important
}

    .modalWidet .modalRow.confirmationPopup .download-btn.btnBorder:hover {
        background-color: var(--theme-colour1-dark) !important
    }

.modalWidet .modalRow.confirmationPopup .qrDiv {
    width: 100%;
    height: 100%;
    border: 1px dashed var(--theme-colour1);
    min-height: 360px;
    border-radius: 10px;
    margin: 13px 0px;
    display: flex;
    align-items: center;
    justify-content: center
}

@media (max-width: 680px) {
    .modalWidet .modalRow.confirmationPopup .qrDiv {
        margin: -9px 0px;
        min-height: 290px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket .header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 24px;
    gap: 70px;
    border-bottom: 1px dashed #dddd;
    padding-bottom: 6px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .addTicket .header {
        margin-bottom: 12px;
        padding-bottom: 8px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .addTicket .header {
        gap: 20px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket .header .success-message {
    display: flex;
    align-items: baseline;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap
}

    .modalWidet .modalRow .modalCntArea .addTicket .header .success-message .title {
        font-size: 18px;
        font-weight: 500;
        line-height: 24px;
        color: var(--black)
    }

@media (max-width: 1366px) {
    .modalWidet .modalRow .modalCntArea .addTicket .header .success-message .title {
        font-size: 16px;
        line-height: 22px
    }
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .addTicket .header .success-message .title {
        font-size: 14px;
        line-height: 20px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul {
    padding: 0;
    margin: 0
}

    .modalWidet .modalRow .modalCntArea .addTicket ul li {
        margin-bottom: 10px;
        padding: 12px 15px 12px 15px;
        border-radius: 8px;
        background-color: var(--white);
        border: 1px solid #f5f5f5;
        cursor: pointer;
        transition: ease-in-out 0.4s;
        display: flex;
        align-items: center;
        position: relative
    }

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li {
        padding: 9px 15px 9px 15px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul li p {
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
    color: var(--c2d);
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 5px;
    column-gap: 5px
}

@media (max-width: 1680px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li p {
        font-size: 16px;
        line-height: 20px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li p {
        font-size: 14px;
        line-height: 18px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul li p span {
    font-size: 13px;
    font-weight: 500;
    line-height: 17px;
    color: var(--black)
}

@media (max-width: 1680px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li p span {
        font-size: 10px;
        line-height: 14px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul li span {
    font-size: 13px;
    font-weight: 400;
    line-height: 21px;
    color: var(--c70)
}

@media (max-width: 1680px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li span {
        font-size: 10px;
        line-height: 18px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li span {
        font-size: 10px;
        line-height: 18px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul li:hover {
    color: var(--theme-colour1-dark);
    background-color: #d0eddc;
    border: 1px solid #d0eddc
}

    .modalWidet .modalRow .modalCntArea .addTicket ul li:hover p span {
        color: var(--c2d)
    }

    .modalWidet .modalRow .modalCntArea .addTicket ul li:hover span {
        color: #729982
    }

    .modalWidet .modalRow .modalCntArea .addTicket ul li:hover svg path {
        fill: var(--theme-colour1-dark)
    }

.modalWidet .modalRow .modalCntArea .addTicket ul li.active {
    color: var(--theme-colour1-dark);
    background-color: #d0eddc;
    border: 1px solid #d0eddc
}

    .modalWidet .modalRow .modalCntArea .addTicket ul li.active p span {
        color: var(--c2d)
    }

    .modalWidet .modalRow .modalCntArea .addTicket ul li.active span {
        color: #729982
    }

    .modalWidet .modalRow .modalCntArea .addTicket ul li.active svg path {
        fill: var(--theme-colour1-dark)
    }

.modalWidet .modalRow .modalCntArea .addTicket ul li .icn {
    position: absolute;
    right: 15px;
    top: 24px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .addTicket ul li .icn {
        right: 11px;
        top: 19px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket ul li .icn svg {
    width: 20px
}

.modalWidet .modalRow .modalCntArea .addTicket .totalBtm {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    border-top: 1px dashed #dddd;
    margin-top: 20px;
    padding-top: 12px;
    flex-wrap: wrap
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .addTicket .totalBtm {
        gap: 10px
    }
}

.modalWidet .modalRow .modalCntArea .addTicket .totalBtm .download-btn {
    font-size: 16px;
    font-weight: 500;
    line-height: 15px;
    background: var(--theme-colour1);
    color: white;
    padding: 8px 25px;
    border-radius: 30px;
    border: none;
    cursor: pointer;
    height: 40px;
    min-width: 130px;
    width: fit-content;
    transition: ease-in-out 0.4s
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .addTicket .totalBtm .download-btn {
        white-space: nowrap
    }
}

.modalWidet .modalRow .modalCntArea .addTicket .totalBtm .download-btn:hover {
    background-color: var(--theme-colour1-dark)
}

.modalWidet .modalRow .modalCntArea .ticket-card .header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 24px;
    gap: 70px;
    border-bottom: 2px dashed #dddd;
    padding-bottom: 6px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header {
        margin-bottom: 12px;
        padding-bottom: 8px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header {
        gap: 20px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message {
    display: flex;
    align-items: baseline;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap
}

    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .status {
        background-color: #92E3A9;
        padding: 10px 15px;
        border-radius: 8px;
        display: flex;
        align-items: center;
        gap: 5px;
        font-size: 16px;
        font-weight: 500;
        line-height: 24px;
        color: var(--c2d)
    }

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .status {
        font-size: 12px;
        line-height: 20px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .status .icn {
    display: flex
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
    width: 131px;
    height: 121px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
        width: 80px;
        height: 80px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .checkmark img {
        width: 80px;
        height: 80px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: var(--black)
}

@media (max-width: 1366px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
        font-size: 16px;
        line-height: 22px
    }
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .header .success-message .title {
        font-size: 14px;
        line-height: 20px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
    display: grid;
    grid-template-columns: 1fr 127px;
    grid-gap: 20px
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr 90px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr 70px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .cardSplit {
        grid-template-columns: 1fr;
        grid-gap: 10px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
    border: 1px solid #BBBBBB;
    padding: 9px;
    border-radius: 16px;
    width: 127px;
    height: 127px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        padding: 5px;
        border-radius: 10px
    }
}

@media (max-height: 800px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        width: 90px;
        height: 90px
    }
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        width: 70px;
        height: 70px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .qr-img {
        order: 0
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .qr-img .qr-code {
    width: 100%
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details {
    margin-bottom: 24px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details {
        margin-bottom: 10px
    }
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details {
        order: 1
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row {
    display: flex;
    gap: 20px;
    column-gap: 20px;
    margin-bottom: 2px;
    font-size: 14px;
    font-weight: 400;
    line-height: 32px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row {
        font-size: 12px;
        line-height: 22px;
        gap: 15px;
        column-gap: 15px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .label {
    color: var(--c2d);
    max-width: 132px;
    width: 100%
}

@media (max-width: 575px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .label {
        max-width: 90px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .detail-row .value {
    color: var(--c2d);
    font-weight: 400;
    max-width: 200px;
    width: 100%;
    word-break: break-all
}

.modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: var(--c2d);
    margin-bottom: 6px
}

@media (max-width: 1366px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
        font-size: 16px;
        line-height: 30px
    }
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .booking-details .title {
        font-size: 14px;
        line-height: 28px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
    background-color: #eee;
    padding: 12px 41px 16px 24px;
    border-radius: 10px
}

@media (max-width: 991px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 28px
    }
}

@media (max-width: 767px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 22px
    }
}

@media (max-width: 480px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table {
        padding: 16px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table {
    width: 100%;
    border-collapse: collapse;
    text-align: left
}

    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table thead tr th {
        color: var(--c70);
        font-size: 13px;
        font-weight: 400;
        line-height: 22px;
        text-align: start;
        padding-bottom: 7px
    }

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table thead tr th {
        font-size: 12px;
        line-height: 24px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td {
    padding-bottom: 14px;
    font-size: 14px;
    font-weight: 500;
    line-height: 26px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td {
        font-size: 14px;
        line-height: 22px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td:first-child {
    text-align: left;
    color: #000
}

.modalWidet .modalRow .modalCntArea .ticket-card .pricing-table table tbody tr td:not(:first-child) {
    text-align: start;
    color: #000
}

.modalWidet .modalRow .modalCntArea .ticket-card .totalBtm {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    border-top: 2px dashed #ccc;
    margin-top: 20px;
    padding-top: 12px;
    flex-wrap: wrap
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .totalBtm {
        gap: 10px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn {
    font-size: 18px;
    font-weight: 500;
    line-height: 15px;
    background: var(--theme-colour1);
    color: white;
    padding: 8px 25px;
    border-radius: 30px;
    border: none;
    cursor: pointer;
    height: 46px;
    width: fit-content
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .totalBtm .download-btn {
        font-size: 16px;
        white-space: nowrap;
        height: 40px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .total-section {
    display: flex;
    justify-content: space-between;
    max-width: 231px;
    width: 100%;
    font-size: 24px;
    font-weight: 400;
    line-height: 32px
}

@media (max-width: 680px) {
    .modalWidet .modalRow .modalCntArea .ticket-card .total-section {
        font-size: 18px;
        line-height: 24px
    }
}

.modalWidet .modalRow .modalCntArea .ticket-card .total-section span:last-child {
    font-weight: 500
}

.modalWidet .modalBg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: #000;
    opacity: 0;
    -webkit-transition: opacity 0.6s, -webkit-transform 0.5s;
    transition: opacity 0.6s, transform 0.5s;
    -webkit-transform: translate3d(0, 102%, 0);
    transform: translate3d(0, 102%, 0);
    box-shadow: 0 3px 5px 0 rgba(32,33,36,0.2)
}

.modalWidet.open {
    opacity: 1;
    pointer-events: visible;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

    .modalWidet.open .modalBg {
        opacity: 0.5;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

div.dataTables_wrapper div.dataTables_filter label {
    position: relative
}

    div.dataTables_wrapper div.dataTables_filter label .form-control {
        padding-right: 43px
    }

    div.dataTables_wrapper div.dataTables_filter label .icn {
        position: absolute;
        right: 4px;
        top: 3px;
        background-color: #6a961f;
        cursor: pointer;
        width: 31px;
        display: flex;
        align-items: center;
        justify-content: center;
        height: 32px;
        border-radius: 2px
    }

        div.dataTables_wrapper div.dataTables_filter label .icn i {
            color: #fff
        }

.tSoftLoginPage {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    display: grid;
    place-items: center;
    padding-inline: 24px
}

    .tSoftLoginPage .LoginTextArea {
        display: grid;
        gap: 20px
    }

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea {
        gap: 14px
    }
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea {
        gap: 12px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard {
    background: rgba(0,0,0,0.35);
    border-radius: 24px;
    padding: 22px 30px;
    display: flex;
    align-items: center;
    gap: 28px
}

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea .singleCard {
        padding: 16px 24px;
        gap: 20px;
        border-radius: 20px
    }
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea .singleCard {
        padding: 16px 20px;
        gap: 16px;
        border-radius: 16px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard .iconDiv {
    min-width: 60px;
    max-width: 80px;
    width: 100%;
    aspect-ratio: 1
}

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea .singleCard .iconDiv {
        max-width: 70px
    }
}

@media (max-width: 1366px) {
    .tSoftLoginPage .LoginTextArea .singleCard .iconDiv {
        max-width: 60px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard .iconDiv img {
    width: 100%;
    object-fit: cover;
    height: auto
}

.tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardTitle {
    font-size: 24px;
    font-weight: 600;
    line-height: 32px;
    margin-bottom: 12px;
    color: var(--white)
}

@media (max-width: 1680px) {
    .tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardTitle {
        line-height: 30px;
        font-size: 21px;
        margin-bottom: 10px
    }
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardTitle {
        line-height: 28px;
        font-size: 18px;
        margin-bottom: 8px
    }
}

.tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardDesc {
    color: var(--white);
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    margin: 0
}

@media (max-width: 1450px) {
    .tSoftLoginPage .LoginTextArea .singleCard .cardContent .cardDesc {
        font-size: 15px;
        line-height: 21px
    }
}

@media (max-height: 550px) {
    .tSoftLoginPage .singleCard {
        padding: 14px 18px !important;
        gap: 12px !important
    }

    .tSoftLoginPage .LoginTextArea {
        gap: 8px !important
    }

    .tSoftLoginPage .cardContent .cardTitle {
        line-height: 22px !important;
        margin-bottom: 4px !important
    }

    .tSoftLoginPage .iconDiv {
        min-width: 54px !important
    }
}

.cmnTableFxng .table-responsive {
    overflow: auto;
    max-height: calc((100vh) - 420px)
}

@media (max-width: 767px) {
    .cmnTableFxng .table-responsive {
        max-height: calc((100vh) - 443px)
    }
}

.cmnTableFxng .tableSticky.tableStickyHead {
    background-color: #f9f9f9 !important
}

.cmnTableFxng .table thead {
    position: sticky;
    background-color: #f9f9f9;
    top: -1px;
    z-index: 4;
    border-top: 1px solid #dbdade;
    border-bottom: 1px solid #dbdade
}

@media (max-width: 767px) {
    .cmnTableFxng .dataTables_filter {
        margin: 10px 0 !important
    }
}
/*# sourceMappingURL=app.css.map */

