* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/*--- common css ---*/

@font-face {
    src: url(../fonts/Manrope/Manrope-ExtraBold.ttf);
    font-family: 'Manrope-ExtraBold';
}

@font-face {
    src: url(../fonts/Manrope/Manrope-Bold.ttf);
    font-family: 'Manrope-Bold';
}

@font-face {
    src: url(../fonts/Manrope/Manrope-SemiBold.ttf);
    font-family: 'Manrope-SemiBold';
}

@font-face {
    src: url(../fonts/Manrope/Manrope-Medium.ttf);
    font-family: 'Manrope-Medium';
}

@font-face {
    src: url(../fonts/Manrope/Manrope-Regular.ttf);
    font-family: 'Manrope-Regular';
}

/* ----------------- */

@font-face {
    src: url(../fonts/Poppins/Poppins-Medium.ttf);
    font-family: 'Poppins-Medium';
}

@font-face {
    src: url(../fonts/Poppins/Poppins-Regular.ttf);
    font-family: 'Poppins-Regular';
}

@font-face {
    src: url(../fonts/Poppins/Poppins-SemiBold.ttf);
    font-family: 'Poppins-SemiBold';
}

/* ---------------- */

@font-face {
    src: url(../fonts/gilroy/Gilroy-Bold.ttf);
    font-family: 'Gilroy-Bold';
}

@font-face {
    src: url(../fonts/gilroy/Gilroy-SemiBold.ttf);
    font-family: 'Gilory-SemiBold';
}

@font-face {
    src: url(../fonts/gilroy/Gilroy-Medium.ttf);
    font-family: 'Gilroy-Medium';
}

@font-face {
    src: url(../fonts/gilroy/Gilroy-ExtraBold.ttf);
    font-family: 'Gilroy-ExtraBold';
}

@font-face {
    src: url(../fonts/gilroy/Gilroy-Regular.ttf);
    font-family: 'Gilroy-Regular';
}


:root {
    --drak-mode: #171202;
    --theme-blackbg: #23252E;
    --body-dark: #2C2C2C;
    --dark-box: #171202;
    --textP-color: #94A3B8;
    --light-text: #D1D1D1;
}

:root {
    --body-color: #f5f5f0;
    --white-color: #fff;
    --black-color: #000;
    --text-black: #23252E;
    --gray-color: #888E9D;
    --gold-color: #E3BD3E;
    --menu-blue: #122559;
    --light-blue: #0963A4;
    --star-color: #FFD166;
    --border-color: #dcdee0;
    --input-color: #777E90;
    --purplr-light: #C3D0FE;
    --green-color: #1D8841;
}

h1 {
    font-size: 65px;
}

h2 {
    font-size: 56px;
}

h3 {
    font-size: 45px;
}

h4 {
    font-size: 32px;
}

h5 {
    font-size: 22px;
}

h6 {
    font-size: 18px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: sans-serif;
    margin-bottom: 20px;
    line-height: 1.2;
    color: var(--text-black);
}


p {
    font-size: 16px;
    line-height: 1.5;
    color: var(--gray-color);
}

p.small {
    font-size: 14px;
}

p:last-child {
    margin-bottom: 0;
}

span {
    display: inline-block;
}

ul,
ol {
    margin: 0;
    padding: 0;
    list-style: none;
}

image,
video {
    width: 100%;
}

a {
    display: inline-block;
    text-decoration: none;
}

.common-btn {
    font-size: 16px;
    color: var(--text-black);
    padding: 0px 25px;
    height: 48px;
    border-radius: 90px;
    transition: 0.5s all;
    background: var(--white-color);
    font-family: 'Manrope-Bold';
    box-shadow: none !important;
    outline: none !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.showMore {
    text-align: center;
    margin-top: 40px;
}

.showMoreBtn {
    background-color: var(--white-color);
    border-radius: 30px;
    height: 48px;
    padding: 0 20px;
    font-family: 'Manrope-Bold';
    outline: none !important;
    box-shadow: none !important;
}

.showMoreBtn i {
    font-size: 12px;
    margin-left: 5px;
}

section {
    padding: 50px 0;
    overflow-x: hidden;
    overflow-y: auto;
}

body {
    background: var(--body-color);
}

.desktop {
    display: none !important;
}

.mobile {
    display: block !important;
}

input[type="date"] {
    -webkit-appearance: none;
    appearance: none;
}



/* ========== Drak-Mode css start ========== */

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

body.dark header.show {
    background-color: #1f1f1fe1;
    box-shadow: 0 0 8px 2px #ffffff25;
}

body.dark .header-fav-icon a {
    color: #a9abb0;
}

body.dark .pageSection2 .Section2Box .travelBox,
body.dark .mainDetailsBox .toursTab,
body.dark .exploreTour .ourTourBox {
    background-color: var(--dark-box) !important;
    box-shadow: 0px 0px 30px #414141 !important;
}

body.dark .tripPrices .costBox table {
    background-color: var(--dark-box) !important;
}

body.dark .ourClickBox .flatpickr-calendar.inline {
    background-color: var(--dark-box) !important;
}

body.dark .flatpickr-calendar {
    background-color: var(--dark-box) !important;
}

body.dark .orderListbox .orderListRight .tourcombox .tourname ul li span.yellelist,
body.dark .orderListbox .orderListRight .tourcombox .tourname ul li span.listgray,
body.dark .orderListbox .orderListRight .tourcombox .tourname ul li span.purplelist {
    color: #000000 !important;
}

body.dark .flatpickr-months .flatpickr-month,
body.dark .flatpickr-weekday,
body.dark .flatpickr-day,
body.dark .orderListbox .orderListRight .tourcombox .tourname ul li span,
body.dark .rate_title .commonLabelSecond,
body.dark .tripPrices .costBox table tr td span,
body.dark .form-check-label,
body.dark .productImportLabel,
body.dark .tripPrices .costBox table tr td p {
    color: #94A3B8 !important;
}

body.dark .rate_title {
    border-color: #334155 !important;
}

body.dark .tripPrices .costBox table th,
body.dark .tripPrices .costBox table td,
body.dark .tripPrices .costBox table {
    border-color: #334155 !important;
}

body.dark .available-date,
body.dark .showList .box-box h5 span.yellowBg,
body.dark span.listgray {
    background-color: #2F2304 !important;
}

body.dark .flatpickr-months .flatpickr-prev-month,
body.dark .flatpickr-months .flatpickr-next-month {
    color: #94A3B8 !important;
    fill: #94A3B8 !important;
}

body.dark .dateBoxLeft .flatpickr-months {
    border-color: #334155 !important;
}


body.dark .ourClickBox .flatpickr-day,
body.dark .ourClickBox .flatpickr-monthDropdown-months,
body.dark .ourClickBox .numInput.cur-year {
    color: var(--white-color) !important;
}

body.dark .ourClickBox span.flatpickr-prev-month svg,
body.dark .ourClickBox span.flatpickr-next-month svg,
body.dark .infoDetails .typecheck .keyword-label {
    color: var(--white-color) !important;
}

body.dark .ourClickBox .catMenuBox .clickTo .keyword-label {
    color: var(--white-color);
}

body.dark .pageSection2 .Section2Box .travelBox .textBox {
    background-color: var(--dark-box) !important;
}

body.dark .typeBox,
body.dark .typeBox,
body.dark .typeBox input {
    background: linear-gradient(30deg, rgb(32 31 31 / 82%) 0%, rgb(35 37 46 / 62%) 100%);
}

body.dark .welcome,
body.dark .typeBox input {
    background-color: var(--drak-mode) !important;
    color: var(--white-color);
}

body.dark .common-btn,
body.dark .showMoreBtn {
    background-color: var(--drak-mode);
    color: var(--white-color);
}

body.dark h1,
body.dark h2,
body.dark h3,
body.dark h4,
body.dark h5,
body.dark h6 {
    /* color: var(--white-color); */
    color: #CBD5E1 !important;
}

body.dark p {
    color: var(--textP-color);
}

body.dark .pageSection2 .Section2Box .travelBox .textBox h6,
body.dark .exploreTour .ourTourBox .rightText h5 {
    color: var(--white-color);
}

body.dark .exploreTour .ourTourBox .rightText .priceBox p,
body.dark .exploreTour .ourTourBox .rightText .priceBox h6 {
    color: var(--light-text);
}

body.dark .pageSection2 .Section2Box .priceBox h5,
body.dark .pageSection2 .Section2Box .travelBox .priceBox p {
    color: var(--light-text) !important;
}

body.dark header .header-box .menuBox .navBar ul li a,
body.dark header .header-box .logoBox .locationBox a,
body.dark header .header-box .menuBox .dropLangBox .selectDrop a {
    color: var(--textP-color);
}

body.dark .ourClickBox .catMenuBox .clickTo input[type="checkbox"]:checked+.keyword-label::after,
body.dark .mainDetailsBox .toursTab .innerTabBox .nav-tabs .nav-link.active {
    color: var(--text-black) !important;
}

body.dark .ourClickBox span.flatpickr-prev-month,
body.dark .ourClickBox span.flatpickr-next-month {
    color: rgb(255 255 255 / 100%);
    fill: rgb(255 255 255 / 100%);
}

body.dark .ourClickBox .flatpickr-day.selected.startRange::after,
body.dark .ourClickBox .flatpickr-day.selected.endRange::after {
    background-color: #ccc !important;
}

body.dark .ourClickBox .flatpickr-day.inRange {
    background-color: #ccc !important;
    box-shadow: -1px 0 0 #ccc, 5px 0 0 #ccc !important;
}

.whitelogo {
    display: none !important;
}

body.dark .whitelogo {
    display: block !important;
}

body.dark .comLogo {
    display: none !important;
}

body.dark header .header-box .menuBox .searchBox a.iconS {
    background-color: var(--gold-color);
}

body.dark header .header-box .menuBox .searchBox.active input,
body.dark .detasilTitle .detasilBox .searchBox input.main,
body.dark .detasilTitle .detasilBox .innerSecrch .srcBox input {
    background-color: var(--dark-mode);
}

body.dark header .header-box .menuBox .searchBox.active a.iconX {
    background-color: var(--dark-box);
}

body.dark header .header-box .menuBox .searchBox.active a.iconX i {
    color: var(--white-color) !important;
}

body.dark .multytimeBox .box-box .round {
    background-color: var(--star-color);
}

body.dark .multytimeBox .box-box {
    background-color: var(--body-dark) !important;
}

body.dark .dropDownLoc,
body.dark .dropDownLanguage,
body.dark .dropDownCurrency {
    background-color: var(--dark-box);
    box-shadow: 0 0 8px 2px #ffffff25;
}

body.dark header .header-box .menuBox .searchBox .search-key ul {
    background-color: var(--drak-mode);
}

body.dark header .header-box .menuBox .searchBox .search-key ul li a i {
    background-color: var(--gold-color);
}

body.dark .mainContentBox,
body.dark .mainReviewBox,
body.dark .bookRightBox .selectDate,
body.dark .bookRightBox .selectDate .multyDrop .dateDropBox,
body.dark .bookRightBox .selectDate .multyDrop .adultDropBox ul,
body.dark .bookRightBox .selectDate .multyDrop .timeDropBox ul,
body.dark .bookRightBox .selectDate .multyDrop .commonClick,
body.dark .activityMain .activityFillSec .mainTabBox .nav,
body.dark .backLayerCom {
    background-color: var(--dark-box) !important;
}

body.dark .bookRightBox .selectDate .multyDrop .commonClick .iconText h6 i,
body.dark .bookRightBox .selectDate .multyDrop .commonClick .iconRight i,
body.dark .commentSec .comRightBox p.cmLine,
body.dark .commentSec .comRightBox .likebox p,
body.dark .mainReviewBox .topReviewBox .rightBox span,
body.dark .detasilTitle .detasilBox .innerSecrch .srcBox i,
body.dark .detasilTitle .detasilBox .innerSecrch .srcBox input::placeholder,
body.dark .activityMain .activityFillSec .mainTabBox .nav .nav-link.mainLink,
body.dark .activityMain .activityFillSec .mainTabBox .importBox .bokunDropBox a.mainDisk,
body.dark .discriplangDown a.main,
body.dark .commentSec .comtitle .filterBox a,
body.dark .bookRightBox .selectDate .multyDrop .timeDropBox ul li a,
body.dark .mainListProducts .tabBtnbox ul li .custombtn i {
    color: #94A3B8;
}

body.dark .bookTiming .bookslottime>a.main,
body.dark .repeatBox .repeatSlot>a.main,
body.dark .duratioBox .duratioSlot>a.main,
body.dark .private .privateSlot>a.main,
body.dark .statusSec .statusSlot>a.main,
body.dark .uploadShowBox .boxOur .imgDetails .imgText h6 {
    color: #94A3B8;
}

body.dark .weakCheckList .typecheck .weak-label,
body.dark .accessibleBox .typecheck .keyword-label {
    color: var(--white-color);
}

body.dark .mainContentBox .activityBox a,
body.dark .mainContentBox .clickMap .btnMap,
body.dark .loadingCom .loadMore {
    background-color: var(--gold-color);
    border-color: var(--gold-color);
}

body.dark .activityMain .activityhead .backBox a {
    color: #B1B5C3 !important;
    border-color: #334155 !important;
    background-color: #2C2C2C !important;
}

body.dark .subimageBox {
    background-color: #334155;
}

body.dark .subimageBox .boxOur {
    background-color: var(--dark-box);
}

body.dark .detasilTitle .detasilBox ul li a,
body.dark .subimageBox .dragBox .btnDrag {
    background-color: var(--gold-color);
}

body.dark .hostworking .addLangBtn ul li a.addClick {
    color: var(--gold-color);
    border-color: var(--gold-color);
}

body.dark .detasilTitle .detasilBox ul li a i,
body.dark .subimageBox .dragBox .btnDrag {
    color: var(--text-black) !important;
}

body.dark .shiftBox .cutofftime h5 {
    color: var(--white-color);
}

body.dark .supplier .userIconBox .userNameBox h6,
body.dark .supplier .userIconBox .userNameBox p {
    color: var(--textP-color) !important;
}

body.dark header.supplierHeader {
    border-color: #746b4c;
}

body.dark .tourListall .tourName {
    background-color: var(--body-dark) !important;
}

body.dark .importTour .activityhead .backBox a,
body.dark .importTour .activityhead .backBox a i {
    color: #B1B5C3 !important;
}

body.dark .supplier .userAc {
    background-color: #777E90;
}

body.dark .rightProfile .rightProfileMain .userPersonaldet ul li span.black,
body.dark .profileImport .commonLabelSecond {
    color: #B1B5C3 !important;
}

/* ========== 23-06-25 */

body.dark .mainListProducts .tabBtnbox ul li .custombtn.active,
body.dark .activityMain .activityFillSec .mainTabBox .nav .nav-link.mainLink.active,
body.dark .mainTableBox table tbody tr:nth-child(even) td,
body.dark .activityMain .activityFillSec .mainTabBox .nav .nav-link.mainLink.active {
    background-color: #2F2304 !important;
    color: #CBD5E1 !important;
}

body.dark .rightProfile .rightProfileMain .userPersonaldet ul li:nth-child(even) {
    background-color: #0F172A !important;
}

body.dark .commonInputSecond,
body.dark .boxFull textarea,
body.dark .comTextarea,
body.dark .iti__tel-input,
body.dark .iti__country-container,
body.dark .ourdetailProfile.profileImport .iti__country-container,
body.dark .react-date-picker__wrapper,
body.dark .proDuratDrop .bokunDropBox a,
body.dark .bookingtabbox .bokunDropBox a,
body.dark .allBookinghead .addTitle .bokunDropBox a {
    background-color: var(--body-box) !important;
    border-color: #334155 !important;
    color: var(--gray-color);
}

body.dark .discriplangDown a.main {
    background-color: var(--body-box) !important;
    border-color: #334155 !important;
    color: #94A3B8 !important;
}

body.dark .iti__arrow::after {
    border-color: #334155 !important;
}

body.dark .iti__selected-country {
    color: var(--gray-color) !important;
}

body.dark .activityMain .activityFillSec .mainTabBox .importBox .bokunDropBox a.mainDisk,
body.dark .discriplangDown a.main,
body.dark .activityMain .activityFillSec .mainTabBox .importBox .bokunDropBox a .iconDown {
    border-color: #334155 !important;
}

body.dark .rightTabcontent .productList .listBoxproduct,
body.dark .rightTabcontent .productList .listBoxproduct .listEditBox ul li .listbtn {
    border-color: #334155 !important;
}

body.dark .rightTabcontent .productList .listBoxproduct .listEditBox ul li .listbtn i {
    color: #94A3B8 !important;
}

body.dark .accordion-flush .accordion-item:hover,
body.dark .bokunDropBox .DropBox li a:hover {
    background-color: #2F2304 !important;
}

body.dark .detailsMore .accordion-item,
body.dark .proDuratDrop .bokunDropBox a .iconDown,
body.dark .bookingtabbox .bokunDropBox a .iconDown,
body.dark .allBookinghead .addTitle .bokunDropBox a .iconDown {
    border-color: #334155 !important;
}

body.dark .paginationBox .pagination .page-item .page-link {
    color: #94A3B8 !important;
    background-color: var(--dark-box);
    border-color: #334155 !important;
}

body.dark .withdrawal_table_start .mainTableBox table tbody tr td,
body.dark .payment_table_start .mainTableBox table tbody tr td p,
body.dark .mainListProducts .tabBtnbox ul li ul.submenu li a,
body.dark .profile_privacy_sec .profile_privacy ul li .text_name p,
body.dark .registerBox .form-group label,
body.dark .mainTableBox table tbody tr td {
    color: #94A3B8 !important;
}

body.dark .mainListProducts .tabBtnbox ul li ul.submenu li a.active {
    color: #ECBB33 !important;
}

body.dark .payment-card {
    background-color: var(--dark-box);
    border-color: #334155 !important;
}

body.dark .payment-card.default {
    background-color: #2F2304 !important;
    border-color: #334155 !important;
}

body.dark .payment-name,
body.dark .payment-value {
    color: #94A3B8 !important;
}

body.dark .DropBox {
    background-color: var(--dark-box) !important;
    box-shadow: 0 0 8px 2px #ffffff25;
}

body.dark .bokunDropBox .DropBox li a {
    color: #CBD5E1;
}

body.dark .select2.select2-container .selection .select2-selection,
body.dark .select2-dropdown {
    background-color: var(--dark-box) !important;
    border-color: #334155 !important;
    color: var(--gray-color);
}

body.dark .paginationBox .pagination .page-item .page-link {
    background: #171202;
    color: #475569;
}

body.dark .iti__dropdown-content {
    background-color: var(--dark-box) !important;
}

body.dark .iti__search-input {
    background-color: #2F2304;
    color: #B1B5C3 !important;
}





/* ========== Drak-Mode css end ========== */

/* ========= profile details page css start ========== */

.rightProfile .continueBtn i {
    margin-right: 10px;
    font-size: 14px;
}

.rightProfile .rightProfileMain .ourdetailProfile {
    display: flex;
    align-items: start;
    gap: 30px;
}

.rightProfile .rightProfileMain .userImgBox {
    height: 160px;
    width: 18%;
    border-radius: 50%;
    background-color: #F1F5F9;
}

.rightProfile .rightProfileMain .userImgBox img {
    height: 160px;
    width: 160px;
    object-fit: cover;
    border-radius: 50%;
}

.rightProfile .rightProfileMain .userPersonaldet {
    width: 82%;
}

.rightProfile .rightProfileMain .userPersonaldet ul li {
    padding: 10px;
    border-radius: 10px;
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.rightProfile .rightProfileMain .userPersonaldet ul li:not(:last-child) {
    margin-bottom: 6px;
}

.rightProfile .rightProfileMain .userPersonaldet ul.userUlList li:nth-child(even) {
    background-color: #F1F5F9;
}

.rightProfile .rightProfileMain .userPersonaldet ul li span {
    color: var(--input-color);
    font-size: 18px;
    font-family: 'Manrope-Medium';
}

.rightProfile .rightProfileMain .userPersonaldet ul li span i {
    margin-right: 5px;
}

.rightProfile .rightProfileMain .userPersonaldet ul li span.black {
    color: #23262F;
    font-family: 'Manrope-Bold';
}

.profileImport .commonLabelSecond {
    color: #292929;
    font-family: 'Manrope-Medium';
}

.profileImport .commonInputSecond {
    border-color: #E6E8EC !important;
    padding: 5px 15px 8px;
}

.profileImport .commonInputSecond::placeholder {
    color: #BDBDBD;
    font-family: 'Manrope-Medium';
    font-size: 14px;
}

.profileImport .userPersonaldet .toptitle h5 {
    font-family: 'Manrope-Bold';
    color: #64748B;
    padding-bottom: 10px;
    border-bottom: 1px solid #E6E8EC;
}

.profileImport .userPersonaldet .toptitle h5 img {
    width: 100%;
    max-width: 30px;
    margin-right: 10px;
    vertical-align: middle;
}

.profileImport .bokunDropBox {
    position: relative;
}

.profileImport .bokunDropBox a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'Poppins-Medium';
    border: 2px solid var(--border-color);
    border-radius: 12px;
    padding: 6px 20px;
    color: #23262F;
}

.profileImport .bokunDropBox a .iconDown {
    height: 35px;
    width: 35px;
    border: 2px solid #E6E8EC;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.profileImport .bokunDropBox a span {
    color: #BDBDBD;
}

.profileImport .bokunDropBox a span i {
    color: #64748B;
    margin-right: 5px;
}

.profileImport .bokunDropBox a input[type="date"] {
    background: transparent;
    border: none;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    padding: 10px 40px;
    outline: none;
}

.rightProfile .rightProfileMain .userImgBox .updateImg {
    text-align: center;
}

.rightProfile .rightProfileMain .userImgBox .updateImg a {
    color: var(--gold-color);
    font-family: 'Manrope-SemiBold';
    margin-top: 10px;
}

.rightProfile .rightProfileMain .userImgBox .updateImg a i {
    margin-right: 5px;
}

.mainListProducts .tabBtnbox ul li .custombtn .fa-chevron-right {
    margin-left: auto;
    font-size: 12px;
    float: right;
    color: #94A3B8;
}

/* 
.mainListProducts .tabBtnbox ul li .custombtn.active .fa-chevron-right {
    display: none;
} */

.profileMainTabSec .mainListProducts .tabBtnbox ul li .custombtn {
    padding: 12px 15px;
    max-width: 270px;
}

.profileMainTabSec .backLayerCom {
    padding: 25px 20px;
}



/*--- header css start ---*/

@keyframes smoothScroll {
    0% {
        transform: translateY(-60px);
        opacity: 0;
    }

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

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

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

header.show {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #ffffffc4;
    z-index: 999;
    animation: smoothScroll 1s forwards;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    backdrop-filter: blur(4px);
}

header {
    padding: 20px 0;
}

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

header .header-box.mobileView {
    display: none;
}

header .header-box .logoBox {
    display: flex;
    align-items: center;
}

header .header-box .logoImg a img {
    max-width: 200px;
}

header .header-box .logoImg {
    border-right: 1px solid var(--border-color);
    padding-right: 30px;
}

header .header-box .menuBox {
    display: flex;
    align-items: center;
    justify-content: center;
}

header .header-box .menuBox .dropLangBox {
    display: flex;
    align-items: center;
    gap: 20px;
}

header .header-box .menuBox .dropLangBox .btnBox {
    display: flex;
}

.hamburger {
    display: none;
}

header .header-box .menuBox .navBar ul li a:hover {
    color: var(--gold-color) !important;
}

header .header-box .menuBox .navBar.mobileMenu {
    display: none;
}

header .header-box .menuBox .searchBox {
    position: relative;
    margin: 0 15px;
}

header .header-box .menuBox .searchBox a.iconS,
header .header-box .menuBox .searchBox a.iconX {
    background: var(--white-color);
    height: 36px;
    width: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: 0.6s;
    right: 0;
    float: right;
}

header .header-box .menuBox .searchBox a.iconS {
    z-index: 2;
}



header .header-box .menuBox .searchBox.active a.iconS {
    right: 220px;
    background: var(--gold-color);
    transition: 0.5s;
}

header .header-box .menuBox .searchBox a.iconX {
    opacity: 0;
}

header .header-box .menuBox .searchBox.active a.iconX {
    right: 5px;
    border: 1px solid var(--border-color);
    /* transition: 0.5s; */
    opacity: 1;
}

header .header-box .menuBox .searchBox a i {
    color: var(--text-black);
    font-size: 18px;
}

header .header-box .menuBox .searchBox input {
    background: var(--white-color);
    border: none;
    box-shadow: none;
    height: 40px;
    width: 0px;
    border-radius: 50%;
    transition: 0.5s;
    opacity: 0;
    outline: none;
    float: right;
}

header .header-box .menuBox .searchBox.active input {
    max-width: 260px;
    border-radius: 30px;
    height: 45px;
    padding: 0 50px;
    width: 100%;
    border: 2px solid var(--gold-color);
    opacity: 1;
}

header .header-box .menuBox .searchBox input::placeholder {
    color: #C3C4C7;
    font-size: 16px;
    font-family: 'Gilory-SemiBold';
}

header .header-box .menuBox .navBar ul li a,
header .header-box .logoBox .locationBox a {
    font-size: 16px;
    color: var(--text-black);
    font-family: 'Manrope-Bold';
    transition: 0.3s;
}

header .header-box .logoBox .locationBox a i {
    font-size: 13px;
    margin-left: 5px;
}

header .header-box .logoBox .locationBox {
    margin-left: 30px;
    position: relative;
    padding: 5px 0;
}

.dropDownLoc,
.dropDownLanguage,
.dropDownCurrency,
.DropBox {
    position: absolute;
    top: 30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 55;
    background: var(--body-color);
    border-radius: 5px;
    box-shadow: 0 0 5px #d9d9d9;
    padding: 5px;
}

.DropBox {
    top: 52px;
    width: 100%;
    background: var(--white-color);
    border-radius: 12px;
}



.dropDownLoc li a,
.dropDownLanguage li a,
.dropDownCurrency li a,
.DropBox li a {
    padding: 5px 15px;
    width: 100%;
    transition: 0.3s;
    border-radius: 5px;
}

.dropDownLoc li a:hover,
.dropDownLanguage li a:hover,
.dropDownCurrency li a:hover,
.DropBox li a:hover {
    background-color: #FDF7E8 !important;
}

header .header-box .menuBox .dropLangBox .selectDrop {
    display: flex;
    align-items: center;
    gap: 20px;
}

header .header-box .menuBox .dropLangBox .btnBox .common-btn i {
    margin-left: 12px;
    font-size: 11px;
}

header .header-box .menuBox .dropLangBox .btnBox .common-btn:first-child {
    margin-right: 10px;
}

header .header-box .menuBox .dropLangBox .btnBox .common-btn.btnGold {
    background-color: var(--gold-color);
    color: var(--text-black) !important;
}

header .header-box .menuBox .dropLangBox .selectDrop a,
.bokunDropBox .DropBox li a {
    color: var(--text-black);
    font-family: 'Manrope-Bold';
    transition: 0.3s;
}

.bokunDropBox .DropBox li a {
    border-radius: 10px;
    margin-top: 5px;
}

header .header-box .menuBox .dropLangBox .selectDrop .languageBox,
header .header-box .menuBox .dropLangBox .selectDrop .currencyBox,
.bokunDropBox {
    position: relative;
}

header .header-box .menuBox .dropLangBox .selectDrop a>.symbol {
    margin-right: 5px;
}

header .header-box .menuBox .dropLangBox .selectDrop a>.right {
    margin-left: 7px;
}

.themeMode .roundBox .form-check-input {
    width: 55px;
    height: 28px;
    background-color: var(--white-color);
    box-shadow: none !important;
    border-color: var(--white-color) !important;
    outline: 5px solid #fff !important;
    cursor: pointer;
}

.themeMode .roundBox .form-switch .form-check-input {
    background-image: url(../images/sun.png) !important;
    transition: 0.3s;
}

.themeMode .roundBox .form-switch .form-check-input:checked {
    background-image: url(../images/darkmode.png) !important;
}

.themeMode .roundBox .form-check-input:checked {
    background-color: var(--drak-mode);
    border-color: var(--drak-mode) !important;
    outline: 5px solid var(--drak-mode) !important;
}

.right-box .search,
.right-box .search-key {
    position: relative;
    margin-right: 30px;
}



header .header-box .menuBox .searchBox .search-key ul {
    position: absolute;
    width: 100%;
    background-color: #fff;
    border-radius: 20px;
    top: 50px;
    padding: 10px;
    z-index: 999;
}

header .header-box .menuBox .searchBox .search-key ul li:not(:last-child) {
    margin-bottom: 8px;
}

header .header-box .menuBox .searchBox .search-key ul li a {
    padding: 8px 5px;
    width: 100%;
    color: var(--input-color);
    border-radius: 5px;
    font-size: 15px;
    font-family: 'Gilory-SemiBold';
}

header .header-box .menuBox .searchBox .search-key ul li a i {
    border: 1px solid #ccc;
    border-radius: 50%;
    padding: 6px 7px 4px;
    background: var(--white-color);
    margin-right: 8px;
}

header .header-box .menuBox .searchBox .search-key ul li a:hover {
    background-color: #F8EFD0;
    color: var(--text-black);
}

header .header-box .menuBox .searchBox2,
.detasilTitle .detasilBox .innerSecrch .srcBox {
    position: relative;
}

header .header-box .menuBox .searchBox2 {
    margin: 15px 10px;
}

header .header-box .menuBox .searchBox2 input.main {
    width: 100%;
    border: 1px solid #E6E8EC;
    outline: none;
    box-shadow: none;
    border-radius: 14px;
    padding: 10px 100px 10px 40px;
    min-height: 60px;
}

header .header-box .menuBox .searchBox2 input.main::placeholder {
    color: #C4C9D6;
}

header .header-box .menuBox .searchBox2 input.main:hover {
    box-shadow: 0px 0px 10px #fff;
}

header .header-box .menuBox .searchBox2 i {
    position: absolute;
    color: var(--input-color);
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
}

header .header-box .menuBox .innerSecrch {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
}

header .header-box .menuBox .innerSecrch .srcBox input {
    min-height: 40px;
    max-width: 100px;
    border: 1px solid #E6E8EC;
    outline: none;
    box-shadow: none;
    border-radius: 8px;
    padding: 5px 5px 5px 30px;
}

header .header-box .menuBox .innerSecrch .srcBox i {
    position: absolute;
    color: var(--text-black);
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
}

/*--- header css end ---*/



/* banner css start */

.mainBanner {
    margin: 0px 15px;
    min-height: 85vh;
    background-image: url(../images/homeimg1.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: relative;
    border-radius: 30px;
    display: flex;
    align-items: center;
}

.mainBanner .bannerBox {
    width: 100%;
}

.mainBanner::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
}

.mainBanner .bannerBox .bannerText {
    position: relative;
    z-index: 555;
}

.mainBanner .bannerBox .sliderText h2 {
    color: var(--white-color);
    font-family: 'Manrope-ExtraBold';
}

.mainBanner .bannerBox .sliderText p {
    color: var(--white-color);
    font-family: 'Manrope-Regular';
    /* max-width: 500px; */
    font-size: 22px;
}

/* .mainBanner .bannerBox {
    width: 100%;
    padding: 0px 20px 50px;
} */

/* .mainBanner .bannerBox .swiper {
    width: 100%;
    height: 100%;
    border-radius: 30px;
} */

/* .mainBanner .bannerBox .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: transparent;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    min-height: 100%;
} */

/* .mainBanner .bannerBox .swiper-slide .img-box {
    width: 100%;
    height: 100%;
} */

/* .mainBanner .bannerBox .swiper-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
} */

/* .mainBanner .bannerBox .sliderText {
    position: absolute;
    text-align: start;
    left: 15%;
} */

/* .mainBanner .bannerBox .swiper-pagination-bullets {
    right: 30px !important;
}

.mainBanner .bannerBox .swiper-pagination-bullet {
    opacity: 0.5;
    background-color: var(--white-color) !important;
    margin: 15px 0 !important;
}

.mainBanner .bannerBox .swiper-pagination-bullet-active {
    background-color: var(--white-color) !important;
    height: 30px;
    border-radius: 10px;
    opacity: 1;
} */

.typeBox {
    background: linear-gradient(30deg, rgb(228 228 228 / 93%) 0%, rgb(228 228 228 / 95%) 100%);
    padding: 20px;
    border-radius: 24px;
    position: relative;
    margin-top: -60px;
    z-index: 55;
}

.typeBox input {
    width: 100%;
    border: none;
    outline: none;
    box-shadow: none;
    padding: 25px 15px;
    border-radius: 17px;
    background-color: var(--white-color);
}

.typeBox input::placeholder {
    font-size: 20px;
    font-family: 'Manrope-Regular';
    color: var(--input-color);
}

.typeBox .sendBtn {
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translateY(-50%);
}

.typeBox .sendBtn .btnSend {
    height: 45px;
    width: 45px;
    border-radius: 50%;
    padding: 0;
    background-color: var(--gold-color);
    outline: none !important;
    box-shadow: none !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* banner css end */

/* pageSection2 css start */

.sectionTitle h3 {
    color: var(--text-black);
    font-family: 'Manrope-Bold';
}

.pageSection2 .Section2Box .row {
    row-gap: 40px;
}

.pageSection2 .Section2Box .placeSec {
    margin-top: 50px;
}

.placeSecMobile {
    display: none !important;
}

.pageSection2 .Section2Box .travelBox {
    height: 100%;
    box-shadow: 0px 0px 30px #dbdbdb;
    border-radius: 30px;
    background-color: var(--white-color);
}

.pageSection2 .Section2Box .travelBox .imgBox {
    height: 240px;
    width: 100%;
}

.pageSection2 .Section2Box .travelBox .imgBox img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
}

.pageSection2 .Section2Box .travelBox .textBox {
    background-color: var(--white-color);
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    padding: 20px 20px;
}

.pageSection2 .Section2Box .travelBox .textBox p i {
    margin-right: 5px;
}

.pageSection2 .Section2Box .travelBox .textBox h6 {
    color: var(--light-blue);
    font-family: 'Manrope-Bold';
    margin-bottom: 15px;
}

.pageSection2 .Section2Box .travelBox .textBox ul {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 15px;
}

.pageSection2 .Section2Box .travelBox .textBox ul li p,
.pageSection2 .Section2Box .travelBox .textBox p {
    font-family: 'Poppins-Regular';
    font-size: 14px;
}

.pageSection2 .Section2Box .travelBox .textBox p.oneLine {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.pageSection2 .Section2Box .priceBox {
    display: flex;
    justify-content: space-between;
    padding-top: 15px;
    border-top: 1px solid var(--border-color);
}

.pageSection2 .Section2Box .priceBox h5 {
    margin-bottom: 0;
    color: var(--text-black);
    font-family: 'Manrope-Bold';
}

.pageSection2 .Section2Box .travelBox .priceBox p {
    color: var(--text-black);
    font-family: 'Manrope-SemiBold';
}

.pageSection2 .Section2Box .travelBox .priceBox p i {
    color: var(--star-color);
}

.pageSection2 .Section2Box .travelBox .priceBox p span {
    color: var(--gray-color);
    font-size: 13px;
}

/* pageSection2 css end */

/* gallery css start */

.gallery .galleryPart .galleryBox {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    column-gap: 25px;
    row-gap: 25px;
    margin-top: 50px;
}

.gallery .galleryPart .imgGridBox {
    position: relative;
    border-radius: 30px;
}

.gallery .galleryPart .galleryBox .imgGridBox::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: linear-gradient(0deg, rgb(0 0 0 / 75%) 0%, rgb(253 253 253 / 0%) 55%);
    border-radius: 30px;
}

.gallery .galleryPart .galleryBox .rowSpan2 {
    grid-row: span 2;
    min-height: 630px;
}

.gallery .galleryPart .galleryBox .colSpan2 {
    grid-column: span 2;
    min-height: 300px;
}

.gallery .galleryPart .galleryBox .imgGridBox.length300 {
    min-height: 300px;
}

.gallery .galleryPart .galleryBox .imgGridBox img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 30px;
}

.gallery .galleryPart .imgGridBox .textBox {
    position: absolute;
    bottom: 30px;
    left: 30px;
    z-index: 5;
}

.gallery .galleryPart .imgGridBox .textBox h5 {
    color: var(--white-color);
    font-family: 'Poppins-Medium';
    margin-bottom: 0px;
}

.gallery .galleryPart .imgGridBox .textBox p {
    color: var(--white-color);
    opacity: 0.7;
    font-family: 'Poppins-Regular';
}


/* gallery css end */

/* tourStyle css start */

.tourStyle .tourStylepart .tourBox .tourGallery {
    position: relative;
    border-radius: 30px;
}

.tourStyle .tourStylepart .tourBox .row {
    row-gap: 30px;
    margin-top: 50px;
}

.tourStyle .tourStylepart .tourBox .tourGallery .imgBox::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: linear-gradient(0deg, rgb(0 0 0 / 75%) 0%, rgb(253 253 253 / 0%) 55%);
    border-radius: 30px;
}

.tourStyle .tourStylepart .tourBox .tourGallery .imgBox img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 30px;
}

.tourStyle .tourStylepart .tourBox .tourGallery .cardText {
    position: absolute;
    bottom: 30px;
    left: 30px;
    z-index: 5;
}

.tourStyle .tourStylepart .tourBox .tourGallery .cardText h5 {
    color: var(--white-color);
    font-family: 'Poppins-Medium';
    margin-bottom: 0px;
}

.tourStyle .tourStylepart .tourBox .tourGallery .cardText p {
    color: var(--white-color);
    opacity: 0.7;
    font-family: 'Poppins-Regular';
}

/* tourStyle css start */


/* experience css start */

.experience {
    overflow-x: unset !important;
    overflow-y: unset !important;
}

.experience .experienceBox .dreamBox {
    background-color: var(--gold-color);
    padding: 50px 80px;
    border-radius: 30px;
    position: relative;
}

.experience .experienceBox .dreamBox .logo-box {
    margin-bottom: 20px;
}

.experience .experienceBox .dreamBox .logo-box img {
    max-width: 250px;
}

.experience .experienceBox .dreamBox .dreamText h2 {
    font-family: 'Gilroy-Bold';
    font-size: 62px;
    color: var(--text-black) !important;
}

.experience .experienceBox .dreamBox .showMore {
    text-align: start;
    margin-top: 30px;
}

.experience .experienceBox .dreamBox .expImgBox img {
    position: absolute;
    top: -35px;
    right: -40px;
    height: 410px;
    width: 430px;
}

.experience .experienceBox .showMoreBtn {
    background-color: var(--white-color) !important;
    color: var(--text-black) !important;
}

/* experience css end */



/* welcome css start */

.welcome {
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
    background-color: var(--white-color);
}

.welcome .welcomeBox .welcomeImg img {
    width: 100%;
}

/* welcome css end */

/* footer css start */

footer {
    background-color: var(--text-black);
    padding: 50px 20px;
}

.footerPart .footerBox .innerBox {
    margin-bottom: 30px;
}

.footerPart .footerBox .innerBox .footermenu .logoImg a img {
    max-width: 210px;
}

.footerPart .footerBox .innerBox .footermenu .logoImg a {
    margin-bottom: 20px;
}

.footerPart .footerBox .innerBox .footermenu .logoImg p {
    font-size: 12px;
    font-family: 'Poppins-Regular';
    max-width: 260px;
    width: 100%;
}

.footerPart .footerBox .innerBox .footermenu ul li a {
    color: var(--white-color);
    font-family: 'Gilory-SemiBold';
    font-size: 14px;
}

.footerPart .copyRight {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 30px;
    border-top: 1px solid #f1f4f729;
}

.footerPart .copyRight p {
    font-size: 13px;
    color: var(--white-color);
    font-family: 'Manrope-SemiBold';
}

.footerPart .copyRight ul {
    display: flex;
    align-items: center;
    gap: 15px;
    flex-wrap: wrap;
}

.footerPart .copyRight ul li a {
    height: 35px;
    width: 35px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f1f4f729;
    color: var(--white-color);
}

.footerPart .footerBox .innerBox .footermenu.fiveBox ul {
    display: flex;
    align-items: center;
    justify-content: start;
    flex-wrap: wrap;
    column-gap: 15px;
    row-gap: 5px;
}

.footerPart .footerBox .innerBox .footermenu.fiveBox ul li a {
    background-color: var(--white-color);
    height: 30px;
    width: 35px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #ccc;
    padding: 5px;
}

.footerPart .footerBox .innerBox .footermenu.fiveBox ul li a img {
    width: 100%;
}


/* footer css start */


/* ============== explore page css start ===================== */

.mainBanner.innerBanner {
    background-image: url(../images/homeimg2.png) !important;
}


/* ====== exploreTour ======= */

.exploreTour .ourTourBox {
    display: flex;
    align-items: center;
    background-color: var(--white-color);
    border-radius: 30px;
    box-shadow: 0px 0px 30px #dbdbdb9c;
    margin-bottom: 20px;
}

.exploreTour .ourTourBox .leftImg {
    width: 30%;
}

.exploreTour .ourTourBox .leftImg img {
    width: 100%;
    object-fit: cover;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
}

.exploreTour .ourTourBox .rightText {
    width: 70%;
    height: 100%;
    padding: 0 30px;
}

.exploreTour .ourTourBox .rightText p {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    font-family: 'Gilory-SemiBold';
}

.exploreTour .ourTourBox .rightText h5 {
    color: var(--light-blue);
    margin-bottom: 20px;
    font-size: 24px;
    font-family: 'Gilory-SemiBold';
}

.exploreTour .ourTourBox .rightText ul {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 15px;
}

.exploreTour .ourTourBox .rightText ul li p {
    font-family: 'Gilroy-Medium';
    font-size: 14px;
}

.exploreTour .ourTourBox .rightText ul li p i {
    margin-right: 5px;
}

.exploreTour .ourTourBox .rightText p i {
    margin-right: 5px;
}

.exploreTour .ourTourBox .rightText .priceBox {
    display: flex;
    justify-content: space-between;
    padding-top: 20px;
}

.exploreTour .ourTourBox .rightText .priceBox h6 {
    margin-bottom: 0;
    color: var(--light-blue);
    font-family: 'Manrope-ExtraBold';
}

.exploreTour .ourTourBox .rightText .priceBox p {
    color: var(--light-blue);
    font-family: 'Manrope-SemiBold';
}

.exploreTour .ourTourBox .rightText .priceBox p span {
    color: var(--gray-color);
    font-size: 13px;
}

.exploreTour .ourTourBox .rightText .priceBox p i {
    color: var(--star-color);
}

.exploreTour .filterOpen {
    display: none;
}

.mainDetailsBox .toursTab {
    background-color: var(--white-color);
    border-radius: 20px;
    padding: 20px 15px;
}

.mainDetailsBox .toursTab .title p {
    color: #B1B5C3;
    font-family: 'Manrope-Regular';
    margin-bottom: 20px;
}

.mainDetailsBox .toursTab .innerTabBox .nav-tabs {
    border: none;
    justify-content: space-between;
    padding-bottom: 20px;
}

.mainDetailsBox .toursTab .innerTabBox .nav-tabs .nav-link {
    border: none;
    font-family: 'Manrope-Bold';
    border-radius: 30px;
    padding: 4px 15px;
    color: var(--input-color);
    font-size: 14px;
}

.mainDetailsBox .toursTab .innerTabBox .nav-tabs .nav-link.active {
    background-color: var(--gold-color);
    color: #FCFCFD !important;
}

.mainDetailsBox .toursTab .innerTabBox .nav-tabs .nav-link:hover {
    border: none;
}

.ourClickBox .chartBox {
    padding-top: 20px;
    border-top: 1px solid #E6E8EC;
    margin-top: 20px;
}

.ourClickBox .chartBox .chartDraw img {
    width: 100%;
}

.ourClickBox .chartBox .chartDraw ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.ourClickBox .chartBox .chartDraw ul li p {
    font-size: 11px;
    font-family: 'Manrope-Medium';
    color: #B1B5C3;
}

.ourClickBox .chartBox .chartPrice {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.ourClickBox .chartBox .chartPrice p {
    margin-bottom: 0;
    color: #B1B5C3;
    font-size: 15px;
    font-family: 'Manrope-Regular';
}

.ourClickBox .chartBox .chartPrice h6 {
    margin-bottom: 0;
    font-family: 'Manrope-Bold';
    font-size: 15px;
}

.ourClickBox .timeBox .timeText p {
    color: #B1B5C3;
    font-size: 15px;
    font-family: 'Manrope-Regular';
}

.ourClickBox .timeBox .timeText .range-slider {
    position: relative;
    width: 100%;
    padding: 15px 0px;
}

.ourClickBox .timeBox .timeText input[type="range"] {
    position: absolute;
    pointer-events: none;
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 4px;
    border-radius: 5px;
    background: var(--gold-color);
    outline: none;
    cursor: pointer;
}

.ourClickBox .timeBox .timeText input[type="range"]::-webkit-slider-thumb {
    pointer-events: all;
    position: relative;
    z-index: 1;
    -webkit-appearance: none;
    appearance: none;
    height: 20px;
    width: 20px;
    background-color: var(--gold-color);
    border-radius: 50%;
    border: none;
    outline: 4px solid var(--white-color) !important;
    box-shadow: 0px 0px 30px #8888888e;
    transition: 0.2s ease-in-out;
}

.ourClickBox .timeBox .timeText input[type="range"]::-moz-range-thumb {
    pointer-events: all;
    height: 20px;
    width: 20px;
    background-color: var(--gold-color);
    border-radius: 50%;
    border: none;
    outline: 4px solid var(--white-color) !important;
    box-shadow: 0px 0px 30px #8888888e;
    transition: 0.2s ease-in-out;
}

.ourClickBox .timeBox .timeText .countBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 15px;
    margin-bottom: 20px;
}

.ourClickBox .timeBox .timeText .countBox h6 {
    margin-bottom: 0;
    font-family: 'Manrope-Medium';
    font-size: 16px;
}

.ourClickBox .categories,
.ourClickBox .feature {
    padding-top: 20px;
    border-top: 1px solid #E6E8EC;
}

.ourClickBox .feature {
    border-bottom: 1px solid #E6E8EC;
}

.ourClickBox .catMenuBox .clickTo {
    position: relative;
    padding-left: 30px;
    margin-bottom: 5px;
}

.ourClickBox .categories .titleCat p,
.ourClickBox .feature .titleCat p {
    margin-bottom: 15px;
    color: #B1B5C3;
    font-size: 15px;
    font-family: 'Manrope-Regular';
}

.ourClickBox .catMenuBox .clickTo input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    margin-right: 0px;
    left: 0;
    top: 0;
    height: 22px;
    width: 22px;
    border-radius: 4px;
    z-index: 55;
    cursor: pointer;
}

.ourClickBox .catMenuBox .clickTo input[type="checkbox"]+.keyword-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    cursor: pointer;
    height: 22px;
    border: 2px solid #E6E8EC;
    background-color: #fff;
    border-radius: 4px;
}

.ourClickBox .catMenuBox .clickTo input[type="checkbox"]:checked+.keyword-label::after {
    content: '\f00c';
    position: absolute;
    font-family: 'fontawesome';
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    color: #fff;
    background-color: var(--gold-color);
    width: 22px;
    height: 22px;
    text-align: center;
    border-radius: 4px;
    padding-top: 2px;
}

.ourClickBox .catMenuBox .clickTo .keyword-label {
    font-size: 14px;
    color: var(--text-black);
    font-family: 'Manrope-Medium';
}

.ourClickBox .catMenuBox ul li {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ourClickBox .catMenuBox ul li:not(:last-child) {
    margin-bottom: 5px;
}

.ourClickBox .catMenuBox ul li p.num {
    font-size: 15px;
    color: var(--input-color);
    font-family: 'Poppins-Medium';
}

.seeMore a {
    color: var(--gold-color);
    font-family: 'Manrope-Bold';
    margin-left: 30px;
    margin-bottom: 30px;
}

.filterReset a {
    padding: 15px 0px 0 10px;
    color: var(--input-color);
    font-size: 16px;
    font-family: 'Manrope-Bold';
}

.filterReset a i {
    margin-right: 5px;
    font-size: 22px;
    vertical-align: middle;
}

/* calendar css start */

.ourClickBox .dateBox #flat {
    display: none;
}

.ourClickBox .flatpickr-weekdays {
    margin-bottom: 20px !important;
}

.ourClickBox .flatpickr-days,
.ourClickBox .flatpickr-rContainer {
    width: 100% !important;
}

.ourClickBox .flatpickr-calendar.inline {
    width: 100%;
    border: none !important;
    box-shadow: none !important;
}

.ourClickBox .flatpickr-day.today {
    border: none !important;
    background-color: #e3bc3e29;
    color: var(--gold-color) !important;
}

.ourClickBox .flatpickr-day:hover {
    background-color: #e3bc3e29 !important;
    border: none !important;
}

.ourClickBox .flatpickr-day {
    font-family: 'Gilory-SemiBold' !important;
    font-size: 15px;
    border: none !important;
}

.ourClickBox .numInput.cur-year,
.ourClickBox .flatpickr-monthDropdown-months {
    font-family: 'Gilroy-ExtraBold' !important;
    font-size: 18px !important;
}

.ourClickBox .flatpickr-monthDropdown-months {
    width: 125px !important;
    font-size: 18px !important;
}

.ourClickBox .flatpickr-monthDropdown-months:hover {
    background: transparent !important;
}

.ourClickBox .flatpickr-month {
    margin-bottom: 15px !important;
}

.ourClickBox span.flatpickr-weekday {
    color: #83889B !important;
    font-family: 'Gilory-SemiBold' !important;
}

.ourClickBox .flatpickr-day.endRange,
.ourClickBox .flatpickr-day.endRange:hover,
.ourClickBox .flatpickr-day.startRange,
.ourClickBox .flatpickr-day.startRange:hover {
    background: var(--gold-color) !important;
    border: none !important;
    border-radius: 50% !important;
    color: var(--black-color) !important;
}

.ourClickBox .flatpickr-day.startRange.startRange+.endRange:not(:nth-child(7n+1)) {
    box-shadow: none !important;
}

.ourClickBox .flatpickr-day.selected.startRange,
.ourClickBox .flatpickr-day.selected.endRange {
    position: relative;
}

.ourClickBox .flatpickr-day.selected.startRange::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    background: #fff1c2;
    height: 100%;
    width: 100%;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    z-index: -1;
}

.ourClickBox .flatpickr-day.selected.endRange::after {
    content: '';
    position: absolute;
    left: -5px;
    top: 0;
    background: #fff1c2;
    height: 100%;
    width: 100%;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    z-index: -1;
}

.ourClickBox .flatpickr-day.inRange {
    background: #fff1c2 !important;
    border: none !important;
    -webkit-box-shadow: -5px 0 0 #e3bc3e29, 5px 0 0 #e3bc3e00 !important;
    box-shadow: -1px 0 0 #fff1c2, 5px 0 0 #e3bc3e00 !important;
}

.ourClickBox .dayContainer {
    min-width: 100% !important;
}

.ourClickBox .flatpickr-day.inRange:last-child {
    border-top-right-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
}

.ourClickBox span.flatpickr-prev-month,
.ourClickBox span.flatpickr-next-month {
    border: 2px solid #E6E8EC !important;
    border-radius: 50%;
    padding: 0 !important;
    height: 35px !important;
    width: 35px !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.ourClickBox span.flatpickr-prev-month svg,
.ourClickBox span.flatpickr-next-month svg {
    color: #83889B !important;
    width: 10px !important;
    height: 10px !important;
}


/* calendar css end */

/* ============== explore page css end ===================== */



/* ============== login page css start ===================== */

.loginSec {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url(../images/loginbg.jpg);
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
    overflow: hidden;
    padding: 30px 0;
}

/* .loginSec::after {
    content: '';
    position: absolute;
    width: 150vw;
    height: 110%;
    bottom: -650px;
    left: -505px;
    background-color: #F4F4F0;
    border-radius: 50%;
} */


.loginSec .loginpart .loginBox {
    box-shadow: 0 0 10px #ccc;
    border-radius: 30px;
    padding: 30px;
    width: 500px;
    background-color: var(--white-color);
    position: relative;
    z-index: 55;
    margin: 0 auto;
}

.loginSec .loginpart .loginBox .logoSec {
    text-align: center;
}

.loginSec .loginpart .loginBox .logoSec a img {
    max-width: 200px;
}

.loginSec .loginpart .loginBox .logoSec h4 {
    color: var(--text-black);
    font-family: 'Gilroy-Bold';
    padding-top: 10px;
    margin-bottom: 30px;
}

.commonLabel {
    width: 100%;
    padding-bottom: 5px;
    color: #B1B5C3;
    font-family: 'Gilroy-Regular';
}

.commonLabelSecond {
    width: 100%;
    font-size: 16px;
    padding-bottom: 10px;
    color: #7A7C86;
    font-family: 'Manrope-SemiBold';
}

.commonInput {
    width: 100%;
    padding: 10px 15px;
    border-radius: 12px;
    outline: none !important;
    box-shadow: none !important;
    border: 2px solid #E6E8EC;
    margin-bottom: 20px;
}

.commonInputSecond {
    width: 100%;
    padding: 8px 15px;
    border-radius: 12px;
    border: 2px solid var(--border-color);
    box-shadow: none;
    outline: none;
    height: 48px;
}

.commonInput::placeholder {
    color: var(--text-black);
    font-family: 'Gilroy-Medium';
}

.loginSec .loginpart .loginBox .fillDetails ul li {
    position: relative;
}

.loginSec .loginpart .loginBox .fillDetails ul li .btnShow {
    position: absolute;
    top: 38%;
    right: 0;
    color: #83889B;
    box-shadow: none !important;
}

.loginSec .loginpart .loginBox .remember .checkBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 15px 0;
}

.comYellowa {
    font-family: 'Gilory-SemiBold';
    font-size: 16px;
    color: var(--gold-color) !important;
    padding-left: 10px;
}

.loginSec .loginpart .loginBox .register p {
    font-family: 'Gilory-SemiBold';
    font-size: 16px;
    color: #6C7278;
    text-align: center;
}

.loginSec .loginpart .loginBox .loginBtn .btn-login {
    width: 100% !important;
    background-color: var(--gold-color);
    margin: 15px 0;
    font-family: 'Gilroy-Bold';
}

.loginSec .loginpart .loginBox .loginBtn .btn-login i {
    margin-left: 5px;
    font-size: 11px;
}

.loginSec .loginpart .loginBox .remember .checkBox .clickTo {
    position: relative;
    padding-left: 30px;
    margin-bottom: 5px;
}

.loginSec .loginpart .loginBox .remember .checkBox .clickTo input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    margin-right: 0px;
    left: 0;
    top: 0;
    height: 22px;
    width: 22px;
    border-radius: 4px;
    z-index: 55;
    cursor: pointer;
}

.loginSec .loginpart .loginBox .remember .checkBox .clickTo input[type="checkbox"]+.keyword-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    cursor: pointer;
    height: 22px;
    border: 2px solid #E6E8EC;
    background-color: #fff;
    border-radius: 4px;
}

.loginSec .loginpart .loginBox .remember .checkBox .clickTo input[type="checkbox"]:checked+.keyword-label::after {
    content: '\f00c';
    position: absolute;
    font-family: 'fontawesome';
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 15px;
    color: #000;
    background-color: var(--gold-color);
    width: 22px;
    text-align: center;
    border-radius: 4px;
}

.loginSec .loginpart .loginBox .remember .checkBox .clickTo .keyword-label {
    font-size: 16px;
    color: var(--text-black);
    font-family: 'Gilory-SemiBold';
}

.lastBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 70px;
}

.lastBox p {
    margin-right: 60px;
    margin-bottom: 0;
    color: #6C7278;
    font-size: 14px;
    white-space: nowrap;
}

.lastBox ul {
    display: flex;
    align-items: center;
}

.lastBox ul li:first-child {
    margin-right: 15px;
    padding-right: 15px;
    border-right: 1px solid var(--border-color);
}

.lastBox ul li a {
    font-family: 'Gilroy-Medium';
    color: var(--gold-color) !important;
    font-size: 14px;
    white-space: nowrap;
}


/* ============== login page css end ===================== */



/* ============== signUp page css start ===================== */

.loginSec.signUp .lastBox {
    bottom: 20px !important;
}

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

.fillDetails .nameBox .box-box {
    width: calc(50% - 10px);
}

.lineSpan {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 20px;
}

.lineSpan .comSpan {
    width: calc(33.33% - 10px);
    border-radius: 20px;
    height: 5px;
    background-color: #E6E8EC;
}

.lineSpan .redSpan {
    background-color: #FD0000 !important;
}

.lineSpan .yellowSpan {
    background-color: #FFA41D !important;
}

.lineSpan .greenSpan {
    background-color: #2ABC30 !important;
}

.loginSec .loginpart .loginBox .fillDetails ul li.countryBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.fillDetails ul li.countryBox .contryCode {
    width: 30%;
}

.fillDetails ul li.countryBox .mobilNum {
    width: 70%;
}

.fillDetails ul li.countryBox .commonLabel {
    font-family: 'Gilory-SemiBold';
}

.contryCode .dropdown {
    position: relative;
    width: 100%;
    display: inline-block;
}

.contryCode .dropbtn {
    padding: 10px 5px;
    border-radius: 12px;
    background: transparent;
    outline: none !important;
    font-size: 16px;
    box-shadow: none !important;
    border: 2px solid #E6E8EC;
    margin-bottom: 15px;
    text-align: left;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.contryCode .flag-icon {
    width: 20px;
    height: 20px;
    margin-right: 10px;
    object-fit: cover;
    border-radius: 50%;
}

.contryCode .arrow-up {
    font-size: 11px;
    margin-left: 10px;
    height: 28px;
    width: 28px;
    border: 2px solid #E6E8EC;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.contryCode .arrow-up i {
    padding-top: 2px;
    padding-right: 1px;
}

.contryCode .dropdown-content {
    display: none;
    position: absolute;
    background-color: white;
    min-width: 100%;
    z-index: 1;
    top: 50px;
    bottom: 100%;
    min-height: 140px;
    border-radius: 12px;
    border: 2px solid #E6E8EC;
}

.contryCode .dropdown-content a {
    color: black;
    padding: 10px;
    text-decoration: none;
    display: flex;
    align-items: center;
    border-radius: 12px;
}

.contryCode .dropdown.show .dropdown-content {
    display: block;
}

.contryCode .dropdown-content a:hover {
    background-color: #ddd;
}

/* ============== signUp page css end ===================== */

/* ============== verification page css start ===================== */


.loginSec .loginpart .loginBox .logoSec h6 {
    color: #94A0AD;
    font-family: 'Gilroy-Bold';
}

.loginSec .loginpart .loginBox .getRegister {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 30px 0px;
}

.loginSec .loginpart .loginBox .getRegister h6 {
    margin-bottom: 0;
    display: flex;
    align-items: center;
    font-family: 'Manrope-Bold';
}

.loginSec .loginpart .loginBox .getRegister h6 span {
    height: 30px;
    width: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--gold-color);
    color: var(--white-color);
    font-size: 14px;
    margin-right: 10px;
}

.loginSec .loginpart .loginBox .getRegister h6 span.green {
    background-color: var(--green-color);
}

.loginSec .loginpart .loginBox .getRegister .next {
    margin: 0 30px;
}

.optionStart .btn {
    color: var(--text-black);
    width: 100%;
    border: 2px solid #E6E8EC;
    box-shadow: none;
    border-radius: 30px;
    font-family: 'Manrope-Bold';
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 5px 25px;
}

.optionStart .btn.appBtn {
    margin-bottom: 15px;
}

.optionStart .btn span i {
    margin-right: 10px;
    font-size: 18px;
    vertical-align: middle;
}

.loginBox.optSection {
    margin-top: 60px;
}

.getOtpBox {
    position: relative;
}

.getOtpBox a {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    font-family: 'Gilroy-ExtraBold';
}

.loginBox.optSection .register {
    margin-top: 20px;
}

.getOtpBox .commonInput {
    margin-bottom: 0;
    border-radius: 10px;
}

/* ============== verification page css end ===================== */


/* ============== details banner page css start ===================== */

.detasilTitle .detasilBox ul {
    display: flex;
    gap: 15px;
}

.detasilTitle .detasilBox .sectionTitle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.detasilTitle .detasilBox ul li a {
    background-color: var(--white-color);
    height: 40px;
    width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

.detasilTitle .detasilBox ul li a i {
    color: var(--input-color);
}

.detasilTitle .detasilBox .searchBox {
    position: relative;
}

.detasilTitle .detasilBox .searchBox input.main {
    width: 100%;
    border: 1px solid #C4C9D6;
    outline: none;
    box-shadow: none;
    border-radius: 14px;
    padding: 10px 100px 10px 40px;
    min-height: 70px;
}

.detasilTitle .detasilBox .searchBox input.main::placeholder {
    font-size: 16px;
    color: #C4C9D6;
    font-family: 'Gilroy-Medium';
}

.detasilTitle .detasilBox .searchBox i {
    position: absolute;
    color: var(--input-color);
    top: 50%;
    left: 15px;
    transform: translateY(-50%);
}

.detasilTitle .detasilBox .innerSecrch {
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
}

.detasilTitle .detasilBox .innerSecrch .srcBox {
    position: relative;
}

.detasilTitle .detasilBox .innerSecrch .srcBox i {
    position: absolute;
    color: var(--text-black);
    top: 50%;
    left: 10px;
    transform: translateY(-50%);
}

.detasilTitle .detasilBox .innerSecrch .srcBox input {
    min-height: 45px;
    max-width: 100px;
    border: 1px solid #C4C9D6;
    outline: none;
    box-shadow: none;
    border-radius: 8px;
    padding: 10px 5px 10px 30px;
}

.detasilTitle .detasilBox .innerSecrch .srcBox input::placeholder {
    color: var(--text-black);
}

.menuBread .breadcrumb {
    margin-top: 15px;
}

.menuBread .breadcrumb .breadcrumb-item:not(:first-child) {
    padding-left: 15px;
}

.menuBread .breadcrumb .breadcrumb-item {
    color: #777E90;
    font-size: 16px;
    font-family: 'Gilory-SemiBold';
}

.menuBread .breadcrumb .breadcrumb-item a {
    color: #777E90;
}

.checkout .menuBread .breadcrumb .breadcrumb-item a {
    color: #8B805B;
}

.menuBread .breadcrumb .breadcrumb-item.active {
    color: #B1B5C3 !important;
}

.menuBread .breadcrumb-item+.breadcrumb-item::before {
    padding-right: 15px;
}

.detailsSlider .owl-stage-outer {
    border-radius: 30px;
}

.detailsSlider .sliderImg img {
    border-radius: 30px;
}

.detailsSlider .owl-nav button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border: 1px solid #ffffff63 !important;
    border-radius: 50%;
    height: 50px;
    width: 50px;
}

.detailsSlider .owl-nav button i {
    color: var(--white-color);
    font-size: 16px;
}

.detailsSlider .owl-nav .owl-prev {
    left: 150px;
}

.detailsSlider .owl-nav .owl-next {
    right: 150px;
}

.mainContentBox {
    background-color: var(--white-color);
    border-radius: 30px;
    padding: 25px 20px;
}

.yellowText {
    color: var(--gold-color);
    font-family: 'Gilroy-Bold';
}

.mainContentBox .showmoreBtn {
    text-align: end;
}

p.green {
    color: #3E3723;
}

.mainContentBox .activityBox a {
    color: var(--text-black);
    border: 2px solid #E6E8EC;
    font-size: 14px;
    padding: 8px 15px;
    border-radius: 30px;
    font-family: 'Gilroy-Bold';
}

.mainContentBox .ticketDetails .ticketBox {
    display: grid;
    grid-template-columns: 270px 1fr;
    border-bottom: 1px solid #E5E6E6;
    margin-bottom: 20px;
    padding-bottom: 15px;
}

.mainContentBox .ticketDetails .ticketBox .leftBox {
    display: flex;
    align-items: center;
    gap: 15px;
}

.mainContentBox .ticketDetails .ticketBox .leftBox h6 {
    margin-bottom: 0;
    color: var(--input-color);
    font-family: 'Gilroy-Bold';
}

.mainContentBox .ticketDetails .ticketBox .leftBox span {
    background-color: var(--gold-color);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mainContentBox .ticketDetails .ticketBox .rightBox p span {
    margin-right: 10px;
}

.mainContentBox .cancelBox {
    margin: 20px 0;
}

.mainContentBox .addressBox .iconLand {
    background-color: var(--gold-color);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.mainContentBox .addressBox {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    gap: 20px;
}

.mainContentBox .addressBox p {
    max-width: 90%;
    font-size: 13px;
}

.mainContentBox .clickMap .btnMap {
    color: var(--text-black);
    border: 2px solid #E6E8EC;
    font-size: 14px;
    padding: 8px 15px;
    box-shadow: none;
    border-radius: 30px;
    font-family: 'Gilroy-Bold';
    width: 100%;
}

.meetingPoint .clickMap .mapBox {
    margin-top: 20px;
}

.meetingPoint .clickMap .mapBox iframe {
    width: 100%;
    min-height: 300px;
    border-radius: 24px;
}

.mainReviewBox {
    background-color: var(--white-color);
    border-radius: 30px;
    padding: 25px 20px;
    margin-top: 40px;
}

.mainReviewBox .topReviewBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}

.mainReviewBox .topReviewBox .rightBox {
    text-align: end;
}

.mainReviewBox .topReviewBox .rightBox p {
    color: #5F5F5F;
}

.starBox ul {
    display: flex;
    justify-content: end;
    gap: 5px;
}

.starBox ul li a i {
    font-size: 14px;
    color: var(--gold-color);
}

.starBox ul li a i.unfill {
    opacity: 0.3;
}

.commentBox {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 20px;
    border-bottom: 1px solid #E6E8EC;
    padding-bottom: 15px;
    margin-bottom: 20px;
}

.commentSec .comtitle {
    margin-bottom: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.commentSec .comtitle .filterBox a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'Poppins-Medium';
    border: 2px solid var(--border-color);
    border-radius: 12px;
    padding: 6px 14px;
    color: #23262F;
    width: 150px;
}

.commentSec .comtitle .filterBox a .iconRight {
    height: 32px;
    width: 33px;
    border: 2px solid #E6E8EC;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.commentSec .comtitle .filterBox a .iconRight i {
    font-size: 15px;
}

.commentSec .comtitle h4 {
    font-family: 'Gilroy-Bold';
}

.commentSec .comLeftBox .imgBox {
    height: 70px;
    width: 70px;
    margin: 0 auto;
    background-color: var(--purplr-light);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.commentSec .comLeftBox .imgBox h5 {
    font-family: 'Gilroy-Bold';
    margin-bottom: 0;
    opacity: 0.6;
}

.commentSec .comLeftBox .imgBox img {
    border-radius: 50%;
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.commentSec .comRightBox p.cmLine {
    color: #353945;
}

.commentSec .comLeftBox .starBox ul {
    justify-content: center !important;
    margin-top: 10px;
}

.commentSec .comLeftBox .dateBox {
    text-align: center;
}

.commentSec .comLeftBox .dateBox p {
    padding-top: 5px;
    font-size: 14px;
    color: var(--input-color);
}

.commentSec .comRightBox .cityname {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 10px;
}

.commentSec .comRightBox .likebox {
    display: flex;
    gap: 12px;
    align-items: center;
}

.commentSec .comRightBox .likebox span {
    color: var(--input-color);
}

.commentSec .comRightBox .likebox p {
    color: #23262F;
}

.commentSec .comRightBox .likebox p i {
    font-size: 18px;
}

.commentSec .comRightBox .cityname span {
    color: var(--input-color);
}

.commentSec .comRightBox .cityname span img {
    vertical-align: baseline;
    margin-right: 10px;
}

.commentSec .comRightBox .cityname h6 {
    position: relative;
    margin-right: 15px;
    font-family: 'Poppins-SemiBold';
}

.commentSec .comRightBox .cityname h6::after {
    position: absolute;
    content: '';
    right: -17px;
    top: 50%;
    height: 7px;
    width: 7px;
    background-color: #D9D9D9;
    border-radius: 50%;
    transform: translateY(-50%);
}

.loadingCom .loadMore {
    color: var(--text-black);
    border: 2px solid #E6E8EC;
    font-size: 16px;
    padding: 8px 15px;
    box-shadow: none;
    border-radius: 30px;
    font-family: 'Gilroy-Bold';
    width: 100%;
}

.loadingCom .loadMore i {
    margin-right: 10px;
    animation: spin 0.6s linear infinite;
}

.bookRightBox .selectDate {
    background-color: var(--white-color);
    border-radius: 30px;
    padding: 25px 20px;
    border: 1px solid #E6E8EC;
}

.bookRightBox .selectDate .multyDrop .secondBox {
    margin: 20px 0;
}

.bookRightBox .selectDate .multyDrop .commonClick {
    border: 2px solid #E6E8EC;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;
    border-radius: 15px;
    background: var(--white-color);
}

.bookRightBox .selectDate .multyDrop .commonClick .iconText h6 {
    margin-bottom: 0;
    color: #777777;
    font-family: 'Poppins-Medium';
}

.bookRightBox .selectDate .multyDrop .commonClick .iconText h6 i {
    color: #292D32;
    margin-right: 10px;
}

.bookRightBox .selectDate .multyDrop .commonClick .iconRight {
    height: 35px;
    width: 35px;
    border: 2px solid #E6E8EC;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bookRightBox .selectDate .multyDrop .commonClick .iconRight i {
    color: var(--drak-mode);
    font-size: 14px;
}

.bookRightBox .selectDate .multyDrop .adultDropBox ul {
    padding: 20px 20px;
    box-shadow: 0px 0px 10px var(--border-color);
    border-radius: 15px;
}

.bookRightBox .selectDate .multyDrop .adultDropBox ul li {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.bookRightBox .selectDate .multyDrop .adultDropBox ul li:not(:last-child) {
    padding-bottom: 10px;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--border-color);
}

.bookRightBox .selectDate .multyDrop .adultDropBox ul li .adultage h6 {
    font-size: 18px;
    font-family: 'Gilory-SemiBold';
}

.bookRightBox .selectDate .multyDrop .adultDropBox ul li .adultage span {
    font-size: 14px;
    color: var(--input-color);
    font-family: 'Gilroy-Regular';
}

.bookRightBox .selectDate .multyDrop .adultDropBox ul li .countBtn i {
    color: #83889B;
    font-size: 25px;
    vertical-align: middle;
    cursor: pointer;
}

.bookRightBox .selectDate .multyDrop .adultDropBox ul li .countBtn span {
    font-size: 18px;
    padding: 0 20px;
    color: #83889B;
}

.bookRightBox .selectDate .multyDrop .timeDropBox ul {
    background: #FCFCFD;
    padding: 20px 20px;
    box-shadow: 0px 0px 10px var(--border-color);
    border-radius: 15px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    text-align: center;
    gap: 10px;
}

.bookRightBox .selectDate .multyDrop .timeDropBox ul li a {
    width: 100%;
    background-color: #E3BD3E1A;
    border: 1px solid var(--gold-color);
    color: #2C2F3A;
    border-radius: 5px;
    padding: 10px 0px;
    font-family: 'Gilory-SemiBold';
    transition: 0.3s;
}

.bookRightBox .selectDate .multyDrop .timeDropBox ul li a:hover {
    background-color: var(--gold-color);
}

.firstBox,
.secondBox,
.thirdBox {
    position: relative;
}

.adultDropBox,
.timeDropBox,
.dateDropBox {
    display: none;
    position: absolute;
    z-index: 10;
    background: var(--white-color);
    width: 100%;
    border-radius: 15px;
    top: 70px;
}

.active-border {
    border-color: var(--gold-color) !important;
}

.bookRightBox .selectDate .multyDrop .dateDropBox {
    padding: 20px 20px;
    box-shadow: 0px 0px 10px var(--border-color);
    border-radius: 15px;
}

.dateDropBox.ourClickBox #flatDate {
    display: none;
}

/* ============== details banner page css end ===================== */



/* ============== Add activity page css start ===================== */

.activityMain .activityhead,
.listProducts .activityhead,
.importTour .activityhead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 50px;
}

.activityMain .activityhead .backBox a,
.listProducts .activityhead .backBox a,
.importTour .activityhead .backBox a {
    font-size: 16px;
    border: 2px solid #E6E8EC;
    border-radius: 30px;
    color: #23262F;
    padding: 8px 20px;
    font-family: 'Manrope-Bold';
}

.activityMain .activityhead .backBox a i,
.listProducts .activityhead .backBox a i,
.importTour .activityhead .backBox a i {
    font-size: 13px;
    margin-right: 10px;
    color: #23262F;
}

.activityMain .activityFillSec .mainTabBox {
    gap: 30px;
}

.activityMain .activityFillSec .mainTabBox .nav {
    background: var(--white-color);
    padding: 25px 20px;
    border-radius: 16px;
}

.activityMain .activityFillSec .mainTabBox .nav .nav-link.mainLink {
    text-align: start;
    color: #23262F;
    border-radius: 10px;
    font-family: 'Manrope-SemiBold';
    padding: 12px 20px 12px 45px;
    border-left: 3px solid transparent;
    width: 240px;
    position: relative;
}

.activityMain .activityFillSec .mainTabBox .nav .nav-link.mainLink::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 50%;
    background-image: url(../images/component.png);
    background-repeat: no-repeat;
    height: 32px;
    width: 32px;
    transform: translateY(-50%);
    background-size: contain;
}

.activityMain .activityFillSec .mainTabBox .nav .nav-link.mainLink.active::after {
    background-image: url(../images/tick-circle.png) !important;
    background-size: contain;
}

.activityMain .activityFillSec .mainTabBox .nav .nav-link.mainLink.complete::after {
    background-image: url(../images/circle-complete.png);
    background-size: contain;
}

.activityMain .activityFillSec .mainTabBox .nav .nav-link.mainLink.active {
    background-color: #F9F3DC;
    border-color: var(--gold-color) !important;
}

.activityMain .activityFillSec .mainTabBox .nav .nav-link.mainLink:not(:last-child) {
    margin-bottom: 10px;
}

.backLayerCom {
    background: var(--white-color);
    padding: 25px 25px;
    border-radius: 24px;
}

.activityMain .activityFillSec .mainTabBox .importBox .bokunDropBox a.mainDisk {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'Poppins-Medium';
    border: 2px solid var(--border-color);
    border-radius: 12px;
    padding: 6px 20px;
    color: #23262F;
}

.commonh3 {
    color: #23262F;
    font-family: 'Manrope-Bold';
}

.activityMain .activityFillSec .mainTabBox .importBox .bokunDropBox a .iconDown {
    height: 35px;
    width: 35px;
    border: 2px solid #E6E8EC;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.boxTabing .nav {
    padding: 30px 0 !important;
    margin-bottom: 0 !important;
}

.boxTabing .nav .nav-item {
    width: 50%;
}

.boxTabing .nav-item .nav-link {
    width: 100%;
    color: #23252EE0;
    border-radius: 0;
    font-family: 'Manrope-Bold';
    border: 1px solid #D9D9D9;
    padding: 10px 20px;
    background-color: var(--white-color);
}

.boxTabing .nav-item .nav-link.active {
    background-color: var(--gold-color);
    border-color: var(--gold-color);
}

.boxTabing .nav-item .nav-link.leftBtn {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.boxTabing .nav-item .nav-link.rightBtn {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}

.innerFormBox {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin-bottom: 25px;
}

.continueBox .continueBtn {
    background: var(--gold-color);
    width: 100%;
    margin-top: 30px;
    font-family: 'Manrope-Bold';
    border-radius: 30px;
    min-height: 45px;
    color: #23252E;
    font-size: 16px;
    box-shadow: none;
    outline: none;
}

.continueBox .continueBtn i {
    font-size: 12px;
    margin-left: 10px;
}

.titleTabMain .emptyBox,
.themeSugest .emptyBox,
.informationSec .emptyBox,
.cancelation .emptyBox {
    min-height: 200px;
}

.progressSec .progressBox {
    background: var(--white-color);
    border-radius: 30px;
    padding: 40px 60px 80px 60px;
    text-align: center;
    max-width: 800px;
    width: 100%;
    margin: 0 auto 60px;
}

.progressSec .progressBox .progress {
    margin-top: 50px;
    border-radius: 30px;
    background-color: #F4F4F0;
}

.progressSec .progressBox .progress .progress-bar {
    background-color: var(--gold-color);
    border-radius: 30px;
}

.loactionMain .boxFull {
    margin-bottom: 25px;
}

.boxFull textarea {
    width: 100%;
    padding: 8px 15px;
    border-radius: 12px;
    border: 2px solid var(--border-color);
    box-shadow: none;
    outline: none;
    min-height: 150px;
    resize: none;
}

.boxFull textarea::placeholder {
    color: #C1C1C4;
}

.mapComBox iframe {
    width: 100%;
    min-height: 300px;
    border-radius: 20px;
}

.meetingLoact {
    margin-top: 40px;
}

.meetingLoact .uploadBox {
    border: 2px dashed #D3D3D3;
    border-radius: 15px;
    min-height: 200px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    position: relative;
}

.meetingLoact .uploadBox .text-box img {
    max-width: 50px;
    width: 100%;
}

.meetingLoact .uploadBox .text-box h6 {
    font-size: 16px;
    margin-bottom: 0;
    font-family: 'Manrope-Medium';
    margin-top: 15px;
}

.meetingLoact .uploadBox .text-box h6 a {
    color: #1F4690;
    margin-left: 5px;
    font-family: 'Manrope-Bold';
}

.meetingLoact .uploadBox .text-box P {
    font-size: 13px;
    padding-top: 5px;
}

.meetingLoact .uploadBox .dragDropBox input {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 5;
}

.uploadShowBox {
    border: 1px solid var(--border-color);
    border-radius: 15px;
    padding: 15px 20px;
    margin: 20px 0;
}

.uploadShowBox .boxOur {
    display: flex;
    align-items: start;
    justify-content: space-between;
    margin-bottom: 10px;
}

.uploadShowBox .boxOur .imgDetails {
    display: flex;
    align-items: center;
    gap: 20px;
}

.uploadShowBox .boxOur .playCancel .playpush,
.uploadShowBox .boxOur .playCancel .btnClose {
    padding: 0;
    font-size: 24px;
}

.uploadShowBox .boxOur .playCancel .playpush {
    color: #A0ABBA;
    margin-right: 15px;
}

.uploadShowBox .boxOur .playCancel .btnClose {
    color: #BE0000;
}

.uploadShowBox .boxOur .imgDetails .imgSec {
    height: 50px;
    width: 50px;
}

.uploadShowBox .boxOur .imgDetails .imgSec img {
    height: 100%;
    /* width: 100%; */
    width: 50px;
    object-fit: cover;
    border-radius: 12px;
}

.uploadShowBox .boxOur .imgDetails .imgText h6 {
    margin-bottom: 0px;
    font-size: 16px;
    color: #132A60;
    font-family: 'Poppins-Medium';
    word-break: break-all !important;
}

.uploadShowBox .boxOur .imgDetails .imgText span {
    color: #969DB2;
    font-size: 13px;
    font-family: 'Poppins-Regular';
}

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

.uploadShowBox .progresBox .progress {
    height: 5px;
    border-radius: 30px;
    background-color: #F4F4F0;
    width: 95%;
}

.uploadShowBox .progresBox .progress .progress-bar {
    background-color: var(--gold-color);
    border-radius: 30px;
}

.uploadShowBox .progresBox .valueBox {
    width: 3%;
    font-size: 13px;
    color: #969DB2;
}

.themeSugest .suggestUp ul,
.themeSugest .selectedCat ul {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}

.themeSugest .suggestUp ul li a {
    padding: 5px 8px;
    font-size: 14px;
    background-color: #F5A52433;
    color: #F5A524;
    border-radius: 8px;
}

.themeSugest .suggestUp ul li a i {
    color: #F5A524;
    margin-right: 5px;
    font-size: 15px;
}

.themeSuges .selectedCat {
    margin-top: 20px;
}

.themeSugest .selectedCat ul li a {
    padding: 5px 8px;
    font-size: 14px;
    background-color: #17C964;
    color: #000000;
    border-radius: 8px;
    box-shadow: 0px 5px 15px #17C96466;
}

.themeSugest .selectedCat ul li a i {
    color: #000000;
    margin-left: 5px;
    font-size: 15px;
}

.suggestUp,
.selectedCat {
    margin-top: 25px;
}

.comTextarea {
    width: 100%;
    padding: 8px 15px;
    border-radius: 12px;
    border: 2px solid var(--border-color);
    box-shadow: none;
    outline: none;
    min-height: 160px;
    resize: none;
}

.comTextarea::placeholder {
    color: #C1C1C4;
}

.discriptionSec .fullDiscriptBox {
    margin: 15px 0;
}

.discriptionBox .writeBoxCom {
    margin: 15px 0;
}

.discriplangDown {
    position: relative;
}

.discriplangDown a.main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'Poppins-Medium';
    border: 2px solid var(--border-color);
    border-radius: 12px;
    padding: 6px 20px;
    color: #23262F;
}

.discriplangDown a.main .iconDown {
    height: 35px;
    width: 35px;
    border: 2px solid #E6E8EC;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.discriptionSec .subDown {
    position: absolute;
    top: 52px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 55;
    background: var(--white-color);
    border-radius: 12px;
    box-shadow: 0 0 5px #d9d9d9;
    padding: 5px;
    width: 100%;
}

.discriptionSec .subDown li a {
    padding: 5px 15px;
    width: 100%;
    border-radius: 10px;
    margin-top: 5px;
    color: var(--text-black);
    font-family: 'Manrope-Bold';
    transition: 0.3s;
}

.discriptionSec .subDown li a:hover {
    background-color: #ffd1669f;
}

.discriptionSec .hostworking {
    margin: 25px 0;
}

.hostworking .addLangBtn ul {
    display: flex;
    align-items: center;
    gap: 5px;
    flex-wrap: wrap;
}

.hostworking .addLangBtn ul li a {
    padding: 5px 12px;
    font-size: 14px;
    border: 2px solid #F5A524;
    background-color: #F8F0D3;
    color: #F5A524;
    border-radius: 10px;
    font-size: 16px;
}

.hostworking .addLangBtn ul li a i {
    margin-left: 5px;
}

.hostworking .addLangBtn ul li a.addClick {
    padding: 5px 12px;
    font-size: 14px;
    border: 2px solid #64748B;
    background: transparent;
    color: #64748B;
    border-radius: 10px;
    font-size: 16px;
}

.hostworking .addLangBtn ul li a.addClick i {
    margin-right: 5px;
    margin-left: 0px;
    font-size: 18px;
    vertical-align: middle;
}

.answerBox {
    margin: 25px 0;
}

.accessibleBox .ourClickBox {
    display: flex;
    gap: 30px;
    padding: 10px 0;
    margin-bottom: 20px;
}

.accessibleBox .typecheck {
    position: relative;
    padding-left: 30px;
    margin-bottom: 5px;
}

.accessibleBox .typecheck input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    margin-right: 0px;
    left: 0;
    top: 0;
    height: 22px;
    width: 22px;
    border-radius: 4px;
    z-index: 55;
    cursor: pointer;
}

.accessibleBox .typecheck .keyword-label {
    font-size: 18px;
    color: #11181C;
    font-family: 'Manrope-Medium';
}

.accessibleBox .typecheck input[type="checkbox"]+.keyword-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    cursor: pointer;
    height: 22px;
    border: 2px solid var(--border-color);
    background-color: #fff;
    border-radius: 6px;
}

.accessibleBox .typecheck input[type="checkbox"]:checked+.keyword-label::after {
    content: '\f00c';
    position: absolute;
    font-family: 'fontawesome';
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 11px;
    color: #11181C;
    background-color: #F5A524;
    width: 22px;
    height: 22px;
    text-align: center;
    border-radius: 6px;
    padding-top: 3px;
}

.imgUpload .coverGallery {
    margin-bottom: 20px;
}

.imgUpload .imageImprot {
    border: 2px dashed #D3D3D3;
    border-radius: 15px;
    min-height: 200px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
    position: relative;
}

.imgUpload .imageImprot .dragDropBox input {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 5;
}

.imgUpload .imageImprot .text-box img {
    max-width: 50px;
    width: 100%;
}

.imgUpload .imageImprot .text-box h6 {
    font-size: 16px;
    margin-bottom: 0;
    font-family: 'Manrope-Medium';
    margin-top: 15px;
}

.imgUpload .imageImprot .text-box h6 a {
    color: #1F4690;
    margin-left: 5px;
    font-family: 'Manrope-Bold';
}

.imgUpload .imageImprot .text-box P {
    font-size: 13px;
    padding-top: 5px;
}

.allimgBox {
    margin-top: 20px;
}

.subimageBox {
    background-color: #E6E8EC;
    border-radius: 16px;
    padding: 2px 45px 2px 2px;
    margin-bottom: 15px;
    position: relative;
}

.subimageBox .boxOur {
    background-color: var(--white-color);
    border-radius: 15px;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.subimageBox .boxOur .imgDetails {
    display: flex;
    align-items: center;
    gap: 20px;
}

.subimageBox .boxOur .imgDetails .imgSec {
    height: 70px;
    width: 70px;
}

.subimageBox .boxOur .imgDetails .imgText h6 {
    margin-bottom: 0;
    word-break: break-all;
}

.subimageBox .boxOur .imgDetails .imgText span {
    color: #969DB2;
    font-size: 13px;
    font-family: 'Poppins-Regular';
}

.subimageBox .boxOur .imgDetails .imgSec img {
    height: 100%;
    /* width: 100%; */
    width: 70px;
    object-fit: cover;
    border-radius: 12px;
}

.subimageBox .deletImg .deletBtn {
    background-color: #FFE3E3;
    padding: 5px 10px;
    border-radius: 8px;
    box-shadow: none;
}

.subimageBox .deletImg .deletBtn i {
    color: #E30000;
}

.subimageBox .dragBox {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
}

.subimageBox .dragBox .btnDrag {
    background-color: var(--white-color);
    color: #A0A7B5;
    padding: 5px 8px;
    border-radius: 8px;
    box-shadow: none;
}

.shiftBox .cutofftime {
    margin-bottom: 20px;
}

.shiftBox .cutofftime h5 {
    color: #23262F;
    font-family: 'Manrope-Bold';
    margin-bottom: 8px;
}

.bookTiming .bookslottime>a.main,
.repeatBox .repeatSlot>a.main,
.duratioBox .duratioSlot>a.main,
.private .privateSlot>a.main,
.statusSec .statusSlot>a.main {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'Poppins-Medium';
    border: 2px solid var(--border-color);
    border-radius: 12px;
    padding: 6px 20px;
    color: #23262F;
}

.bookTiming .bookslottime>a.main .iconDown,
.repeatBox .repeatSlot>a.main .iconDown,
.duratioBox .duratioSlot>a.main .iconDown,
.private .privateSlot>a.main .iconDown,
.statusSec .statusSlot>a.main .iconDown {
    height: 35px;
    width: 35px;
    border: 2px solid #E6E8EC;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bookTiming .daysSelect {
    display: grid;
    grid-template-columns: 80% 1fr;
    gap: 20px;
}

.repeatSec,
.private {
    margin: 20px 0;
}

.duratioSec {
    margin-bottom: 20px;
}

.daysSelect .bookslottime,
.repeatSec .repeatBox,
.duratioBox .duratioSlot,
.private .privateSlot,
.statusSec .statusSlot {
    position: relative;
}

.bookslottime .timeDrop,
.repeatBox .repeatDrop,
.duratioSlot .duratioDrop,
.private .privateDrop,
.statusSlot .statusDrop {
    position: absolute;
    top: 52px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 55;
    background: var(--white-color);
    border-radius: 12px;
    box-shadow: 0 0 5px #d9d9d9;
    padding: 5px;
    width: 100%;
}

.bookslottime .timeDrop li a,
.repeatBox .repeatDrop li a,
.duratioSlot .duratioDrop li a,
.private .privateDrop li a,
.statusSlot .statusDrop li a {
    padding: 5px 15px;
    width: 100%;
    border-radius: 10px;
    margin-top: 5px;
    color: var(--text-black);
    font-family: 'Manrope-Bold';
    transition: 0.3s;
}

.bookslottime .timeDrop li a:hover,
.repeatBox .repeatDrop li a:hover,
.duratioSlot .duratioDrop li a:hover,
.private .privateDrop li a:hover,
.statusSlot .statusDrop li a:hover {
    background-color: #ffd1669f;
}

.weakCheckList .ourClickBox {
    display: flex;
    gap: 30px;
    padding: 10px 0;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.weakCheckList .typecheck {
    position: relative;
    padding-left: 30px;
    margin-bottom: 5px;
}

.weakCheckList .typecheck input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    margin-right: 0px;
    left: 0;
    top: 0;
    height: 22px;
    width: 22px;
    border-radius: 4px;
    z-index: 55;
    cursor: pointer;
}

.weakCheckList .typecheck .weak-label {
    font-size: 18px;
    color: #11181C;
    font-family: 'Manrope-Medium';
}

.weakCheckList .typecheck input[type="checkbox"]+.weak-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 22px;
    cursor: pointer;
    height: 22px;
    border: 2px solid var(--border-color);
    background-color: #fff;
    border-radius: 6px;
}

.weakCheckList .typecheck input[type="checkbox"]:checked+.weak-label::after {
    content: '\f00c';
    position: absolute;
    font-family: 'fontawesome';
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 11px;
    color: #11181C;
    background-color: #F5A524;
    width: 22px;
    height: 22px;
    text-align: center;
    border-radius: 6px;
    padding-top: 3px;
}

.shiftBox .multytimeBox {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-top: 20px;
}

.multytimeBox .box-box {
    background: #FCFCFD;
    height: 130px;
    width: 140px;
    border-radius: 20px;
    border: 2px solid #E6E8EC;
    padding: 14px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.multytimeBox .box-box .round {
    height: 24px;
    width: 24px;
    border-radius: 50%;
    background-color: #F4F4F5;
    border: 2px solid #D4D4D8;
}

.multytimeBox .box-box p {
    margin-bottom: 0px;
}

.seatsBox .commonLabelSecond i {
    font-size: 22px;
    margin-left: auto;
    cursor: pointer;
    float: right;
    margin-right: 5px;
    color: #6E828D;
}

.bookingCategoryMobile {
    display: none;
}

.commongridMobile .innerDiv {
    display: grid;
    grid-template-columns: 1fr 180px;
}

.bookingFamily .bookingCategory {
    margin-top: 25px;
}

.bookingCategory .commongridbox {
    display: grid;
    grid-template-columns: 280px 1fr 1fr 1fr;
    gap: 15px;
    margin-bottom: 15px;
}

.bookingCategoryMobile {
    margin: 20px 0;
}

.commongridMobile .innerDiv {
    display: grid;
    grid-template-columns: 1fr 180px;
    gap: 20px;
    margin-bottom: 10px;
    align-items: center;
}

.commongridMobile .innerDiv .commonInputSecond {
    height: 42px;
}

.bookingCategory .commongridbox h6,
.commongridMobile .innerDiv h6 {
    color: #7A7C86;
    margin-bottom: 0;
    font-size: 14px;
    font-family: 'Manrope-ExtraBold';
}

.tripPrices .costBox {
    overflow-x: scroll;
    scrollbar-width: none;
}

.tripPrices .costBox::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #E7EAEC;
}

.tripPrices .costBox::-webkit-scrollbar {
    height: 5px;
    background-color: #E7EAEC;
    border-radius: 10px;
}

.tripPrices .costBox::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #9AAAB3;
}

.tripPrices .costBox table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #E7EBED;
    border-radius: 15px;
    overflow-x: auto;
    background-color: var(--white-color);
}

.tripPrices .costBox table th,
.tripPrices .costBox table td {
    padding: 15px;
    border: 1px solid #E7EBED;
    white-space: nowrap;
}

.tripPrices .costBox table tbody tr:last-child>td:first-child {
    border-bottom-left-radius: 15px;
}

.tripPrices .costBox table th:first-child {
    border-top-left-radius: 13px;
}

.tripPrices .costBox table th:last-child {
    border-top-right-radius: 13px;
}

.tripPrices .costBox table tr td h6 {
    margin-bottom: 0;
    color: #1E293B;
    font-family: 'Manrope-ExtraBold';
}

.tripPrices .costBox table tr td p {
    font-size: 13px;
    color: #1E293B;
    font-family: 'Manrope-Medium';
}

.tripPrices .costBox table tr td span {
    font-size: 16px;
    font-family: 'Manrope-Medium';
    color: #1E293B;
}

.tripPrices .costBox table td input {
    resize: none;
    position: absolute;
    box-shadow: none;
    outline: none;
    border: 1px solid var(--gold-color);
    top: 0;
    border-bottom-right-radius: 13px;
    padding: 10px;
}

.tripPrices .costBox table td.commisoin {
    padding: 0 !important;
    position: relative;
    border-bottom-right-radius: 15px;
}

.bookingDate {
    margin-top: 30px;
}

.bookingDate .bookOurBox {
    background-color: #FFFBEB;
    padding: 20px;
    max-width: 450px;
    border-radius: 15px;
    margin-top: 20px;
}

.bookingDate .bookOurBox h5 {
    color: #BB8E11;
    font-family: 'Manrope-Bold';
}

.bookingDate .bookOurBox .confDate {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 20px;
}

.bookingDate .bookOurBox .confDate h6,
.bookingDate .bookOurBox .discount h6 {
    text-align: end;
    font-size: 16px;
    font-family: 'Manrope-Bold';
    color: #23262F;
}

.bookingDate .bookOurBox .discount {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.infocheck .infoDetails {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    margin-top: 15px;
}

.infoDetails .typecheck {
    position: relative;
    padding-left: 35px;
    margin-bottom: 5px;
}

.infoDetails .typecheck input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    margin-right: 0px;
    left: 0;
    top: 0;
    height: 22px;
    width: 22px;
    border-radius: 4px;
    z-index: 55;
    cursor: pointer;
}

.infoDetails .typecheck .keyword-label {
    font-size: 16px;
    color: #11181C;
    font-family: 'Manrope-Medium';
}

.infoDetails .typecheck input[type="checkbox"]+.keyword-label::before {
    content: '';
    position: absolute;
    left: 0;
    /* top: 50%; */
    /* transform: translateY(-50%); */
    width: 22px;
    cursor: pointer;
    height: 22px;
    border: 2px solid var(--border-color);
    background-color: #fff;
    border-radius: 6px;
    margin-top: 2px;
}

.infoDetails .typecheck input[type="checkbox"]:checked+.keyword-label::after {
    content: '\f00c';
    position: absolute;
    font-family: 'fontawesome';
    left: 0px;
    top: 53%;
    transform: translateY(-50%);
    font-size: 11px;
    color: #11181C;
    background-color: #F5A524;
    width: 22px;
    height: 22px;
    text-align: center;
    border-radius: 6px;
    padding-top: 3px;
}


/* ============== Add activity page css end ===================== */



/* ============== list products page css start ===================== */

.mainListProducts .tabBtnbox ul li {
    margin-bottom: 10px;
}

.mainListProducts .tabBtnbox ul li .custombtn {
    text-align: start;
    color: #64748B;
    border-radius: 10px;
    font-family: 'Manrope-Bold';
    padding: 12px 12px;
    border-left: 3px solid transparent;
    width: 100%;
    /* max-width: 240px; */
    position: relative;
    display: flex;
    align-items: center;
}

.mainListProducts .tabBtnbox ul li .custombtn.active {
    background-color: #F9F3DC;
    border-color: var(--gold-color) !important;
    color: #23262F !important;
}

.mainListProducts .tabBtnbox ul li .custombtn.active i {
    color: var(--gold-color) !important;
}

.mainListProducts .tabBtnbox ul li .custombtn svg {
    vertical-align: bottom;
    margin-right: 10px;
}

.mainListProducts .tabBtnbox ul li ul.submenu {
    padding-left: 50px;
    padding-top: 10px;
    display: none;
    position: relative;
}

.mainListProducts .tabBtnbox ul li ul.submenu::after {
    content: '';
    position: absolute;
    top: 0;
    left: 20px;
    height: 70px;
    width: 2.5px;
    background-color: #FBEFD0;
}

.mainListProducts .tabBtnbox ul li ul.submenu li a {
    color: #2F2304;
    font-size: 16px;
    font-family: 'Manrope-Bold';
    position: relative;
}

.mainListProducts .tabBtnbox ul li ul.submenu li a::before {
    content: '';
    position: absolute;
    left: -30px;
    top: -10px;
    width: 100%;
    height: 100%;
    background-image: url(../images/border-img-blur.png);
    background-repeat: no-repeat;
    z-index: 5;
}

.mainListProducts .tabBtnbox ul li ul.submenu li a.active::before {
    background-image: url(../images/border-img.png);
}

.mainListProducts .tabBtnbox ul li .custombtn .arrow {
    font-size: 12px;
    transition: transform 0.3s ease;
}

.mainListProducts .tabBtnbox ul li .custombtn .rotate {
    transform: rotate(-90deg);
}

.mainListProducts .tabBtnbox ul li ul.submenu li a.active {
    color: #ECBB33;
}

.mainListProducts .tabBtnbox ul li .custombtn.active svg path {
    fill: #ECBB33;
}

.mainListProducts .tabBtnbox ul li .custombtn.active i {
    color: #23262F !important;
}

.mainListProducts .tabBtnbox ul li .custombtn i {
    margin-right: 10px;
    font-size: 20px;
    color: #23262F;
}

.mainListProducts .tabBtnbox ul li .custombtn i {
    margin-right: 10px;
    font-size: 20px;
    color: #23262F;
}

.rightTabcontent .importTitle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
}

.rightTabcontent .addTour .btnGold {
    background-color: var(--gold-color);
    color: var(--text-black) !important;
}

.rightTabcontent .addTour .btnGold i {
    margin-right: 10px;
    color: #23252E;
}

.rightTabcontent .productList .listBoxproduct {
    display: grid;
    grid-template-columns: 1fr 130px;
    gap: 10px;
    border: 2px solid var(--border-color);
    border-radius: 15px;
    padding: 15px;
    margin-bottom: 15px;
}

.rightTabcontent .productList .listBoxproduct .listBoxLeft {
    display: flex;
    gap: 15px;
}

.rightTabcontent .productList .listBoxproduct .listBoxLeft .listText {
    width: 78%;
}

.rightTabcontent .productList .listBoxLeft .listImg {
    height: 90px;
    width: 22%;
}

.rightTabcontent .productList .listBoxLeft .listImg img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.rightTabcontent .productList .listBoxproduct .listBoxLeft .listText h6 {
    font-family: 'Manrope-ExtraBold';
    margin-bottom: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

span.comTagspan {
    font-size: 14px;
    border-radius: 8px;
    padding: 2px 8px;
}

span.yellow {
    color: #F5A524;
    background-color: #F5A52433;
}

span.blue {
    color: #006FEE;
    background-color: #006FEE33;
}

span.green {
    color: #17C964;
    background-color: #17C96433;
}

span.purple {
    color: #7828C8;
    background-color: #7828C833;
}

.rightTabcontent .productList .listBoxproduct .listEditBox ul li .listbtn {
    height: 35px;
    width: 35px;
    border: 2px solid var(--border-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.rightTabcontent .productList .listBoxproduct .listEditBox ul li .listbtn i {
    color: #777E90;
    font-size: 15px;
}

.rightTabcontent .productList .listBoxproduct .listEditBox ul {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: end;
}

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

.rightTabcontent .pagenext .pageList p {
    font-size: 16px;
    color: #000000E0;
    font-family: 'Manrope-SemiBold';
}

.paginationBox .pagination {
    gap: 10px;
}

.paginationBox .pagination .page-item .page-link {
    border: 1px solid #CBD5E1;
    border-radius: 6px;
    color: #475569;
    font-family: 'Manrope-SemiBold';
    height: 35px;
    width: 35px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
    outline: none;
}

.paginationBox .pagination .page-item .page-link.active,
body.dark .paginationBox .pagination .page-item .page-link.active {
    background-color: var(--gold-color) !important;
    color: var(--white-color) !important;
    border-color: var(--gold-color) !important;
}

.page-item:first-child .page-link,
.page-item:last-child .page-link {
    border-radius: 6px !important;
}

.tourListall {
    margin-top: 30px;
}

.tourListall .tourName {
    display: grid;
    grid-template-columns: 30px 1fr 140px;
    gap: 15px;
    align-items: center;
    background-color: #F4F4F5;
    border-radius: 6px;
    padding: 10px 20px;
}

.tourListall .tourName .fisrtBox span.graySpan {
    height: 18px;
    width: 18px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #D4D4D8;
    color: var(--black-color);
}

.tourListall .tourName .box h6 {
    margin-bottom: 0;
    color: #71717A;
    font-family: 'Manrope-Bold';
    text-transform: uppercase;
    font-size: 15px;
}

.mainlistBox .listourbox {
    display: grid;
    grid-template-columns: 30px 1fr 140px;
    gap: 15px;
    padding: 15px 20px;
    align-items: center;
    /* margin-bottom: 15px; */
}

.listourbox .listcheck {
    position: relative;
    margin-bottom: 5px;
}

.listourbox .tourlistimg {
    display: flex;
    align-items: center;
    gap: 15px;
}

.listourbox .tourlistimg .listImg {
    width: 15%;
    height: 80px;
}

.listourbox .tourlistimg .listImg img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.listourbox .tourlistimg .listText {
    width: 85%;
}

.listourbox .tourlistimg .listText h6 {
    font-size: 16px;
    margin-bottom: 0;
    font-family: 'Manrope-Medium';
}

.listourbox .listcheck input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    margin-right: 0px;
    left: 0;
    top: 0;
    height: 18px;
    width: 18px;
    border-radius: 4px;
    z-index: 55;
    cursor: pointer;
}

.listourbox .listcheck input[type="checkbox"]+.keyword-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 18px;
    cursor: pointer;
    height: 18px;
    border: 2px solid var(--border-color);
    background-color: #fff;
    border-radius: 6px;
}

.listourbox .listcheck input[type="checkbox"]:checked+.keyword-label::after {
    content: '\f00c';
    position: absolute;
    font-family: 'fontawesome';
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    color: #11181C;
    background-color: #F5A524;
    width: 18px;
    height: 18px;
    text-align: center;
    border-radius: 6px;
    padding-top: 2px;
}

.productDuration .proDuratDrop {
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr 1fr;
    padding-bottom: 20px;
    border-bottom: 1px solid #EDF1F6;
    margin-bottom: 20px;
}

.bookingtabbox .bookingtabDrop {
    display: grid;
    gap: 20px;
    grid-template-columns: 1fr 1fr 1fr;
    padding: 20px 0;
}

.proDuratDrop .bokunDropBox,
.bookingtabbox .bokunDropBox,
.allBookinghead .bokunDropBox {
    position: relative;
}

.proDuratDrop .bokunDropBox a,
.bookingtabbox .bokunDropBox a,
.allBookinghead .addTitle .bokunDropBox a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'Poppins-Medium';
    border: 2px solid var(--border-color);
    border-radius: 12px;
    padding: 6px 20px;
    color: #23262F;
}

.proDuratDrop .bokunDropBox a .iconDown,
.bookingtabbox .bokunDropBox a .iconDown,
.allBookinghead .addTitle .bokunDropBox a .iconDown {
    height: 35px;
    width: 35px;
    border: 2px solid #E6E8EC;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.allBookinghead .addTitle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30px;
}

.allBookinghead .bokunDropBox {
    width: 300px;
}

span.listgray {
    background-color: #D4D4D8;
    color: #000000;
    padding: 5px 8px;
    font-size: 14px;
    border-radius: 8px;
}

span.yellelist {
    background-color: #F5A524;
    color: var(--white-color);
    padding: 5px 8px;
    font-size: 14px;
    border-radius: 8px;
}

span.purplelist {
    background-color: #7828C8;
    color: var(--white-color);
    padding: 5px 8px;
    font-size: 14px;
    border-radius: 8px;
}

span.bluelist {
    background-color: #006FEE;
    color: var(--white-color);
    padding: 5px 8px;
    font-size: 14px;
    border-radius: 8px;
}

.orderListbox {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.orderListbox .dateBoxLeft {
    padding-right: 15px;
    border-right: 1px solid #E6E8EC;
    margin-right: 20px;
}

.orderListbox .orderListRight .toptitle h5 {
    font-family: 'Manrope-Bold';
    color: #64748B;
    padding-bottom: 10px;
    border-bottom: 1px solid #E6E8EC;
}

.orderListbox .orderListRight .tourcombox {
    border-bottom: 1px solid #E6E8EC;
    margin-bottom: 25px;
}

.orderListbox .orderListRight .tourcombox .timespan h6 {
    color: #44444F;
    font-family: 'Manrope-Bold';
    font-size: 16px;
}

.orderListbox .orderListRight .tourcombox .timespan h6 i {
    margin-right: 5px;
    color: #64748B;
    font-size: 18px;
}

.orderListbox .orderListRight .tourcombox .tourname {
    padding-bottom: 25px;
}

.orderListbox .orderListRight .tourcombox .tourname h6 {
    color: #44444F;
    font-family: 'Manrope-SemiBold';
    font-size: 18px;
    margin-bottom: 10px;
}

.orderListbox .orderListRight .tourcombox .tourname ul {
    display: flex;
    align-items: center;
    gap: 15px;
}

.orderListbox .orderListRight .tourcombox .tourname ul li span img {
    margin-right: 5px;
    vertical-align: middle;
}

.orderListbox .orderListRight .tourcombox .tourname ul li:last-child {
    margin-left: 5px;
}

.accordion-flush .accordion-item {
    border: 2px solid #F1F5F9 !important;
    margin-bottom: 15px;
    box-shadow: none;
    background-color: transparent !important;
    border-radius: 12px;
    transition: 0.3s;
}

.accordion-flush .accordion-item:hover {
    background-color: #FDF7E8 !important;
    box-shadow: 0px 10px 30px -10px #00000026;
}

.accordion-flush .accordion-item .accordion-button {
    border: none !important;
    box-shadow: none;
    background-color: transparent !important;
    padding: 15px !important;
}

.detailsMore .accordion-button::after {
    display: none;
}

.accordion-flush .accordion-item .accordion-button .booksesson {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 15px;
}

.accordion-flush .accordion-item .accordion-button .booksesson .bookImg img {
    height: 90px;
    width: 100%;
    object-fit: cover;
    border-radius: 12px;
}

.accordion-flush .accordion-item .accordion-button .booksesson .rightsesson h6 {
    margin-bottom: 5px;
    font-size: 16px;
    color: #64748B;
    font-family: 'Manrope-Bold';
}

.accordion-flush .accordion-item .accordion-button .booksesson .rightsesson h4 {
    color: #23262F;
    font-family: 'Manrope-Bold';
    font-size: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    margin-bottom: 10px;
}

.hideShowClick button {
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
    outline: none;
    color: #ECBB33;
    font-family: 'Manrope-Bold';
    font-size: 14px;
}

.rightsesson .hideShowClick button i {
    margin-left: 5px;
}

.rightsesson .ourdetails .schedulesec ul {
    display: flex;
    gap: 10px;
}

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

.rightsesson .ourdetails .schedulesec ul li i {
    margin-right: 5px;
}

.rightsesson .ourdetails .schedulesec ul li i,
.rightsesson .ourdetails .schedulesec ul li span {
    color: #94A3B8;
    font-size: 13px;
    font-family: 'Manrope-Bold';
}

.detailsMore .accordion-body {
    padding: 10px 15px 10px 180px;
}

.detailsMore .accordion-body .statusbox {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 10px;
}

.detailsMore .accordion-body .statusbox .firstlable h5 {
    font-size: 20px;
    font-family: 'Manrope-Bold';
    color: #64748B;
    margin-bottom: 10px;
}

.detailsMore .accordion-body .statusbox a {
    display: block;
    text-decoration: underline;
    color: var(--gold-color);
    font-family: 'Manrope-Bold';
    margin-bottom: 10px;
}

.detailsMore .accordion-body .statusbox .showstatus h6 {
    color: #1E293B;
    font-size: 18px;
    font-family: 'Manrope-Bold';
    margin-bottom: 10px;
}

.detailsMore .accordion-body .statusbox span.greenstatus {
    background: #17C964;
    padding: 0px 10px;
    border-radius: 5px;
    font-size: 16px;
}

.detailsMore .accordion-body .ourbtnsec {
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
}

.detailsMore .accordion-body .ourbtnsec .btn {
    width: calc(33% - 10px);
    min-height: 50px;
    border-radius: 30px;
    outline: none;
    box-shadow: none;
    font-family: 'Manrope-Bold';
    font-size: 18px;
}

.detailsMore .accordion-body .ourbtnsec .btn i {
    vertical-align: middle;
}

.detailsMore .accordion-body .ourbtnsec .btn.cancelbtn {
    color: #E25E5E;
    border: 2px solid #E25E5E;
}

.detailsMore .accordion-body .ourbtnsec .btn.resendbtn {
    border: 2px solid #5D4709;
    color: #5D4709;
}

.detailsMore .accordion-body .ourbtnsec .btn.downloadbtn {
    color: #292D32;
    background-color: #E3BD3E;
}

.detailsMore .accordion-body .ourbtnsec .btn.cancelbtn i,
.detailsMore .accordion-body .ourbtnsec .btn.downloadbtn i {
    margin-right: 5px;
}

.detailsMore .accordion-body .ourbtnsec .btn.resendbtn i {
    margin-left: 5px;
}

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

.commonPagination .pagination {
    gap: 10px;
}

.commonPagination .paginationTitle p {
    font-size: 18px;
    color: #000000E0;

}

.commonPagination .page-item .page-link {
    color: #475569;
    font-family: 'Manrope-SemiBold';
    border: 1px solid #CBD5E1;
    border-radius: 8px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 15px;
}

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


/* ========= chat history sec css start =========== */

.rightChatBox.backLayerCom {
    padding: 0;
    border-radius: 16px;
}

.rightChatBox .mainChatbox {
    display: flex;
    align-items: start;
}

.rightChatBox .mainChatbox .chatLeftside {
    width: 45%;
    border-right: 1px solid #ECEFF4;
}

.rightChatBox .mainChatbox .chatRightside {
    width: 55%;
}

.rightChatBox .mainChatbox .chatLeftside .leftChatsearch,
.rightChatBox .mainChatbox .chatRightside .openchatActive {
    padding: 25px;
    border-bottom: 1px solid #ECEFF4;
}

.rightChatBox .mainChatbox .chatLeftside .leftChatsearch .searchHere {
    position: relative;
}

.rightChatBox .mainChatbox .chatLeftside .leftChatsearch .searchHere input {
    border: none;
    box-shadow: none;
    outline: none;
    background-color: #F8FAFC;
    width: 100%;
    padding: 12px 10px 12px 40px;
    border-radius: 10px;
}

.rightChatBox .mainChatbox .chatLeftside .leftChatsearch .searchHere input::placeholder,
.rightChatBox .mainChatbox .chatRightside .msgTyoeBox .typeHere input::placeholder {
    color: #94A3B8;
}

.rightChatBox .mainChatbox .chatLeftside .leftChatsearch .searchHere i {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    color: #94A3B8;
}

.rightChatBox .mainChatbox .chatLeftside .contactPeople,
.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox {
    padding: 25px;
    height: calc(100vh - 150px);
    overflow-y: scroll;
    scrollbar-width: none;
}

.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox {
    padding-top: 10px !important;
    padding-bottom: 88px;
}

.contactPeople .allChatuser .chatName {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 20px 10px;
    border-bottom: 1px solid #CBD5E1;
}

.contactPeople .allChatuser .chatName.activeOpen {
    border-bottom: none !important;
    background-color: #FBEFD0;
    border-radius: 12px;
}

.contactPeople .allChatuser .chatName .chatUserImg {
    width: 17%;
}

.contactPeople .allChatuser .chatName .chatUserImg .imgBox {
    width: 50px;
    height: 50px;
    margin: 0 auto;
}

.contactPeople .allChatuser .chatName .chatUserImg img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 50%;
}

.contactPeople .allChatuser .chatName .chatUserName {
    width: 83%;
}

.contactPeople .allChatuser .chatName .chatUserName h6 {
    margin-bottom: 10px;
    font-family: 'Manrope-Bold';
}

.contactPeople .allChatuser .chatName .chatUserName h6 span {
    float: right;
    font-size: 15px;
    color: #292C38;
    font-family: 'Manrope-Regular';
}

.contactPeople .allChatuser .chatName .chatUserName .msgStatus {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.contactPeople .allChatuser .chatName .chatUserName .msgStatus p {
    color: #292C38;
    margin-bottom: 0;
    max-width: 90%;
    width: 100%;
    font-family: 'Manrope-Regular';
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.contactPeople .allChatuser .chatName .chatUserName .msgStatus span.pending {
    height: 25px;
    width: 25px;
    background-color: var(--gold-color);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: 'Manrope-Bold';
}

.rightChatBox .mainChatbox .chatRightside .openchatActive h6 {
    margin-bottom: 2px;
    color: #292C38;
    font-family: 'Manrope-SemiBold';
}

.rightChatBox .mainChatbox .chatRightside .openchatActive span {
    font-size: 16px;
    color: #73778B;
}

.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox .timehead {
    text-align: center;
    padding-bottom: 15px;
    font-size: 15px;
    font-family: 'Manrope-Regular';
    color: #96A0B5;
}

.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox ul li.leftMsg,
.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox ul li.rightMsg {
    max-width: 70%;
    margin-bottom: 15px;
}

.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox ul li.rightMsg {
    margin-left: auto;
}

.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox ul li.leftMsg p {
    background-color: #ECBB33;
    padding: 20px;
    border-radius: 15px 15px 15px 0px;
    color: var(--white-color);
    font-size: 18px;
    margin-bottom: 0;
    font-family: 'Manrope-Regular';
}

.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox ul li.rightMsg p {
    border-radius: 15px 15px 0px 15px;
    background-color: #F1F5F9;
    padding: 20px;
    margin-bottom: 0;
}

.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox ul li.leftMsg .msgTime,
.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox ul li.rightMsg .msgTime {
    width: 100%;
    color: #96A0B5;
    font-size: 13px;
}

.rightChatBox .mainChatbox .chatRightside .ourMsgHistory .chatMainBox ul li.leftMsg .msgTime {
    text-align: end;
}

.rightChatBox .mainChatbox .chatRightside .ourMsgHistory {
    position: relative;
}

.rightChatBox .mainChatbox .chatRightside .msgTyoeBox {
    padding: 20px;
    background-color: var(--white-color);
    position: absolute;
    width: 100%;
    left: 0px;
    bottom: 0;
}

.rightChatBox .mainChatbox .chatRightside .msgTyoeBox .typeHere input {
    width: 100%;
    padding: 12px 50px 12px 20px;
    border: none;
    background-color: #F8FAFC;
    border-radius: 10px;
}

/* ========= chat history sec css end =========== */


.righttableSec .tableHead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.righttableSec .tableHead .headDrop {
    display: flex;
    align-items: center;
    gap: 5px;
}

.righttableSec .tableHead .headDrop .bokunDropBox a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-family: 'Poppins-Regular';
    border: 2px solid #E4E4E7;
    border-radius: 18px;
    padding: 6px 20px;
    color: #11181C;
    min-height: 51px;
    width: 180px;
    box-shadow: 0 1px 2px #0000000D;
}

.mainTableBox table thead tr th {
    border-bottom: none;
    font-size: 13px;
    background-color: #F1F5F9;
    white-space: nowrap;
    color: #323741;
    font-family: 'Manrope-SemiBold';
}

.mainTableBox table thead tr th:first-child {
    border-top-left-radius: 12px;
}

.mainTableBox table thead tr th:last-child {
    border-top-right-radius: 12px;
}

.mainTableBox table tbody tr td {
    font-size: 13px;
    color: #0F0F10;
    border-bottom: 0;

}

.mainTableBox table tbody tr td p {
    font-size: 13px;
    color: #0F0F10;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.mainTableBox table tbody tr td a {
    color: #BB8E11;
    font-size: 14px;
}

.mainTableBox table tbody tr td a i {
    color: #ECBB33;
    margin-right: 5px;
}

.righttableSec .commonPagination .page-item .page-link {
    color: #888E9E;
}

.righttableSec .commonPagination .page-item .page-link i {
    font-size: 16px;
}

.righttableSec .commonPagination .page-item .page-link.left,
.righttableSec .commonPagination .page-item .page-link.right {
    font-size: 14px;
}

/* ============== list products page css end ===================== */

/* ============== checkout page css start ===================== */

.checkout .cardPayment {
    background-color: var(--white-color);
    padding: 30px 25px;
    border-radius: 15px;
}

.checkout .cardPayment .payTitle h4,
.checkout .cardPayment .payCradBox .text h4 {
    color: #23252E;
    font-family: 'Gilroy-Bold';
}

.checkout .cardPayment .payCradBox .text h4 {
    margin-bottom: 0;
}

.checkout .cardPayment .updateDate {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.checkout .cardPayment .updateDate .dateBoxUpdate {
    background-color: #F4F5F6;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 20px;
}

.checkout .cardPayment .updateDate .dateBoxUpdate .datetext h6 {
    margin-bottom: 0;
    font-family: 'Gilroy-Bold';
}

.checkout .cardPayment .updateDate .dateBoxUpdate .datetext span {
    color: #777E90;
    font-size: 13px;
    font-family: 'Gilroy-Regular';
}

.checkout .cardPayment .updateDate .dateBoxUpdate a {
    color: #777E90;
}

.checkout .cardPayment .payCradBox {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 20px 0;
}

.checkout .cardPayment .payCradBox ul {
    display: flex;
    align-items: center;
    gap: 15px;
}

.checkout .cardPayment .payCradBox ul li a img {
    max-width: 60px;
    width: 100%;
}

.checkout .cardPayment .fillNewbox .commonLabelSecond {
    font-size: 14px;
    color: #B1B5C3;
}

.checkout .cardPayment .fillNewbox .commonInputSecond::placeholder {
    font-family: 'Gilory-SemiBold';
    color: #777E90;
    font-size: 14px;
}

.checkout .cardPayment .payOnline {
    margin-bottom: 60px;
}

.checkout .cardPayment .contrySelect {
    display: grid;
    grid-template-columns: 22% 1fr;
    gap: 20px;
}

.checkout .finalBill {
    background-color: var(--white-color);
    padding: 30px 25px;
    border-radius: 15px;
    box-shadow: 0px 60px 100px -48px #0F0F0F4D;
}

.checkout .finalBill .topImgSec {
    height: 290px;
    margin-bottom: 30px;
    width: 100%;
}

.checkout .finalBill .topImgSec img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 18px;
}

.checkout .finalBill .contentBox {
    margin-bottom: 30px;
}

.checkout .finalBill .contentBox p {
    font-size: 14px;
    color: #888E9D;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.checkout .finalBill .contentBox p i {
    margin-right: 5px;
    color: #888E9D;
}

.checkout .finalBill .contentBox h4 {
    font-family: 'Gilroy-Bold';
    color: #E3BD3E;
}

.checkout .finalBill .billBox .billTitle {
    color: #23262F;
    font-family: 'Gilroy-Bold';
    font-size: 24px;
}

.checkout .finalBill .billBox .enterCoupne .typebox .sendBtn {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
}

.checkout .finalBill .billBox .enterCoupne .typebox {
    position: relative;
}

.checkout .finalBill .billBox .enterCoupne .typebox input {
    width: 100%;
    border: none;
    outline: none;
    box-shadow: none;
    padding: 12px 50px 12px 15px;
    border: 2px solid #E6E8EC;
    border-radius: 10px;
    background-color: var(--white-color);
}

.checkout .finalBill .billBox .enterCoupne .typebox input::placeholder {
    color: #777E90;
    font-family: 'Gilroy-Regular';
    font-size: 15px;
}

.checkout .finalBill .billBox .enterCoupne .typebox .sendBtn .btnSend {
    height: 38px;
    width: 38px;
    border-radius: 50%;
    padding: 0;
    background-color: var(--gold-color);
    outline: none !important;
    box-shadow: none !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

.checkout .finalBill .billBox .priceTex ul {
    padding: 20px 15px;
}

.checkout .finalBill .billBox .priceTex ul li:not(:last-child) {
    margin-bottom: 5px;
}

.checkout .finalBill .billBox .priceTex ul li p {
    display: flex;
    justify-content: space-between;
}

.checkout .finalBill .billBox .priceTex ul li p.small {
    font-size: 13px;
}

.checkout .finalBill .billBox .priceTex ul li p.big {
    color: #777E90;
    font-family: 'Gilory-SemiBold';
    font-size: 16px;
}

.checkout .finalBill .billBox .priceTex ul li p.big span.black {
    color: #23262F;
    font-family: 'Gilroy-Bold';
}

.checkout .finalBill .billBox .totalCost {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #F4F5F6;
    border-radius: 8px;
    padding: 10px 15px;
}

.checkout .finalBill .billBox .totalCost h6,
.checkout .finalBill .billBox .totalCost p {
    margin-bottom: 0;
}

.checkout .finalBill .billBox .totalCost p {
    color: #23262F;
    font-size: 18px;
    font-family: 'Gilory-SemiBold';
}

.checkout .finalBill .billBox .totalCost p>span {
    color: #777E90;
}

.checkout .finalBill .billBox .totalCost h6 {
    color: #23262F;
    font-family: 'Gilroy-Bold';
}

/* ============== checkout page css end ===================== */



/* ========= Supplider header css start ============ */

.supplier {
    position: relative;
}

.supplier .userIconBox {
    display: flex;
    align-items: center;
    gap: 10px;
}

.supplier .userIconBox .userNameBox h6 {
    margin-bottom: 0;
    font-size: 14px;
    color: #5D4709;
    font-family: 'Manrope-Bold';
}

.supplier .userIconBox .userNameBox p {
    font-size: 12px;
    font-family: 'Manrope-Bold';
    color: #2F2304;
    text-align: right;
}

.supplier .userIconBox .userImg a img {
    width: 100%;
    max-width: 50px;
    border-radius: 50%;
}

.supplier .userAc {
    width: 100%;
    background-color: var(--bs-white);
    padding: 10px;
    border-radius: 10px;
    position: absolute;
    right: 0;
    display: none;
}

.supplier .userAc ul li a {
    font-size: 13px;
    color: #2F2304;
    font-family: 'Manrope-Bold';
    width: 100%;
    padding: 5px 10px;
    border-radius: 5px;
    transition: 0.3s;
}

.supplier .userAc ul li a:hover {
    background-color: #ffd1669f;
}

.supplier .userAc ul li:not(:last-child) {
    margin-bottom: 5px;
}

header.supplierHeader {
    border-bottom: 1px solid #0000001A;
}

header.supplierHeader .header-box .logoImg {
    border-right: none !important;
    position: relative;
}

header.supplierHeader .header-box .logoImg .supTag {
    position: absolute;
    top: -10px;
    right: -20px;
}

header.supplierHeader .header-box .logoImg .supTag img {
    width: 100%;
    max-width: 70px;
}

/* ========= Supplider header css end ============ */

/* ========= company_profile css start ======== */

.company_profile {
    margin-top: 30px;
}

.company_profile .topheader .toptitle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 20px;
    border-bottom: 1px solid #E6E8EC;
}

.company_profile .topheader .toptitle h5 {
    font-family: 'Manrope-Bold';
    color: #64748B;
    margin-bottom: 0;
}

.company_profile .topheader .toptitle h5 img {
    width: 100%;
    max-width: 30px;
    margin-right: 10px;
    vertical-align: middle;
}

.company_profile .topheader .toptitle a {
    background: var(--gold-color);
    font-family: 'Manrope-Bold';
    border-radius: 30px;
    color: #23252E;
    font-size: 16px;
    box-shadow: none;
    outline: none;
    padding: 10px 20px;
}

.company_profile .topheader .toptitle a svg {
    vertical-align: middle;
    margin-right: 5px;
}

.company_profile_sec .rightProfile .rightProfileMain .userPersonaldet {
    width: 100%;
    margin-top: 20px;
}

.company_profile_sec .rightProfile .rightProfileMain .userPersonaldet ul li:nth-child(even) {
    background-color: #F1F5F9;
}

.company_profile_sec .rightProfile .rightProfileMain .userPersonaldet ul li span svg {
    margin-right: 8px;
    vertical-align: middle;
}

.rightProfile .rightProfileMain .userPersonaldet ul li span img {
    width: 100%;
    max-width: 50px;
    border: 1px solid #CBD5E1;
    border-radius: 8px;
}

.profile_privacy_sec .profile_privacy ul li {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    width: 50%;
}

.profile_privacy_sec .profile_privacy ul li:not(:last-child) {
    margin-bottom: 20px;
}

.profile_privacy_sec .profile_privacy ul li .text_name svg {
    vertical-align: middle;
    margin-right: 8px;
}

.profile_privacy_sec .profile_privacy ul li .text_name p {
    color: #23262F;
    font-size: 16px;
    font-family: 'Manrope-ExtraBold';
}

.profile_privacy_sec .profile_privacy ul li .swicth_box .form-switch .form-check-input {
    background-color: #543e04;
    border-color: #543e04;
    min-height: 28px;
    width: 48px;
    box-shadow: none;
    outline: none;
    background-image: url(../images/white-round.svg) !important;
}

.form-switch .form-check-input:focus {
    background-image: url(../images/white-round.svg) !important;
}

.profile_privacy_sec .profile_privacy ul li .swicth_box .form-check-input:checked {
    background-color: #ECBB33;
    border-color: #ECBB33;
}

.profile_privacy_sec .profile_privacy .registerBox .form-group {
    width: 50%;
}

.registerBox .form-group.secondClass .btnShow {
    top: 70%;
}


/* ========= company_profile css end ======== */
.registerBox .form-group .btnShow {
    position: absolute;
    top: 50%;
    right: 0;
    color: #83889B;
    box-shadow: none !important;
    transform: translateY(-50%);
}

.registerBox .form-group {
    position: relative;
}

.registerBox .form-group .lineSpan {
    padding: 15px 0;
}

.registerBox .form-group label {
    color: #292929;
    font-size: 14px;
    font-family: 'Manrope-Medium';
    padding-bottom: 10px;
}

/* ========= finance_payment css start ======== */

.finance_Payment .rightPayment .importTitle {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.finance_Payment .rightPayment .importTitle h4 {
    margin-bottom: 0;
}

.finance_Payment .rightPayment .importTitle .gray_filter {
    background-color: #D4D4D866;
    font-size: 14px;
    color: #000000;
    border-radius: 6px;
    padding: 6px 10px;
    font-family: 'Manrope-SemiBold';
    transition: 0.3s all;
}

.finance_Payment .rightPayment .importTitle .gray_filter:hover,
.finance_Payment .rightPayment .importTitle .gray_filter.active {
    background-color: #D4D4D8;
}

.filter_box .inner_filter {
    display: none;
    border: 1px solid #DCDCDC;
    border-radius: 8px;
    background-color: #FDFDFD;
    padding: 10px 10px;
    width: 200px;
    position: absolute;
    margin-top: 5px;
    z-index: 5;
}

.filter_box .inner_filter.show {
    display: block;
}

.filter_box .inner_filter ul li:not(:last-child) {
    margin-bottom: 5px;
}

.filter_box .inner_filter ul li a {
    padding: 8px 10px;
    border-radius: 8px;
    width: 100%;
    color: #334155;
    font-family: 'Manrope-Medium';
    font-size: 14px;
    display: flex;
    align-items: center;
    transition: 0.3s all;
}

.filter_box .inner_filter ul li a:hover,
.filter_box .inner_filter ul li a.active {
    background-color: #FDF7E8;
}

.filter_box .inner_filter ul li a svg {
    margin-right: 5px;
    vertical-align: sub;
}

.filter_box .inner_filter ul li a i {
    margin-left: auto;
    color: #94A3B8;
    font-size: 13px;
}

.finance_Payment .rightPayment .importTitle .gray_filter i {
    margin-right: 5px;
    vertical-align: middle;
}

.finance_Payment .sub_filter {
    position: relative;
}

.finance_Payment .sub_filter .added_filer a {
    background-color: #D4D4D866;
    font-size: 14px;
    color: #000000;
    border-radius: 6px;
    padding: 6px 10px;
    font-family: 'Manrope-SemiBold';
    transition: 0.3s all;
}

.finance_Payment .sub_filter .added_filer a:first-child {
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    border-right: 4px solid #fff;
}

.finance_Payment .sub_filter .added_filer a:last-child {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.finance_Payment .sub_filter .tour_status_drop {
    position: absolute;
    top: 40px;
    left: 0;
    z-index: 55;
    background: #FDFDFD;
    border-radius: 8px;
    box-shadow: 0 12px 16px -4px #24242414;
    border: 1px solid #DCDCDC;
    padding: 10px;
    width: 200px;
    display: none;
}

.finance_Payment .sub_filter .tour_status_drop.show {
    display: block;
}

.finance_Payment .sub_filter .tour_status_drop .filter_search {
    position: relative;
}

.finance_Payment .sub_filter .tour_status_drop .filter_search input {
    border: 2px solid #E6E8EC;
    border-radius: 10px;
    min-height: 48px;
    width: 100%;
    padding: 10px 20px 10px 35px;
}

.finance_Payment .sub_filter .tour_status_drop .filter_search input::placeholder {
    color: #BDBDBD;
    font-family: 'Manrope-Medium';
    font-size: 14px;
}

.finance_Payment .sub_filter .tour_status_drop .filter_search svg {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.finance_Payment .sub_filter .tour_status_drop .filter_search svg path {
    fill: #28303F;
}

.finance_Payment .status_select {
    margin: 15px 0 5px;
    padding-left: 15px;
}

.finance_Payment .status_select .clickTo {
    position: relative;
    padding-left: 30px;
}

.finance_Payment .status_select .clickTo .keyword-label {
    font-size: 12px;
    padding: 8px 6px;
    border-radius: 5px;
    display: inline-block;
    font-family: 'Manrope-SemiBold';
}

.finance_Payment .status_select .clickTo input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    margin-right: 0px;
    left: 0;
    top: 0;
    height: 20px;
    width: 20px;
    border-radius: 4px;
    z-index: 55;
    cursor: pointer;
}

.finance_Payment .status_select .clickTo input[type="checkbox"]+.keyword-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    cursor: pointer;
    height: 20px;
    border: 2px solid #CBD5E1;
    background-color: #fff;
    border-radius: 6px;
}

.finance_Payment .status_select .clickTo input[type="checkbox"]:checked+.keyword-label::after {
    content: '\f00c';
    position: absolute;
    font-family: 'fontawesome';
    left: 0px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    color: #000;
    background-color: var(--gold-color);
    width: 20px;
    height: 20px;
    text-align: center;
    border-radius: 6px;
    padding-top: 5px;
}

.finance_Payment .status_select .clickTo:not(:last-child) {
    margin-bottom: 15px;
}

.finance_Payment .sub_filter .added_filer a i {
    margin-left: 5px;
    vertical-align: middle;
    font-size: 18px;
}

.payment_table_start .mainTableBox {
    overflow-x: auto;
}

.payment_table_start .mainTableBox::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #F1F5F9;
}

.payment_table_start .mainTableBox::-webkit-scrollbar {
    height: 6px;
    border-radius: 10px;
    background-color: #F1F5F9;
}

.payment_table_start .mainTableBox::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #CBD5E1;
}

.payment_table_start .mainTableBox table {
    font-family: 'Manrope-SemiBold';
    font-size: 14px;
}

.mainTableBox table tbody tr.active td {
    background-color: #FBEFD0 !important;
}

.mainTableBox table tbody tr:nth-child(even) td {
    background-color: #F8FAFC;
}

.payment_table_start .mainTableBox table thead tr th {
    color: #323741;
    font-size: 14px;
    padding: 10px 10px;
    background: #F1F5F9;
    font-family: 'Manrope-Bold';
}

.payment_table_start .mainTableBox table tbody tr td .date {
    display: flex;
    gap: 5px;
}

/* .payment_table_start .mainTableBox table thead tr th:first-child{
    border-top-left-radius: 0px;
}

.payment_table_start .mainTableBox table thead tr th:last-child  {
    border-top-right-radius: 0px;
} */

.payment_table_start .mainTableBox table .badge {
    font-size: 12px;
    padding: 8px 6px;
    border-radius: 5px;
    display: inline-block;
    font-family: 'Manrope-SemiBold';
}

.badge-send,
.badge-complete {
    background-color: #17C964;
    color: #000000;
}

.badge-awaiting {
    background-color: #D4D4D8;
    color: #2F2304;
}

.badge-cancelled {
    background-color: #F84646;
    color: #2F2304;
}

.payment_table_start .mainTableBox table tbody tr td p {
    font-size: 14px;
    color: #2F2304;
    width: 200px;
}

.payment_table_start .mainTableBox table tbody tr td a {
    color: #BB8E11;
    font-size: 14px;
    white-space: nowrap;
    font-family: 'Manrope-SemiBold';
    text-decoration: underline;
}

.payment_table_start .mainTableBox table tbody tr td a svg {
    margin-left: 6px;
    vertical-align: text-bottom;
}

.payment_table_start .mainTableBox table tbody tr td svg {
    vertical-align: sub;
}


.withdrawal_table_start .mainTableBox table tbody tr td {
    padding: 10px 15px;
    color: #0F0F10;
    font-family: 'Manrope-SemiBold';
}

.withdrawal_table_start .mainTableBox table tbody tr.active td {
    color: #5D4709;
}

.withdrawal_table_start .mainTableBox table tbody tr.active td svg path {
    fill: #5D4709;
}

.payment_table_start .mainTableBox table tbody tr.active td p {
    color: #5D4709;
}

.payment_table_start.withdrawal_table_start .mainTableBox table tbody tr td .date {
    gap: 10px;
    white-space: nowrap;
}

.withdrawal_table_start .mainTableBox table tbody tr td p {
    width: 110px;
}

.withdrawal_table_start .mainTableBox table thead tr th:first-child,
.withdrawal_table_start .mainTableBox table tbody tr td:first-child {
    border-top-left-radius: 12px;
    border-bottom-left-radius: 12px;
}

.withdrawal_table_start .mainTableBox table thead tr th:last-child,
.withdrawal_table_start .mainTableBox table tbody tr td:last-child {
    border-top-right-radius: 12px;
    border-bottom-right-radius: 12px;
}

.finance_withdrawal .rightPayment .importTitle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.finance_withdrawal .rightPayment .importTitle h4 {
    margin-bottom: 0;
}

.finance_withdrawal .rightPayment .importTitle .filter_search {
    position: relative;
}

.finance_withdrawal .rightPayment .importTitle .filter_search svg {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
}

.finance_withdrawal .rightPayment .importTitle .filter_search input {
    border: 2px solid #E6E8EC;
    border-radius: 10px;
    min-height: 48px;
    width: 220px;
    padding: 10px 20px 10px 35px;
}

.finance_withdrawal .rightPayment .importTitle .filter_search input::placeholder {
    color: #BDBDBD;
    font-family: 'Manrope-Medium';
}

.payment_table_start .mainTableBox.mobileTable {
    display: none;
}

.mainTableBox.mobileTable .accordion-item {
    border-bottom: 1px solid #E2E8F0 !important;
    border: none;
}

.mainTableBox.mobileTable .accordion-item:nth-child(even) .accordion-button {
    background-color: #F8FAFC;
}

.mainTableBox.mobileTable .accordion-button {
    box-shadow: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 8px 15px;
    position: relative;
}

.mainTableBox.mobileTable .accordion-button:not(.collapsed) {
    box-shadow: none;
    background-color: #F8FAFC;
    border-bottom: 1px solid #E2E8F0 !important;
}

.mainTableBox.mobileTable .accordion-button .box_one span,
.mainTableBox.mobileTable .accordion-button .box_two span {
    color: #64748B;
    font-size: 12px;
    margin-bottom: 5px;
    font-family: 'Manrope-Bold';
}

.mainTableBox.mobileTable .accordion-button .box_one h6 {
    color: #8C6A0D;
    margin-bottom: 0;
    font-size: 16px;
    font-family: 'Manrope-SemiBold';
}

.mainTableBox.mobileTable .accordion-button .box_two h6 {
    color: #2F2304;
    margin-bottom: 0;
    font-size: 16px;
    font-family: 'Manrope-SemiBold';
}

/* .mainTableBox.mobileTable .accordion-button::after {
    display: none;
} */

.mainTableBox.mobileTable .accordion-button::after {
    content: '\f078';
    font-family: 'fontawesome';
    position: absolute;
    right: 20px;
    background-image: none;
    font-size: 14px;
    height: 30px;
    width: 30px;
    border: 1px solid #F6E0A2;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0F172A;
    padding-top: 2px;
}

.mainTableBox.mobileTable .accordion-button:not(.collapsed)::after {
    background-color: #FBEFD0;
}

.mainTableBox.mobileTable .accordion-body {
    padding: 8px 0px 0px;
}

.mainTableBox.mobileTable .accordion-body ul li {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 8px 0;
    align-items: center;
}

.mainTableBox.mobileTable .accordion-body ul li:not(:last-child) {
    border-bottom: 1px solid #E2E8F0;
}

.mainTableBox.mobileTable .accordion-body ul li .item_body {
    padding-left: 25px;
}

.mainTableBox.mobileTable .accordion-body ul li .item_body h6 {
    margin-bottom: 0;
    color: #64748B;
    font-family: 'Manrope-Bold';
    font-size: 14px;
}

.mainTableBox.mobileTable .accordion-body ul li .item_body a {
    color: #BB8E11;
    font-size: 14px;
    white-space: nowrap;
    font-family: 'Manrope-SemiBold';
    text-decoration: underline;
}

.mainTableBox.mobileTable .accordion-body ul li .item_body a svg {
    margin-left: 6px;
    vertical-align: text-bottom;
}

.mainTableBox.mobileTable .accordion-body ul li .item_body p {
    color: #2F2304;
    font-size: 14px;
    font-family: 'Manrope-SemiBold';
}

.mainTableBox.mobileTable .accordion-body ul li .item_body .badge {
    font-size: 12px;
    padding: 8px 6px;
    border-radius: 5px;
    display: inline-block;
    font-family: 'Manrope-SemiBold';
}

/* ========= finance_payment css end ======== */


body.dark .react-calendar {
    background-color: var(--dark-box) !important;
    border: 1px solid #334155 !important;
}

body.dark .react-calendar__month-view .react-calendar__tile,
body.dark .react-calendar__month-view .react-calendar__month-view__days__day--weekend,
body.dark .react-calendar__navigation .react-calendar__navigation__label__labelText,
body.dark .react-calendar__navigation button {
    color: #CBD5E1 !important;
}

body.dark .react-calendar__year-view .react-calendar__tile,
body.dark .react-calendar__decade-view__years .react-calendar__tile,
body.dark .react-calendar__century-view__decades .react-calendar__tile {
    color: #CBD5E1;
    border: 1px solid #334155;
}

body.dark .react-calendar__year-view .react-calendar__tile--hasActive,
body.dark .react-calendar__decade-view__years .react-calendar__tile--hasActive,
body.dark .react-calendar__century-view__decades .react-calendar__tile--hasActive {
    color: #171202 !important;
}

body.dark .react-calendar__month-view .react-calendar__tile:enabled:hover,
body.dark .react-calendar__month-view .react-calendar__tile:enabled:focus,
body.dark .react-calendar__navigation button:enabled:hover,
body.dark .react-calendar__navigation button:enabled:focus,
body.dark .react-calendar__navigation button:disabled {
    background-color: #2F2304 !important;
}

body.dark .payment-icon {
    color: #CBD5E1;
}

body.dark .filter_box .inner_filter {
    background-color: #171202;
    border: 1px solid #334155;
}
body.dark  .filter_box .inner_filter ul li a{
     color: #CBD5E1;

}
body.dark  .filter_box .inner_filter ul li a:hover, .filter_box .inner_filter ul li a.active{
    background-color: #2F2304 !important;
    color: #CBD5E1 !important;
}
body.dark .finance_Payment .sub_filter .tour_status_drop {
    background-color: #171202;
    color: #CBD5E1;
}
body.dark .finance_Payment .sub_filter .tour_status_drop .filter_search input{
    background-color: #171202;
    color: #CBD5E1;
}

.amountDetail .amountBox {
    margin-bottom: 30px;
}

.amountDetail .amountBox ul li p {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 15px;
    border-radius: 10px;
    font-size: 18px;
    color: #23262F;
    font-family: 'Manrope-SemiBold';
}

.amountDetail .amountBox ul li p:nth-child(even) {
    background-color: #F8FAFC;
}

.amountDetail .amountBox ul li p span {
    color: #475569;
    font-family: 'Manrope-Medium';
    font-size: 18px;
}

.amountDetail .amountBox ul li p span img {
    margin-right: 10px;
}