/*-------------------- Master Styles ------------------*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap');

/* @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&display=swap'); */


/* Hide scrollbar for all elements */
* {
	scrollbar-width: none;
	/* Firefox */
	-ms-overflow-style: none;
	/* Internet Explorer 10+ */
}

*::-webkit-scrollbar {
	/* WebKit browsers */
	display: none;
}

input,
span {
	font-family: "Montserrat";
}




body {
	margin: 0;
	padding: 0;
	font-family: "Montserrat", sans-serif;
	background-color: #e5e5e5;
	height: 100%;
}

body.lightMode {
	background: linear-gradient(200deg, #FFF9CF, white);
}

@media screen and (min-width: 769px) {
	body {
		/* overflow: hidden; */
		z-index: -2;
		position: relative;
	}
}

* {
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
}

a {
	cursor: pointer;
}

/*-------------------- Base Setup ------------------*/

html {
	overscroll-behavior-x: none;
	height: 100vh;
	scroll-behavior: smooth;
}


/* body.scroll {
	overflow: scroll;
} */

input:focus::placeholder {
	color: transparent;
}

@keyframes shimmer {
	0% {
		background-position: -1000px 0;
	}

	100% {
		background-position: 1000px 0;
	}
}


div#app {
	background: linear-gradient(200deg, #FFF9CF, white);
	background-size: 1000px 100%;
	animation: shimmer 2s linear 0s 10 forwards;
	margin: auto;
	max-width: 100%;
	height: 100vh !important;
	position: relative;
	transition: 0.4s ease-in-out;
	max-height: 100%;
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

body.lightMode div#app {
	background: #fff;
}


.disabled-link {
	pointer-events: none;
}

.grecaptcha-badge {
	visibility: hidden;
}

.global__loading {
	position: absolute;
	width: 101%;
	height: 101vh;
	z-index: 999;
	position: fixed;
}

.global__loading:before {
	content: "";
	position: absolute;
	width: inherit;
	height: inherit;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.65);
}

.text-right {
	text-align: right;
}

.hidden {
	display: none;
}

.pointer {
	cursor: pointer;
}

img,
video {
	pointer-events: none;
}

yellow {
	color: #fde723;
}

/*------------------ Header -------------------*/

div#header {
	background: #1e1e2d;
	padding: 0 2%;
	display: flex;
	color: #fff;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	gap: 5px;
	min-height: 48px;
	position: relative;
}

body.lightMode div#header {
	background: linear-gradient(180deg,
			#FFF9CF 0%,
			#FFF9CF 100%,
			#FFF08C 100%);
	min-height: 48px;
}


.header__hamburger,
.header__logo {
	display: flex;
}

div#header div img {
	width: auto;
	height: 33px;
}

div#header div svg {
	height: 25px;
	width: 25px;
}

div#header div svg g {
	fill: white;
}

.header__hamburger svg path {
	stroke: #1e1e2d;
}

.header__logo {
	font-size: 20px;
	color: #fde327;
	margin-left: 5px;
	margin-right: 5px;
	font-weight: 800;
	font-family: 'Nunito';
}

body.lightMode .header__logo {
	color: #1e1e2d;
}


.header__menu {
	flex: 3;
	text-align: right;
	height: 100%;
	overflow: hidden;
}

.header__hamburger {
	cursor: pointer;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	/* display: none; */
}

.header__menu ul li {
	height: 100%;
	width: 40px;
	padding: 0;
	text-align: center;
	list-style: none;
	cursor: pointer;
}

a.head__experiences,
a.head__skyScanner {
	background: #fde723;
	border-radius: 5px;
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 40px;
	position: relative;
	/* display: none !important; */
}

a.head__experiences:after {
	content: "New";
	position: absolute;
	top: -6px;
	right: -14px;
	font-size: 8px;
	background: #cf000f;
	height: 12px;
	width: 25px;
	line-height: 12px;
	border-radius: 2px;
	animation: blinker 1s linear infinite;
}

.header__menu ul li:last-child {
	padding-right: 0;
}

.header__menu ul li i {
	font-size: 23px;
}

.header__menu ul li a {
	cursor: pointer;
	flex: 1;
	text-align: right;
	display: flex;
	align-items: center;
	flex-direction: row;
	height: 100%;
	padding: 0px 0 0 10px;
	color: #fde327;
	font-size: 16px;
}

li.head__addPost.head__long a {
	padding: 0px;
}

a.head__dashboard {
	height: 18px;
}

.header__menu ul {
	display: flex;
	text-align: right;
	justify-content: flex-end;
	margin: 0;
	padding: 0;
	height: 100%;
	align-items: center;
	align-content: center;
	flex-wrap: nowrap;
	flex-direction: row;
	gap: 8px;
}

div#header div.header__hamburger img {
	height: 15px;
	width: auto;
}

a.head__skyScanner {
	line-height: 37px;
}

a.head__notifications svg path {
	fill: #fff;
}

.header__menu ul li a svg path {
	fill: #ffff;
}

body.lightMode .header__menu ul li a svg path {
	fill: #000;
}

.header__menu ul li.head__long {
	min-width: 80px;
	width: auto;
	font-size: 12px;
	font-weight: 500;
}

.header__menu ul li.head__long svg {
	margin: 0 5px 0 0;
}

.head__addPost.head__long {
	display: flex;
	flex-direction: row;
	align-items: center;
}

.header__menu-feed li.head__experienceOrders,
.header__menu-feed li.head__spDashboard,
.header__menu-experiences li.head__spDashboard,
.header__menu-experiences li.head__search,
.header__menu-flightHotels li.head__addPost,
.header__menu-flightHotels li.head__search,
.header__menu-flightHotels li.head__experienceOrders,
.header__menu-premium li.head__spDashboard,
.header__menu-premium li.head__experienceOrders,
.header__menu-premium li.head__search {
	display: none !important;
}

/*------------------ Footer -------------------*/

div#footer {
	position: fixed;
	height: 60px;
	bottom: 0%;
	width: 100%;
	background: #15151f;
	/* width: 420px; */
	max-width: 100%;
	z-index: 4;
	box-shadow: 4px 0px 6.6px rgba(0, 0, 0, 0.3);
	border-radius: 30px 30px 0 0;
	/* height: 12vh; */
	display: flex;
	justify-content: center;

}

body.lightMode div#footer {
	background: #f5f5f5;
	/* box-shadow: 0px 0px 25px 0px #b8b8b8; */
}

div#app.drawer-out div#footer {
	position: absolute;
}


div#footer ul {
	display: flex;
	/* flex-direction: row; */
	/* flex-wrap: nowrap; */
	/* justify-content: space-between; */
	align-content: center;
	margin: 0;
	padding: 0;
	/* padding: 16px 0 0; */
	height: 100%;
	/* position: relative; */
	width: 100%;
}

#footer ul li {
	position: relative;
	list-style: none;
	cursor: pointer;
	transition: transform 0.3s ease, color 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
}

#footer ul li:hover {
	transform: scale(1.1);
}

#footer ul li.active svg path {
	fill: #000;
	transition: fill 0.3s ease;
}

body.lightMode div#footer ul li svg path {
	fill: #1d1d1d;
	transition: fill 0.3s ease;
}

@keyframes pulse {
	0% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.05);
	}

	100% {
		transform: scale(1);
	}
}

#footer ul li.active {
	animation: pulse 1s infinite;
	animation-duration: 2s;
	animation-iteration-count: 2;
	background: #F9EA7D;
	border-radius: 15px 15px 0 0;
}

div#footer ul li img,
div#footer ul li svg {
	height: 24px;
}

div#footer ul li img {
	width: 24px;
	object-fit: cover;
	border-radius: 50%;
}

div#footer ul li .overlap__influencerTag {
    top: 18%;
    left: 50%;
}


body.lightMode div#footer ul li img {
	background-color: #111;
}

div#footer ul li svg path {
	fill: #fff;
}

div#footer ul li {
	list-style: none;
	text-align: center;
	flex: 1;
}

div#footer ul li a {
	display: flex;
	cursor: pointer;
	flex-direction: column;
	align-items: center;
	gap: 3px;
	width: 100%;
}

div#footer ul li span {
	display: block;
	color: #eeee;
	font-size: 9px;
	font-weight: 600;
}

#footer ul li.active span {
	color: #000;
}

body.lightMode div#footer ul li span {
	color: #1e1e1e;
}

li.menu__large a {
	width: 67px;
	display: block;
	height: 67px;
	position: absolute;
	top: -45px;
	background: #f6ee33;
	border-radius: 50%;
	left: 0;
	right: 0;
	margin: auto;
	border: 3px solid #f9f9f9;
	padding: 18.5px 0;
	z-index: 11;
}

li.menu__large {
	position: relative;
	width: calc((100vw - 10%) / 5);
	height: 60px;
}

li.menu__large a span {
	bottom: -25px;
	position: relative;
}

div#app.guestUser li.menu__large a {
	top: 0;
	height: 35px;
	padding: 0;
	background: transparent;
	border: 0;
}

div#app.guestUser li.menu__large span {
	bottom: 0;
}

li.menu__large a svg path {
	stroke: #000;
}

div#footer ul li svg {
	width: auto;
}

div#app.guestUser li.menu__large a svg path {
	stroke: white;
}

body.lightMode div#app.guestUser li.menu__large a svg path {
	stroke: black;
}

div#app.guestUser li.menu__large.active a svg path {
	stroke: #fde723;
}

#main__feed-box,
#main__search-box,
#main__premium-box,
#main__addPost-box,
#main__profile-box,
#main__experiences-box,
#main__flightHotels-box,
#main__spDashboard-box,
#main__chat-box,
#manageListingsPage {
	display: none;
}

.chat__filter-buttons {
	display: flex;
	justify-content: space-around;
}

.chat__filter-button {
	flex-grow: 1;
	text-align: center;
	padding: 15px;
	cursor: pointer;
}

#main__feed-box.active,
#main__search-box.active,
#main__premium-box.active,
#main__addPost-box.active,
#main__profile-box.active,
#main__experiences-box.active,
#main__flightHotels-box.active,
#main__spDashboard-box.active,
#main__chat-box.active,
#manageListingsPage.active {
	display: flex;
	flex-direction: column;
}



.login__outer-view {
	display: none;
}

.login__outer-view {
	display: none;
}

/*------------------ Reels -------------------*/

span#tb__reels {
	position: absolute;
	right: 10px;
	width: 75px;
	height: 75px;
	border-radius: 50%;
	bottom: 100px;
	padding: 10px;
	text-align: center;
	line-height: 65px;
	cursor: pointer;
	z-index: 3;
    background-image: url(https://beatravelbuddy.com/view/assets/img/Ai-rhea.webp);
    background-size: cover;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: transparent;
    border: none;
    cursor: pointer;
}

div#app.no__shots #tb__reels {
	display: none;
}

span#tb__reels img,
span#tb__reels svg {
	height: 40px;
	width: 40px;
}

span#tb__reels svg path {
	fill: #000;
}

/*------------------ Feed -------------------*/

div#main__feed-box,
#scroll__feed {
	width: 100%;
	top: 50px;
	background: #15151f;
	overflow-x: hidden;
	transition: 0.4s ease-in-out;
}

body.lightMode div#main__feed-box {
	background: #fff;
}

div#main__feed {
	padding: 70px 0 0;
	transition: 0.4s ease-in-out;
	position: relative;
	height: 100vh;
}

.feed_item img {
	max-width: 100%;
}

.feed_item {
	background: #1e1e2d;
	padding: 8px;
	color: #c1c1c1;
	/* box-shadow: 3px 3px 5px 0 rgb(0 0 0 / 80%); */
	border-radius: 8px 8px 0 0;
}

body.lightMode .feed_item {
	background: linear-gradient(200deg, #FFF9CF, white);
	color: #111;
	/* box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.11); */
	border-radius: 8px;
}

body.lightMode .feed_item-story .feed_item {
	background: #000;
	color: #111;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.11);
	border-radius: 8px 8px 0 0;
}

.feed__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
	align-content: center;
	flex-wrap: nowrap;
	/* margin: 0 0 8px; */
}

.feed_item:first-child {
	margin: 0 0 15px;
}

.feed__head-img {
	width: 45px;
	height: 45px;
	margin-right: 10px;
	flex: 1;
	max-width: 60px;
	position: relative;
}

.feed__head-img a {
	display: block;
	width: inherit;
	height: inherit;
}

.feed__head-img a img {
	width: inherit;
	height: inherit;
	border-radius: 50%;
	object-fit: cover;
	border: 1px solid #056B6B;
}

body.lightMode .feed__head-img a img {
	border: 1px solid black;
}

.feed__head-follow {
	display: flex;
	align-items: center;
	align-content: center;
	height: 35px;
	border-radius: 7px;
	font-weight: 500;
	justify-content: center;
	padding: 19px 4px 17px 8px;
	;
	cursor: pointer;
	background-color: transparent;
	color: #59A4FF;
	border: 2px solid #59A4FF;
}

span.feed__head-follow-icon {
	color: #000;
	font-size: 10px;
	font-weight: 800;
	text-align: center;
	padding: 5px;
	margin: 0;
	display: flex;
	align-items: center;
	font-style: normal;
	font-weight: 800;
	line-height: normal;
}



.feed__head-follow-icon svg {
	height: 25px !important;
	width: 25px !important;
}

.feed__head-name a span {
	color: #fff;
	font-size: 18px;

	strong {
		font-weight: 600;
	}
}

body.lightMode .feed__head-name a span {
	color: #000;
	/* text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); */
}

body.lightMode .findBud .feed__head-name a span {
	color: #000;
}

.feed__head-name a {
	color: #a5a3a3;
	font-weight: 500;
	font-size: 14px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

body.lightMode .feed__head-name a {
	color: #4d4d4d;
	font-weight: 400;
}

.feed__head-name a span.feed___head-name-location {
	font-size: 12px;
	padding-left: 5px;
	font-weight: 600;
}

span.feed___head-name {
	padding-right: 5px;
	font-weight: 600;
}

span.feed___head-date,
span.feed___head-feedType {
	font-size: 10px;
	color: #a5a3a3;
	font-weight: 700;
}

body.lightMode span.feed___head-date,
body.lightMode span.feed___head-feedType {
	color: #fff;
}

body.lightMode .feed_item-story span.feed___head-date,
body.lightMode .feed_item-story span.feed___head-feedType {
	color: #000;
}


.feed__head-name {
	flex: 5;
}

.feed__head-menu {
	flex: 1;
	text-align: right;
	font-size: 28px;
	position: relative;
	padding: 5px;
	/* height: 50px;
	line-height: 50px; */
	display: inline-block;
	/* max-width: 35px; */
}

.feed__head-menu a {
	display: block;
	color: #fff;
}

body.lightMode .feed__head-menu a {
	color: #000;
}

.feed__body-images {
	width: calc(100% + 50px);
	margin: 0 0 0 -25px;
	position: relative;
}

.feed__container .feed__body-images {
	width: unset;
	margin: unset;
}

.feed__body-interested {
	padding: 10px;
}

.feed__body-actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;

	svg {
		height: 25px;
		width: 25px;
	}
}

.feed__body-images .swiper-slide {
	min-height: 100%;
}

@media screen and (max-width: 421px) {
	.feed__body-images .swiper-slide {
		min-height: 100vw;
	}
}

.feed__actions ul {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	margin: 10px 0px 15px;
	padding: 0;
	align-content: stretch;
	gap: 25px;
}

/* .feed__body-actions {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	align-items: center;
	justify-content: space-between;
} */

.feed__actions.createGroup {
	/* margin-left: 45px; */
	font-size: 12px;
}

.feed__actions.createGroup svg {
	height: 35px;
    width: 40px;
}

.feed__actions:first-child {
	flex: 6;
	max-width: fit-content;
}



.feed__actions {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	cursor: pointer;
	font-weight: 500;
}

.feed__actions ul li {
	list-style: none;
	width: auto;
	height: 25px;
	vertical-align: top;
}

.feed__actions ul li a {
	display: inline-block;
	vertical-align: inherit;
	font-size: 12px;


}

.feed__actions ul li a svg path {
	fill: #fff;
}

.feed__body-interested.createGroupFind {
	display: flex;
	align-items: center;
	justify-content: space-around;
	/* display: none; */
}

body.lightMode .feed__actions ul li a svg path {
	fill: #000;
}

body.lightMode a.feed__actions-like[data-liked="liked"] svg path,
body.lightMode .feed__body-interested.interested svg path {
	fill: red;
}

a.feed__actions-like[data-liked="liked"] svg path {
	fill: red;
}

span.feed__actions-likes {
	width: 25px;
	height: 25px;
	font-size: 10px;
	display: inline-block;
	background: #f6ee33;
	text-align: center;
	line-height: 25px;
	border-radius: 50%;
	color: #15151f;
	border: 1px solid #fff;
	font-weight: 600;
}

.feed__actions ul li:first-child {
	margin: 0;
}

span.feed__actions-liked_users {
	margin: 0 0 0 5px;
	vertical-align: middle;
	cursor: pointer;
}

span.feed__actions-liked_user {
	display: inline-block;
	width: 25px;
	height: 25px;
	border-radius: 50%;
	margin-right: -5px;
	border: 2px solid #fff;
	vertical-align: middle;
}

.feed__actions ul li span.feed__actions-liked_user img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	border-radius: 50%;
	border: 1px solid #056B6B;
}

.feed__actions-liked_user .overlap__influencerTag {
	position: relative !important;
	top: -24px !important;
}


.feed__actions ul li g,
a.feed__actions-bookmark svg path,
a.feed__actions-chat svg path {
	fill: #fff;
}

body.lightMode .feed__actions ul li g,
body.lightMode a.feed__actions-bookmark svg path,
body.lightMode a.feed__actions-chat svg path {
	fill: #1d1d1d;
}

body.lightMode a.feed__actions-share svg path {
	fill: #1d1d1d;
}

.feed__actions ul li svg {
	width: 25px;
	height: 25px;
}


.feed__actions-bookmark.active svg path {
	fill: #f6ee33;
}

body.lightMode .feed__actions-bookmark.active svg path {
	fill: #00acac;
}

.feed__body-description {
	font-size: 14px;
	/* line-height: 1.45; */
	color: #c1c1c1;
	margin: 0 0 10px;
}

body.lightMode .feed__body-description {
	color: #000;
}

body.lightMode .feed_item-story .feed__body-description pre {
	color: #000;
}

.feed_item-story .feed__body-actions {
	padding: 0 10px !important;
}

.feed_item-story .feed__body-description {
	padding: 0 10px !important;
}

.feed__body-trip_details-new {
	color: #000;
	font-family: Montserrat;
	font-size: 12px;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.feed__body-trip_details-new svg {
	height: 20px;
	width: 20px;
}



.feed__body-trip_details {
	font-size: 12px;
	display: flex;
	justify-content: space-between;
	font-weight: 600;
}

.feed__body-trip_details.hidden {
	display: none;
}

.feed__body-trip_location {
	margin: 0 10px 5px 0;
	flex: 1;
}

.feed__body-trip_details i {
	padding: 0 5px 0 0;
}

body.lightMode i.fas.fa-calendar-alt {
	color: #000;
}

/* .feed_item-find_buddy .feed__body-trip_details{
	display: none;
} */

.feed__body-trip_date {
	flex: 1;
}

.feed__body-trip_details span {
	color: #fff;
	padding-left: 5px;
	font-size: 12px;
	font-weight: 500;
}

body.lightMode .feed__body-trip_details span {
	color: #000;
	font-weight: 600;
}

body.lightMode .noMedia .feed__body-trip_details span {
	color: #000;
	font-weight: 600;
}

body.lightMode .noMedia .feed__body-description pre {
	color: #000 !important;
}

body.lightMode .noMedia i.fas.fa-calendar-alt {
	color: #000;
}

body.lightMode .noMedia .feed__head-name a span {
	color: #000;
	text-shadow: none;
}

body.lightMode .noMedia span.feed___head-date,
body.lightMode .noMedia span.feed___head-feedType {
	color: #000;
}

span.feed___head-date,
span.feed___head-feedType {
	display: none;
}

.noMedia {
	display: block;
	padding: 5px 10px;

	.findBud-head {
		padding: 10px;
	}
}

.feed__body-trip_location span {
	cursor: pointer;
}

.feed__actions:last-child ul {
	justify-content: flex-end;
}

.feed__body-comments {
	font-size: 12px;
	color: #b3b6b9;
	cursor: pointer;
	display: inline-block;
}

.feed__body-comments p {
	font-size: 14px;
	color: #b3b6b9;
	display: inline-block;
	margin: 0 0 10px;
}

.feed__body-comments p:first-child {
	font-size: 16px;
	color: #000;
	display: inline-block;
	margin: 0 0 10px;
}

body.lightMode .feed__body-comments p {
	color: #5f5f5f;
	font-weight: 600;
}

body.lightMode .feed__body-comments p:first-child {
	/* color: #fde723; */
	font-weight: 600;
}

.feed__comment {
	width: 95%;
	/* margin: 0 0 0 -25px; */
	height: auto;
	position: relative;
}

.feed__comment input,
.feed__comment textarea {
	width: 100%;
	height: 100%;
	min-height: 60px;
	background: transparent;
	border: 0;
	border-top: 1px solid #343434;
	padding: 18px 75px 0 25px;
	outline: 0;
	color: #f9f9f9;
	font-family: "Montserrat", sans-serif;
	font-size: 13.33px;
	word-spacing: 0px;
	letter-spacing: 0.25px;
	line-height: 1.5;
	box-sizing: border-box;
	/* overflow: scroll; */
}

body.lightMode textarea.autosize {
	/* border-top: 1px solid #eee; */
	color: black;
	font-weight: 400;
}

.autosize {
	resize: none;
	overflow: hidden;
}

.feed__comment button {
	position: absolute;
	z-index: 1;
	right: 15px;
	height: 50px;
	width: 50px;
	background: transparent;
	border: 0;
	color: #75bdeb;
	font-size: 17px;
	font-weight: 600;
	cursor: pointer;
	top: 0;
}

body.lightMode .feed__comment button {
	color: #056b6b;
	font-weight: 600;
}

.feed__actions ul li img {
	width: 24px;
}

.feed__actions:last-child ul li {
	text-align: right;
}

.swiper-slide {
	/* width: 430px; */
	max-width: 100%;
	position: relative;
}

.swiper-slide img {
	height: 420px;
	width: 100%;
	/* max-height: 100vw; */
	object-fit: cover;
	object-position: center;
}

@media screen and (min-width: 440px) {
	.swiper-slide img {
		object-fit: contain;
	}
}

/* Placeholder class with the shimmer effect */
/* Common styles for all placeholders */
.image-placeholder,
.image-placeholder-feeds,
.feeds__image-placeholder {
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: #333;
	/* Dark background */
	background-image: linear-gradient(to right, #333 0%, #4f4f4f 20%, #333 40%, #333 100%);
	background-repeat: no-repeat;
	background-size: cover;
	/* Cover the entire area */
	display: inline-block;
	animation: shimmer 1.5s linear infinite forwards;
}

/* Unique height for each placeholder */
.image-placeholder {
	height: 250px;
	border-radius: 12px;
}

.image-placeholder-feeds {
	height: 420px;
}

.feeds__image-placeholder {
	height: 100%;
	width: 100%;
}

body.lightMode .image-placeholder,
body.lightMode .image-placeholder-feeds,
body.lightMode .feeds__image-placeholder {
	background: #f5f5f5;
	/* Light background */
	background-image: linear-gradient(to right, #f5f5f5 0%, #e0e0e0 20%, #f5f5f5 40%, #f5f5f5 100%);

}

.swiper-pagination-bullet-active {
	background: whitesmoke;
}

.swiper-pagination-bullet {
	opacity: 0.5;
}

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

.swiper-slide video {
	width: 100%;
	height: auto;
	max-height: 420px;
	min-height: 420px;
}

.feed__body-video-overlay {
	position: absolute;
	width: 100%;
	left: 0;
	height: 100%;
	top: 0;
}

#main__feed-box::-webkit-scrollbar,
#main__premium-box::-webkit-scrollbar,
#main__spDashboard-box::-webkit-scrollbar,
.comments__box::-webkit-scrollbar,
#secondary .secondary__tab::-webkit-scrollbar,
.experiences__secondary .secondary__tab::-webkit-scrollbar,
.feed_type-locals ul::-webkit-scrollbar,
.likes__box::-webkit-scrollbar,
.search__body::-webkit-scrollbar,
.search__sug-item__locations .search__sug-body::-webkit-scrollbar,
.search__sug-item__buddies .search__sug-body::-webkit-scrollbar,
.followers__items::-webkit-scrollbar,
#main__profile-box .profile__page::-webkit-scrollbar,
.profileViews__items::-webkit-scrollbar,
.addPost__item::-webkit-scrollbar,
#main__drawer.loginDrawer .drawerBody::-webkit-scrollbar,
.experiences__body::-webkit-scrollbar,
.experiences__search::-webkit-scrollbar,
.addListings__body::-webkit-scrollbar,
.chats__container::-webkit-scrollbar,
.singleChat__box::-webkit-scrollbar,
.create__chat-group__users::-webkit-scrollbar,
.create__chat-group__users-search::-webkit-scrollbar,
.createGroup-SelectedUsers::-webkit-scrollbar,
.experiences__page::-webkit-scrollbar,
#main__flightHotels-box::-webkit-scrollbar,
.feed__send-profiles::-webkit-scrollbar,
.feed__send-groups-tab::-webkit-scrollbar,
.feed__send-search-box::-webkit-scrollbar,
.popup__master.popup__master--addFindBuddyInstructions .popup__container .popup__body::-webkit-scrollbar {
	width: 0;
	/* width of the entire scrollbar */
}

#main__feed-box::-webkit-scrollbar-track,
#main__premium-box::-webkit-scrollbar-track,
#main__spDashboard-box::-webkit-scrollbar-track,
.comments__box::-webkit-scrollbar-track,
#secondary .secondary__tab::-webkit-scrollbar-track,
.secondary_item .secondary__tab::-webkit-scrollbar-track,
.experiences__secondary .secondary__tab::-webkit-scrollbar-track,
.feed_type-locals ul::-webkit-scrollbar-track,
.likes__box::-webkit-scrollbar-track,
.search__body::-webkit-scrollbar-track,
.followers__items::-webkit-scrollbar-track,
.search__sug-item__locations .search__sug-body::-webkit-scrollbar-track,
.search__sug-item__buddies .search__sug-body::-webkit-scrollbar-track,
#main__profile-box .profile__page::-webkit-scrollbar-track,
.profileViews__items::-webkit-scrollbar-track,
#main__drawer.loginDrawer .drawerBody::-webkit-scrollbar-track,
.addPost__item::-webkit-scrollbar-track,
.experiences__body::-webkit-scrollbar-track,
.addListings__body::-webkit-scrollbar-track,
.experiences__search::-webkit-scrollbar-track,
.chats__container::-webkit-scrollbar-track,
.create__chat-group__users::-webkit-scrollbar-track,
.create__chat-group__users-search::-webkit-scrollbar-track,
.createGroup-SelectedUsers::-webkit-scrollbar-track,
.singleChat__box::-webkit-scrollbar-track,
.experiences__page::-webkit-scrollbar-track,
#main__flightHotels-box::-webkit-scrollbar-track,
.feed__send-profiles::-webkit-scrollbar-track,
.feed__send-groups-tab::-webkit-scrollbar-track,
.feed__send-search-box::-webkit-scrollbar-track,
.popup__master.popup__master--addFindBuddyInstructions .popup__container .popup__body::-webkit-scrollbar-track {
	background: transparent;
	/* color of the tracking area */
}



#main__feed-box::-webkit-scrollbar-thumb,
.comments__box::-webkit-scrollbar-thumb,
#secondary .secondary__tab::-webkit-scrollbar-thumb,
.secondary_item .secondary__tab::-webkit-scrollbar-thumb,
.experiences__secondary .secondary__tab::-webkit-scrollbar-thumb,
.profileViews__items::-webkit-scrollbar-thumb {
	background-color: rgb(39, 39, 48);
	/* color of the scroll thumb */
	border-radius: 20px;
	/* roundness of the scroll thumb */
	border: 3px solid transparent;
	/* creates padding around scroll thumb */
}

.feed__body-video-overlay-play {
	position: absolute;
	bottom: 0;
	width: 100%;
	text-align: center;
	height: 65px;
	font-size: 25px;
	color: #fff;
	background: linear-gradient(0deg, #1e1e2d 2%, rgba(0, 0, 0, 0) 75%);
	line-height: 65px;
	cursor: pointer;
}

body.lightMode .feed__body-video-overlay-play {
	background: none;
	color: #000;
}

.feed__body-video-overlay-mute {
	position: absolute;
	right: 15px;
	bottom: 12px;
	font-size: 20px;
	z-index: 2;
	cursor: pointer;
	height: 35px;
	width: 35px;
}

.feed__body-video-overlay-mute.services {
	bottom: 30px;
}

.feed__body-description a {
	color: #ffd600;
}

body.lightMode .feed__body-description a {
	color: #056b6b;
	font-weight: 600;
}

body.lightMode a.hashtag-item {
	color: #000;
	font-weight: 600;
}

.feed__body-description p {
	margin: 0;
}

.feed__body-description pre {
	display: block;
	margin: 0;
	white-space: break-spaces;
	font-family: inherit;
	font-size: 13px;
	font-weight: 500;
	color: white;
}

body.lightMode .feed__body-description pre {
	color: #000;
}

.feed_item-ask .feed__body-description pre {
	color: #000;
}

.feed_item-find_buddy .feed__comment {
	width: 100%;
	margin: 0;
}

.feed_item-find_buddy .feed__body-interested_box {
	padding: 0 10px;
}

.feed__head.findBud {
	/* position: absolute;
    top: 0;
    left: 0; */
	width: 100%;
	background: rgba(30, 30, 45, 0.7);
	/* Semi-transparent background */
	padding: 8px;
	color: #FFFFFF;
	/* Ensure text is white */
	text-shadow: unset;
	font-weight: bold;
	/* Make text bold for better visibility */
	/* z-index: 4; */
	gap: 10px;
	display: flex;
	flex-direction: column;
	align-items: normal;
}

body.lightMode .feed__head.findBud {
	color: #000;
}


body.lightMode .feed__head-follow {
	background-color: #fde723;
	border: none;
}


.findBud-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 5px;
}

.findBud-image {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.findBud-follow {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.feed__container {
	position: relative;

	.image-placeholder-feeds {
		height: inherit;
	}

	/* .swiper-slide img {
        height: 540px;
    } */
}

.feed__container span.feed___head-feedType {
	display: none;
}

/* .feed__container .swiper-slide img {
	border-radius: 10px 10px 0px 0px;
} */

/* .feed-comment svg path {
    stroke: #ccc;
}

body.lightMode .feed-comment svg path {
    stroke: #000;
} */

body.lightMode .feed__container .feed___head-feedType {
	color: #1e1e2d;
}

.descriptionBox.singlePost {
	position: unset;
}

.descriptionBox {
	/* position: absolute;
    bottom: 0;
    left: 0; */
	width: 100%;
	/* z-index: 3;  */
	background: #fff;
	/* Semi-transparent background */
	padding: 0px 10px 0 10px;
	/* Optional: Add padding for better appearance */

	font-weight: bold;
	/* Make text bold for better visibility */
	cursor: pointer;
}

body.lightMode .feed__body-description.findBud {
	text-shadow: unset;
	/* Add text shadow */
}

body.lightMode .feed__head.findBud {
	border-radius: 10px 10px 0px 0px;
	background: linear-gradient(90deg, #FFF8C6 59.77%, #FFF 93.99%);
}

body .truncate {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	/* number of lines to show */
	line-clamp: 2;
	-webkit-box-orient: vertical;
}

a.feed__body-readmore {
	font-size: 12px;
	color: #f6ee33;
	margin: 10px 0 15px;
	display: block;
	position: relative;
	text-align: right;
	font-weight: 600;
}

body.lightMode a.feed__body-readmore {
	color: #000;
}

a.feed__body-readmore:after {
	content: "";
	position: absolute;
	width: 70px;
	height: 1px;
	background: #f6ee33;
	bottom: -3px;
	right: 0;
}

body.lightMode a.feed__body-readmore:after {
	background: #056b6b;
}

.feed_item-find_buddy .feed__body {
	display: flex;
	flex-direction: column;
}

.feed__body-interested svg {
	vertical-align: bottom;
	fill: white;
	margin: 0 5px 0 0;
	height: 25px;
	width: 25px;
}

.feed__body-interested svg path {
	fill: white;
}

body.lightMode .feed__body-interested svg path {
	fill: #000;
}

body.lightMode a.createGroupFind svg path {
	fill: #1d1d1d;
}

.feed__body-interested.interested svg path,
.feed__body-interested.interested svg path {
	fill: red;
	color: red;
	font-weight: 600;
}

.feed_item-find_buddy .feed__actions ul li svg {
	width: 25px;
	height: 25px;
}

.feed__body-interested_box {
	font-size: 15px;
	color: #fde723;
	display: inline-block;
	/* margin: 20px 0 10px; */
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	/* border-bottom: 1px solid #343434; */
	/* gap: 20px; */
	/* padding: 0 0 10px; */
}

/* body.lightMode .feed__body-interested_box {
	border-bottom: 1px solid #eee;
} */

.feed__body-related,
.feed__body-related.chatNow {
	color: #61ffff;
	font-weight: 500;
	font-size: 13px;
}

.feed__body-related.simliarTrips {
	padding: 10px;
}

.feed__body-related.chatNow {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	display: none;

}

.feed__body-related.chatNow svg {
	width: 20px;
	height: 20px;

}

.feed__body-related.chatNow g {
	fill: #fff;
}

.chatUser {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	max-width: 110px;
}

body.lightMode .feed__body-related,
body.lightMode .feed__body-related.chatNow {
	color: #000;
	font-weight: 600;
	/* display: none; */
}

.feed__body-related.new.simliarTrips {
	position: absolute;
	z-index: 3;
	bottom: 1rem;
	right: .5rem;
	border-radius: 8rem;
	background: #FFF;
	flex-shrink: 0;
}

.similar__text {
	background: linear-gradient(270deg, #FDDE09 10.98%, #000 81.28%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	font-family: Montserrat;
	font-size: 11px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
}

body.lightMode .feed__body-related.chatNow svg g {
	fill: #000;
}

body.lightMode .feed__body-interested_box {
	color: #1e1e2d;
}

.feed__body-interested_box .feed__body-comments p {
	margin: 0;
}

.feed__body-interests {
	margin-left: -5px;
	padding: 0 5px 0 0;
}

.feed__body-interests,
.feed__body-related {
	cursor: pointer;
}

body.lightMode .feed__body-interests {
	color: #056b6b;
	font-weight: 600;
}

.feed-comment {
	display: flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
}

.feed__share {
	height: 25px;
	width: 25px;
}

feed-comment svg {
	width: 25px;
	height: 25px;
}

.options__menu {
	position: absolute;
	top: 100%;
	z-index: 999;
	display: none;
	right: 0;
}

.options__menu-box {
	position: absolute;
	z-index: 1;
	font-weight: 600;
	right: -9px;
	background: white;
	width: 180px;
	border-radius: 10px;
	box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.16);
}

.options__menu-mask {
	position: fixed;
	width: 100%;
	max-width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	margin: auto;
}

.options__menu-box ul {
	margin: 0;
	padding: 0;
	position: relative;
}

.options__menu-box ul li {
	font-size: 14px;
	list-style: none;
	padding: 14px 16px;
	margin: 0;
	text-align: left;
	border-bottom: 1px solid #f5f5f5;
	display: flex;
	justify-content: space-between;
	color: #111;
	letter-spacing: 0.5px;
	line-height: 1.5;
	cursor: pointer;
}

.options__menu-box ul li.hidden {
	display: none;
}

.feed_item .options__menu-box ul li svg {
	max-width: 15px;
	max-height: 15px;
	text-align: right;
	width: auto;
	height: auto;
	margin: 0 !important;
}

.feed_item .options__menu-box ul li svg path {
	stroke: #111;
}

.options__menu-box ul:before {
	content: "";
	position: absolute;
	bottom: 100%;
	right: 10%;
	margin-left: -10px;
	border-width: 10px;
	border-style: solid;
	border-color: transparent transparent #fff transparent;
}

.options__menu-box ul li .options__menu-icon svg {
	width: 16px;
	height: 16px;
}

.options__menu-box ul li:last-child {
	border: 0;
}

.options__menu-box ul li:hover {
	background: #fde723;
	color: black;
}

.options__menu-box ul li:first-child {
	border-radius: 10px 10px 0 0;
}

.options__menu-box ul li:last-child {
	border-radius: 0 0 10px 10px;
}

.findType,
.genderType {
	display: none;
}

/*------------------ Likes ------------------*/

.likes__item {
	padding: 0 20px;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid #121416;
}

.likes__item-identity {
	cursor: pointer;
}

body.lightMode .likes__item {
	border-bottom: 1px solid #e7e7e7;
}

.likes__item:last-child {
	border-bottom: 0;
}

.likes__item-image {
	max-width: 50px;
	max-height: 50px;
}

.likes__item-image img {
	width: 45px;
	height: 45px;
	object-fit: cover;
	object-position: center;
	border-radius: 50%;
	max-width: 45px;
	max-height: 45px;
	border: 1px solid #056B6B;
}

.likes__item-image .overlap__influencerTag {
	position: relative !important;
	left: 22px !important;
	top: -49px !important;
}

.likes__item-identity {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	align-content: center;
	flex-direction: row;
	flex-wrap: nowrap;
}

.likes__item-name {
	color: #fff;
	padding: 0 0 0 15px;
	font-size: 15px;
	font-weight: 600;
}

.likes__item-actions ul li svg {
	width: 25px;
	height: 25px;
}

body.lightMode .likes__item-actions ul li svg path {
	stroke: black;
}

body.lightMode .likes__item-actions ul li svg path:last-child {
	fill: #000;
}

.likes__item-actions ul li a.likes_item-message svg g {
	fill: #fff;
}

.likes__item-actions ul {
	display: flex;
	padding: 0;
	justify-content: flex-end;
}

.likes__item-actions ul li {
	list-style: none;
	padding-left: 15px;
}

.likes__item-name {
	color: #fff;
}

body.lightMode .likes__item-name {
	color: #111;
	font-weight: 400;
	font-size: 14px;
	line-height: 1.5;
}

.likes__item-name svg,
.verified_svg,
.verified_sp_svg {
	width: 15px;
	height: 15px;
	vertical-align: initial;
	margin-left: 8px;
}

.likes__item-name svg path,
.verified_svg path {
	fill: #3fc380;
}

.likes__item-name svg path,
.verified_sp_svg path {
	fill: blue;
}

.likes__box {
	height: calc(100% - 100px);
	max-height: initial;
}

/*------------------ Secondary ------------------*/

div#secondary .secondary__tab,
.secondary_item .secondary__tab,
.experiences__secondary .secondary__tab {
	position: absolute;
	width: 100%;
	height: 100vh;
	top: 0;
	overflow-y: scroll;
	background: #15151f;
	overflow-x: hidden;
	z-index: 5;
	display: none;
}

body.lightMode div#secondary .secondary__tab,
body.lightMode .secondary_item .secondary__tab {
	/* background: linear-gradient(200deg, #FFF9CF, white); */
	background: white;
}

div#app.drawer-out #secondary,
div#app.drawer-out .experiences__secondary {
	top: 10px;
	transition: 0.4s ease-in-out;
}

div#app.drawer-out div#secondary .drawerHeader,
div#app.drawer-out .experiences__secondary .drawerHeader {
	position: initial;
	transition: 0.4s ease-in-out;
}

a.drawer__back svg path {
	stroke: #fff;
}

body.lightMode a.drawer__back svg path {
	stroke: #111;
}

a.drawer__back,
a.drawer__back svg {
	width: 20px;
	height: 20px;
	flex: 1;
}

a.drawer__back {
	padding: 2vh 10px 2vh 15px;
	display: block;
	height: 60px;
}

.drawerTitle {
	color: #ddd;
	font-weight: 500;
	text-transform: uppercase;
	flex: 8;
	text-align: center;
	font-size: 1rem;
	flex: 15;
	text-indent: -20px;
	max-width: 90%;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	padding: 2vh 15px 2vh 0;
}

body.lightMode .drawerTitle {
	color: #505050;
}

#secondary .drawerHeader span,
.experiences__secondary .drawerHeader span {
	font-size: 1.1rem;
	color: #fff;
}

body #secondary .drawerHeader span.highlight,
body .experiences__secondary .drawerHeader span.highlight {
	color: #f6ee33;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

body.lightMode #secondary .drawerHeader span.highlight,
body.lightMode .experiences__secondary .drawerHeader span.highlight {
	color: #111;
	font-weight: 600;
}

div#secondary .drawerHeader,
.experiences__secondary .drawerHeader {
	position: sticky;
	top: 0;
	left: 0;
	right: 0;
	z-index: 11;
	border-radius: 0px;
	max-width: 100%;
}

div#secondary.hidding .drawerHeader,
.experiences__secondary.hidding .drawerHeader {
	position: relative;
	margin: 0 0 -60px;
}

.drawerBody .feed_item .feed__comment {
	/* width: calc(100% + 50px); */
	/* margin: 0 0 0 -25px; */
	height: auto;
	position: relative;
	bottom: initial;
}

/*----------------- Feed Tabs -----------------*/

.community__tabs {
	max-height: 85vh;
	overflow-y: scroll;
	/* Allows vertical scrolling */
	overflow-x: hidden;
	/* Prevents horizontal scrolling */
	scrollbar-width: none;
	/* For Firefox */
}

/* For Chrome, Safari, and other WebKit-based browsers */
.community__tabs::-webkit-scrollbar {
	display: none;
}

@media (min-width: 768px) {
	.community__tabs {
		max-height: 100vh;
	}
}

div#main {
	background: #15151f;
	height: 100vh !important;
}

body.lightMode div#main {
	background: #fff;
}

div#main__tabs ul li {
	list-style: none;
	color: #fff;
	font-size: 12px;
	height: 38px;
	display: flex;
}

div#main__tabs ul li a svg path {
	fill: #fff;
}


div#main__tabs ul li.active a svg path,
body.lightMode div#main__tabs ul li a svg path {
	fill: #000;
}

body.lightMode div#main__tabs ul li {
	color: #1e1e1e;
}

div#main__tabs ul li a {
	display: flex;
	width: 115px;
	justify-content: space-evenly;
	align-items: center;
}

div#main__tabs {
	overflow-x: scroll;
	width: 100%;
	cursor: grab;
	z-index: 5;
	background: #1e1e2d;
	transition: 0.4s ease-in-out;
	max-width: 100%;
	display: flex;
	justify-content: center;
}

body.lightMode div#main__tabs {
	background: linear-gradient(180deg,
			#FFF9CF 0%,
			#FFF9CF 100%,
			#FFF08C 100%);
}


@media (max-width: 580px) {
	div#main__tabs {
		justify-content: unset;

	}
}

div#main__tabs::-webkit-scrollbar {
	display: none;
}

div#main__tabs ul {
	padding: 0;
	cursor: grab;
	margin: 0;
	display: flex;
	width: 100%;
	justify-content: space-evenly;
}

div#main__tabs ul li {
	position: relative;
	list-style: none;
	cursor: pointer;
	transition: transform 0.3s ease, color 0.3s ease;
}

div#main__tabs ul li:hover {
	transform: scale(1.1);
}

div#main__tabs ul li.active {
	background: #f6ee33;
	color: #15151f;
	font-weight: 500;
	animation: pulse 1s infinite;
	animation-duration: 2s;
	animation-iteration-count: 2;
	font-size: 12px;
	font-family: 'Nunito';
	font-weight: 700;
	border-radius: 10% 10% 0 0;
}

body.lightMode div#main__tabs li.tab__item.active {
	background-color: #fff;
	border-radius: 10% 10% 0 0;
	box-shadow: inset 0 3px 0px rgba(0, 0, 0, 0.15);
}

/* Premium animations */
.feed__box {
	display: none;
	padding: 0 0 50px;
}

/*--------------- Comments Drawer ----------------*/

.comments__box,
.likes__box {
	overflow-y: scroll;
	height: calc(94vh - 110px);
	max-height: 702px;
}

.comment__item {
	padding: 0 20px 20px 15px;
	display: flex;
	margin: 0 0 20px;
	border-bottom: 1px solid #121416;
}

body.lightMode .comment__item {
	border-bottom: 1px solid #e9e9e9;
}

.comment__item:last-child {
	border-bottom: 0;
}

.comment__item-image {
	flex: 1.5;
	min-width: 61px;
}

.comment__item-body {
	flex: 8;
	min-width: 0;
	overflow-wrap: break-word;
}

.comment__item-image img {
	width: 45px;
	height: 45px;
	object-fit: cover;
	object-position: center;
	border-radius: 50%;
	max-width: 45px;
	max-height: 45px;
}

.comment__item-image .overlap__influencerTag {
	position: relative;
	top: -49px;
}

.comment__item-bheader {
	padding: 0 0 20px;
}

.comment__item-name {
	color: #fff;
	font-size: 15px;
	font-weight: 600;
}

body.lightMode .comment__item-name {
	color: #1d1d1d;
}

.comment__item-content,
.comment__item-content pre {
	padding: 5px 0 0;
	color: #c1c1c1;
	font-size: 13px;
	line-height: 1.5;
	white-space: break-spaces;
	font-family: inherit;
	margin: 0;
	overflow-wrap: break-word;
	word-break: break-word;
}

body.lightMode .comment__item-content pre {
	color: #000000;
}

.comment__item-content a {
	color: #f6ee33;
	overflow-wrap: anywhere;
	word-break: break-all;
}

body.lightMode .comment__item-content a {
	color: #056b6b;
	font-weight: 500;
}

.comment__item-bfooter {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	flex-direction: row;
	font-size: 12px;
	color: #aaa;
}

body.lightMode .comment__item-bfooter {
	color: #afafaf;
}

.comment__item-like svg g {
	fill: #aaa;
}

body.lightMode .comment__item-like svg g {
	fill: #000;
}

body.lightMode span.comment__item-like-count {
	color: #1c1c1c;
}

.comment__item-like svg {
	max-height: 16px;
	max-width: 16px;
	vertical-align: top;
	margin-right: 10px;
	cursor: pointer;
}

.comment__item-like {
	display: inline-block;
	padding-left: 15px;
	vertical-align: top;
}

.comment__item-reply {
	display: inline-block;
	color: #f6ee33;
	cursor: pointer;
}

body.lightMode .comment__item-reply {
	color: #056b6b;
	font-weight: 500;
}

.comment__item-actions {
	padding-left: 35px;
}

.drawerBody .feed__comment {
	width: 95%;
	margin: 0;
	height: 50px;
	position: absolute;
	bottom: 85px;
}

.comment__item-replies {
	padding: 15px 0 0;
}

.comment__item-replies span {
	padding: 0;
	font-size: 12px;
	color: #e8e8e8;
	cursor: pointer;
	position: relative;
	display: inline-block;
}

body.lightMode span.comment__item-replies-toggle {
	color: #1d1d1d;
}

.comment__item-replies span:after {
	position: absolute;
	width: 100%;
	height: 1px;
	bottom: -4px;
	left: 0;
	background: #b9b3b3;
	content: "";
}

.comment__item-replies .comment__item {
	padding: 0 15px 12px 0;
}

.comment__item-replies .comment__item:first-child {
	margin: 20px 0;
}

.comment__item-replies .comment__item .comment__item-image img {
	max-width: 35px;
	max-height: 35px;
}

.comment__item-replies .comment__item .comment__item-image .overlap__influencerTag {
	top: -39px !important;
}

.comment__item-replies .comment__item .comment__item-image {
	min-width: 45px;
}

.comment__item-replies .comment__item .comment__item-name {
	font-size: 13px;
}

.comment__item-replies .comment__item .comment__item-content {
	font-size: 12px;
}

.comment__item-replies .comment__item .comment__item-like {
	padding: 0;
	margin-left: -15px;
}

.comment__item-replies .comment__item .comment__item-bheader {
	padding: 0 0 10px;
}

.comment__item-replies .comment__item .comment__item-bfooter {
	font-size: 10px;
}

.replies__box {
	display: none;
}

/*--------------- Drawer CSS ----------------*/

.drawer {
	position: fixed;
	bottom: 0;
	overflow: scroll;
	z-index: 1001;
	will-change: transform;
	background-color: #fff;
	height: 100%;
	left: 50%;
}

.drawer.no-act {
	transform: translate(-50%, 100vh);
	display: none;
}

.drawerHeader {
	background-color: #1e1e2d;
	display: flex;
	justify-content: space-between;
}

body.lightMode .drawerHeader {
	background: linear-gradient(180deg, #FFF9CF 0%, #FFF9CF 100%, #FFF08C 100%);
}

.drawerHeader span {
	font-size: 14px;
	color: rgb(246, 238, 51);
	font-weight: 600;
	text-transform: uppercase;
}

body.lightMode .drawerHeader span {
	color: #111;
}

.drawerHeader .drawer-kapat {
	align-self: center;
	font-size: 20px;
	cursor: pointer;
}

.drawerBody {
	height: 100vh;
	position: relative;

}

#main__drawer.loginDrawer .drawerBody {
	height: 100%;
}

#dark-back {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	position: fixed;
	display: none;
	background: rgba(0, 0, 0, 0.4);
	z-index: 90;
	padding-right: 17px;
	overflow: hidden;
}

div#main__drawer {
	width: 420px;
	background: #1e1e2d;
	max-width: 100%;
}

body.lightMode div#main__drawer {
	background: #fdfdfd;
}

div#main__drawer.mini {
	height: 70%;
}

body.lightMode div#main__drawer .drawerHeader,
div#main__drawer .drawerHeader {
	padding: 2vh 20px 20px;
}

@media screen and (max-height: 700px) {
	div#main__drawer.loginDrawer .drawerHeader {
		padding: 1vh 15px;
	}
}

.drawerHeader .drawer-kapat {
	fill: white;
	color: #fff;
	stroke: white;
}

body.lightMode .drawerHeader .drawer-kapat {
	stroke: #111;
}

#dark-back {
	background: rgba(0, 0, 0, 0.6);
}

div#app.drawer-out {
	position: fixed;
	left: 0;
	right: 0;
	padding-top: 10px;
	border-radius: 0;
	/* width: 400px; */
	z-index: 1;
}

div#app.drawer-out div#header {
	border-radius: 10px 10px 0 0;
}

div#app.drawer-out div#main__feed-box {
	top: 70px;
}

div#app.drawer-out div#main__tabs {
	top: 60px;
	width: 400px;
}

div#app.drawer-out div#main__feed {
	padding: 50px 0 0;
}

/*--------------- Loader CSS ----------------*/

.feed__loading {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	height: 100px;
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
}

.feed__loading svg {
	width: 100px;
	height: 100px;
}

/*-------------- Locals Card CSS ---------------*/

.feed_type-locals {
	background: transparent;
	padding: 0;
	overflow: hidden;
	white-space: nowrap;
	box-shadow: none;
	margin: 10px 0 8px 0 !important;
	width: 100%;
}

.feed_type-locals ul {
	margin: 0;
	padding: 15px 0 0;
	overflow-x: scroll;
}

.feed_type-locals ul li {
	position: relative;
	list-style: none;
	display: inline-block;
	max-width: 70px;
	margin-right: 15px;
	vertical-align: top;
	max-height: 110px;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
}

.feed_type-locals ul li:first-child {
	margin-left: 25px;
}

.feed_type-locals ul li img {
	width: 70px;
	height: 70px;
	object-fit: cover;
	border-radius: 50%;
}

.feed_type-locals ul li span {
	display: block;
	color: #fff;
	font-size: 11px;
	width: inherit;
	word-break: break-word;
	white-space: break-spaces;
	text-align: center;
	line-height: 1.4;
	padding: 5px 0 0;
}

body.lightMode .feed_type-locals ul li span {
	color: #000;
	font-weight: 600;
}

.feed_type-locals ul.active {
	cursor: grabbing;
	cursor: -webkit-grabbing;
}

/*------------ Search CSS ---------------*/

div#main__search-box {
	position: absolute;
	top: 0;
	z-index: 4;
	width: 100%;
	background: #1e1e2d;
	height: 100vh;
	border-radius: 10px 10px 0 0;
}

body.lightMode div#main__search-box {
	background: linear-gradient(200deg, #FFF9CF, white);
	border-radius: 0px;
}

.search__header {
	background: #15151f;
	padding: 0 15px;
	border-radius: 10px 10px 0 0;
}

body.lightMode .search__header {
	background: #fff;
	box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.05);
}

.search__title h3 {
	font-size: 19px;
	color: #fff;
	font-weight: 600;
	letter-spacing: 0.01em;
}

body.lightMode .search__title h3 {
	color: #111;
}

.search__title {
	display: flex;
	align-items: center;
	justify-content: space-between;
	align-content: center;
	flex-direction: row;
}

span.search__filter svg path {
	fill: white;
}

body.lightMode span.search__filter svg path {
	fill: #000;
}

.search__container {
	padding-bottom: 16px;
	margin: 0 0 17px;
	position: relative;
}

.search__box input,
.experiences__search-box input,
.editPlaces__search-box input {
	width: 100%;
	height: 50px;
	border-radius: 10px;
	padding: 0 50px 0 20px;
	background: #58586459;
	color: #fff;
	border: 0;
	outline: 0;
}

body.lightMode .search__box input,
body.lightMode.experiences__search-box input {
	background: var(--light-grey-1, #f5f5f5);
	color: #000;
	font-weight: 500;
}

.search__box,
.experiences__search-box,
.editPlaces__search-box {
	position: relative;
	width: 100%;
	height: 50px;
}

.search__box button,
.experiences__search-box button,
.editPlaces__search-box button {
	position: absolute;
	right: 8px;
	top: 8px;
	height: 34px;
	width: 34px;
	border-radius: 7px;
	border: 0;
	background: #f6ee33;
	padding: 0;
	cursor: pointer;
}

.search__box button svg,
.experiences__search-box button svg,
.editPlaces__search-box button svg {
	width: 24px;
	height: 24px;
}

.search__box button svg {
	width: 14px;
	height: 14px;
}

.search__suggestion {
	padding: 12px 0 0;
	font-size: 12px;
	color: #c1c1c1;
	font-weight: 500;
}

body.lightMode .search__suggestion {
	color: #111111;
}

.search__suggestion span {
	font-weight: 600;
	color: #fff;
}

body.lightMode .search__suggestion span {
	color: #000;
}

.search__body {
	position: absolute;
	top: 173px;
	width: 100%;
	height: calc(100vh - 173px - 70px);
	left: 0;
	padding: 0 16px;
	overflow-y: scroll;
}

.search__sug-title {
	font-size: 15px;
	color: #eee;
	letter-spacing: 0.01em;
}

body.lightMode .search__sug-title {
	color: #1d1d1d;
	font-weight: 600;
	font-size: 13px;
}

.search__sug-title svg {
	height: 20px;
	width: inherit;
	vertical-align: middle;
	padding-right: 7px;
}

.search__sug-title svg path {
	stroke: #fff;
}

body.lightMode .search__sug-title svg path {
	stroke: #000;
}

.search__sug-item__locations .search__sug-body,
.search__sug-item__buddies .search__sug-body {
	display: flex;
	width: 100%;
	margin: 16px -15px 30px;
	max-width: 420px;
}

.search__sug-item__locations .search__sug-body .search__sug-item {
	margin-right: 15px;
	min-width: 160px;
	width: 160px;
	height: 160px;
	display: inline-block;
	flex: unset;
	position: relative;
	border-radius: 50% 50% 50% 8px;
	background-size: cover;
	overflow: hidden;
}

.search__sug-item__locations .search__sug-body .search__sug-item:first-child {
	margin-left: 15px;
}

.search__sug-item__locations .search__sug-body .search__sug-item:after {
	content: "";
	z-index: 1;
	border-radius: 0 0 75% 8px;
	position: absolute;
	width: 259px;
	height: 89px;
	left: 0;
	top: 80px;
	background: linear-gradient(180deg,
			rgb(0 0 0 / 10%) -0.69%,
			rgb(0 0 0 / 0%) -0.67%,
			rgb(0 0 0 / 62%) 73.8%,
			rgba(0, 0, 0, 0.8) 153.75%);
}

.ssi__locations-title {
	position: absolute;
	width: 111px;
	height: 16px;
	left: 10px;
	top: 115px;
	font-style: normal;
	font-weight: 600;
	font-size: 16px;
	line-height: 16px;
	letter-spacing: 0.01em;
	color: #ffffff;
	z-index: 2;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ssi__locations-posts {
	position: absolute;
	height: 12px;
	left: 10px;
	top: 135px;
	z-index: 2;
	font-style: normal;
	font-weight: 400;
	font-size: 11px;
	line-height: 10px;
	letter-spacing: 0.01em;
	color: #ffffff;
}

.ssi__locations-posts svg {
	width: 12px;
	height: 12px;
	vertical-align: middle;
}

.ssi__image {
	width: 100%;
	height: 100%;
	border-radius: inherit;
}

.ssi__image img {
	object-fit: cover;
	width: inherit;
	height: inherit;
}

.search__sug-body {
	margin: 16px 0 30px;
}

.search__sug-item__buddies .search__sug-body .search__sug-item {
	margin-right: 15px !important;
	width: 75px !important;
	display: inline-block;
	position: relative;
	border-radius: 50%;
	vertical-align: top;
}

.search__sug-item__buddies .search__sug-body .search__sug-item:first-child {
	margin-left: 15px;
}

.ssi__buddies-image {
	width: 100%;
	height: 75px;
	object-fit: cover;
}

.ssi__buddies-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}

.ssi__buddies-title {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	font-style: normal;
	font-weight: 400;
	font-size: 12px;
	line-height: 13px;
	text-align: center;
	letter-spacing: 0.01em;
	color: #ffffff;
	margin: 10px 0 0;
}

body.lightMode .ssi__buddies-title {
	color: #000000;
	font-weight: 600;
}

.search__sug-item__trending .search__sug-body .search__sug-item,
.search__sug-item__recent .search__sug-body .search__sug-item {
	line-height: 32px;
	display: inline-block;
	background: #58586459;
	color: #fff;
	font-weight: 500;
	font-size: 12px;
	padding: 4px 12px;
	margin: 0 10px 10px 0px;
	border-radius: 20px;
	border: 1px solid #555564;
}

body.lightMode .search__sug-item__trending .search__sug-body .search__sug-item,
body.lightMode .search__sug-item__recent .search__sug-body .search__sug-item {
	color: #000;
	background: #f5f5f5;
	font-weight: 600;
	border-color: #999999;
}

.search__sug-item__trending .search__sug-body .search__sug-item span svg,
.search__sug-item__recent .search__sug-body .search__sug-item span svg {
	width: 16px;
	height: 16px;
	vertical-align: text-top;
	margin-right: 5px;
}

.search__sug-item__trending .search__sug-body .search__sug-item span svg path,
.search__sug-item__recent .search__sug-body .search__sug-item span svg path {
	stroke: white;
}

body.lightMode .search__sug-item__trending .search__sug-body .search__sug-item span svg path,
body.lightMode .search__sug-item__recent .search__sug-body .search__sug-item span svg path {
	stroke: #000;
}

.search__sug-item__trending .search__sug-body .search__sug-item.active,
.search__sug-item__recent .search__sug-body .search__sug-item.active {
	color: #000;
	background: #f6ee33;
	font-weight: 500;
	border-color: #f6ee33;
}

body.lightMode .search__sug-item__trending .search__sug-body .search__sug-item.active,
body.lightMode .search__sug-item__recent .search__sug-body .search__sug-item.active {
	color: #000;
	background: #f6ee33;
	font-weight: 500;
	border-color: #f6ee33;
}

.search__sug-item__trending .search__sug-body .search__sug-item.active span svg path,
.search__sug-item__recent .search__sug-body .search__sug-item.active span svg path {
	stroke: black;
}

.search__sug-item__recent .search__sug-title {
	color: #59a4ff;
}

body.lightMode .search__sug-item__recent .search__sug-title {
	color: #59a4ff;
	font-weight: 600;
	font-size: 15px;
}

.search__sug-item__recent .search__sug-title svg path {
	stroke: #59a4ff;
}

.search__sug-item__recent .search__sug-body .search__sug-item {
	box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.25);
}

body.lightMode .search__sug-item__recent .search__sug-body .search__sug-item {
	box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.05);
}

span.search__sug-item__recent-remove {
	color: #f6ee33;
	padding-left: 15px;
	font-size: 17px;
	line-height: 1;
	display: none;
}

.search__sug-item__recent .search__sug-body .search__sug-item.active span.search__sug-item__recent-remove {
	color: #000;
}

.search__sug-body .search__sug-item {
	cursor: pointer;
}

.search__headers {
	display: none;
}

.search__headers ul {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	flex-wrap: nowrap;
	align-items: center;
	padding: 0;
	height: 30px;
	line-height: 30px;
	margin: 1em 0 0;
}

.search__headers ul li {
	font-weight: 500;
	font-size: 11px;
	line-height: 17px;
	letter-spacing: 0.01em;
	color: #707070;
	list-style: none;
	padding: 0 2px;
	cursor: pointer;
}

.search__headers ul li.active {
	background: #000;
	width: inherit;
	height: inherit;
	opacity: 1;
	color: #fde723;
	border-radius: 10px;
	font-size: 16px;
	padding: 5px;
	font-weight: 600;
	border: 1px solid #fde723;
}

@media (max-width: 400px) {
	.search__headers ul li.active {
		font-size: 13px;
	}
}

div#main__search-box.results .search__headers {
	display: block;
}

div#main__search-box.results .search__body {
	top: calc(173px + 46px);
	height: calc(100vh - 173px - 70px - 46px);
}

.search__item,
.locations__item {
	margin: 0 0 32px;
	display: flex;
	justify-content: space-between;
	color: #fff;
	cursor: pointer;
	align-items: center;
}

.search__item-left {
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: flex-start;
	flex-wrap: nowrap;
	flex: 3;
}

.search__item-follow svg {
	height: 11px;
	width: 11px;
	vertical-align: baseline;
	margin: 0 5px 0 0;
}

.search__item-title {
	font-size: 14px;
	font-weight: 500;
	color: #fff;
}

body.lightMode .search__item-title {
	color: #000;
}

.search__item-subtitle {
	font-weight: 100;
	font-size: 12px;
	padding: 5px 0 0;
	color: #eee;
}

body.lightMode .search__item-subtitle {
	color: #111;
	font-weight: 500;
}

.search__item-follow {
	background: rgba(97, 255, 255, 0.08);
	border: 1px solid #61ffff;
	border-radius: 4px;
	font-size: 11px;
	height: 24px;
	line-height: 24px;
	padding: 0 7px;
	display: inline-block;
	color: #61ffff;
}

body.lightMode .search__item-follow {
	border-color: #056b6b;
	color: #056b6b;
	font-weight: 700;
	background: inherit;
	border: 1.5px solid;
}

body.lightMode .search__item-follow svg path {
	stroke: #056b6b;
	fill: #056b6b;
}

.search__item-right {
	flex: 1.3;
	text-align: right;
}

.search__item-icon {
	margin: 0 15px 0 0;
	width: 40px;
	height: 40px;
}

body.lightMode .search__item-icon svg circle {
	fill: #000;
	fill-opacity: 0.7;
}

.search__item-icon img {
	width: inherit;
	height: inherit;
	border-radius: 50%;
	object-fit: cover;
}

body.lightMode .search__item-icon img {
	border: 1px solid black;
}

.search__item-icon .overlap__influencerTag {
	position: relative;
	top: -44.3px;
	left: 50%;
}

.search__item-subtitle svg {
	width: 12px;
	height: 12px;
	vertical-align: top;
	margin-left: 2px;
}

.search__item-subtitle svg path {
	fill: #f6ee33;
}

button.search__close svg {
	width: 14px;
	height: 14px;
}

button.search__close {
	cursor: pointer;
}

.search__item-follow.following {
	background: transparent;
	border: 0;
	color: #eee;
}

.search__item-follow.following svg path {
	fill: white;
	stroke: white;
}

.search__sug-item:last-child {
	padding: 0 0 40px;
}

.search__sug-item__locations,
body .search__sug-item__buddies {
	width: calc(100% + 32px);
	overflow: hidden;
	margin-left: -16px;
	padding-left: 16px !important;
}

/*----------------- Notifications -----------------*/

div#notifications h3 {
	font-size: 16px;
	color: #eee;
	/* font-weight: 100; */
	margin: 0 0 15px;
	padding: 0 20px;
}

body.lightMode div#notifications h3 {
	color: #056b6b;
}

.notif__item {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-content: center;
	padding: 5px 20px 15px;
	/* box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2); */
	margin: 0 0 7px;
	/* background: #1e1e2d; */
	color: #eee;
	cursor: pointer;
}

body.lightMode .notif__item {
	color: #111;
}

.notif__image {
	width: 45px;
	height: 45px;
	margin: 0 15px 0 0;
}

.notif__image img {
	width: inherit;
	height: inherit;
	border-radius: 50%;
	object-fit: cover;
}

.notif__text {
	font-size: 13px;
	line-height: 1.3;
	margin: 0 0 5px;
}

.notif__date img {
	width: 15px;
	height: 15px;
	vertical-align: bottom;
	margin: 0 10px 0 0;
}

.notif__date {
	font-size: 11px;
	color: #bbb;
}

body.lightMode .notif__date {
	color: #777;
}

div#notifications {
	padding: 25px 0;
	height: 100%;
	overflow: auto;
}

.notifs__week,
.notifs__month {
	border-bottom: 1px solid #343434;
	padding: 0 0 20px;
	margin: 0 0 20px;
}

body.lightMode .notifs__week,
body.lightMode .notifs__month {
	border-bottom-color: #ccc;
}

.notif__left {
	display: flex;
	flex: 4;
}

.notif__right {
	margin: 0 0 0 15px;
	background: rgba(97, 255, 255, 0.08);
	border: 1px solid #61ffff;
	border-radius: 4px;
	font-size: 12px;
	height: 24px;
	line-height: 24px;
	padding: 0 7px;
	display: inline-block;
	color: #61ffff;
}

body.lightMode .notif__right {
	border-color: #056b6b;
	color: #056b6b;
	background: inherit;
	font-weight: 600;
}

.notif__right.notif__reply {
	border-color: #f6ee33;
	color: #f6ee33;
}

body.lightMode .notif__right {
	border-color: #056b6b;
	color: #056b6b;
	background: inherit;
	font-weight: 600;
}

.notif__right svg {
	width: 10px;
	height: 10px;
	margin: 0 5px 0 0;
	vertical-align: baseline;
}

body.lightMode .notif__right svg path {
	stroke: #056b6b;
	fill: #056b6b;
}

.notif__right.notif__reply svg path {
	fill: #f6ee33;
}

/*-----------------New Premium -----------------*/

.premium_info_table-box ul {
	list-style: none;
	padding: 10px 0;
	margin: 20px 16px;
}

li.premium_rows-head {
	display: flex;
	border-bottom: 0.2px solid #353553;
	font-size: 12px;
	height: 40px;
	text-align: center;
}

body.lightMode li.premium_rows-head {
	border-bottom-color: #ccc;
}

.premium_info_table-box {
	border-radius: 20px 20px 0px 0px;
	background: #1e1e2d;
	color: #eee;
}

body.lightMode .premium_info_table-box {
	background-color: #fdfdfd;
	color: #111;
}

.premium_rows-head ul {
	list-style: none;
	padding: 0px;
	display: flex;
	justify-content: center;
	align-items: center;
	flex: 1;
	margin: 0px;
}

li.premium_content-provided-head {
	text-align: center;
	margin: 0px;
	height: 100%;
	display: flex;
	flex: 1.25;
	align-content: center;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	letter-spacing: 0.5px;
	cursor: pointer;
}

.premium__header__title span {
	color: #f6ee33;
}

li.premium_content-row:last-child {
	border: 0;
}

.premium_content-head h4 {
	font-size: 14px;
}

.premium_content-provided-head h4 {
	margin: 0px;
}

li.premium_content-row {
	display: flex;
	border-bottom: 0.1px solid #353553;
	flex-wrap: wrap;
	flex-direction: row;
	align-content: space-between;
	align-items: center;
	justify-content: space-between;
}

body.lightMode li.premium_content-row {
	border-bottom-color: #f1f1f1;
}

.premium_content-info {
	flex: 1.25;
	text-align: left;
	min-width: 55.5%;
}

.premium_content-row ul {
	list-style: none;
	padding: 0px;
	display: flex;
	margin: 0px;
	height: 100%;
	flex: 1;
	align-items: flex-start;
}

.green {
	color: #61ffff;
}

body.lightMode .green {
	color: #056b6b;
}

body.lightMode .green svg path {
	fill: #056b6b;
}

body.lightMode .premium-super svg path {
	fill: #056b5b;
}

.red {
	color: #fde723;
}

body.lightMode .red {
	color: #ef053d;
}

body.lightMode .red svg path {
	fill: #ef053d;
}

p.super_check {
	color: #61ffff;
}

body.lightMode p.super_check {
	color: #056b6b;
}

ul.experience-info {
	font-size: 10px;
}

.premium_content-info p {
	font-size: 12px;
	line-height: 1.5;
	margin: 0px 0;
	font-weight: 600;
	width: 95%;
}

.premium_content-provided-head p {
	margin: 15px 0px;
}

.faq-info-box {
	display: flex;
	align-items: center;
	justify-content: space-around;
	font-size: 14px;
	color: #ffffff;
	cursor: pointer;
}

body.lightMode .faq-info-box,
body.lightMode .faq-info-box h2 {
	background: #fef9c4;
	color: #111;
}

.faq-info-box p {
	margin: 0;
	color: #fff;
}

body.lightMode .faq-info-box p {
	color: #111;
	font-weight: 700;
}

.faq-info-box span {
	position: relative;
	left: calc(100px - 20px);
	display: flex;
}

.faq-info-box svg {
	margin: 0px 15px 0 10px;
}

.faq-info-box svg g circle {
	fill: #222;
}

body.lightMode .faq-info-box svg g circle {
	fill: transparent;
}

.faq-info-box svg g path {
	stroke: #fff;
}

body.lightMode .faq-info-box svg g path {
	stroke: #000;
}

.faq-info-box span svg path {
	stroke: #61ffff;
}

body.lightMode .faq-info-box span svg path {
	stroke: #000;
}

.premium_content_last {
	font-weight: 600;
	letter-spacing: 1px;
	width: 100%;
	height: 70px;
	display: flex;
	align-items: center;
}

.premium_content-info.premium_content_last p {
	font-size: 12px;
	text-transform: uppercase;
	font-weight: 600;
	color: #61ffff;
}

body.lightMode .premium_content-info.premium_content_last p {
	color: #056b6b;
	font-weight: 700;
}

.premium-mini.active,
.premium-pro.active {
	background: #15151d;
	padding: 0 0px;
}

body.lightMode .premium-super.active,
body.lightMode .premium-pro.active,
body.lightMode .premium-mini.active {
	background: rgb(253 231 35 / 40%);
}

.premium-super.active {
	background: #15151d;
	padding: 0 2px;
}

body.lightMode .premium-super.active {
	background: rgb(253 231 35 / 40%);
}

body.lightMode .premium-super svg path {
	fill: #056b6b;
}

.premium_rows-head li.premium_content-provided-head.active {
	border-radius: 10px 10px 0 0;
}

p.sp_mini_check.red {
	font-size: 10px;
}

.prem-cont_lastRow li.premium_content-provided-head.active {
	border-radius: 0 0 10px 10px;
}

/*----------------- Premium -----------------*/

.premium_content-head {
	flex: 1.25;
	text-align: left;
	padding: 10px 0 0;
}

.premium_content-head h4 {
	margin: 0px;
	color: #61ffff;
}

body.lightMode .premium_content-head h4 {
	color: #056b6b;
}

.premium_content-provided-head h4 {
	margin: 0px;
}

div#main__premium-box {
	position: absolute;
	z-index: 4;
	width: 100%;
	background: #111;
	height: 100vh;
	overflow-x: hidden;
	overflow-y: scroll;
}

.premium__body {
	margin-bottom: 60%;
}

body.lightMode div#main__premium-box {
	background: inherit;
}

.premium__header {
	height: 190px;
	position: relative;
}

.premium__header img {
	height: inherit;
	width: 100%;
	object-fit: cover;
}

.premium__header-bg {
	height: inherit;
	position: relative;

}

.premium__header-bg img {
	width: 100%;
	height: 100%;
}

.premium__header-bg svg {
	width: 100%;
	height: 100%;
}

.premium__header__title {
	position: absolute;
	bottom: 25px;
	font-size: 19px;
	color: #eeeeeee3;
	text-align: center;
	width: 100%;
	line-height: 1.5;
	font-weight: 500;
}

body.lightMode .premium__header__title {
	color: #fff;
}

.premium__features {
	margin-bottom: 10px;
}

.premium__feature-item {
	flex: calc(50% - 7px);
	color: #fff;
}

body.lightMode .premium__feature-item {
	color: #000;
}

.premium__feature-title {
	font-size: 13px;
	font-weight: 600;
	line-height: 1.5;
	margin: 0;
}

.premium__feature-head {
	display: flex;
	align-items: center;
}

.premium__feature-icon svg {
	width: 25px;
	height: 25px;
	margin-right: 10px;
}

.premium__feature-icon svg path {
	fill: white;
}

body.lightMode .premium__feature-icon svg path {
	fill: #000;
}

.premium__feature-item:nth-child(2n) {
	margin: 0 0px 25px 14px;
}

.premium__feature-content p {
	font-style: normal;
	/* font-weight: 300; */
	font-size: 12px;
	line-height: 140%;
	color: #eeeeee;
	margin: 7px 0 0;
}

body.lightMode .premium__feature-content p {
	color: #111;
	font-weight: 500;
}

.premium__feature-content p span {
	color: #fde723;
	display: block;
	padding: 10px 0px;
	position: relative;
	font-size: 11px;
}

.premium__feature-content p span:before {
	content: "";
	bottom: 5px;
	height: 2px;
	position: absolute;
	width: 30px;
	background: #fde327;
}

.premium__faq-box {
	display: flex;
	color: #fff;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
	margin: 0 0 25px;
}

body.lightMode .premium__faq-box {
	color: #000;
}

.premium__faq-title {
	font-style: normal;
	font-weight: 600;
	font-size: 18px;
	line-height: 18px;
	color: #ffffff;
	flex: 1;
}

body.lightMode .premium__faq-title {
	color: #000;
}

.premium__faq-text {
	font-weight: 400;
	font-size: 12px;
	line-height: 13px;
	overflow: hidden;
	color: #ffffff;
	white-space: nowrap;
	text-overflow: ellipsis;
	margin: 0 10px 0 0;
	flex: 3.5;
}

body.lightMode .premium__faq-text {
	color: #000;
}

.premium__faq-cta {
	flex: 1;
	position: relative;
	text-align: right;
	font-size: 14px;
}

.premium__faq-cta:before {
	content: "";
	width: 70%;
	height: 1px;
	background: white;
	position: absolute;
	bottom: -5px;
	right: 0;
}

body.lightMode .premium__faq-cta:before {
	background: #000;
}

.premium__offer {
	background: #ffd600;
	padding: 10px 10px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	margin: 0 0 20px;
}

.premium__offer-text {
	font-weight: 600;
	font-size: 13px;
	line-height: 15px;
	text-align: left;
	color: #000000;
	display: flex;
	flex: 3;
	align-items: center;
}

.premium__offer-code {
	flex: 1;
	background: #4caf50;
	font-size: 12px;
	padding: 7px 5px;
	border-radius: 4px;
	color: #fff;
	text-align: center;
}

.premium__offer-text svg {
	width: 20px;
	height: 20px;
	margin: 0 5px 0 0;
}

.scroll-left {
	height: 100px;
	overflow: hidden;
	position: relative;
}

.scroll-left .inner {
	position: absolute;
	width: 100%;
	height: 100%;
	margin: 0;
	line-height: 50px;
	text-align: center;
	/* Starting position */
	-moz-transform: translateX(100%);
	-webkit-transform: translateX(100%);
	transform: translateX(100%);
	/* Apply animation to this element */
	-moz-animation: scroll-left 15s linear infinite;
	-webkit-animation: scroll-left 15s linear infinite;
	animation: scroll-left 15s linear infinite;
}

/* Move it (define the animation) */
@-moz-keyframes scroll-left {
	0% {
		-moz-transform: translateX(100%);
	}

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

@-webkit-keyframes scroll-left {
	0% {
		-webkit-transform: translateX(100%);
	}

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

@keyframes scroll-left {
	0% {
		-moz-transform: translateX(100%);
		/* Browser bug fix */
		-webkit-transform: translateX(100%);
		/* Browser bug fix */
		transform: translateX(100%);
	}

	100% {
		-moz-transform: translateX(-100%);
		/* Browser bug fix */
		-webkit-transform: translateX(-100%);
		/* Browser bug fix */
		transform: translateX(-100%);
	}
}

.premium__packages-box {
	color: #fff;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	flex: 1.2;
}

body.lightMode .premium__packages-box {
	color: #000;
}

.subscribed_info_box {
	width: 80%;
	padding: 10px;
}

.premium__packages-item {
	flex: 1;
	border-radius: 8px;
	text-align: center;
	cursor: pointer;
	width: 100%;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	margin: 2px 1px;
}

ul.package_price_row {
	background: #15151d;
}

body.lightMode ul.package_price_row {
	background: #fdfdfd;
}

.premium__package-item__title {
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 140%;
	color: #fde723;
	text-align: center;
	padding: 5px 0;
}

body.lightMode .premium__package-item__title {
	color: #0b9292;
	font-weight: 700;
}

.premium__package-item__price-old {
	font-weight: 400;
	font-size: 8px;
	line-height: 140%;
	text-decoration: line-through;
	font-style: italic;
}

body.lightMode .premium__package-item__price-old {
	color: #056b6b;
	font-weight: 600;
}

.premium__package-item__price-new span {
	font-style: normal;
	font-weight: 700;
	font-size: 14px;
	line-height: 140%;
	display: inline;
}

body.lightMode .premium__package-item__price-new span {
	color: #000;
	font-weight: 500;
}

span.premium__price span {
	font-size: 10px;
	font-weight: 500;
}

.premium__package-item__price-new {
	font-style: normal;
	font-size: 10px;
	padding: 5px 0;
}

body.lightMode .premium__package-item__price-new {
	color: #000;
}

.premium__package-item__subTitle {
	font-size: 12px;
	padding: 10px 0 5px 0;
}

.premium__package-item_orderId {
	font-size: 8px;
	padding: 5px 0;
}

.premium__recommend {
	font-weight: 700;
	font-size: 10px;
	text-transform: uppercase;
	line-height: 140%;
	/* or 11px */
	color: #fde723;
	margin: 0 0 10px;
}

body.lightMode .premium__recommend {
	color: #056b6b;
}

.premium__package-offer {
	font-weight: 400;
	font-size: 10px;
	line-height: 140%;
	/* or 14px */
	text-align: center;
	color: #eeeeee;
}

body.lightMode .premium__package-offer {
	color: #000;
}

.premium_content-provided-head.active .premium__packages-item {
	background: #fde723;
	color: #000;
	box-shadow: 1px 1px 11px 0px rgba(0, 0, 0, 0.5);
}

body.lightMode .premium__packages-item.active {
	background: inherit;
	border: none;
}

.premium__purchase {
	cursor: pointer;
	padding: 0px 20px 0px 20px;
}

.premium__purchase .premium__purchase {
	display: none;
}

.premium__terms {
	font-weight: 400;
	font-size: 9px;
	line-height: 11px;
	text-align: center;
	color: #9e9d9d;
	margin: 0 0 10px 0;
}

.premium__terms span {
	color: #fff;
	padding: 0 0 0 3px;
	position: relative;
	cursor: pointer;
}

body.lightMode .premium__terms span {
	color: #000;
}

.premium__terms span:before {
	content: "";
	width: 85%;
	height: 1px;
	position: absolute;
	background: white;
	bottom: -5px;
	right: 0;
}

.premium__button {
	background: #f6ee33;
	margin: 25px 16px 12px;
	display: flex;
	padding: 10px 15px;
	border-radius: 8px;
	justify-content: space-between;
	font-weight: 700;
	font-size: 14px;
	line-height: 19px;
	/* identical to box height */
	text-align: center;
	color: #000000;
}

.premium__button__text svg {
	width: 20px;
	vertical-align: inherit;
	height: auto;
}

.premium__button__price {
	position: relative;
	/* identical to box height */
}

.premium__button__text {
	text-transform: uppercase;
}

.premium__button__price:before {
	content: "";
	position: absolute;
	left: calc(100% + 10px);
	top: 0;
	width: 40px;
	right: 0;
	bottom: 0;
	height: 2px;
	background: #000;
	margin: auto;
}

.drawerBody iframe {
	width: 100%;
	height: 100%;
	margin: -15px 0 0;
}

.drawerHeader.blackHeader {
	background: #000;
}

.premium__packages-subscribed {
	margin: 44px 0 20px;
	border: 1px solid #fde723;
	border-radius: 8px;
	color: #fff;
	text-align: center;
	font-size: 12px;
	padding: 10px 0;
}

.premium__packages-subscribed__title {
	font-weight: 600;
	color: #eee;
}

.premium__packages-subscribed__validity {
	padding: 8px 0 9px;
	font-size: 18px;
	color: #ffbe2e;
	font-weight: 600;
	text-transform: capitalize;
}

.premium__packages-subscribed__orderNumber {
	color: #bbb;
	font-size: 10px;
	padding: 5px 0 0;
}

.premium__packages-subscribed__render span {
	font-size: 16px;
	font-weight: 600;
}

/*------------------ Add Post ------------------*/

div#main__addPost-box {
	position: absolute;
	top: 0;
	z-index: 4;
	width: 100%;
	background: #1e1e2d;
	height: 100vh;
	border-radius: 10px 10px 0 0;
}

body.lightMode div#main__addPost-box {
	background: #fdfdfd;
}

.filepond--root .filepond--credits {
	display: none !important;
}

.editImage {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	padding: 0 16px;
	margin: 25px 0 0;
	gap: 0 16px;
}

.addPost__images-item {
	flex: 1;
	width: 100%;
	height: 80px;
	text-align: center;
	position: relative;
	border-radius: 10px;
	max-width: 100px;
}

.addPost__images-item span {
	position: absolute;
	top: -5px;
	right: -5px;
	background: #cf000f;
	width: 15px;
	height: 15px;
	font-size: 8px;
	color: #fff;
	border-radius: 50%;
	line-height: 15px;
	cursor: pointer;
}

.addPost__images-item img {
	width: inherit;
	height: inherit;
	object-fit: cover;
	border-radius: inherit;
}

/*------------------ Profile ------------------*/

.profileCover__zoomIn {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 1000;
	height: 100%;
	display: none;
}

.profileCover__zoomIn-overlay {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	z-index: 1;
	top: 0;
	left: 0;
}

.profileCover__zoomIn img {
	width: auto;
	height: auto;
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	display: block;
	z-index: 5;
	object-fit: cover;
	max-width: 90%;
	max-height: 90%;
	pointer-events: visible;
}

div#main__profile-box {
	position: absolute;
	top: 0;
	z-index: 4;
	width: 100%;
	background: #15151f;
	height: 100vh;
	border-radius: 10px 10px 0 0;
}

body.lightMode div#main__profile-box {
	background-color: #fdfdfd;
}

.profile__page {
	position: relative;
	z-index: 11;
}

div#main__profile-box .profile__page {
	top: 0;
	height: 100vh;
	overflow-y: scroll;
	overflow-x: hidden;
}

.profile__head {
	width: 100%;
	height: 50px;
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 100%;
}

.profile__cover {
	margin: 0 0 12px;
	z-index: -1;
	position: relative;
	width: 100%;
	height: 40vh;
	margin-bottom: 16px;
	background-color: #b3d4fc;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #555;
	font-size: 18px;
	border-radius: 0 0px 40px 40px;
}

.profile__cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0 0px 40px 40px;
}

.profile__cover .swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal.swiper-pagination-fraction,
.experience__gallery-full .swiper-pagination.swiper-pagination-bullets.swiper-pagination-horizontal.swiper-pagination-fraction {
	right: 16px;
	left: initial;
	color: #000;
	font-size: 12px;
	background: rgba(255, 255, 255, 0.45);
	width: auto;
	padding: 3px 10px;
	border-radius: 13px;
	display: inline;
	font-weight: 600;
}

.profile__head:before {
	content: "";
	background: linear-gradient(0deg,
			rgba(0, 0, 0, 0.1) -0.69%,
			rgba(0, 0, 0, 0) -0.67%,
			rgb(0 0 0 / 32%) 73.8%,
			rgba(21, 21, 31, 0.9) 153.75%);
	width: 100%;
	height: 200%;
	position: absolute;
	z-index: 0;
}

.profile__head-left {
	flex: 1;
	position: relative;
	font-size: 0;
	padding: 0 0 0 16px;
}

.profile__head-name {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 220px;
}

.profile__head-left svg {
	width: 20px;
	height: 20px;
}

.profile__head-left svg path {
	stroke: white;
}

.profile__head-right {
	flex: 2.5;
	text-align: right;
	line-height: 50px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	position: relative;
	height: inherit;
	padding-right: 16px;
	padding-top: 10px;
}

.profile__follow,
.profile__login {
	background: rgb(97, 255, 255);
	height: 24px;
	font-size: 12px;
	display: inline-block;
	border-radius: 4px;
	line-height: 24px;
	color: #000;
	padding: 0 10px;
	font-weight: 500;
	cursor: pointer;
}

body.lightMode .profile__follow,
body.lightMode .profile__login {
	background: #056b6b;
	color: #fff;
}

.profile__login {
	margin: 0 10px 0 0;
	background: #fde723;
	font-weight: 600;
}

.profile__follow svg {
	width: 10px;
	height: 10px;
	margin: 0 5px 0 0;
	vertical-align: baseline;
}

.profile__follow svg path {
	stroke: black;
}

body.lightMode .profile__follow svg path {
	stroke: #fff;
}

.profile__menu {
	height: 19px;
	margin: 0 0 0 15px;
	cursor: pointer;
}

.profile__menu {
	margin: 0;
	height: 35px;
	position: relative;
	width: 40px;
	line-height: 33px;
	top: -5px;
	right: -15px;
	text-align: center;
	margin-left: -10px;
}

.profile__menu svg path {
	fill: white;
}

body.lightMode .profile__menu svg path {
	fill: #fff;
}

.profile__menu svg {
	vertical-align: bottom;
	height: 19px;
}

.profile__title {
	padding: 0 16px;
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: nowrap;
	align-content: center;
	margin: 15px 0 16px;
}

.profile__title-first {
	flex: 1;
}

.profile__title-second {
	flex: 3;
	padding: 0 12px;
}

.profile__title-third {
	flex: 1;
	text-align: right;
	display: flex;
	justify-content: flex-end;
}

.profile__photo {
	width: 108px;
	height: 108px;
	margin: -28px 0 0;
	position: relative;
}

.profile__photo img {
	width: inherit;
	height: inherit;
	object-fit: cover;
	border-radius: 50%;
	border: 4px solid #15151f;
	pointer-events: all;
}

body.lightMode .profile__photo img {
	border: 2px solid #000;
}

.profile__photo .profile__ratings {
	display: none;
}

.influencer {
	position: relative;
}

.influencer:before {
	content: "";
	width: calc(100% - 8px);
	height: calc(100% - 8px);
	border-radius: 50%;
	position: absolute;
	left: 4px;
	top: 4px;
	/* border: 4px solid #15151f; */
	z-index: 999999;
	background-image: url("https://tbd-prod-media.s3.ap-south-1.amazonaws.com/uploads/static/badge.png");
	background-size: contain;
}

.profile__modal {
	position: fixed;
	max-width: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	z-index: 45;
	display: none;
}

.profile__modal-mask {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	z-index: 1;
	top: 0;
	left: 0;
}

.profile__modal-body img {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	max-width: 100%;
	height: auto;
	border-radius: 0;
	z-index: 1;
	border: 0;
	max-height: 90%;
}

.profile__modal-body .overlap__influencerTag {
	top: 133px !important;
}

.profile__chat,
.profile__views {
	width: 30px;
	height: 30px;
	background: #fde723;
	text-align: center;
	line-height: 33px;
	border-radius: 50%;
}

.profile__chat svg,
.profile__views svg {
	width: 16px;
	height: 16px;
}

.profile__name {
	font-weight: 600;
	font-size: 15px;
	line-height: 17px;
	letter-spacing: 0.01em;
	color: #ffff;
	margin: 0 0 6px;
	display: flex;
	align-items: center;
	gap: 10px;
}

body.lightMode .profile__name {
	color: #000;
}

.profile__location {
	font-weight: 400;
	font-size: 12px;
	line-height: 15px;
	letter-spacing: 0.01em;
	color: #e7e7e7;
	margin: 0 0 10px;
}

body.lightMode .profile__location {
	color: #171717;
	font-weight: 500;
}

.profile__follows {
	display: flex;
	font-weight: 600;
	font-size: 14px;
	line-height: 17px;
	letter-spacing: 0.01em;
	color: #fff;
}

body.lightMode .profile__follows {
	color: #000;
}

.profile__followers,
.experience__host-followers {
	border-right: 2px solid #707070;
	padding-right: 7px;
	margin-right: 7px;
}

.profile__follows span {
	font-weight: 400;
	font-size: 10px;
	line-height: 12px;
	letter-spacing: 0.01em;
	padding-left: 4px;
	opacity: 0.8;
}

body.lightMode .profile__follows span {
	color: #707070;
}

.profile__chat,
.profile__views,
.profile__follows,
.profile__location,
.profile__photo,
.profile__ratings,
.profile__activity,
.profile__posts-tab__head ul li,
.profile__tab-share ul li,
.followers__tab_head ul li,
.followers__load-more,
.profile__head-left svg,
.profile__head-left-back,
.comment__item-image img,
.comment__item-name,
.rate__now,
.ratings__sort,
.rating__title-name,
.rating__title-img img,
form#rateNow .form_row.form_submit button,
.feed_type-locals ul li img,
.profile__completeness-cta,
.profile__head-edit,
.profile__head-chat,
.profile__head-bucketList,
.profileViews__cta,
.profile__head-left img,
.profile__find-card,
.profile__ask-card,
.profile__head-add-cover,
.profile__head-delete-cover,
.profile__head-submit {
	cursor: pointer;
}

.profile__ratings {
	background: rgba(97, 255, 255, 0.05);
	height: 40px;
	display: flex;
	line-height: 40px;
	flex-direction: row;
	justify-content: flex-start;
	padding: 0 16px;
	align-items: center;
	align-content: center;
	flex-wrap: nowrap;
	margin: 0 0 16px;
}

body.lightMode .profile__ratings {
	background: rgb(156 156 156 / 5%);
}

.profile__rating {
	font-weight: 400;
	font-size: 12px;
	line-height: 12px;
	letter-spacing: 0.01em;

	/* Black 2 */
	color: #fff;
}

body.lightMode .profile__rating {
	color: #000;
	font-weight: 600;
}

.profile__ratings-icon {
	padding: 0 10px 0 0;
}

.profile__rating-open {
	flex: 4;
	text-align: right;
	color: rgb(97, 255, 255);
	font-size: 10px;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

body.lightMode .profile__rating-open {
	color: #056b6b;
	font-weight: 800;
}

body.lightMode .profile__rating-open svg path {
	stroke: #000;
}

.profile__rating-open svg path {
	stroke: rgb(97, 255, 255);
}

.profile__rating-open svg {
	height: 24px;
	width: 24px;
	vertical-align: sub;
}

.profile__about h4 {
	font-weight: 700;
	font-size: 14px;
	line-height: 17px;
	letter-spacing: 0.01em;
	color: #fff;
	margin: 0;
}

body.lightMode .profile__about h4 {
	color: #000;
	margin: 0;
	padding: 0;
	font-weight: 700;
}

.profile__about {
	padding: 0 16px;
	margin: 0 0 25px;
}

.profile__about p,
.profile__about pre {
	font-weight: 400;
	font-size: 12px;
	line-height: 150%;
	letter-spacing: 0.01em;
	color: #e7e7e7;
	font-family: inherit;
	white-space: inherit;
	position: relative;
}

body.lightMode .profile__about p,
body.lightMode .profile__about pre {
	color: #000;
	font-weight: 600;
}

.profile__about pre.truncate {
	-webkit-line-clamp: 3;
}

.profile__about span {
	display: block;
	text-align: right;
	color: rgb(97, 255, 255);
	font-size: 12px;
	margin: -7px 0 0;
	cursor: pointer;
}

body.lightMode .profile__about span {
	color: #056b6b;
	font-weight: 500;
}

.profile__activities {
	display: flex;
	padding: 0 16px;
	justify-content: space-between;
	margin: 0 0 35px;
	width: 420px;
	max-width: 100%;
}

.profile__activity {
	display: flex;
}

.profile__activity-icon {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #f5f5f5;
	text-align: center;
	line-height: 30px;
	margin: 0 8px 0 0;
}

.profile__activity-icon svg {
	width: 17px;
	height: 17px;
	vertical-align: text-top;
}

.profile__activity-icon svg path {
	fill: #15151f;
}

.profile__activity.profile__trips svg path {
	fill: unset;
	stroke: #15151f;
}

.profile__activity-text span {
	display: block;
}

.profile__activity-text span:last-child {
	font-weight: 400;
	font-size: 11px;
	line-height: 150%;
	letter-spacing: 0.01em;
	color: #707070;
}

.profile__activity-text span:first-child {
	font-weight: 400;
	font-size: 13px;
	line-height: 150%;
	letter-spacing: 0.01em;
	color: #fff;
}

body.lightMode .profile__activity-text span:first-child {
	color: #000;
	font-size: 13px;
	font-weight: 600;
}

.profile__activity.profile__followers {
	border: 0;
}

.profile__posts-tab__head ul {
	display: flex;
	justify-content: space-between;
	flex-wrap: nowrap;
	flex-direction: row;
	align-items: center;
	margin: 0 0 30px;
	padding: 0;
}

.profile__posts {
	padding: 0 16px;
	margin: 0 0 20rem;
}

.profile__posts-tab__head ul li {
	text-align: center;
	list-style: none;
	color: #fff;
	flex: 1;
	font-size: 14px;
	font-weight: 600;
}

body.lightMode .profile__posts-tab__head ul li {
	color: #000;
}

.profile__posts-tab__head ul li span {
	font-size: 11px;
	display: block;
	color: #e7e7e7;
	padding: 3px 0 0;
	font-weight: 600;
}

body.lightMode span.profile__posts-count {
	color: #000;
}

.profile__posts-tab__head ul li.active {
	font-weight: 600;
	position: relative;
}

.profile__posts-tab__head ul li.active:after {
	content: "";
	height: 4px;
	background: #f6ee33;
	width: 70%;
	bottom: -15px;
	position: absolute;
	left: 0;
	margin: auto;
	right: 0;
}

.profile__tab-share ul {
	padding: 0;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-start;
	width: 100%;
}

.profile__tab-share ul li {
	list-style: none;
	flex: calc(33.33% - 12px);
	margin: 0px 2px 4px;
	height: 170px;
	max-width: calc(35.33% - 12px);
	width: 100%;
}

.profile__tab-share ul li img {
	max-width: 100%;
	max-height: 170px;
	width: inherit;
	height: inherit;
	object-fit: cover;
}

.drawerBody.followersBody {
	padding: 0;
}

.followers__tab_head ul {
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: nowrap;
	flex-direction: row;
}

.followers__tab_head ul li {
	flex: 1;
	text-align: center;
	list-style: none;
	font-size: 15px;
	line-height: 1;
	height: 43px;
	letter-spacing: 0.01em;
	color: #e7e7e7;
}

body.lightMode .followers__tab_head ul li {
	color: #111;
}

.followers__tab_head ul li span {
	padding: 0 5px 0 0;
}

.followers__tab_head ul li.active {
	font-weight: 700;
	color: #fff;
	position: relative;
	transition: 0.1s linear;
}

body.lightMode .followers__tab_head ul li.active {
	color: #111;
}

.followers__tab_head ul li.active:after {
	content: "";
	width: 75%;
	left: 0;
	right: 0;
	margin: auto;
	height: 3px;
	background: #056b6b;
	position: absolute;
	bottom: 0;
}

.followers__tab_head {
	margin: 0px 0 25px;
	border-bottom: 0.25px solid rgb(32 30 30 / 25%);
	box-shadow: 0px 7px 10px rgba(0, 0, 0, 0.5);
	backdrop-filter: blur(25px);
}

body.lightMode .followers__tab_head {
	background-color: #fdfdfd;
	border: none;
	box-shadow: 0px 7px 10px rgb(232 232 232);
	backdrop-filter: none;
}

.followers__search {
	padding: 0 16px;
	position: relative;
}

.followers__search input {
	width: 100%;
	height: 44px;
	border-radius: 7px;
	padding: 0 50px 0 20px;
	background: #58586459;
	color: #fff;
	border: 0;
	outline: 0;
}

body.lightMode .followers__search input {
	background: #d5d5d559;
}

.followers__search button {
	position: absolute;
	right: 21px;
	width: 32px;
	height: 32px;
	top: 6px;
	border-radius: 7px;
	background-color: #fde723;
	border: 0;
}

.followers__search button svg {
	width: 16px;
	height: 16px;
}

.followers__items {
	padding: 0 16px;
	overflow-y: scroll;
	margin: 25px 0 50px;
	height: calc(100vh - 6vh - 200px);
}

.drawerBody.followers__body {
	padding: 0;
}

.followers__load-more {
	font-size: 13px;
	margin: 0 0 20px;
	color: #fff;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.profile__views-number {
	font-size: 10px;
	color: #707070;
	line-height: 1.5;
	padding: 5px 0 0;
	text-align: center;
}

.profile__views-number span {
	display: block;
}

.profile__completeness-box {
	padding: 16px;
	margin: 16px 0;
	background: #fde723;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: nowrap;
}

.profile__completeness-left {
	flex: 2;
}

.profile__completeness-right {
	flex: 1;
}

.profile__completeness-left p {
	font-size: 10px;
	line-height: 1.5;
	margin: 8px 0 0;
}

.profile__completeness-left h4 {
	margin: 0;
	font-size: 14px;
	font-weight: 600;
}

.profile__completeness-cta {
	font-size: 12px;
	text-align: center;
	height: 30px;
	line-height: 30px;
	background: #056b6b;
	border-radius: 4px;
	color: #fff;
	font-weight: 600;
	margin: 17px 0 0;
}

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

.profile__completeness-progress__bar {
	position: relative;
	width: 100%;
	height: 8px;
	background: white;
	max-width: 100%;
	border-radius: 10px;
	display: block;
	flex: 5.66;
}

.profile__completeness-value {
	flex: 1;
	font-size: 10px;
	padding: 0 0 0 8px;
	color: #056b6b;
	font-weight: 600;
}

.profile__completeness-progress-item {
	position: absolute;
	height: inherit;
	background: #056b6b;
	border-radius: 10px 0 0 10px;
}

.profile__head-edit svg,
.profile__head-chat svg,
.profile__head-bucketList svg,
.profile__head-add-cover svg,
.profile__head-delete-cover svg,
.profile__head-submit svg {
	width: 15px;
	height: 15px;
}

.profile__head-edit svg path,
.profile__head-chat svg path,
.profile__head-bucketList svg path,
.profile__head-add-cover svg path,
.profile__head-delete-cover svg path,
.profile__head-submit svg path {
	fill: white;
}

body.lightMode .profile__head-bucketList svg path {
	fill: #056b6b;
}

body.lightMode .profile__head.fixed svg path {
	fill: black;
	stroke: #000;
}

.profile__head-bucketList {
	padding: 0 5px;
	height: 30px;
	color: #fff;
	background: rgba(17, 17, 17, 0.62);
	font-size: 12px;
	border-radius: 4px;
	text-align: center;
	line-height: 30px;
	margin: 0 5px 0 0;
}

.profile__head-bucketList svg {
	margin: 0 0 0 5px;
	vertical-align: middle;
}

.profile__head-edit,
.profile__head-chat,
.profile__head-add-cover,
.profile__head-delete-cover,
.profile__head-submit {
	margin: 0 5px;
	height: 30px;
	width: 30px;
	line-height: 34px;
	background: rgba(17, 17, 17, 0.62);
	border-radius: 4px;
	text-align: center;
}

.profile__head-chat {
	margin: 0 0px 0 5px;
}

.profile__head-right .profile__head-bucketList svg {
	vertical-align: text-top;
	width: 12px;
	height: 12px;
}

.profileViews__search-box {
	padding: 3px 0 8px;
}

.popup__master.popup__master--profileViews .popup__container {
	height: 78vh;
}

.profileViews__search {
	padding: 0 16px;
	position: relative;
}

.profileViews__search input {
	width: 100%;
	height: 40px;
	border: 0;
	background: #f5f5f5;
	padding: 0 20px;
	border-radius: 10px;
	outline: 0;
}

.profileViews__search span {
	position: absolute;
	right: 24px;
	width: 32px;
	height: 32px;
	line-height: 32px;
	top: 0;
	bottom: 0;
	margin: auto;
	background: #fde723;
	text-align: center;
	border-radius: 7px;
}

.profileViews__search span svg {
	width: 16px;
	height: 16px;
}

.profileViews__cta {
	position: absolute;
	bottom: 0;
	height: 60px;
	line-height: 60px;
	text-align: center;
	width: 100%;
	font-size: 18px;
	font-weight: 700;
	background: #f6ee33;
	border-radius: 0 0 20px 20px;
	display: none;
}

.profileViews__cta svg {
	position: absolute;
	right: 20px;
	bottom: 0;
	top: 0;
	margin: auto;
	width: 16px;
	height: 16px;
}

.profileViews__cta span {
	display: block;
	text-align: center;
	font-size: 12px;
	font-weight: 700;
	position: absolute;
	top: -45px;
	width: 100%;
}

.profileViews__items {
	height: calc(78vh - 80px - 51px - 15px);
	overflow-x: hidden;
	margin: 15px 0 0;
}

.profileViews__items .search__item {
	padding: 0 16px;
	color: #000;
	margin: 0 0 25px;
}

.profileViews__items .search__item-title {
	color: #000;
}

.profileViews__items .search__item-subtitle {
	color: #444;
}

.profileViews__items .search__item-follow {
	border-color: #056b6b;
	color: #fff;
	background: #056b6b;
}

.profileViews__items .search__item-follow svg path {
	stroke: white;
}

.profileViews__item--isolate .profileViews__items {
	overflow-y: hidden;
	position: relative;
	height: calc(78vh - 80px - 51px - 70px - 28px);
}

.profileViews__hide {
	content: "";
	width: 100%;
	position: absolute;
	bottom: 60px;
	height: 305px;
	filter: blur(8px);
	-webkit-filter: blur(8px);
	background-color: rgba(255, 255, 255, 0.4);
	backdrop-filter: saturate(70%);
	display: none;
}

.profileViews__item--isolate .profileViews__hide,
.profileViews__item--isolate .profileViews__cta {
	display: block;
}

.profile__posts-tab-item {
	display: none;
	padding: 0 0 50px;
}

.profile__posts-tab-item.active {
	display: block;
}

.no-posts {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 25px;
	color: #fff;
	font-size: 18px;
}

body.lightMode .no-posts {
	color: #000;
}

.no-posts__icon {
	margin: 0 10px 0 0;
	width: 25px;
	height: 25px;
}

.profile__head.fixed {
	position: fixed;
	border-radius: 10px 10px 0 0;
	background: #15151f;
	z-index: 12;
	transition: 0.125s linear;
	max-width: 100%;
}

body.lightMode .profile__head.fixed {
	background: #fff;
	color: #111;
}

.profile__head.fixed:before {
	display: none;
}

.profile__head.fixed .profile__head-left {
	color: #fff;
	font-size: 14px;
	display: flex;
	align-items: center;
	line-height: 50px;
	flex: 2;
	margin-top: 10px;
}

body.lightMode .profile__head.fixed .profile__head-left {
	color: #111;
	font-weight: 600;
}

.profile__head-left img {
	max-width: 27.5px;
	max-height: 25px;
	width: auto;
	height: 12px;
	margin: 0 10px 0 0;
}

.profile__head-left-back {
	width: calc(30px + 16px);
	margin-left: -16px;
	padding-left: 16px;
	line-height: 50px;
}

.profile__head-left-back svg {
	vertical-align: middle;
}

.profile__head.fixed .profile__head-bucketList,
.profile__head.fixed .profile__head-edit,
.profile__head.fixed .profile__head-chat,
.profile__head.fixed .profile__head-add-cover,
.profile__head.fixed .profile__head-submit {
	background: rgba(5, 107, 107, 0.15);
}

body.lightMode .profile__head.fixed .profile__head-bucketList {
	background: rgba(5, 107, 107, 0.05);
	color: #056b6b;
	font-weight: 500;
}

body.lightMode .profile__head.fixed .profile__head-edit,
body.lightMode .profile__head.fixed .profile__head-chat {
	background: #fff;
}

.profile__head.fixed .profile__head-left svg {
	margin: 0 10px 0 0;
	vertical-align: middle;
	width: 20px;
	height: 20px;
}

.profile__find-card,
.profile__ask-card {
	padding: 12px 25px;
	background: #1e1e2d;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
	margin: 0 -16px 10px;
	width: calc(100% + 32px);
	color: #fff;
	border-bottom: 1px solid #f6ee3366;
}

body.lightMode .profile__find-card,
body.lightMode .profile__ask-card {
	background: #fdfdfd;
	color: #000;
	box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.1);
}

.profile__posts-tab-item.profile__tab-find,
.profile__posts-tab-item.profile__tab-ask {
	padding: 0 0 10rem;
}

.profile__find-card__header,
.profile__ask-card__header {
	display: flex;
	align-items: center;
	font-size: 14px;
	font-weight: 600;
}

.profile__find-card__header-left,
.profile__ask-card__header-left {
	margin: 0 10px 0 0;
}

.profile__find-card__header-left svg,
.profile__ask-card__header-left svg {
	width: 30px;
	height: 30px;
}

body.lightMode .profile__find-card__header-left svg g circle,
body.lightMode .profile__ask-card__header-left svg circle {
	fill: #ddd;
}

body.lightMode .profile__find-card__header-left svg g path {
	fill: #ddd;
	stroke: #505050;
}

body.lightMode .profile__ask-card__header-left svg g path {
	stroke: #000;
}

.profile__find-card__header-location span,
.profile__ask-card__header-location span {
	font-weight: 700;
}

.profile__find-card__header-date,
.profile__ask-card__header-date {
	padding: 3px 0 0;
	font-size: 12px;
	color: #bbbbbb;
	margin-top: 15px;
}

body.lightMode .profile__find-card__header-date,
body.lightMode .profile__ask-card__header-date {
	color: #686868;
}

.profile__find-card__body,
.profile__ask-card__body {
	line-height: 1.6;
	font-size: 12px;
	padding: 10px 0 0;
	margin: 0 0 15px;
	font-weight: 600;
	color: #eee;
}

body.lightMode .profile__find-card__body,
body.lightMode .profile__ask-card__body {
	color: #222;
}

.profile__find-card__body pre,
.profile__ask-card__body pre {
	font-family: inherit;
	font-size: inherit;
	color: inherit;
	white-space: pre-line;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin: 5px 0 5px;
}

.profile__find-card__body a,
.profile__find-card__header-date span.type,
.profile__ask-card__body a,
.profile__ask-card__header-date span.type {
	color: #f6ee33;
}

body.lightMode .profile__find-card__body a,
body.lightMode .profile__find-card__header-date span.type,
body.lightMode .profile__ask-card__body a,
body.lightMode .profile__ask-card__header-date span.type {
	color: #056b6b;
}

.profile__menu .options__menu-box {
	right: 5px;
}

.profile__menu .options__menu-box ul:before {
	right: 10px;
}

.profile__menu .options__menu {
	top: 110%;
}

.profile__menu .options__menu-box ul li {
	padding: 10px 16px;
	font-size: 13px;
}

.profile__menu .options__menu-box ul li svg path {
	fill: #000;
}

.profile__menu .options__menu-box ul li:last-child svg path {
	fill: #000;
}

.report__box__profile .popup__container {
	height: 440px;
}

/*-------------- Ratings Page --------------*/

.ratings__head {
	height: 88px;
	margin: -15px 0 20px;
	background: #1e1e2d;
	padding: 20px 16px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
}

body.lightMode .ratings__head {
	color: #000000;
	background: rgba(253, 231, 35, 0.08);
}

.ratings__head-left {
	font-size: 14px;
	font-weight: 600;
	color: #ffff;
}

body.lightMode .ratings__head-left {
	color: #000000;
}

.ratings__head-rating {
	display: inline-block;
}

.ratings__head-rating.hidden {
	display: none;
}

.ratings__head-rating .rating__item-stars {
	height: 18px;
	width: auto;
	vertical-align: bottom;
	margin: 0 10px 0 0;
}

.ratings__head-outof {
	font-size: 10px;
	color: #bbbbbb;
	margin: 5px 0 0;
	font-weight: 400;
}

body.lightMode .ratings__head-outof {
	color: #056b6b;
}

.ratings__head-outof span {
	padding: 0 3px;
}

span.ratings__head-rating-value {
	padding: 0 0 0 5px;
}

body.lightMode span.ratings__head-rating-value {
	color: #666666;
	font-weight: 500;
}

.rate__now {
	height: 30px;
	font-size: 14px;
	background: #fde723;
	display: inline-block;
	line-height: 30px;
	width: 110px;
	border-radius: 4px;
	font-weight: 500;
	text-align: center;
}

.rate__now svg {
	width: 16px;
	height: 16px;
	vertical-align: text-top;
	margin: 0 3px 0 0;
}

.ratings__title {
	padding: 0 16px;
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	align-items: center;
	margin: 0 0 20px;
}

.ratings__sort-options {
	display: none;
}

.ratings__title-left {
	font-size: 14px;
	color: #eee;
	font-weight: 600;
}

body.lightMode .ratings__title-left {
	color: #000;
}

span.ratings__title-outof {
	padding: 0 0 0 5px;
	font-size: 10px;
	color: #bbbbbb;
}

body.lightMode span.ratings__title-outof {
	color: #555555;
}

.ratings__sort-title {
	font-weight: 700;
	font-size: 11px;
	line-height: 150%;
	letter-spacing: 0.01em;
	color: #61ffff;
}

.ratings__sort-title svg {
	height: 6px;
	width: fit-content;
	margin: 0 0 0 3px;
}

.ratings__sort-title svg path {
	fill: #61ffff;
}

.ratings__sort {
	display: none;
}

.ratings__item {
	padding: 20px 16px;
	border-bottom: 1px solid #2a2828;
}

body.lightMode .ratings__item {
	border-bottom: 1px solid #e5e5e5;
}

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

.rating__title-left {
	display: flex;
}

.rating__title-img {
	width: 40px;
	height: 40px;
	margin: 0 12px 0 0;
}

.rating__title-img img {
	width: inherit;
	height: inherit;
	object-fit: cover;
	border-radius: 50%;
}

.rating__title-name {
	color: #fff;
	font-size: 14px;
	font-weight: 600;
}

body.lightMode .rating__title-name {
	color: #000;
}

.rating__title-date {
	font-size: 10px;
	color: #bbbbbb;
	margin: 5px 0 0;
	font-weight: 400;
}

body.lightMode .rating__title-date {
	color: #222;
}

.ratings__item-title-right svg {
	width: auto;
	height: 8px;
}

.ratings__item-title-right svg path {
	fill: #bbbbbb;
}

body.lightMode .ratings__item-title-right svg path {
	fill: #111;
}

.rating__stars {
	padding: 12px 0;
	color: #fff;
	font-size: 12px;
}

body.lightMode .rating__stars {
	color: #000;
}

.rating__stars svg {
	margin: 0 10px 0 0;
	vertical-align: text-top;
}

.rating__content pre {
	margin: 0;
	font-size: 12px;
	color: #e7e7e7;
	line-height: 1.5;
	white-space: normal;
	font-family: inherit;
}

body.lightMode .rating__content pre {
	color: #111;
}

.rating__content pre a {
	color: #f6ee33;
}

.ratings__item:last-child {
	border: 0;
	padding: 16px 16px 50px;
}

.rating__item-stars svg {
	display: inline;
	width: 16px;
	height: auto;
	fill: #fde723;
}

.rating__item-stars svg path {
	fill: #fde723;
}

.rating__item-stars svg path {
	shape-rendering: geometricprecision;
}

.rating__stars span.rating__item-stars svg {
	height: 13px;
	margin: 0 1px 0 0;
}

.rating__stars span.rating__item-stars {
	margin: 0 6px 0 0;
}

/*--------------- Rate Now Popup ---------------*/

.rateNow__popup {
	display: none;
	position: fixed;
	top: -60px;
	width: 420px;
	height: 100vh;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 12;
	max-width: 100%;
}

.ratings__box {
	width: inherit;
}

.ratings__body {
	width: inherit;
}

.ratings__page {
	width: inherit;
}

div#secondary,
.experiences__secondary {
	width: inherit;
}

.popup__bg {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	background: rgba(17, 17, 17, 0.45);
	left: 0;
	z-index: 0;
}

.rateNow__box {
	width: 90%;
	position: absolute;
	height: 450px;
	margin: auto;
	left: 0;
	right: 0;
	background: white;
	top: 0;
	bottom: 0;
	border-radius: 20px;
}

.rateNow__title {
	height: 50px;
	line-height: 50px;
	text-align: center;
	background: rgba(253, 231, 35, 0.48);
	border-radius: 20px 20px 0 0;
	color: #000;
	margin: 0 0 24px;
	font-weight: 600;
}

.rateNow__form {
	padding: 0 16px;
}

form#rateNow .form_row .form_column label,
form#rateNow .form_row .form_column label strong {
	font-weight: 500;
	font-size: 14px;
	line-height: 17px;
	letter-spacing: 0.01em;
	color: #000;
	font-family: inherit;
	margin: 0 0 10px;
	display: block;
}

.form_row {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

form#rateNow .form_row {
	margin: 0 0 20px;
}

form#rateNow .form_row.form_submit {
	margin: 0;
}

.form_column {
	flex: 1;
}

form#rateNow .form_row .form_column textarea {
	width: 100%;
	border: 1px solid rgb(237, 237, 237);
	border-radius: 8px;
	outline: 0;
	font-family: inherit;
	padding: 15px 15px 0;
	color: #111;
	font-size: 12px;
	resize: none;
}

.form_row.form_submit {
	position: absolute;
	bottom: 0;
	width: 100%;
	left: 0;
}

.form_row.form_submit button {
	height: 60px;
	width: 100%;
	background: 0;
	border: 0;
	font-size: 16px;
	font-weight: 600;
	border-radius: 0 0 0 20px;
	color: #056b6b;
}

.form_row.form_submit .form_column:last-child button {
	background: #fde723;
	border-radius: 0 0 20px 0;
	color: #000;
}

span.character_count {
	font-weight: 400;
	font-size: 11px;
	line-height: 12px;
	text-align: right;
	letter-spacing: 0.01em;
	color: #bbb;
	float: right;
	margin: 6px 0 0;
}

/*---------------- Rating Slider ----------------*/

.rating-group {
	display: inline-flex;
}

/* make hover effect work properly in IE */
.rating__icon {
	pointer-events: none;
}

/* hide radio inputs */
.rating__input {
	position: absolute !important;
	left: -9999px !important;
}

/* set icon padding and size */
body .rating-group .rating__label {
	cursor: pointer;
	padding: 0 0.1em;
	font-size: 24px !important;
}

/* add padding and positioning to half star labels */
body .rating-group .rating__label--half {
	padding-right: 0;
	margin-right: -1.2em !important;
	z-index: 2;
}

body .rating-group label.rating__label.hidden {
	padding: 0;
	margin: 0;
	width: 0;
	font-size: 0;
}

/* set default star color */
.rating__icon--star {
	color: #fde723;
}

/* set color of none icon when unchecked */
.rating__icon--none {
	color: #eee;
}

/* if none icon is checked, make it red */
.rating__input--none:checked+.rating__label .rating__icon--none {
	color: red;
}

/* if any input is checked, make its following siblings grey */
.rating__input:checked~.rating__label .rating__icon--star {
	color: #ddd;
}

/* make all stars orange on rating group hover */
.rating-group:hover .rating__label .rating__icon--star,
.rating-group:hover .rating__label--half .rating__icon--star {
	color: #fde723;
}

/* make hovered input's following siblings grey on hover */
.rating__input:hover~.rating__label .rating__icon--star,
.rating__input:hover~.rating__label--half .rating__icon--star {
	color: #ddd;
}

/* make none icon grey on rating group hover */
.rating-group:hover .rating__input--none:not(:hover)+.rating__label .rating__icon--none {
	color: #eee;
}

/* make none icon red on hover */
.rating__input--none:hover+.rating__label .rating__icon--none {
	color: red;
}

/*--------------- Toast ---------------*/

.toast {
	text-align: center;
	position: fixed;
	bottom: 120px;
	left: 0;
	right: 0;
	margin: auto;
	width: 80%;
	background: #1e1e2d;
	padding: 10px 15px;
	border-radius: 7px;
	color: #fde723;
	font-weight: 600;
	font-size: 14px;
	z-index: 999;
	display: none;
	max-width: 350px;
}

/*--------------- Read More ---------------*/

/* Hide the element until it has finished upgrading to a Custom Element */
read-more:not(:defined) {
	visibility: hidden;
}

/* Ensure the element is visible in no-js environments */
.no-js read-more:not(:defined) {
	visibility: visible;
}

read-more p {
	font: inherit;
	line-height: inherit;
}

read-more button {
	all: unset;
	color: var(--color-primary);
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
}

read-more button:focus,
read-more button:hover {
	text-decoration: none;
}

/*--------------------- Travel Shots ---------------------*/

div#main__shots-box {
	display: none;
	background: #000;
	position: fixed;
	width: inherit;
	height: calc(100vh);
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 12;
	overflow: hidden;
	border-radius: 10px 10px 0 0;
	max-width: inherit;
}

.shots__head {
	height: 65px;
	position: absolute;
	background: linear-gradient(180deg,
			#000000 -25.47%,
			rgba(0, 0, 0, 0) 84.43%);
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	width: 100%;
	color: white;
	z-index: 2;
	line-height: 65px;
	padding: 0 16px;
	font-weight: 500;
	font-size: 14px;
	text-align: center;
}

.shots__back svg {
	height: 18px;
	width: 18px;
}

.shots__back svg path {
	stroke: white;
}

.shots__body {
	position: absolute;
	width: 100%;
	height: 100%;
}

.shots__video {
	height: 100%;
	width: 100%;
	position: relative;
}

.shots__video video {
	width: 100%;
	/*height: auto;*/
	max-height: 100%;
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	z-index: 1;
}

.shots__bottom {
	position: absolute;
	bottom: 0;
	padding: 15px;
	z-index: 2;
	width: 80%;
	color: #fff;
}

.shots__user-img {
	width: 37px;
	height: 37px;
	margin: 0 13px 0 0;
}

.shots__user-img img {
	height: inherit;
	width: inherit;
	object-fit: cover;
	border-radius: 50%;
}

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

.shots__user-description pre {
	font-family: inherit;
	overflow: hidden;
	font-size: 13px;
	color: #e7e7e7;
	white-space: pre-wrap;
}

.shots__user-description pre a {
	color: #fde723;
}

.shots__user {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	width: 90%;
	align-items: center;
}

.shots__user-left {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
}

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

.shots__user-name-text {
	font-size: 15px;
	font-weight: 500;
}

.shots__user-name-location {
	font-size: 12px;
	color: #bbb;
	padding: 1px 0 0;
}

.shots__follow {
	font-size: 12px;
	height: 25px;
	line-height: 24px;
	padding: 0 10px;
	border: 1px solid #fff;
	border-radius: 6px;
}

.shots__video-overlay {
	position: absolute;
	z-index: 2;
	width: 100%;
	height: 100%;
}

.shots__item:after {
	content: "";
	height: 280px;
	background: linear-gradient(0deg, #000000 -25.47%, rgba(0, 0, 0, 0) 84.43%);
	width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 1;
}

.shots__sidebar {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 15%;
	z-index: 2;
	color: #fff;
}

.shots__sidebar ul {
	padding: 0;
	margin: 0;
}

.shots__sidebar ul li {
	display: block;
	text-align: center;
	margin: 0 0 20px;
}

.shots__sidebar ul li svg {
	width: 25px;
	height: 25px;
}

.shots__sidebar ul li span {
	display: block;
	font-size: 12px;
}

.shots__sidebar ul li svg path {
	fill: #fff;
}

li.shots_volume[data-state="mute"] span.shots__mute {
	display: none;
}

li.shots_volume[data-state="unmute"] span.shots__unmute {
	display: none;
}

li.shots_volume i {
	font-size: 30px;
}

.shots__sidebar ul li.shots_volume {
	margin: 0 0 30px;
}

#main__shots-box .swiper-wrapper {
	height: 100vh;
}

.mute-container {
	width: 100%;
	height: 100%;
	position: relative;
}

.play-button {
	display: none;
	font-size: 35px;
	color: white;
	background-color: rgba(0, 0, 0, 0.6);
	border-radius: 50%;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	margin: auto;
	width: 75px;
	text-align: center;
	height: 75px;
	align-items: center;
	justify-content: center;
}

.shots__video-overlay.playing .play-button {
	display: flex;
	animation: fadeInOut 2s forwards;
	/* 2s is the duration of the entire animation, adjust as needed */
}

.play-button svg {
	max-height: 30px;
	max-width: 30px;
}

.play-button svg path {
	fill: #fff;
}

@keyframes fadeInOut {
	0% {
		opacity: 0;
	}

	10% {
		opacity: 1;
	}

	80% {
		opacity: 0.8;
	}

	85% {
		opacity: 0.6;
	}

	90% {
		opacity: 0.4;
	}

	95% {
		opacity: 0.2;
	}

	100% {
		opacity: 0;
	}
}

.shots__back svg,
.shots__addPost svg,
.shots__sidebar ul li,
.shots__user-name,
.shots__user-img,
.shots__user-description,
.shots__follow {
	cursor: pointer;
}

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

body.lightMode #main__drawer.loginDrawer,
div#main__drawer.loginDrawer {
	/* background: white; */
	background-image: url("../img/login-bg.jpg");
	background-repeat: no-repeat;
	background-size: cover;
}

div#main__drawer.loginDrawer .drawerHeader {
	background: transparent;
	/* display: none; */
}

div#main__drawer.loginDrawer .drawerBody {
	padding: 0;
	overflow-y: scroll;
	max-height: 100%;
}

div#main__drawer.loginDrawer .drawerHeader svg.drawer-kapat {
	fill: white;
	stroke: white;
}

.login__switch-SignUp,
.login__switch-Login,
.login__form-box .form__row.form__submit button,
.signUp__form-box .form__row.form__submit button,
.resetPass__form-box .form__row.form__submit button,
span.show-hide-password,
.login__form-box span.login__forgotPassword,
span.verifyPhone,
select#signUp__countryCode {
	cursor: pointer;
}

.login__view,
.reset__view,
.otp__view {
	padding: 0px 20px;
	height: 100%;
}

.login__view h3,
.reset__view h3,
.onboarding__page-title h1 {
	margin: 0 0 30px;
	font-size: 30px;
	font-weight: 600;
	line-height: 1.3;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
}

.onboarding__page-title h1 {
	color: #fff;
}

@media screen and (max-width: 768px) {

	.login__view h3,
	.reset__view h3,
	.onboarding__page-title h1 {
		font-size: 32px;
	}
}

.login__form-box form,
.resetPass__form-box form {
	margin: 0 0 35px;
	text-align: center;
}

@media screen and (max-height: 700px) {

	.login__form-box form,
	.resetPass__form-box form {
		margin: 0 0 25px;
	}
}

.login__form-box input,
.signUp__form-box input,
.resetPass__form-box input,
.onboarding__form-box input {
	display: block;
	width: 100%;
	height: 55px;
	border-radius: 10px;
	border: 1px solid #000;
	padding: 0 20px;
	font-size: 14px;
	outline: 0;
	color: initial;
}

.login__form-box .form__row,
.signUp__form-box .form__row,
.resetPass__form-box .form__row,
.onboarding__form-box .form__row {
	margin: 0 0 18px;
	text-align: left;
}

@media screen and (max-height: 700px) {

	.login__form-box .form__row,
	.signUp__form-box .form__row,
	.resetPass__form-box .form__row,
	.onboarding__form-box .form__row {
		margin: 0 0 12px;
	}
}

.login__form-box label,
.signUp__form-box label,
.resetPass__form-box label,
.onboarding__form-box label {
	display: block;
	width: 100%;
	font-size: 14px;
	padding: 0 0 8px;
	font-weight: 500;
	color: black;
}

.onboarding__form-box label {
	font-weight: 700;
	color: #fff;
}

.login__form-box span.login__forgotPassword,
.signUp__form-box span.login__forgotPassword {
	font-size: 14px;
	padding: 8px 0 0;
	display: block;
	font-weight: 500;
	text-decoration: underline;
}

.login__form-box .form__row .form__column,
.signUp__form-box .form__row .form__column,
.resetPass__form-box .form__row .form__column,
.onboarding__form-box .form__row .form__column {
	position: relative;
}

span.show-hide-password {
	position: absolute;
	right: 25px;
	top: 42.5px;
}

.login__form-box .form__row.form__submit button,
.signUp__form-box .form__row.form__submit button,
.otp__view .form__row.form__submit button,
.resetPass__form-box .form__row.form__submit button,
.onboarding__form-box .form__row.form__submit button {
	width: 100%;
	display: block;
	height: 55px;
	border: 0;
	outline: 0;
	background: #f6ee33;
	border-radius: 10px;
	font-size: 18px;
	color: #000;
	font-weight: 700;
	position: relative;
	cursor: pointer;
	/* width: 250px; */
}

@media screen and (max-width: 700px) {

	.login__form-box .form__row.form__submit button,
	.signUp__form-box .form__row.form__submit button,
	.otp__view .form__row.form__submit button,
	.resetPass__form-box .form__row.form__submit button,
	.onboarding__form-box .form__row.form__submit button {
		height: 50px;
		width: 100%;
	}
}

.login__form-box .form__row.form__submit,
.signUp__form-box .form__row.form__submit,
.resetPass__form-box .form__row.form__submit,
.onboarding__form-box .form__row.form__submit {
	margin: 28px 0 0;
}

.login__form-box .form__row.form__submit span.login__switch-SignUp,
.signUp__form-box .form__row.form__submit span.login__switch-Login,
.resetPass__form-box .form__row.form__submit span.login__switch-Login {
	display: block;
	padding: 18px 0 5px;
	text-align: center;
	font-size: 14px;
	color: white;
}

.login__form-box .form__row.form__submit span.login__switch-SignUp b,
.signUp__form-box .form__row.form__submit span.login__switch-SignUp b,
.resetPass__form-box .form__row.form__submit span.login__switch-SignUp b {
	font-weight: 800;
	color: white;
	font-size: 14px;
	text-decoration: underline;
}

.form__row.hidden {
	display: none;
}

.login__social-box span {
	font-size: 16px;
	font-style: italic;
	font-weight: 300;
	color: white;
}

.signUp__form-box,
.forgotPassword__form-box,
.otp__view,
.reset__view,
.form__resetPass {
	display: none;
}

.signUp__form-box .form__row .form__row.form__terms p {
	font-size: 13px;
}

.signUp__form-box .form__row.form__terms p {
	font-size: 13px;
	text-align: center;
	line-height: 1.5;
	margin: 0;
	color: white;
}

.signUp__form-box .form__row.form__terms p a {
	color: #f6ee33;
	font-weight: 500;
	padding: 0 4px;
	text-decoration: underline;
}

.form__phone {
	display: flex;
	position: relative;
}

span.verifyPhone {
	display: flex;
	justify-content: flex-end;
	padding: 8px 0 0;
	font-size: 14px;
	text-transform: capitalize;
	color: #fde723;
}

body.lightMode span.verifyPhone {
	color: #056b6b;
	font-weight: 600;
}

span.verifyPhone.verified {
	cursor: not-allowed;
	color: #16a085;
	text-transform: capitalize;
	font-weight: 700;
}

.login__form-box select,
.signUp__form-box select,
.resetPass__form-box select,
.onboarding__form-box select {
	flex: 1;
	padding: 0px 5px;
	margin: 0 7px 0 0;
	background: #000;
	color: #fff;
	border-color: black;
	border-radius: 10px;
	max-width: 70px;
	min-width: 70px;
	text-align: center;
}

.login__form-box input.error,
.signUp__form-box input.error,
.resetPass__form-box input.error,
.onboarding__form-box input.error {
	border: 2px solid #cf000f;
}

.form__row.form-err {
	text-align: center;
	line-height: 1.5;
	font-size: 14px;
	background: #cf000f;
	color: #fff;
	border-radius: 6px;
	display: none;
	margin: 0 auto;
	padding: 15px 25px;
	width: fit-content;
	min-width: 173px;
}

.otp-field {
	display: flex;
}

.otp-field input {
	width: 51px;
	font-size: 32px;
	padding: 10px 0;
	text-align: center;
	border-radius: 5px;
	margin: 2px;
	border: 1px solid #000;
	/* background: transparent; */
	font-weight: 600;
	color: #000;
	outline: none;
	transition: all 0.1s;
	appearance: none;
	-webkit-appearance: none;
}

.otp-field input:focus {
	border: 1px solid #f6ee33;
	box-shadow: 0 0 1px 1px #f6f03363;
}

.disabled {
	opacity: 0.5;
}

.form__column.email {
	display: none;
}

input[type="number"] {
	appearance: textfield;
	-moz-appearance: textfield;
}

.otp-field__large {
	display: block;
}

.otp-field__large input[type="number"] {
	width: 100%;
	/* max-width: 340px; */
	line-height: 51px;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

.otp__masthead {
	margin: 0 0 25px;
	text-align: center;
}

.otp__header {
	font-size: 28px;
	font-weight: 700;
	color: black;
	margin: 10px 0 30px 60px;
}

.otp__view-box p {
	color: white;
	font-size: 15px;
	font-weight: 500;
	margin: 10px 0 30px 60px;
}

@media screen and (max-height: 700px) {
	.otp__view-box p {
		font-size: 11px;
	}

	.otp__view {
		padding: 0 22px 65px;
	}
}

.otp__view-box p span {
	font-size: 16px;
	padding: 10px 0 0;
	color: white;
	font-weight: 500;
	display: inline-block;
	position: relative;
}

.otp__container {
	margin: 0 0 25px;
}

.otp__view-box p span.otp__email-value:after {
	content: "";
	position: absolute;
	width: 88%;
	height: 1px;
	background: #9b8f8f;
	bottom: -3px;
	right: 0;
}

.otp__resend {
	font-size: 16px;
	color: white;
	cursor: pointer;
	/* margin: 0 0 30px 65px; */
	margin-bottom: 15px;
}

.otp__resend span {
	font-weight: 700;
	padding: 0 0 0 5px;
}

.otp__resend.disabled {
	opacity: 1;
	cursor: not-allowed;
}

span.otp__resend_in {
	padding: 0;
}

.reset__view p.reset__subTitle {
	margin: -20px 0 30px;
	font-size: 14px;
	line-height: 1.5;
	color: black;
}

span.otp__email-edit svg {
	width: 13px;
	height: 13px;
}

.otp__view-box p span.otp__email-edit {
	padding: 0 0 0 5px;
	position: static;
	cursor: pointer;
}

.otp__view .form-err {
	margin: 0 auto 20px;
}

.login__form-box .form__row.form__submit button svg,
.otp__view .form__row.form__submit button svg,
.resetPass__form-box .form__row.form__submit button svg,
.signUp__form-box .form__row.form__submit button svg,
.onboarding__form-box .form__row.form__submit button svg {
	position: absolute;
	width: 40px;
	height: 40px;
	right: 10px;
	top: 0;
	bottom: 0;
	background: white !important;
	border-radius: 50%;
}

.login__form-box .form__row.form__submit button svg path,
.otp__view .form__row.form__submit button svg path,
.resetPass__form-box .form__row.form__submit button svg path,
.signUp__form-box .form__row.form__submit button svg path,
.onboarding__form-box .form__row.form__submit button svg path {
	fill: black;
}

.strength {
	height: 0px;
	width: 100%;
	background: #ccc;
	margin-top: -7px;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	overflow: hidden;
	transition: height 0.3s;
}

.strength span {
	width: 0px;
	height: 7px;
	display: block;
	transition: width 0.3s;
}

.password__guide h6 {
	font-size: 13px;
	font-weight: 500;
	line-height: 1.5;
	margin: 0;
}

.password__guide {
	margin: 20px 0 0;
	color: white;
	/* display: none; */
}

.password__guide ul {
	margin: 5px 0 0;
}

.password__guide ul li {
	font-size: 12px;
	line-height: 20px;
}

.countryCodeOverlay {
	position: absolute;
	left: 0;
	padding: 0px 10px;
	margin: 0 7px 0 0;
	background: #000;
	color: #fff;
	top: 0;
	border-radius: 10px;
	height: 55px;
	line-height: 55px;
	display: flex;
	width: 70px;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
}

.countryCodeOverlay svg {
	width: 12px;
}

.countryCodeOverlay svg path {
	fill: white;
}

body button.firebaseui-idp-button.mdl-button.mdl-js-button.mdl-button--raised.firebaseui-idp-google.firebaseui-id-idp-button,
.login__google-ios {
	width: 100%;
	max-width: 100%;
	box-shadow: none;
	border: 1px solid #000;
	border-radius: 5px;
	padding: 0 20px;
	height: 50px;
	color: #000;
}

body button.firebaseui-idp-button.mdl-button.mdl-js-button.mdl-button--raised.firebaseui-idp-facebook.firebaseui-id-idp-button,
.login__facebook-ios {
	width: 100%;
	display: block;
	max-width: 100%;
	height: 50px;
}

body .firebaseui-card-content {
	padding: 0;
}

body .firebaseui-idp-google>.firebaseui-idp-text {
	color: #000;
	font-weight: 500;
}

.login__social__button {
	height: 50px;
	line-height: 50px;
	margin: 15px 0 0;
	font-weight: 400;
	border-radius: 6px;
	padding: 0 16px;
	border: 1px solid;
	cursor: pointer;
	border: 1px solid;
	cursor: pointer;
	font-style: italic;
	-webkit-appearance: none;
	appearance: none;
	background: white;
}

.login__facebook-ios,
.login__facebook-android,
.login__facebook-android {
	background: #4267b2;
	color: #fff;
	border: 1px solid #4267b2;
}

.login__apple-ios,
.login__apple-android {
	background: #000;
	color: #fff;
}

.login__apple-ios,
.login__apple-android {
	background: #000;
	color: #fff;
}

.login__social__button i {
	padding: 0 10px 0 0;
}

/*--------------- Onboarding Page ----------------*/

div#secondary .secondary__tab.onboardingBody,
div#secondary .secondary__tab.onboardingBody2 {
	/* height: calc(100vh - 70px); */
	z-index: 13;
	border-radius: 0;
}

div#secondary .secondary__tab.onboardingBody .drawerBody,
div#secondary .secondary__tab.onboardingBody .drawerHeader {
	top: 0;
	height: inherit;
}

.onboardingBody .drawerHeader {
	display: none;
}

.onboarding__page {
	padding: 0 35px;
	margin-top: 50px;
}

.onboarding__form-box {
	padding: 0 0 50px;
}

.onboarding__page-title h4 {
	margin: 20px 0 8px;
	font-size: 19px;
	font-weight: 600;
	color: #bbb;
}

.onboarding__page-title {
	margin: 0 0 30px;
}

.form__profile-pic-box__upload label,
.edit__profile-pic-box__upload label,
.form__profile-pic-box__img,
.checkbox-item,
.form__row label,
.form__checkbox-view__more,
.onboarding__form-box .form__row.form__submit button,
.profile-pic-box__upload label {
	cursor: pointer;
}

.form__profile-pic-box {
	position: relative;
	text-align: center;
}

.form__profile-pic-box__img {
	width: 133px;
	height: 133px;
	margin: auto;
	line-height: 133px;
	border-radius: 50%;
	background: #ccc;
	position: relative;
}

.form__profile-pic-box__img img {
	width: inherit;
	height: inherit;
	object-fit: cover;
	border-radius: inherit;
	object-position: center;
}

.form__profile-pic-box__img svg {
	width: 75px;
	margin: 25px 0;
}

.form__profile-pic-box__img svg path {
	fill: white;
	stroke: #919191;
}

.form__profile-pic-box__upload input,
.edit__profile-pic-box__upload input,
.profile-pic-box__upload input {
	display: none;
}

.form__profile-pic-box__upload label {
	position: absolute;
	bottom: 0;
	height: 40px;
	left: 0;
	width: 40px;
	background: #b5b5b5;
	border-radius: 50%;
}

.form__profile-pic-box__upload label svg,
.edit__profile-pic-box__upload label svg,
.profile-pic-box__upload label svg {
	width: 20px;
	margin: 0;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	bottom: 0;
	top: 0;
}

.form__profile-pic-box__upload label svg path,
.edit__profile-pic-box__upload label svg path,
.profile-pic-box__upload label svg path {
	fill: black;
	stroke: initial;
}

.profile-pic-box__upload label {
	position: absolute;
	backdrop-filter: 0;
	height: 30px;
	width: 30px;
	border-radius: 50%;
	background: rgb(238 228 228 / 32%);
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
}

.form__checkbox.checkbox__type {
	margin: 0 0 30px;
	display: flex;
	gap: 0 15px;
}

.form__checkbox.checkbox__type svg path {
	fill: #fff;
}

.form__checkbox.checkbox__type .checked svg path {
	fill: initial;
}

#onboarding__form .form__checkbox .checkbox-item {
	padding: 0 15px;
}

#onboarding__form .form__checkbox .checkbox-item svg {
	margin: 0 10px 0 0;
}

.form__checkbox .checkbox-item {
	height: 55px;
	margin: 0 0 13px;
	border: 1px solid #bbb;
	border-radius: 10px;
	font-size: 18px;
	padding: 0 30px;
	color: #bbb;
}

.form__checkbox .checkbox-item svg,
.form__checkbox .checkbox-item img,
.editGender__checkbox .checkbox-item img {
	max-width: 28px;
	max-height: 35px;
	vertical-align: middle;
	margin: 0 20px 0 0px;
}

.form__checkbox .checkbox-item input,
.editGender__checkbox .checkbox-item input,
.editInterest__checkbox.checkbox__interests input {
	display: none;
}

.form__checkbox .checkbox-item label {
	font-size: 14px;
	color: #bbb;
	height: inherit;
	padding: initial;
	line-height: 55px;
	font-weight: 500;
}

.form__checkbox .checkbox-item.selected,
.form__checkbox .checkbox-item.checked,
.editGender__checkbox .checkbox-item.checked,
.editInterest__checkbox .checkbox-item.checked {
	border: 1px solid #fde723;
	background: linear-gradient(45deg, #fff 0%, #fff 30%, #fde723 70%, #fef49d 100%);
}

.form__checkbox .checkbox-item label[for="onboarding__type-traveller"] svg {
	max-width: 26px;
}

.form__checkbox.checkbox__gender,
.form__checkbox.checkbox__interests,
.form__checkbox.checkbox__services,
.editGender__checkbox.checkbox__gender,
.editInterest__checkbox.checkbox__interests {
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: flex-start;
	flex-wrap: wrap;
	padding: 10px 0 0;
}

.form__checkbox.form__checkbox.checkbox__gender,
.editProfile.editGender__checkbox.checkbox__gender {
	margin: 0 0 25px;
}

.form__checkbox.checkbox__gender .checkbox-item,
.form__checkbox.checkbox__interests .checkbox-item,
.editGender__checkbox.checkbox__gender .checkbox-item,
.editInterest__checkbox.checkbox__interests .checkbox-item {
	padding: 0px 10px;
	min-height: 40px;
	margin: 0 10px 10px 0;
	height: auto;
}

.form__checkbox.checkbox__gender .checkbox-item svg,
.form__checkbox.checkbox__interests .checkbox-item svg,
.editGender__checkbox.checkbox__interests .checkbox-item svg {
	max-width: 16px;
	max-height: 16px;
	margin: 0 4px 0 0;
}

.form__checkbox.checkbox__gender .checkbox-item svg path {
	fill: #bbb;
}

.form__checkbox.checkbox__gender .checkbox-item.checked svg path {
	fill: #000;
}

.form__checkbox.checkbox__gender .checkbox-item label,
.form__checkbox.checkbox__interests .checkbox-item label,
.editGender__checkbox.checkbox__gender .checkbox-item label,
.editInterest__checkbox.checkbox__interests .checkbox-item label {
	line-height: 40px;
	font-size: 12px;
	cursor: pointer;
}

.form__location {
	position: relative;
}

.form__location input {
	border: 0;
	border-bottom: 1px solid #000;
	height: 45px;
}

.form__location span {
	position: absolute;
	right: 8px;
	bottom: 0;
	top: 0;
	margin: auto;
	width: 15px;
	height: 15px;
}

.form__location span svg {
	max-width: 15px;
	max-height: 15px;
}

.form__location span svg path {
	fill: black;
}

.onboarding__form-box .form__location {
	margin: 0 0 25px;
}

.form__checkbox.checkbox__interests .checkbox-item,
.editInterest__checkbox.checkbox__interests .checkbox-item {
	text-align: center;
	min-height: 30px;
	padding: 0 14px;
	margin: 0 10px 8px 0;
}

.form__checkbox.checkbox__interests .checkbox-item label,
.editInterest__checkbox.checkbox__interests .checkbox-item label {
	line-height: 30px;
	font-size: 12px;
}

.form__checkbox.checkbox__interests,
.editInterest__checkbox.checkbox__interests {
	max-height: 130px;
	overflow: hidden;
}

.editInterest__checkbox.checkbox__interests {
	margin: 20px 0 0;
}

.form__checkbox.checkbox__interests.open,
.editInterest__checkbox.checkbox__interests.open {
	max-height: initial;
	overflow: initial;
}

.form__checkbox-view__more {
	display: flex;
	text-align: right;
	justify-content: flex-end;
	font-size: 13px;
	font-weight: 700;
	margin: 7px 0 0;
	color: #bbb;
}

body.lightMode .form__checkbox-view__more {
	color: #056b6b;
}

span.verifyPhone svg {
	width: 20px;
	height: 20px;
	margin: 0 0 0 10px !important;
}

body.lightMode span.verifyPhone svg path {
	fill: black;
}

.form__row.form__row-services {
	margin: 0 0 35px;
	display: none;
}

.checkbox__services .checkbox-item {
	padding: 0 15px;
	margin: 0 10px 13px 0;
	height: 45px;
}

.checkbox__services .checkbox-item img {
	margin: 0 8px 0 0;
	max-width: 25px;
	max-height: 25px;
}

.checkbox__services .checkbox-item label {
	font-size: 12px;
	line-height: 45px;
}

.form__row.form__hidden {
	display: none;
}

/*-------------- Locations Drawer --------------*/

.location__search,
.influencer__search {
	background: #15151f;
	margin: -15px 0 0;
	height: 75px;
	border-bottom: 1px solid #363642;
	padding: 0 16px;
	position: relative;
}

body.lightMode .location__search,
body.lightMode .influencer__search {
	background-color: #fdfdfd;
	border-bottom: 0px;
	margin: -5px 0 0;
}

.location__search span svg,
.influencer__search span svg {
	max-width: 17px;
	max-height: 17px;
	vertical-align: top;
}

.location__search span svg path {
	fill: #000;
}

input#location__search,
input#influencer__search {
	width: 100%;
	height: 50px;
	margin: 12.5px 0;
	border: 0;
	border-radius: 10px;
	background: #58586459;
	padding: 0 50px 0 25px;
	color: #fff;
	outline: 0;
}

body.lightMode input#location__search,
body.lightMode input#influencer__search {
	background-color: #f5f5f5;
	color: #111;
}

.location__search span,
.influencer__search span {
	bottom: 0;
	margin: auto;
	position: absolute;
	right: 25px;
	top: 0px;
	height: 34px;
	width: 34px;
	border-radius: 7px;
	border: 0;
	background: #f6ee33;
	padding: 0;
	text-align: center;
	padding: 8.5px 0;
}

.location__list {
	padding: 20px 16px 50px;
}

.conatiner__suggested {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 12px;
	padding: 14px 16px;
	border: 1px solid #e5e7eb;
	border-radius: 10px;
	margin-bottom: 12px;
	margin-top: 8px;
	background-color: white;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
	transition: all 0.2s ease;
	cursor: pointer;
	font-size: 15px;
}


.location__search span.search__close,
.influencer__search span.search__close {
	cursor: pointer;
}

.search__results-item.no-results {
	color: #b5b5b5;
}

body.lightMode .search__results-item.no-results {
	color: #333;
}

/*---------------- OTP Secondary ----------------*/

div#secondary .secondary__tab.otpBody {
	height: 100vh;
	/* background: #fff; */
	background-image: url("../img/login-bg.jpg") !important;
	background-repeat: no-repeat;
	z-index: 13;
	border-radius: 0;
	overflow: hidden;
	background-size: cover;
}

div#secondary,
.onboardingBody2 {
	width: 80% !important;
}

div#secondary .secondary__tab.otpBody .drawerHeader {
	font-size: 0;
	background: transparent;
	/* display: none; */
}

div#secondary .secondary__tab.otpBody .drawerHeader svg path {
	stroke: #000;
}

.secondary__tab.otpBody .drawerBody .otp__view {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.otp__view .form__row.form__submit button {
	min-width: 250px;
}

/*------------- Popups --------------*/

.popup__master {
	position: fixed;
	top: 0;
	z-index: 13;
	width: 100%;
	left: 0;
	height: 100vh;
	display: none;
}

.popup__mask {
	position: absolute;
	width: inherit;
	height: inherit;
	background: rgba(0, 0, 0, 0.6);
	top: inherit;
	left: inherit;
}

.popup__container {
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	min-height: 350px;
	max-width: 90%;
	max-height: 90%;
	background: #fff;
	z-index: 1;
	border-radius: 20px;
	height: 400px;
	width: 400px;
	display: none;
}

.popup__head {
	height: 52px;
	margin: 0 0 5px;
	padding: 0 16px;
	line-height: 52px;
	display: flex;
	justify-content: space-between;
	background: rgba(253, 231, 35, 0.18);
	border-radius: 20px 20px 0 0;
}

.popup__head-close svg {
	width: 13px;
	height: 13px;
}

.popup__head-title {
	font-size: 13px;
	font-weight: 600;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
}

.popup__head-close,
.completeness__popup-ctas,
.report__box-ctas,
.permissions__box-ctas {
	cursor: pointer;
}

.completeness__popup {
	padding: 0 16px;
	/* max-height: 400px; */
	overflow-y: scroll;
}

.completeness__popup p {
	line-height: 1.4;
	font-size: 14px;
	color: #333;
}

@media screen and (max-width: 380px) {
	.completeness__popup p {
		font-size: 13px;
	}
}

.completeness__popup p b {
	font-weight: 500;
}

.popup__master.popup__master--profileCompleteness .popup__container {
	height: 600px;
}

.completeness__popup ul {
	font-size: 14px;
	padding: 0 0 0 20px;
}

.completeness__popup ul li {
	font-size: 14px;
	padding: 0 0 8px;
	color: #333;
	line-height: 1.4;
}

.completeness__popup-ctas,
.report__box-ctas,
.permissions__box-ctas {
	position: absolute;
	bottom: 0;
	height: 55px;
	display: flex;
	justify-content: space-between;
	width: 100%;
	left: 0;
}

.completeness__popup-ctas div,
.report__box-ctas div,
.permissions__box-ctas div {
	flex: 1;
	text-align: center;
	font-size: 13px;
	background: #bfbfbf;
	font-weight: 600;
	line-height: 55px;
}

.completeness__popup-cancel,
.report__box-cancel,
.permissions__box-cancel {
	border-radius: 0 0 0 20px;
}

body .completeness__popup-complete,
body .report__box-complete,
body .flight__box-apply,
body .permissions__box-complete {
	border-radius: 0 0 20px 0;
	background: #f6ee33;
}

/*------------- Hamburger Menu --------------*/


/*------------- Hamburger Menu --------------*/

.hamburger__menu {
	position: absolute;
	width: 100%;
	height: 100vh;
	left: 0;
	top: 0;
	z-index: 1000;
	display: none;
}

.hamburger__menu-body {
	width: 300px;
	height: 100%;
	background: linear-gradient(135deg, #ffffff 0%, #FFF9CF 100%);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
	z-index: 1;
	position: relative;
	overflow: auto;
	scrollbar-width: none;
	transition: all 0.3s ease;
	animation: slideIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
	border-radius: 0 16px 16px 0;
	color: #333;
}

.hamburger__menu-body::-webkit-scrollbar {
	display: none;
}

@keyframes slideIn {
	from {
		transform: translateX(-100%);
		opacity: 0;
	}

	to {
		transform: translateX(0);
		opacity: 1;
	}
}

.hamburger__menu-header {
	line-height: 70px;
	text-align: left;
	background: linear-gradient(90deg, #15151d 0%, #1a1a29 100%);
	font-size: 22px;
	font-weight: 700;
	color: #fde723;
	text-indent: 24px;
	letter-spacing: 0.5px;
	position: relative;
	overflow: hidden;
}

/* Add a subtle pattern to the header */
.hamburger__menu-header::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.05' fill-rule='evenodd'%3E%3Ccircle cx='3' cy='3' r='3'/%3E%3Ccircle cx='13' cy='13' r='3'/%3E%3C/g%3E%3C/svg%3E");
	z-index: 0;
}

.hamburger__menu-box {
	padding: 15px 0;
}

.hamburger__menu-box ul {
	margin: 0;
	padding: 0;
}

.hamburger__menu-box ul li {
	padding: 0 24px;
	list_style: none;
	line-height: 55px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.04);
	font-size: 15px;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.2s ease;
	position: relative;
	color: #333;
	display: flex;
	align-items: center;
}

.hamburger__menu-box ul li::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 24px;
	width: 0;
	height: 2px;
	background: linear-gradient(90deg, #fde723, transparent);
	transition: width 0.3s ease;
}

.hamburger__menu-box ul li:hover::after {
	width: 70%;
}

.hamburger__menu-box ul li:last-child {
	border: 0;
}

.hamburger__menu-box ul li:hover {
	color: #000;
	background-color: rgba(0, 0, 0, 0.02);
	transform: translateX(5px);
}

.hamburger__menu-box ul li.highlight {
	background: linear-gradient(90deg, #fde723 0%, #ffd700 100%);
	font-weight: 600;
	color: #000;
	padding: 0 24px;
	margin: 15px 10px;
	border-radius: 12px;
	box-shadow: 0 4px 15px rgba(253, 231, 35, 0.25);
	position: relative;
	overflow: hidden;
	transform: none !important;
	line-height: 60px;
	border: none;
	animation: pulse 2s infinite;
}

.hamburger__menu-box ul li.highlight::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(90deg,
			rgba(255, 255, 255, 0) 0%,
			rgba(255, 255, 255, 0.4) 50%,
			rgba(255, 255, 255, 0) 100%);
	transform: translateX(-100%);
	animation: shimmer 2.5s infinite;
}

.hamburger__menu-box ul li.highlight::after {
	display: none;
}

@keyframes shimmer {
	100% {
		transform: translateX(100%);
	}
}

.hamburger__menu-box ul li.highlight.no-mb {
	margin-bottom: 15px;
}

.hamburger__menu-box ul li.highlight:hover {
	background: linear-gradient(90deg, #ffeb3b 0%, #ffd600 100%);
	transform: translateY(-2px) !important;
	box-shadow: 0 8px 20px rgba(253, 231, 35, 0.35);
}

/* Add a crown icon to premium button */
.hamburger__menu-box ul li.highlight::after {
	content: '👑';
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 18px;
	display: block;
	width: auto;
	height: auto;
	background: none;
}

.menu-category {
	display: block;
	text-decoration: none;
	color: inherit;
}

.menu-category h6 {
	padding: 0 24px;
	margin: 0;
	list-style: none;
	line-height: 60px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.04);
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: space-between;
	transition: all 0.2s ease;
	color: #333;
	position: relative;
}

.menu-category h6::before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 4px;
	height: 0;
	background: #fde723;
	transition: height 0.3s ease;
	border-radius: 0 4px 4px 0;
}

.menu-category h6:hover::before {
	height: 70%;
}

.menu-category h6 span {
	transition: transform 0.3s ease;
}

.menu-category h6:hover {
	background-color: rgba(0, 0, 0, 0.02);
	color: #000;
	padding-left: 28px;
}

.menu-category h6:hover span i {
	transform: rotate(-180deg);
}

.sub-menu,
.sub-menu-settings {
	background-color: rgba(0, 0, 0, 0.02);
	overflow: hidden;
	max-height: 0;
	transition: max-height 0.4s cubic-bezier(0, 1, 0, 1);
	border-radius: 8px;
	margin: 0 8px;
}

.menu-category:hover .sub-menu,
.menu-category:hover .sub-menu-settings {
	max-height: 1000px;
	transition: max-height 0.6s ease-in-out;
}

.sub-menu li,
.sub-menu-settings li {
	padding-left: 40px !important;
	font-size: 14px !important;
	line-height: 45px !important;
	border-bottom: 1px solid rgba(0, 0, 0, 0.02) !important;
}

.sub-menu li:last-child,
.sub-menu-settings li:last-child {
	border-bottom: none !important;
}

.hamburger__menu-mask {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	left: 0;
	top: 0;
	backdrop-filter: blur(4px);
	opacity: 0;
	animation: fadeIn 0.3s ease forwards;
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

/* Settings styles */
.settings_box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 15px;
}

.settings_labels {
	font-size: 14px;
	font-weight: 500;
	margin: 0;
}

.day-night_toggle_box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 10px 0;
}

.day-night_switch_box {
	position: relative;
}

.day_night_switch {
	opacity: 0;
	width: 0;
	height: 0;
}

.day_night_switch-label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	width: 52px;
	height: 28px;
	background: #e9ecef;
	border-radius: 100px;
	position: relative;
	transition: background-color 0.3s;
	padding: 0 6px;
	box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
}

.day_night_switch-label .fa-sun {
	color: #f1c40f;
	font-size: 12px;
	z-index: 1;
}

.day_night_switch-label .fa-moon {
	color: #7f8c8d;
	font-size: 12px;
	z-index: 1;
}

.day_night_checkbox-ball {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 22px;
	height: 22px;
	background: #fff;
	border-radius: 50%;
	transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.day_night_switch:checked+.day_night_switch-label {
	background: #3498db;
}

.day_night_switch:checked+.day_night_switch-label .day_night_checkbox-ball {
	transform: translateX(24px);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

.travel-store {
	color: inherit;
	text-decoration: none;
	display: block;
	position: relative;
	overflow: hidden;
}

.travel-store::after {
	content: '🛍️';
	position: absolute;
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 16px;
}

/* Version number styling */
.hamburger__menu-box ul li:last-child {
	color: rgba(0, 0, 0, 0.4);
	font-size: 12px;
	text-align: center;
	padding-top: 20px;
	line-height: normal;
	justify-content: center;
}

/* Add subtle animations to icons */
.fa-solid {
	transition: transform 0.3s ease;
}

.menu-category:hover .fa-solid {
	transform: rotate(-180deg);
}

/* Add a subtle pulsing effect to the premium button */
@keyframes pulse {
	0% {
		box-shadow: 0 4px 15px rgba(253, 231, 35, 0.25);
	}

	50% {
		box-shadow: 0 4px 25px rgba(253, 231, 35, 0.4);
	}

	100% {
		box-shadow: 0 4px 15px rgba(253, 231, 35, 0.25);
	}
}

/* Add a subtle bounce effect when the menu opens */
@keyframes menuBounce {
	0% {
		transform: scale(0.8);
		opacity: 0;
	}

	70% {
		transform: scale(1.05);
	}

	100% {
		transform: scale(1);
		opacity: 1;
	}
}

.hamburger__menu-box {
	animation: menuBounce 0.5s ease-out forwards;
}

/* Add a subtle hover effect for menu items */
.hamburger__menu-box ul li:not(.highlight)::before {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: 0;
	background: linear-gradient(90deg, rgba(253, 231, 35, 0.1), transparent);
	transition: width 0.3s ease;
}

.hamburger__menu-box ul li:not(.highlight):hover::before {
	width: 100%;
}


/*----------------- Add Post Page -----------------*/

div#main__addPost {
	position: absolute;
	top: 0;
	z-index: 11;
	width: 100%;
	background: #1e1e2d;
	height: 100vh;
	border-radius: 10px 10px 0 0;
}

.addPost__header {
	height: 50px;
	line-height: 50px;
	padding: 0 20px;
	display: flex;
	justify-content: space-between;
	color: #fff;
	background: #15151f;
	border-radius: 10px 10px 0 0;
}

body.lightMode .addPost__header {
	background: rgba(255, 255, 255, 0.78);
	backdrop-filter: blur(25px);
	color: #000;
}

.addPost__page svg {
	width: 15px;
	height: 15px;
}

/* .addPost__page svg path {
	fill: #fff;
} */

.cat_date svg path,
.traveler__type svg path {
	fill: #fff;
}

.addPost__header-left svg {
	width: 16px;
	height: 16px;
	vertical-align: initial;
	margin: 0 11px 0 0;
}

.addPost__tab-item,
.form__section-beige,
.form__search-bar-icon,
.form__privacy select,
.addPost__post,
.addPost__find-tabs ul li,
span.instructions,
.addPost__header-right {
	cursor: pointer;
}

.addPost__header-left {
	font-size: 16px;
	font-weight: 600;
}

.addPost__post {
	/* height: 24px; */
	background: #fde723;
	/* padding: 0 20px; */
	border-radius: 10px;
	margin: 13px 0;
	width: 69px;
	line-height: 24px;
	font-size: 12px;
	color: #000;
	text-align: center;
	font-weight: 600;
	text-transform: capitalize;
	background: linear-gradient(45deg, #fff 0%, #fff 30%, #fde723 70%, #fef49d 100%);
	/* border: .1px solid #1e1e2d;
}

button.addPost__post {
    text-align: center;
    /* height: 40px; */
	border: .1px solid #1e1e2d;
	outline: 0;
	width: 150px;
	/* margin: -25px 0 0; */
	font-size: 15px;
}

button.addPost__post_discard {
	text-align: center;
	/* height: 40px; */
	border: 0;
	outline: 0;
	width: 150px;
	/* margin: -25px 10px; */
	font-size: 15px;
	background: #FDE723;
	border-radius: 10px;
	font-weight: 600;
	text-transform: capitalize;
	line-height: 24px;
	color: #000;
	display: none;
	background: linear-gradient(45deg, #fff 0%, #fff 30%, #fde723 70%, #fef49d 100%);
	border: .1px solid #1e1e2d;
}

.addPost__tabs {
	padding: 0 16px;
	height: 80px;
	background: #15151f;
	box-shadow: 0px 3px 7px #15151fad;
	backdrop-filter: blur(25px);
	display: none;
	width: 100%;
}

body.lightMode .addPost__tabs {
	border-bottom: 0.25px solid rgba(245, 245, 245, 0.25);
	box-shadow: 0px 4px 3px 0px rgba(0, 0, 0, 0.05);
	background: rgba(255, 255, 255, 0.78);
	backdrop-filter: blur(25px);
}

.addPost__item {
	padding: 0 0 10rem;
	height: 90vh;
	overflow-y: scroll;
	display: none;
	display: flex;
	flex-direction: column;
}

.addPost__share.addPost__item {
	display: none;
}

@media screen and (min-width: 720px) {
	.addPost__item {
		height: 98vh
	}

}

.addPost__item.active {
	display: block;
}

.addPost__tab-item {
	flex: 1;
	text-align: center;
	color: #bbb;
	font-size: 14px;
	font-weight: 500;

}

.addPost__tab-item svg path {
	stroke: #fff;
	fill: none;
}

body.lightMode .addPost__tab-item {
	color: #707070;
}

.addPost__tab-item svg {
	display: block;
	width: 20px;
	height: 20px;
	margin: 15px auto 8px;
}

body.lightMode .addPost__tab-item svg path {
	stroke: #707070;
}

body.lightMode .addPost__tab-item.active svg path {
	stroke: #111;
}

.addPost__tab-item.active {
	position: relative;
	color: yellow;
	font-weight: 700;
	font-size: 16px;

}

.addPost__tab-item.active svg path {
	stroke: yellow;
	fill: none;
}

body.lightMode .addPost__tab-item.active {
	color: #111;
}

.addPost__tab-item.active:after {
	content: "";
	bottom: 0;
	height: 3px;
	width: 100%;
	left: 0;
	position: absolute;
	background: #fde723;
	border-radius: 10px;
}

.addPost__item .form__section {
	padding: 0px 20px 20px;
}

.addPost__item .form__row {
	display: flex;
	justify-content: space-around;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: flex-start;
	margin: 0 0 18px;
}

.form__row.form__upload {
	margin: 0;
}

.addPost__item .form__row:last-child {
	margin: 0;
}

.addPost__item .form__column {
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	gap: 20px;
}

.addPost__item .form__section-beige {
	background: rgb(255 255 255 / 5%);
}

body.lightMode .addPost__item .form__section-beige {
	background: rgb(252 255 0 / 15%);
}

.addPost__item .form__upload .form__column {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	align-items: center;
}

.addPost__item .form__upload-left {
	color: #61FFFF;
	flex: 3;
	font-weight: 600;
}

body.lightMode .form__upload-left {
	color: #000;
}

.addPost__item .form__upload-right {
	display: flex;
	justify-content: flex-end;
}

.form__upload-right input {
	display: none;
}

.form__upload-left span {
	display: block;
	font-size: 10px;
	font-weight: 400;
	margin: 5px 0 0;
	color: #ddd;
}

body.lightMode .form__upload-left span {
	color: #444;
}

.form__upload-btn {
	width: 32px;
	height: 32px;
	background: #fde723;
	border-radius: 50%;
	text-align: center;
	margin: 0 15px 0 0;
}

.form__upload-btn svg {
	width: 14px;
	height: 14px;
	margin: 8px 0;
}

.form__upload-btn svg path {
	stroke: #000;
}

.addPost__item .form__row label {
	font-size: 14px;
	font-weight: 600;
	color: rgb(97, 255, 255);
	margin: 0 0 16px;
	display: block;
	line-height: 1.5;
}

body.lightMode .addPost__item .form__row label {
	color: #056b6b;
}

#addPost__find-influencers .addPost__item .form__row label {
	color: #fff;
}

.addPost__item .form__row input {
	height: 45px;
	background: transparent;
	width: 100%;
	border: 1px solid #524e4e;
	border-radius: 10px;
	padding: 0 16px;
	font-size: 12px;
	color: #eee;
}

.addPost__item .form__row input:focus {
	box-shadow: 0 0 10px #719ECE;
	transition: box-shadow 0.5s ease-in-out;
	outline: none;
}

body.lightMode .addPost__item .form__row input {
	color: #aaa;
}

body.lightMode .form__row input {
	border-color: #e5e5e5;
	outline: 0;
}

.form__row input.err {
	border: 2px solid #cf000f;
}

body.lightMode .form__row input.err {
	border: 2px solid #cf000f;
}

.addPost__item .form__row textarea {
	width: 100%;
	border: 1px solid #524e4e;
	background: transparent;
	border-radius: 10px;
	padding: 20px 16px;
	font-family: inherit;
	font-size: 12px;
	color: #eee;
	resize: none;
	min-height: 115px;
	overflow-y: auto;
}

.addPost__item .form__row textarea:focus {
	border: 1px solid #fde723;
	outline: #fde723;
}

body.lightMode .addPost__item .form__row input:focus,
body.lightMode .addPost__item .form__row textarea:focus {
	border: 1px solid #fde723;
	outline: #fde723;
}

.addPost__item .form__row input::placeholder,
.addPost__item .form__row textarea::placeholder {
	color: #aaa;
	font-size: 13px;
}

.addPost__item .form__section .form__row:last-child input {
	margin: 0;
}

.form__section-lime {
	background: #15151f;
}

body.lightMode .form__section-lime {
	background-color: #fdfbe7;
}

.addPost__item .form__tags .form__row-head label {
	color: #e5e5e5;
	font-size: 13px;
}

::-webkit-calendar-picker-indicator {
	filter: invert(1);
}

span.form__row-buddies__tagged {
	font-size: 10px;
	color: #bbb;
	display: inline;
}

.form__row-head {
	display: flex;
	justify-content: space-between;
}

span.form__row-buddies__tagged span {
	color: #fde723;
	font-weight: 700;
	padding: 0 0 0 5px;
}

.form__search-bar {
	position: relative;
}

.form__search-bar input {
	padding: 0 45px 0 16px;
	margin: 0;
}

.form__search-bar .form__search-bar-icon {
	position: absolute;
	right: 8px;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 32px;
	height: 32px;
	border-radius: 7px;
	text-align: center;
	background: #fde723;
	border: 0;
}

.form__search-bar-icon svg {
	width: 16px;
	height: 16px;
	text-align: center;
	margin: 8px 0;
}

.form__search-bar-icon svg path {
	stroke: #000;
}

.addPost__item .form__social label {
	color: #e5e5e5;
	font-size: 13px;
}

.form__social-item {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: nowrap;
	font-size: 12px;
	color: #ccc;
	margin: 0 0 10px;
}

.form__social-item:last-child {
	margin: 0;
}

.form__social-item-left {
	vertical-align: middle;
	font-weight: 600;
}

.form__social-item-left svg {
	width: 20px;
	height: 20px;
	margin: 0;
	vertical-align: middle;
	margin: 0 8px 0 0;
}

.form__social-item-user {
	position: relative;
	width: 100%;
	text-align: right;
	font-weight: 100;
	font-size: 11px;
}

.form__social-item-right {
	flex: 1;
	display: flex;
	justify-content: flex-end;
	position: relative;
}

.form__social-item-left {
	vertical-align: middle;
	font-weight: 600;
	flex: 1;
}

body .addPost__item .form__row label.switch {
	width: 32.5px;
	height: 18px;
	display: inline-block;
	position: relative;
	vertical-align: middle;
	margin: 0 0 0 15px;
}

body .addPost__item .form__row label.switch input {
	display: none;
}

.form__social-item:first-child svg path {
	stroke: initial;
}

.form__social-item:first-child svg {
	background: white;
	border-radius: 50%;
}

.form__column-flex {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	flex-direction: row;
	flex-wrap: nowrap;
}

.addPost__item .form__privacy.form__row label {
	color: #fff;
	margin: 0 0 3px;
}

.form__privacy.form__row .form__column-left span {
	color: #bbb;
	font-size: 11px;
}

body.lightMode .form__privacy.form__row .form__column-left span {
	color: #3d3d3d;
}

.form__privacy select {
	border: 0;
	background: 0;
	color: #bbb;
	font-size: 12px;
	font-family: inherit;
	outline: 0;
}

body.lightMode .form__privacy select {
	color: #2d2d2d;
}

.form__privacy {
	display: none !important;
}


.hanging__name {
	position: relative;
}

.hanging__name span {
	position: absolute;
	top: -6px;
	left: 10px;
	font-size: 12px;
	background: #1e1e2d;
	padding: 0 7px;
	color: #61FFFF;
}

body.lightMode .hanging__name span {
	background: #FDFDFD;
	color: #000;
	font-weight: 600;
	font-size: 13px;
}

.addPost__find-tabs {
	padding: 16px;
}

.addPost__find-tabs ul {
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	align-content: center;
	flex-direction: row;
}

.addPost__find-tabs ul li {
	text-align: center;
	list-style: none;
	flex: 1;
	border: 1px solid #524e4e;
	line-height: 30px;
	border-radius: 4px;
	color: #eee;
	font-size: 14.5px;
	text-transform: uppercase;
	font-weight: 500;
}

body.lightMode .addPost__find-tabs ul li {
	color: #707070;
	border-color: #c1c1c1;
}

.addPost__find-tabs ul li:nth-child(2) {
	margin: 0 10px;
}

.addPost__find-tabs ul li.active {
	background: #f6ee33;
	border-color: #f6ee33;
	color: #111;
	font-weight: 600;
}

body.lightMode .addPost__find-tabs ul li.active {
	font-weight: 700;
	color: #000;
	border: none;
}

.form__section .form__row:last-child textarea {
	margin: 0px;
}

body.lightMode .form__section .form__row textarea {
	border-color: #e5e5e5;
}

.form__section.form__section-lime label {
	color: #61FFFF;
}

.addPost__item .form__checkbox.checkbox__gender {
	margin: 0;
	padding: 0;
}

.addPost__item .addPost__find-item .checkbox-item label {
	margin: 0;
	color: #eee;
	font-weight: 400;
	font-size: 12px;
}

body.lightMode .addPost__item .addPost__find-item .checkbox-item label {
	color: #000;
	font-weight: 500;
}

.addPost__item .addPost__find-item .checkbox-item {
	border-color: #524e4e;
	margin: 0 8px 8px 0;
	padding: 0 8px;
}

.addPost__item .addPost__find-item .checkbox-item label svg path {
	fill: white;
	stroke: initial;
}

body.lightMode .addPost__item .addPost__find-item .checkbox-item label svg path {
	fill: #707070;
}

body.lightMode .addPost__item .addPost__find-item .checkbox-item.checked label svg path {
	fill: #000;
}

.addPost__item .addPost__find-item .checkbox-item.checked label {
	color: #000;
	font-weight: 500;
}

/* .addPost__item .addPost__find-item .checkbox-item.checked {
	border-color: #fde723;
} */

.addPost__item .addPost__find-item .checkbox-item.checked svg path {
	fill: #000;
}

.addPost__find-item {
	display: none;
}

.addPost__find-item.active {
	display: block;
}

.addPost__page span.character_count {
	position: static;
}

span.instructions {
	position: static;
	color: #85ade9;
	font-weight: 600;
}

body.lightMode span.instructions {
	color: #056b6b;
}

.instructions__popup {
	font-size: 14px;
	padding: 15px 16px;
	line-height: 1.4;
}

.popup__master.popup__master--addFindBuddyInstructions .popup__container {
	height: 750px;
	max-height: 85vh;
}

.popup__master--addFindMeetupInstructions .popup__container {
	height: 500px;
}

.popup__master.popup__master--addFindBuddyInstructions .popup__container .popup__body {
	overflow-y: scroll;
	max-height: calc(100% - 85px);
}

.instructions__popup p {
	margin: 0 0 15px;
}

.instructions__popup h5 {
	font-size: 16px;
	margin: 0 0 10px;
	color: #056b6b;
}

.instructions__popup ol,
.instructions__popup ul {
	margin: 0 0 20px;
}

.instructions__popup ol li,
.instructions__popup ul li {
	font-size: 13px;
	padding-bottom: 10px;
}

div#upload__preview {
	display: flex;
	justify-content: flex-start;
	align-items: flex-end;
	flex-wrap: wrap;
	flex-direction: row;
}

div#upload__preview img {
	flex: 1;
	max-width: 100%;
	height: inherit;
	object-fit: cover;
}

.upload__preview-item {
	max-width: 30%;
	margin: 0 1.5% 3%;
	position: relative;
	height: 120px;
}

div#upload__preview .upload__preview-item:first-child {
	margin: 20px 1.5% 3%;
}

.upload__preview-item-close {
	position: absolute;
	right: -10px;
	top: -10px;
	text-align: center;
	width: 20px;
	height: 20px;
	background: #cf000f;
	border-radius: 50%;
	line-height: 16px;
}

.upload__preview-item-close svg {
	width: 8px;
	height: 8px;
	margin: 0;
}

.upload__preview-item-close svg path {
	fill: white;
}

.popup__master-mediaPopup .popup__container {
	height: 120px;
	min-height: 150px;
}

.addPostMedia__box {
	padding: 15px 25px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	align-content: center;
}

.addPostMedia__box-item {
	flex: 1;
	text-align: center;
}

.addPostMedia__box-item svg {
	width: 25px;
	height: 25px;
	display: block;
	margin: 0 auto 10px;
}

.relative {
	position: relative;
}

.filepond--panel-root {
	background-color: transparent !important;
	/* border: 1px dashed #bbb; */
}

.filepond--drop-label {
	padding: 60px 0 20px;
}

.filepond--drop-label label {
	text-align: left;
	width: 100%;
	padding: 0.5em 16px !important;
	font-size: 11px;
	color: #8d8d8d;
	font-family: "Montserrat", sans-serif !important;
}

.form__row.form__upload {
	margin: 0;
	position: absolute;
	top: 24px;
	width: calc(100% - 24px);
	padding: 0 16px;
}

div#app.guestUser input#share__upload {
	display: none;
}

div#app.guestUser .form__row.form__upload {
	position: static;
	padding: 0 0 16px;
	margin: 0;
	width: 100%;
}

.filepond--root {
	margin-bottom: 0;
}



@media screen and (max-width: 380px) {
	.onboarding__page {
		padding: 0 25px;
	}

	.form__checkbox.checkbox__gender .checkbox-item,
	.editGender__checkbox.checkbox__gender .checkbox-item {
		min-height: 35px;
		padding: 0 6px;
	}

	.addPost__item .addPost__find-item .checkbox-item label {
		font-size: 11px;
	}

	.premium_content-info p {
		font-size: 10px;
	}

	.form__checkbox.checkbox__gender .checkbox-item label {
		line-height: 35px;
	}

	/*------------- Premium ---------------- */

	.premium__package-item__price-new span {
		font-size: 11px;
	}

	.premium__package-item__price-new {
		font-size: 8px;
	}

	.premium__button__text svg {
		width: 20px;
		vertical-align: inherit;
		height: auto;
		margin: 0 0 -1px 5px;
	}

	.premium__button {
		font-size: 12px;
	}

	/* -------- Profile --------- */

	.profile__head-right {
		flex: 3.5;
	}

	/*--------- hamurger menu left --------- */

	.hamburger__menu-box ul li {
		line-height: 40px;
		font-size: 11px;
	}
}

/* @media screen and (max-width: 768px) { */
.form__row.form__upload {
	padding: 0;
}

.filepond--drop-label {
	padding: 40px 0 0;
}

.filepond--drop-label label {
	font-size: 0 !important;
}

.upload__overlay-mobile {
	position: absolute;
	content: "";
	width: 20%;
	height: 70%;
	right: 0;
	z-index: 1;
	display: block;
}

/* } */

/*------------ Toggle Switch ------------*/
.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.slider:before {
	position: absolute;
	content: "";
	height: 12px;
	width: 12px;
	left: 4px;
	bottom: 0px;
	background-color: #2c2c2c;
	-webkit-transition: 0.4s;
	transition: 0.4s;
	top: -0.5px;
	margin: auto;
}

input:checked+.slider {
	background-color: #fde723;
}

input:focus+.slider {
	box-shadow: 0 0 1px #fde723;
}

input:checked+.slider:before {
	-webkit-transform: translateX(12px);
	-ms-transform: translateX(12px);
	transform: translateX(12px);
}

/* Rounded sliders */
.slider.round {
	border-radius: 34px;
	width: 32.5px;
	height: 26px;
}

.slider.round:before {
	border-radius: 50%;
}

/*------------ Pace ------------*/

.pace {
	-webkit-pointer-events: none;
	pointer-events: none;

	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	z-index: 999;
	position: relative;
}

.pace-inactive {
	display: none;
}

.pace .pace-progress {
	background: #fde723;
	position: fixed;
	z-index: 2000;
	top: 0;
	right: 100%;
	width: 100%;
	height: 2px;
}

.pace-activity {
	/* background: url("https://firebasestorage.googleapis.com/v0/b/travelbuddy-174317.appspot.com/o/web-view%2Fsplash_screen.png?alt=media&token=cb1dacb9-1c40-4aba-96a4-7d55e7f61fb4"); */
	position: fixed;
	width: 420px;
	height: 100%;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	background-size: contain;
	background-position: bottom;
	background-repeat: no-repeat;
	background-color: #171717;
}

/*--------------- Welcome Screens ---------------*/

.welcome_screens {
	position: fixed;
	width: 420px;
	overflow: hidden;
	height: 100vh;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 998;
	background: #171717;
	max-width: 100%;
}

.welcome_screens .swiper-slide img {
	height: 100%;
	max-height: 100%;
}

.swiper-button-next {
	top: initial;
	bottom: 50px;
	width: 85%;
	left: 0;
	right: 0;
	margin: auto;
	background: #f6ee33;
	height: 57px;
	border-radius: 25px;
}

.swiper-button-next:after {
	content: "";
	background-image: url(../img/vector_arrowRight.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 17px;
	width: inherit;
	height: inherit;
}

.welcome__getStarted {
	top: initial;
	bottom: 0;
	width: 420px;
	left: 0;
	right: 0;
	margin: auto;
	background: #000;
	height: 72px;
	border-radius: 0 163px 0 0;
	position: fixed;
	z-index: 10;
	text-align: center;
	line-height: 72px;
	font-size: 26px;
	font-weight: 600;
	cursor: pointer;
	color: #fde723;
	text-transform: uppercase;
	max-width: 100%;
}

.welcome__screen {
	background: #fde723;
	height: inherit;
	width: inherit;
}

.welcome__screen.welcome__screen-type__1 {
	height: 100%;
}

.welcome__screen-background {
	width: inherit;
	height: inherit;
}

.welcome__screen-background img {
	width: inherit;
	height: inherit;
}

.welcome__screen-bubble {
	position: absolute;
	width: 100%;
	bottom: 0;
	height: auto;
	background: #ffe712;
	border-radius: 50% 50% 50% 8px;
	font-size: 41px;
	padding: 92px 40px;
	line-height: 1.4;
	font-weight: 800;
	aspect-ratio: 1;
}

.welcome__screen-bubble span.highlight {
	background: #000;
	display: block;
	color: #fff;
	margin-left: -10px;
	padding-left: 10px;
}

.welcome__screen-subText {
	font-size: 27px;
	font-weight: 600;
	padding: 10px 0 0;
}

.welcome__screen-bubble span.green {
	color: #056b6b;
}

.welcome_screens .swiper-horizontal>.swiper-pagination-bullets,
.welcome_screens .swiper-pagination-bullets.swiper-pagination-horizontal {
	bottom: 50px;
	left: 0px;
	right: 5px;
	text-align: left;
	padding: 0 0 0 20px;
}

.welcome_screens .swiper-pagination-bullet {
	opacity: 1;
	background: #fff;
}

.welcome_screens .swiper-pagination-bullet-active {
	background-color: #000;
	transform: scale(1.5);
}

.welcome_screens .swiper-button-next {
	top: initial;
	bottom: 45px;
	width: 70px;
	left: initial;
	right: 16px;
	background: #000;
	height: 70px;
	border-radius: 50%;
}

.welcome__screen-bubble.welcome__screen-bubble__white {
	background: white;
	max-width: 90%;
	padding: 92px 40px 0;
	top: 70px;
	bottom: 0;
	margin: auto;
	left: 0;
	right: 0;
	text-align: center;
	border-radius: 50% 50% 8px 50%;
}

.welcome_screens .swiper-button-next.swiper-button-disabled {
	display: none;
}

.welcome_screens .swiper-pagination.lastSlide {
	bottom: 110px;
	text-align: center;
	padding: 0;
	position: fixed;
}

.welcome__screen-icon {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	width: 200px;
	bottom: 365px;
	height: 145px;
	z-index: 1;
}

.welcome__screen-icon svg {
	width: inherit;
	height: inherit;
}

.welcome__screen-title {
	position: fixed;
	top: 85px;
	text-align: center;
	width: 100%;
	font-size: 42px;
	font-weight: 800;
}

@media screen and (max-width: 414px) {
	.welcome__screen-bubble {
		font-size: 37px;
		width: 90%;
	}

	.welcome__screen-bubble.welcome__screen-bubble__white {
		background: white;
		max-width: 85%;
		padding: 75px 40px 0;
		font-size: 30px;
	}

	.welcome__screen-title {
		top: 75px;
		font-size: 35px;
	}

	.welcome__screen-icon {
		width: 150px;
		bottom: 300px;
		height: 105px;
	}

	.welcome__screen-subText {
		font-size: 23px;
		padding: 5px 0 0;
	}
}

/*-------------------- Feedback Form ----------------------*/

.feedback__page {
	padding: 10px 25px;
}

.feedback__title {
	font-size: 17px;
	text-transform: uppercase;
	color: #fde723;
	font-weight: 600;
	margin: 0 0 10px;
}

body.lightMode .feedback__title {
	color: #111;
}

form#feedback__form textarea {
	width: 100%;
	background: transparent;
	border-radius: 5px;
	padding: 15px;
	resize: vertical;
	margin: 0 0 10px;
	font-family: inherit;
	font-size: 12px;
	line-height: 1.4;
	color: #eee;
}

body.lightMode form#feedback__form textarea {
	color: #1d1d1d;
}

form#feedback__form textarea::placeholder {
	color: #ccc;
}

#feedback__form button {
	height: 40px;
	display: block;
	width: 170px;
	background: #fde723;
	border: 0;
	border-radius: 5px;
	font-weight: 600;
	text-transform: uppercase;
	float: right;
	cursor: pointer;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	color: #111;
}

#feedback__text.err {
	border: 1px solid #cf000f;
}

#feedback__form .form__row {
	margin: 16px 0;
}

/*----------------- Blocked Users -----------------*/

.blocked__list {
	padding: 15px 16px 50px;
}

.blocked__list-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	color: #fff;
	font-size: 14px;
	margin: 0 0 20px;
	border-bottom: 1px solid #666;
	padding: 0 0 10px;
}

.blocked__list-item__left {
	display: flex;
	align-items: center;
}

.blocked__list-item-img {
	width: 45px;
	height: 45px;
	margin: 0 15px 0 0;
}

.blocked__list-item-unblock {
	width: 90px;
	text-align: center;
	height: 30px;
	line-height: 30px;
	background: #fde723;
	color: #15151f;
	border-radius: 5px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
}

.blocked__list-item-img img {
	width: inherit;
	height: inherit;
	border-radius: 50%;
	border: 1px solid #666;
}

.blocked__list-item:last-child {
	border: 0;
}

.blocked__list-item-img,
.blocked__list-item-name,
.blocked__list-item-unblock {
	cursor: pointer;
}

.blocked__list .no-posts__icon svg path {
	fill: #fde723;
}

/*-------------- Report Popup --------------*/

.report__box__option {
	line-height: 45px;
	padding: 0 16px;
	border-bottom: 1px solid #efefef;
	font-size: 14px;
	font-weight: 400;
	cursor: pointer;
}

.report__box__option:last-child {
	border: 0;
}

.report__box__option:hover,
.report__box__option.active {
	background: #fde723;
}

/*---------------- Permissions Box ----------------*/

.popup__master.permissions .popup__container {
	height: 200px;
	min-height: auto;
}

.report__box-text {
	padding: 10px 16px 20px;
	line-height: 1.5;
}

/*------------- Influencers Page --------------*/

.influencer__body,
.influencer__search-box {
	padding: 40px 0 50px;
	background: #1e1e2d;
	margin: 20px 0 0 0;
}

body.lightMode .influencer__body,
body.lightMode .influencer__search-box {
	background: #fdfdfd;
}

.influencer__body {
	padding: 60px 0 50px;
}

.influencer__item {
	padding: 16px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	flex-wrap: nowrap;
	border-bottom: 1px solid #363642;
}

body.lightMode .influencer__item {
	border-color: #eee;
}

.influencer__item-right {
	flex: 1;
}

.influencer__item-left {
	flex: 3;
	display: flex;
	align-items: center;
	flex-direction: row;
}

.influencer__item-image {
	width: 60px;
	height: 60px;
	margin: 0 15px 0 0;
}

.influencer__item-image img {
	width: inherit;
	height: inherit;
	border-radius: 50%;
	object-fit: contain;
}

.influencer__item-name {
	color: #fff;
	font-size: 15px;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	max-width: 200px;
}

body.lightMode .influencer__item-name {
	color: #000;
	font-weight: 600;
}

span.influencer__item-location {
	display: block;
	color: #bbb;
	font-size: 12px;
	margin: 5px 0 0;
}

span.influencer__item-location {
	color: #555;
}

.influencer__item:last-child {
	border: 0;
}

.influencer__item-connect {
	line-height: 30px;
	background: #fde723;
	text-align: center;
	font-size: 12px;
	border-radius: 5px;
	font-weight: 600;
}

body.lightMode .influencer__item-connect {
	background: #056b6b;
	color: #fff;
}

.influencer__search span svg path {
	fill: transparent;
	stroke: #000;
}

.influencer__item-image,
.influencer__item-name,
.influencer__item-connect {
	cursor: pointer;
}

.influencer__search {
	position: fixed;
	width: 100%;
	max-width: 680px;
	left: 0;
	right: 0;
	margin: auto;
	top: 56px;
}

/*----------------- 404 Page -----------------*/

.page__404 {
	position: absolute;
	z-index: 999;
	top: 0;
	height: 100%;
	width: 100%;
	background-color: #15151f;
}

.page__404-background {
	width: inherit;
	height: inherit;
}

.page__404-background img {
	width: inherit;
	height: inherit;
	object-fit: cover;
	object-position: center;
}

.page__404-redirect {
	width: 275px;
	height: 60px;
	position: absolute;
	bottom: 50px;
	left: 0;
	right: 0;
	margin: auto;
	text-align: center;
	line-height: 60px;
	font-size: 22px;
	font-weight: 700;
	text-transform: uppercase;
	background: #ffe500;
	border-radius: 8px;
}

.no-bg {
	background: initial;
}

/*------------------ Message Popups ------------------*/

.message_popup .popup__container {
	min-height: 650px;
	max-height: 85vh;
	background: transparent;
}

.message__popup-page {
	position: relative;
	top: -57px;
}

.message__popup-head {
	border-radius: 20px 20px 0 0;
	height: 320px;
	background: #fff;
	overflow: hidden;
}

.message__popup-head img {
	max-height: 100%;
	border-radius: 20px;
	object-fit: cover;
	width: 100%;
}

.message__popup-head__text {
	position: absolute;
	top: -33px;
	z-index: 2;
	font-size: 30px;
	display: flex;
	color: #fff;
	font-weight: 600;
	align-items: center;
}

.message__popup-head__text svg {
	margin: 0 15px 0 0;
}

.message__popup-head:before {
	position: absolute;
	width: 100%;
	height: 50px;
	left: 0px;
	top: 0px;
	background: rgba(0, 0, 0, 0.37);
	filter: blur(12.5px);
	content: "";
	z-index: 2;
}

.message__popup-body {
	padding: 20px 20px 0;
	background: white;
	border-radius: 0 0 20px 20px;
}

.message__popup-body__apps {
	margin: 0 0 20px;
}

.message__popup-cta {
	width: calc(100% + 40px);
	height: 50px;
	background: #fde723;
	border-radius: 0 0 20px 20px;
	line-height: 50px;
	padding: 0 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 18px;
	font-weight: 700;
	margin-left: -20px;
	cursor: pointer;
}

.popup__head-close {
	z-index: 3;
}

.popup__head-close svg path {
	fill: #000;
}

body.lightMode .popup__head-close svg path {
	fill: #ccc;
}

.message__popup-body__logo {
	margin: 0 0 20px;
}

.message__popup-body__content h3 {
	margin: 0 0 10px;
	font-size: 19px;
	line-height: 25px;
	font-weight: 700;
}

.message__popup-body__content p {
	font-size: 14px;
	line-height: 1.5;
	margin: 0 0 20px;
}

.message__popup-body__apps ul li {
	list-style: none;
	padding-right: 15px;
}

.message__popup-body__apps ul {
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: flex-start;
	padding: 0;
	margin: 0;
}

/*--------------- Permission Popups ---------------*/

.permission__drawer {
	position: relative;
	top: -75px;
	background: #1a1d21;
	height: 100%;
}

.permission__drawer-head {
	height: 275px;
	width: 100%;
	position: relative;
}

.permission__drawer-head img {
	width: inherit;
	object-fit: cover;
	height: inherit;
	object-position: top;
}

.permission__drawer-head svg {
	width: 56px;
	height: 56px;
	margin: auto;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 1;
}

.permission__drawer-head:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background: linear-gradient(180deg, rgba(26, 29, 33, 0) 0%, #1a1d21 90%);
	height: 175px;
}

.permission__drawer-body {
	padding: 25px 30px;
	text-align: center;
	color: #fff;
}

.permission__drawer-body h4 {
	font-size: 18px;
	font-weight: 600;
	margin: 0 0 16px;
}

.permission__drawer-body p {
	font-size: 15px;
	line-height: 1.5;
	color: #eeeeee;
}

.permission__drawer-cta--allow {
	width: 287px;
	max-width: 85%;
	margin: auto;
	text-align: center;
	line-height: 50px;
	background: #fde723;
	font-size: 15px;
	font-weight: 600;
	color: #111;
	border-radius: 5px;
}

.permission__drawer-cta--cancel {
	margin: 25px 0;
	text-align: center;
	color: #fff;
	font-size: 16px;
	font-weight: 600;
}

.permission__drawer-cta {
	cursor: pointer;
}

@media screen and (max-height: 700px) {
	.permission__drawer-head {
		height: 200px;
	}

	.permission__drawer-head svg {
		width: 40px;
		height: 40px;
	}

	.permission__drawer-body {
		padding: 15px 30px;
	}

	.permission__drawer-body h4 {
		font-size: 16px;
	}

	.permission__drawer-body p {
		font-size: 13px;
	}
}

/*--------------- Single Experience Page ---------------*/

.single__experience-page {
	position: relative;
	overflow-y: scroll;
	top: -15px;
	z-index: 11;
	background: #1e1e2d;
	height: 100%;
	/* Ensuring the height is set */
	scrollbar-width: none;
}

body.lightMode .single__experience-page {
	background: #fdfdfd;
}

.experience__gallery-thumbs,
.experience__gallery-full {
	overflow: hidden;
}

.experience__gallery-full {
	height: 250px;
	position: relative;
}

.experience__gallery-full .swiper-slide img {
	height: 250px;
	width: 100%;
	object-fit: contain;
	background: #1e1e2d;
}

body.lightMode .experience__gallery-full .swiper-slide img {
	background-color: #fdfdfd;
}

.experience__gallery-thumbs {
	margin: 5px 0;
}

.experience__gallery-thumbs .swiper-slide {
	width: 80px;
	height: 50px;
	cursor: pointer;
}

.experience__gallery-thumbs .swiper-slide-thumb-active img {
	border: 1px solid #fde723;
}

.experience__gallery-thumbs .swiper-slide img {
	width: inherit;
	height: inherit;
	object-fit: cover;
}

.swiper.experience__gallery-thumbs {
	margin: 2px 0 0;
}

.experience__head {
	padding: 0 16px;
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	align-items: flex-start;
	flex-wrap: nowrap;
}

.experience__head-left {
	flex: 4;
}

.experience__head-right {
	flex: 1;
}

.experience__head-host img {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
	margin: auto;
}

.experience__head-host .overlap__influencerTag {
	position: relative !important;
	top: -40.2px !important;
}

.experience__head-title h1 {
	font-size: 16px;
	color: #fff;
	margin: 0 0 4px;
	line-height: 1.5;
	font-weight: 600;
}

body.lightMode .experience__head-title h1 {
	color: #000;
}

.experience__head-category {
	font-size: 10px;
	color: #ddd;
	margin: 0 0 20px;
	text-transform: capitalize;
}

body.lightMode .experience__head-category {
	color: #111;
	font-weight: 400;
}

.experience__head-category svg path {
	fill: white;
}

.experience__head-category svg {
	vertical-align: middle;
	margin: 0 5px 0 0;
}

body.lightMode .experience__head-category svg path {
	fill: #000;
}

.experience__booking-cta,
.experience__booking-slot,
.experience__head-host,
.experience__host-offered-right,
.experience__policy,
.services__booking-cta {
	cursor: pointer;
}

.experience__gallery {
	margin: 0 0 15px;
	position: relative;
}

.experience__gallery-buttons {
	position: absolute;
	top: 25px;
	z-index: 11;
	left: 12px;
}

.experience__gallery-button svg {
	max-width: 15px;
	width: auto;
	height: auto;
	max-height: 15px;
}

.experience__gallery-button {
	background: rgba(17, 17, 17, 0.45);
	width: 30px;
	height: 30px;
	text-align: center;
	border-radius: 4px;
	line-height: 28px;
	cursor: pointer;
}

.experience__gallery-button svg path {
	fill: white;
	stroke: white;
}

.experience__gallery-buttons {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	flex-wrap: nowrap;
	width: 96%;
}

.experience__gallery-right {
	display: flex;
	justify-content: flex-end;
}

.experience__gallery-right .experience__gallery-button:first-child {
	margin: 0 10px 0 0;
}

.experience__gallery-right .experience__gallery-button {
	line-height: 34px;
}

.experience__bookmark {
	display: none;
}

.experience__head-location {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	flex-wrap: nowrap;
	align-items: center;
}

.experience__head-location-left svg {
	height: 17px;
	width: auto;
	margin: 0;
}

.experience__head-location-left {
	background: #fde723;
	width: 30px;
	height: 30px;
	text-align: center;
	line-height: 34px;
	border-radius: 50%;
	margin: 0 10px 0 0;
	border: 0;
}

.experience__head-location-right {
	font-size: 11px;
	color: #fff;
}

body.lightMode .experience__head-location-right {
	color: #111;
	font-weight: 600;
}

.experience__head-location-right span {
	display: block;
	color: #bbb;
	margin: 4px 0 0;
}

.experience__head-host span {
	color: rgb(97, 255, 255);
	font-size: 10px;
	margin: 0 0 10px;
	display: block;
	text-align: center;
	font-weight: 700;
}

body.lightMode .experience__head-host span {
	color: #056b6b;
}

.experience__head-host .hostedBy {
	color: #ccc;
	margin: 10px 0 0;
	font-weight: 500;
}

body.lightMode .experience__head-host .hostedBy {
	color: #111;
}

.experience__rating {
	padding: 20px 0 0;
}

.experience__content {
	padding: 0 16px;
	color: #bbb;
}

.experience__content h3,
.experience__content h4,
.experience__content h5,
.experience__content h6,
.experience__content h2 {
	font-size: 15px;
	font-weight: 600;
	color: #eee;
	margin: 0 0 10px;
}

body.lightMode .experience__content h3,
body.lightMode .experience__content h4,
body.lightMode .experience__content h5,
body.lightMode .experience__content h6,
body.lightMode .experience__content h2 {
	color: #000;
	font-weight: 800;
}

.experience__content p,
.experience__content ul,
.experience__content ol {
	color: #bbb;
	font-size: 13px;
	line-height: 1.5;
	margin: 0 0 10px !important;
	font-weight: 500;
}

body.lightMode .experience__content p,
body.lightMode .experience__content ul,
body.lightMode .experience__content ol {
	color: #111;
}

.experience__content ol,
.experience__content ul {
	margin: 0 0 10px;
	padding: 0 0 0 20px;
}

.experience__content blockquote {
	margin: 24px 0;
	color: rgb(97, 255, 255);
	font-size: 14px;
	font-weight: 600;
}

.experience__content a {
	color: #fde723;
}

body.lightMode .experience__content a {
	color: #056b6b;
	font-weight: 600;
}

.experience__itenary {
	width: calc(100% + 32px);
	margin: 30px -16px 0;
}

.experience__itenary-item {
	padding: 12px 16px;
	display: flex;
	justify-content: space-around;
	flex-direction: row;
	align-items: stretch;
	font-size: 13px;
	color: #bbb;
	line-height: 1.5;

	p:first-of-type {
		font-size: 14px;
		color: #fde723;
	}
}

.experience__itenary-item__left {
	flex: 1;
	color: #fff;
	font-size: 16px;
}

body.lightMode .experience__itenary-item__left {
	color: #111;
	font-weight: 600;
}

.experience__itenary-item__right {
	flex: 4.5;
	padding: 0 0 0 10px;
}

.experience__itenary-item:nth-child(odd) {
	background: #15151f;
}

body.lightMode .experience__itenary-item:nth-child(odd) {
	background: #f5f5f5;
}

.experience__pricing {
	border-bottom: 1px solid #2a2828;
	padding: 5px 16px 20px;
	font-size: 15px;
	color: #eee;
	margin: 0 0 25px;
}

body.lightMode .experience__pricing {
	color: #505050;
	border-bottom-color: #e5e5e5;
}

.experience__pricing span.item__price-slashed {
	font-size: 13px;
	padding: 0 5px 0 0;
	color: #a79f36;
}

.experience__pricing-info {
	color: #ccc;
	font-size: 12px;
	padding: 15px 0 0;
	line-height: 1.5;
}

.experience__pricing-info a {
	padding: 0 0 0 5px;
	color: #fde723;
	text-decoration: underline;
}

span.experience__price {
	color: #fde723;
	padding: 0 5px;
	font-size: 23px;
	font-weight: 600;
}

body.lightMode span.experience__price {
	color: #056b6b;
}

span.experience__price-gst {
	color: #ccc;
	font-size: 12px;
	font-weight: 100;
}

body.lightMode span.experience__price-gst {
	color: #808080;
}

.experience__rating .profile__ratings {
	background-color: #15151d;
}

.experience__host-head {
	padding: 0 16px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	margin: 0 0 16px;
}

.experience__host-head__left img {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	object-fit: cover;
}

.experience__host-head__left .overlap__influencerTag {
	position: relative !important;
	left: -40px !important;
}

.experience__host-head__left {
	margin: 0 10px 0 0;
}

.experience__host-head-name {
	font-weight: 600;
	font-size: 15px;
}

.experience__host-head__right {
	color: #eee;
}

body.lightMode .experience__host-head__right {
	color: #111;
}

.experience__host-head-sub {
	font-size: 11px;
	padding: 3px 0 0;
}

.experience__host-instructions {
	background: #fff388;
	margin: 0 16px;
	padding: 10px 20px;
	border-radius: 20px;
	display: -webkit-box;
	-webkit-line-clamp: 50;
	-webkit-box-orient: vertical;
	overflow: hidden;
	position: relative;
}

.experience__host-about {
	padding: 80px 16px 0;
	margin: -50px 0 0;
	background: #15151f;
	color: #ccc;
}

body.lightMode .experience__host-about {
	color: #111;
	background: rgba(253, 231, 35, 0.08);
}

.experience__host-instructions p,
.experience__host-instructions ul {
	margin: 0 0 16px;
	font-size: 12px;
	line-height: 1.5;
	color: #1d1d1d;
	font-weight: 500;
}

.experience__host-about__content {
	font-size: 13px;
	line-height: 1.5;
	margin: 0 0 16px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

.experience__host-stats {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	padding: 0 0 20px;
	border-bottom: 1px solid #2a2828;
}

body.lightMode .experience__host-stats {
	border-bottom-color: #e5e5e5;
}

.experience__host-stats__right {
	display: flex;
	align-items: center;
}

.experience__host-offered {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 15px 0;
}

.experience__host-offered-right {
	font-size: 12px;
	color: rgb(97, 255, 255);
}

body.lightMode .experience__host-offered-right {
	color: #056b6b;
	font-weight: 500;
}

.experience__host-offered-right svg {
	vertical-align: middle;
	width: 20px;
	height: 20px;
}

.experience__host-offered-right svg path {
	stroke: rgb(97, 255, 255);
}

body.lightMode .experience__host-offered-right svg path {
	stroke: #056b6b;
}

.experience__host-offered-left {
	font-size: 14px;
	font-weight: 600;
}

.experience__host-about__title {
	font-size: 14px;
	font-weight: 600;
	padding: 0 0 16px;
}

.experience__host-instructions--no-instructions .experience__host-head-sub,
.experience__host-instructions--no-instructions .experience__host-about__title {
	display: none;
}

.experience__host-instructions--no-instructions .experience__host-about {
	padding: 65px 16px 0;
}

.experience__host-instructions--no-instructions .experience__host-head {
	padding: 10px 16px 0;
	margin: 0;
}

.experience__policies {
	padding: 20px 16px 145px;
	display: flex;
}

.booking__active .experience__policies {
	padding-bottom: 177px;
}

.experience__policy {
	flex: 1;
	/* padding: 0 7px; */
	display: flex;
	justify-content: center;
}

.experience__policy-left {
	width: 30px;
	height: 30px;
	background: #fde723;
	line-height: 34px;
	text-align: center;
	border-radius: 50%;
	margin: 0 8px 0 0;
}

.experience__policy-right {
	color: #fff;
	font-size: 12px;
}

body.lightMode .experience__policy-right {
	color: #111;
}

.experience__policy-right span {
	display: block;
	color: #ccc;
	padding: 3px 0 0;
}

body.lightMode .experience__policy-right span {
	color: #707070;
}

.experience__policy-left svg path {
	stroke: #000;
}

.experience__policy-left svg {
	height: 17px;
	width: auto;
}

.experience__booking {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	max-width: 100%;
	width: 420px;
	margin: auto;
	background: #15151f;
	color: #fff;
}

body.lightMode .experience__booking {
	background: #fff;
	color: #111;
	font-weight: 500;
}

.experience__booking-badge {
	background: #ef053d;
	text-align: center;
	width: 100%;
	height: 22px;
	font-size: 12px;
	line-height: 22px;
	color: #fff;
	font-weight: 600;
}

.experience__booking-box {
	height: 60px;
	display: flex;
	justify-content: space-between;
	text-align: center;
}

.experience__booking-cta,
.services__booking-cta {
	background: #fde723;
	width: 50%;
	line-height: 60px;
	font-size: 18px;
	font-weight: 600;
	color: #111;
}

.experience__booking-slot {
	width: 50%;
	text-align: left;
	padding: 0 16px;
	display: flex;
	font-size: 14px;
	flex-direction: row;
	align-items: center;
	gap: 5px;
}

div#lottie__enquireExp {
	max-height: 30px;
	max-width: 30px;
}

.experience__booking-cta svg,
.services__booking-cta svg {
	width: 16px;
	height: 16px;
	vertical-align: middle;
	margin: 0 5px 0 0;
}

.experience__booking-slot span {
	font-size: 12px;
}

.experience__booking-selectSlot {
	color: #FDE723;
	font-size: 16px;
	font-weight: 600;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	cursor: pointer;
}

body.lightMode .experience__booking-selectSlot {
	color: #056b6b;
}

.experience__booking-tickets h5 {
	margin: 0 0 10px;
	font-size: 14px;
}

.experience__booking-tickets {
	padding: 10px 16px;
	border-bottom: 1px solid #fde723;
	font-size: 13px;
	width: calc(100% - 67px);
}

@media screen and (min-width: 768px) {
	.experience__booking-tickets {
		width: 100%;
	}
}

.experience__booking-tickets__box {
	display: flex;
	justify-content: space-between;
}

span.experience__booking-tickets__pricing-tax {
	font-size: 10px;
}

span.experience__booking-tickets__pricing-total {
	font-size: 15px;
	font-weight: 700;
	color: #fde723;
	padding: 0 5px 0 0;
}

.experience__share {
	display: none;
	position: absolute;
	bottom: -45px;
	height: 40px;
	border-radius: 20px;
	background: grey;
	right: 0;
	line-height: 40px;
	z-index: 1;
}

.experience__share ul {
	padding: 0;
	margin: 0;
	display: flex;
}

.experience__share ul li {
	list-style: none;
	padding: 0 13px;
}

.experience__share ul li a {
	color: #fff;
	font-size: 20px;
}

.experience__rating .profile__rating span {
	display: block;
	padding: 3px 0 0;
	font-size: 8px;
	color: #bbb;
}

body.lightMode .experience__rating .profile__rating span {
	color: #707070;
}

span.rating__item-stars {
	display: flex;
	align-items: center;
	flex-direction: row;
	width: 80px;
}

span.rating__item-stars {
	display: flex;
	align-items: center;
	flex-direction: row;
	width: 85px;
	display: inline-block;
}

.whatsapp-us {
	position: fixed;
	right: 0;
	bottom: 60px;
	width: 67px;
	height: 67px;
	border-radius: 50% 0 0 50%;
	background: green;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.whatsapp-us svg {
	width: 32px;
	height: 32px;
}

.whatsapp-us svg path {
	fill: #fff;
}

@media screen and (min-width: 768px) {
	.whatsapp-us {
		right: 25px;
		bottom: 25px;
		width: 65px;
		height: 65px;
		border-radius: 50%;
		background: green;
		box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
	}
}

/*----------------- Booking Summary -----------------*/

.form__plusMinus span {
	cursor: pointer;
}

.form__plusMinus .minus,
.form__plusMinus .plus {
	width: 20px;
	background: transparent;
	border-radius: 4px;
	border: 0;
	display: inline-block;
	/* vertical-align: middle; */
	text-align: center;
	position: absolute;
	color: #fde723;
	/* line-height: 30px; */
	font-weight: 700;
	font-size: 24px;
	margin-inline: 4px;
}

body.lightMode .form__plusMinus .minus,
body.lightMode .form__plusMinus .plus {
	color: #056b6b;
	font-size: 20px;
	width: 30px;
}

.form__plusMinus input {
	height: 34px;
	width: 100px;
	text-align: center;
	font-size: 26px;
	border: 1px solid #ddd;
	border-radius: 4px;
	display: inline-block;
	vertical-align: middle;
}

.bookingSummary__page {
	position: relative;
	top: -15px;
	z-index: 11;
	background: #1e1e2d;
}

body.lightMode .bookingSummary__page {
	background: #fdfdfd;
}

.bookingSummary__head {
	line-height: 50px;
	height: 50px;
	margin: 17px 0 30px;
	padding: 0 16px;
	color: #fff;
	cursor: pointer;
}

.bookingSummary__head svg {
	width: 16px;
	height: 10px;
	vertical-align: unset;
}

.bookingSummary__head svg path {
	stroke: #eee;
}

body.lightMode .bookingSummary__head svg path {
	stroke: #111;
}

.bookingSummary__head h3 {
	display: inline;
	vertical-align: middle;
	margin: 0 16px;
	font-weight: 600;
	font-size: 16px;
	color: #eee;
}

body.lightMode .bookingSummary__head h3 {
	color: #111;
}

.bookingSummary-booking__box {
	padding: 0 16px 16px;
	font-size: 14px;
}

.bookingSummary-booking__box-head {
	color: #fde723;
	margin: 0 0 10px;
}

body.lightMode .bookingSummary-booking__box-head {
	color: #056b6b;
	font-weight: 700;
}

.bookingSummary-booking__box-head svg path {
	stroke: #fde723;
}

body.lightMode .bookingSummary-booking__box-head svg path {
	stroke: #056b6b;
}

.bookingSummary-booking__box-head svg {
	vertical-align: middle;
	margin: 0 5px 0 0;
}

.bookingSummary-booking__box-table,
.bookingSummary-booking__box-tickets,
.bookingSummary__details-body {
	width: calc(100% + 32px);
	margin: 0 -16px;
	background: #15151f;
	padding: 24px 16px;
}

body.lightMode .bookingSummary-booking__box-table,
body.lightMode .bookingSummary-booking__box-tickets {
	background: rgba(5, 107, 107, 0.03);
}

body.lightMode .bookingSummary__details-body {
	background: #fdfbec;
}

.bookingSummary-booking__item {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
}

.bookingSummary-booking__item-right {
	flex: 1;
}

.bookingSummary-booking__item-left {
	flex: 2;
}

.bookingSummary-booking__item-title {
	font-size: 16px;
	color: #fff;
	font-weight: 500;
	margin: 0 0 5px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	line-height: 1.5;
}

body.lightMode .bookingSummary-booking__item-title {
	color: #111;
	font-weight: 600;
}

.bookingSummary-booking__item-sub {
	color: #ccc;
	font-size: 12px;
}

body.lightMode .bookingSummary-booking__item-sub {
	color: #111;
	font-weight: 400;
}

.bookingSummary-booking__item-price {
	text-align: right;
	font-size: 20px;
	color: #fde723;
	font-weight: 600;
	margin: 5px 0 4px;
}

body.lightMode .bookingSummary-booking__item-price {
	color: #056b6b;
	font-weight: 600;
}

span.bookingSummary-booking__item-price__subText {
	color: #bbb;
	font-size: 10px;
}

body.lightMode span.bookingSummary-booking__item-price__subText {
	color: #707070;
}

.bookingSummary-booking__item-tax {
	font-size: 12px;
	color: #bbb;
	text-align: right;
}

body.lightMode .bookingSummary-booking__item-tax {
	color: #707070;
}

.bookingSummary-booking__box-tickets {
	padding-top: 0;
}

form#bookingSummary__form {
	border-top: 1px solid #2a2828;
	padding: 12px 0 0;
}

body.lightMode form#bookingSummary__form {
	border-top-color: #ddd;
}

#bookingSummary__form .form__row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-direction: row;
}

.bookingSummary-booking__box-tickets__item:nth-child(2) {
	margin: 0 0 0 20px;
}

.bookingSummary_date {
	color: #eee;
	font-size: 12px;
}

body.lightMode .bookingSummary_date {
	color: #111;
	font-weight: 500;
}

.bookingSummary-booking__box-tickets__item label {
	font-size: 10px;
	color: #bbb;
	margin: 0 0 5px;
	display: block;
	font-weight: 500;
}

body.lightMode .bookingSummary-booking__box-tickets__item label {
	color: #707070;
}

.bookingSummary-booking__box-tickets__item input,
.bookingSummary-booking__box-tickets__item select {
	max-width: 100%;
	min-width: 92px;
	height: 30px;
	background: transparent;
	padding: 0 5px 0 5px;
	font-size: 12px;
	color: #fff;
	border-radius: 5px;
	border-color: #bbb;
}

body.lightMode .bookingSummary-booking__box-tickets__item input,
body.lightMode .bookingSummary-booking__box-tickets__item select {
	color: #111;
	font-weight: 600;
}

.form__plusMinus {
	position: relative;
}

.form__plusMinus span.plus {
	right: 0;
}

.bookingSummary__coupons {
	padding: 0 16px;
	margin: 0 0 24px;
}

.bookingSummary__coupons-head {
	font-size: 16px;
	color: #eee;
	font-weight: 600;
	margin: 0 0 12px;
}

body.lightMode .bookingSummary__coupons-head {
	color: #111;
}

.bookingSummary__coupons-viewAll {
	color: yellow;
	font-weight: 600;
	font-size: 14px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	text-decoration: underline;
	margin-right: 20px;
}

body.lightMode .bookingSummary__coupons-viewAll {
	color: #000;
}

form#bookingSummary__couponForm .form__row .form__column {
	position: relative;
	flex: 1;
}

form#bookingSummary__couponForm .form__row .form__column input {
	width: 100%;
	height: 50px;
	border-radius: 6px;
	background: transparent;
	color: #eee;
	border: 1px solid #fde723;
	padding: 0 95px 0 15px;
	font-size: 12px;
}

body.lightMode form#bookingSummary__couponForm .form__row .form__column input {
	border-color: rgba(5, 107, 107, 0.5);
}

form#bookingSummary__couponForm .form__row .form__column button {
	position: absolute;
	right: 5px;
	height: 40px;
	top: 5px;
	padding: 0px 25px;
	font-size: 13px;
	border-radius: 6px;
	border: 0;
	background: #fde723;
	font-weight: 600;
}

body.lightMode form#bookingSummary__couponForm .form__row .form__column button {
	background: #056b6b;
	color: #fff;
	font-weight: 500;
	font-size: 14px;
	letter-spacing: 0.5px;
}

.bookingSummary__premiumCard {
	text-align: center;
	margin: 24px 0;
}

.bookingSummary__userDetails {
	padding: 0 16px;
	margin: 0 0 24px;
}

.bookingSummary__userDetails-head,
.bookingSummary__details-head {
	color: #fff;
	margin: 0 0 13px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

body.lightMode .bookingSummary__userDetails-head,
body.lightMode .bookingSummary__details-head {
	color: #111;
	font-weight: 600;
}

.bookingSummary__userDetails-body {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-start;
}

span.bookingSummary__userDetails-otp__resend_in {
	display: none;
}

.bookingSummary__userDetails-otp__resend.disabled span.bookingSummary__userDetails-otp__resend_in {
	display: inline;
}

form#bookingSummary__signUp {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	width: 100%;
}

.bookingSummary__userDetails-item input {
	position: absolute;
	width: calc(100% + 20px);
	height: 100%;
	margin: -20px;
	background: transparent;
	border: 0;
	outline: 0;
	padding: 15px 20px 0;
	color: #fff;
}

.bookingSummary__userDetails-item {
	flex: calc(50% - 15px);
	margin: 0 0 16px;
	height: 50px;
	font-size: 13px;
	color: #eee;
	border: 1px solid #857f49;
	border-radius: 6px;
	padding: 5px 10px;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	position: relative;
	max-width: 50%;
}

body.lightMode .bookingSummary__userDetails-item {
	border-color: #eee;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	-webkit-transition: "color 9999s ease-out, background-color 9999s ease-out";
	-webkit-transition-delay: 9999s;
}

.bookingSummary__userDetails-value {
	text-overflow: ellipsis;
	overflow: hidden;
	padding: 10px 0 0;
}

body.lightMode .bookingSummary__userDetails-value {
	color: #111;
}

.bookingSummary__userDetails-item.error {
	border-color: #cf000f;
}

.bookingSummary__userDetails-item:nth-child(2n) {
	margin: 0 0 0 15px;
}

.bookingSummary__userDetails-title {
	font-size: 9px;
	color: #bbb;
	font-weight: 100;
	display: block;
	width: 100%;
	position: absolute;
	top: 6px;
}

body.lightMode .bookingSummary__userDetails-title {
	color: #707070;
}

form#bookingSummary__signUp.active .bookingSummary__phoneBox.bookingSummary__phoneBox {
	display: flex;
	flex-direction: row;
	position: absolute;
	left: 0;
	width: 100%;
}

.bookingSummary__phoneBox select {
	width: 30%;
	height: 50px;
	background: transparent;
	border: 0;
	padding: 15px 0 0;
	color: #fff;
	font-size: 12px;
	text-align: center;
	appearance: none;
	cursor: pointer;
	outline: 0;
}

.bookingSummary__phoneBox input {
	width: 70%;
	position: static;
	margin: 0;
	height: 50px;
	padding: 15px 0px 0;
}

.bookingSummary__phoneBox select option {
	color: #000;
}

.bookingSummary__userDetails-head svg {
	vertical-align: middle;
	margin: 0 5px 0 0;
	width: 16px;
	height: 16px;
}

.bookingSummary__userDetails-head svg path {
	fill: white;
}

body.lightMode .bookingSummary__userDetails-head svg path {
	fill: #111;
}

.bookingSummary__userDetails-item:nth-child(3) {
	margin: 0;
}

.bookingSummary__details {
	margin: 0 0 24px;
	padding: 0 16px;
}

.bookingSummary__userDetails-item:nth-child(3) {
	margin: 0;
}

.bookingSummary__details-item {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	color: #ddd;
	font-weight: 300;
	padding: 0 0 10px;
	font-size: 14px;
	font-weight: 600;
}

.bookingSummary__details-value {
	font-size: 18px;
	font-weight: 600;
}

body.lightMode .bookingSummary__details-item {
	color: #111;
	font-weight: 500;
}

body.lightMode .bookingSummary__details-title.bookingSummary__details-item-discount {
	color: #056b6b;
}

.bookingSummary__details-item.bookingSummary__details-final {
	padding: 7.5px 0 0;
	margin: 7.5px 0 0;
	border-top: 1px solid #616161;
	color: #fff;
	font-weight: 600;
	font-size: 15px;
}

body.lightMode .bookingSummary__details-item.bookingSummary__details-final {
	color: #111;
	font-weight: 500;
	border-top-color: #bbb;
}

.bookingSummary__details-item.bookingSummary__details-item-discount {
	color: #fde723;
}

.bookingSummary__details-title span {
	display: block;
	padding: 5px 0 0;
	font-size: 12px;
	font-weight: 600;
}

.bookingSummary__cta {
	padding: 0 16px 100px;
}

.bookingSummary__cta button {
	width: 100%;
	background: #fde723;
	border: 0;
	height: 50px;
	border-radius: 7px;
	color: #000;
	font-size: 18px;
	font-weight: 600;
	cursor: pointer;
	position: relative;
}

.bookingSummary__cta button svg {
	position: absolute;
	height: 30px;
	width: auto;
	right: 10px;
	top: 0;
	bottom: 0;
	margin: auto;
}

.bookingSummary__cta button svg path {
	fill: #000;
}

.bookingSummary__login {
	font-size: 10px;
}

.bookingSummary__login span {
	cursor: pointer;
	font-size: 15px;
	color: #fde723;
	margin: 0 0 0 5px;
	font-weight: 500;
}

.booking__box-item {
	padding: 5px 0 10px;
	border-bottom: 1px solid #616165;
	width: calc(100% - 32px);
	margin: auto;
}

body.lightMode .booking__box-item {
	border-bottom-color: #d5d5d5;
}

.booking__box-item.booking__box-tickets {
	border: 0;
}

.booking__box-button {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	text-align: center;
	line-height: 60px;
	background: #fde723;
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
	font-weight: 600;
	cursor: pointer;
}

.booking__box-item.form__row {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

.booking__box-item.form__row .form__column {
	flex: 1;
}

.booking__box-item.form__row .form__column:first-child {
	margin: 0 5% 0 0;
}

.booking__box-item.form__row .form__column label {
	display: block;
	font-size: 14px;
	font-weight: 600;
	margin: 0 0 5px;
	color: #eee;
}

body.lightMode .booking__box-item.form__row .form__column label {
	color: #111;
}

.booking__box-item.form__row .form__column select {
	width: 100%;
	height: 40px;
	border: 1px solid #3d3c3c;
	border-radius: 4px;
	font-size: 12px;
	padding: 0 0 0 10px;
	color: #eee;
	background: transparent;
}

body.lightMode .booking__box-item.form__row .form__column select {
	color: #111;
	border-color: #aaa;
	font-weight: 500;
	outline: 0;
}

.booking__box-item.form__row .form__column select option {
	background: #1e1e2d;
}

body.lightMode .booking__box-item.form__row .form__column select option {
	background: #fff;
}

.popup__master--experience__booking .popup__container {
	min-height: 450px;
	background: #1e1e2d;
}

body.lightMode .popup__master--experience__booking .popup__container {
	background: #fff;
}

.popup__master--experience__booking .popup__head {
	background: #15151d;
	color: #fde723;
}

body.lightMode .popup__master--experience__booking .popup__head {
	background: rgba(253, 231, 35, 0.1);
	color: #111;
}

.booking__slots-selected,
.booking__box-tickets__title {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	font-weight: 600;
	font-size: 14px;
	line-height: 150%;
	letter-spacing: 0.01em;
	color: #ddd;
}

body.lightMode .booking__slots-selected,
body.lightMode .booking__box-tickets__title {
	color: #222;
}

span.booking__slots-left {
	font-size: 10px;
	font-weight: 600;
	color: #ef053d;
}

.booking__slots ul {
	margin: 8px 0 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 19px 4rem;
}

.booking__slots ul li {
	list-style: none;
	/* margin: 0 10px 10px 0; */
	line-height: 30px;
	text-align: center;
	font-size: 12px;
	font-weight: 500;
	border: 1px solid #3d3c3c;
	border-radius: 4px;
	color: #bbb;
	cursor: pointer;
	padding: 0 10px;
}

.booking__slots ul li.active {
	background: #fde723;
	border-color: #111;
	color: #111;
	font-weight: 700;
}

body.lightMode .booking__slots ul li.active {
	border-color: #fff;
}

.booking__box-tickets .form__plusMinus {
	padding: 10px 0;
	width: 100px;
}

.booking__box-tickets .form__plusMinus input {
	font-size: 12px;
	color: #fff;
	background: transparent;
	border: 1px solid #3d3c3c;
}

body.lightMode .booking__box-tickets .form__plusMinus input {
	color: #111;
	font-weight: 600;
	font-size: 14px;
	border-color: #999;
}

.bookingSummary__cta p.terms {
	font-size: 12px;
	text-align: center;
	color: #ddd;
	line-height: 1.5;
}

body.lightMode .bookingSummary__cta p.terms {
	color: #707070;
}

.bookingSummary__cta p.terms a {
	color: #fde723;
}

.bookingSummary__userDetails-section {
	width: 100%;
	margin: 20px 0 0;
	color: #fff;
}

.bookingSummary__userDetails-otp__description {
	display: flex;
	font-size: 10px;
	color: #bbb;
	padding: 2px 0 8px;
	justify-content: space-between;
	align-items: flex-end;
}

.bookingSummary__userDetails-otp__resend {
	color: #fde723;
	font-weight: 600;
	font-size: 12px;
	cursor: pointer;
}

.bookingSummary__userDetails-otp__input {
	position: relative;
}

.bookingSummary__userDetails-otp__input input {
	width: 100%;
	height: 45px;
	background: transparent;
	border: 1px solid #857f49;
	border-radius: 6px;
	padding: 0 80px 0 15px;
	color: #fff;
	outline: 0;
}

.bookingSummary__userDetails-otp__input button {
	position: absolute;
	right: 5px;
	height: 35px;
	top: 5px;
	width: 70px;
	background: #fde723;
	border: 0;
	border-radius: 6px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}

.bookingSummary__userDetails-otp__input button svg {
	width: 10px;
	height: auto;
}

.bookingSummary__userDetails-otp__input button svg path {
	stroke: #000;
}

.bookingSummary__userDetails-otp__title {
	font-size: 14px;
}

/*---------------- All Experience Page ----------------*/

#main__experiences-box {
	position: absolute;
	width: 100%;
	max-width: 100%;
	height: 100vh;
	top: 50px;
	background-color: #15151D;
}

body.lightMode #main__experiences-box {
	background: white;
}

.experiences__page {
	position: relative;
	overflow-y: scroll;
	overflow-x: hidden;
	height: inherit;
}

.experiences__head-title__box {
	line-height: 50px;
	padding: 0 16px;
	font-size: 18px;
	color: #111;
	font-weight: 700;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.experiences__head-title span {
	font-size: 10px;
	display: block;
	line-height: 1;
	margin: -10px 0 5px;
	color: #056b6b;
}

@media screen and (max-width: 400px) {
	.experiences__head-title__box {
		font-size: 16px;
	}

	.experiences__head-title span {
		font-size: 9px;
	}
}


.experiences__head-search__box {
	width: calc(100% - 32px);
	margin: auto;
	padding: 12px 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.experiences__head-categories__box {
	padding: 0 16px 10px;
	display: flex;
	margin: 0 10px 0 0;
}

.experiences__head-category__item {
	font-size: 12px;
	padding: 6px 11px;
	background: #fde723;
	border-radius: 5px;
	position: relative;
	font-weight: 500;
	color: #000;
}

.experiences__head-category__item span {
	position: absolute;
	width: 18px;
	height: 18px;
	text-align: center;
	top: -9px;
	right: -9px;
	background: #000;
	border-radius: 50%;
	line-height: 9px;
	padding: 4px;
	cursor: pointer;
}

.experiences__head-category__item span svg {
	width: 8px;
	max-width: 90%;
	height: auto;
}

.experiences__head-category__item span svg path {
	fill: white;
}

.experiences__head {
	background: #ffffff;
	border-bottom: 0.25px solid rgba(245, 245, 245, 0.25);
	box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05);
	backdrop-filter: blur(25px);
}

.experiences__body-item,
.experiences__search {
	padding: 0;
	position: relative;
	margin-bottom: 30%;
}

form#experiences__search input::placeholder {
	color: #1e1e2d;
}

.experiences__body .feed__loading {
	bottom: 0;
}

body .experiences__body-tabs {
	gap: 0 25px;
	margin: -10px 16px 25px;
	justify-content: center;
}

.experiences__categories {
	margin-left: 14px;
	display: none;
}

.edit__places .editPlaces__search-box {
	height: 40px;
}

.experiences__head-search__box .experiences__search-box input,
.edit__places .editPlaces__search-box input {
	height: 40px;
	background: #f5f5f5;
}

body.lightMode .experiences__head-search__box .experiences__search-box input,
body.lightMode .edit__places .editPlaces__search-box input {
	color: #111;
}

.experiences__head-search__box .experiences__search-box button,
.edit__places .editPlaces__search-box button {
	top: 0;
	height: 32px;
	width: 32px;
	right: 4px;
	bottom: 0;
	margin: auto;
}

.experiences__head-search__box .experiences__search-box button svg,
.edit__places .editPlaces__search-box button svg {
	width: 18px;
	height: 18px;
}

.experience__item {
	width: calc(100% - 32px);
	margin: 0 auto 25px;
	display: flex;
	flex-direction: column;
	border-radius: 10px;
	z-index: 1;
}

body.lightMode .experience__item {
	box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);
	background: #f4f4f4;
	box-shadow: 10px 10px 30px rgba(0, 0, 0, 0.5);
	box-shadow: 10px 10px 15px rgba(0, 0, 0, 0.25);
}

.experience__item-image {
	flex: 2;
	/* margin: 0 16px 0 0; */
	position: relative;
	height: 200px;
}

.experience__item-content {
	flex: 3;
	padding: 8px 16px 12px 12px;
}

.experience__item-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 10px 10px 0 0;
	max-height: 250px;
}

span.experience__item-location {
	position: absolute;
	font-size: 10px;
	color: #fff;
	left: 10px;
	top: 8px;
	font-weight: 600;
	z-index: 2;
	display: -webkit-box;
	line-clamp: 1;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.experience__item-image:before {
	content: "";
	width: 100%;
	position: absolute;
	height: 100px;
	border-radius: 10px 10px 0 0;
	background: linear-gradient(180deg,
			rgb(0 0 0 / 78%) 0%,
			rgb(27 26 26 / 83%) 4%,
			rgb(255 255 255 / 0%) 40%);
}

.experience__item-title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	flex-wrap: nowrap;
}

.experience__item-bookmark,
.experience__topRated-bookmark {
	display: none;
}

.experience__item-bookmark svg {
	height: 13px;
	width: auto;
}

.experience__item-title h3 {
	margin: 0 0 5px;
	font-size: 14px;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	color: #fff;
	font-weight: 600;
}

body.lightMode .experience__item-title h3 {
	color: #000;
	font-weight: 600;
}

.experience__item-category {
	font-size: 10px;
	margin: 0 0 10px;
	color: #bbb;
}

body.lightMode .experience__item-category {
	color: #000;
	font-size: 12px;
	font-weight: 600;
}

.experience__item-category svg {
	margin: 0 5px 0 0;
	vertical-align: middle;
}

.experience__item-hostRating {
	display: flex;
	justify-content: space-between;
	color: #ddd;
}

body.lightMode .experience__item-hostRating {
	color: #111;
}

.experience__item-rating svg {
	width: 12px;
	height: 12px;
}

.experience__item-rating svg path {
	fill: #fde723;
}

.experience__item-rating {
	font-size: 12px;
	font-weight: 600;
	text-align: right;
}

.experience__item-rating span {
	font-size: 8px;
	display: block;
	color: #707070;
	padding: 3px 0 0;
}

.experience__item-host {
	font-size: 11px;
	margin: 0 0 12px;
	font-weight: 500;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 150px;
	color: #ddd;
}

body.lightMode .experience__item-host {
	color: #111;
	font-size: 13px;
	font-weight: 600;
}

.experience__item-price {
	font-size: 15px;
	color: #fde723;
	font-weight: 700;
}

body.lightMode .experience__item-price {
	color: #056b6b;
}

.experience__item-price span.item__price-slashed {
	color: #666;
	font-size: 12px;
	padding: 0 0 0 5px;
}

.item__price-slashed {
	text-decoration: line-through;
}

span.experience__item-tax {
	color: #707070;
	font-size: 10px;
	padding: 0 0 0 3px;
}

.experience__item-becomeExperienceProvider {
	width: 100%;
	margin: 0 0 30px;
	text-align: center;
}

.experience__item-becomeExperienceProvider img {
	width: 100%;
	height: auto;
	object-fit: cover;
	/* max-width: 575px; */
	border-radius: 20px;
}

.experience__item-badge {
	top: 8px;
	position: absolute;
	left: -8px;
	font-size: 9px;
	background: #d5d5d5;
	height: 20px;
	line-height: 20px;
	padding: 0 8px;
	border-radius: 4px;
	font-weight: 600;
}

.experience__item-badge__yellow {
	background: #fde723;
}

.experience__item-badge__red {
	background: #ef053d;
	color: #fff;
}

.experiences__body-item {
	display: none !important;
}

.experiences__body-item.active {
	display: block !important;
}

.experience__topRated {
	width: 100%;
}

.experience__card {
	padding: 10px 0px;
	background: #1e1e2d;


}

body.lightMode .experience__card {
	border-radius: 8px 0 0px 8px;
	background: #fff;

}

.experience__categories {
	padding: 25px 0 25px 16px;
	width: 100%;
	overflow: hidden;
}

body.lightMode .experience__categories {
	background: #fdfbec;
}

.experience__categories-head {
	font-size: 14px;
	font-weight: 600;
	margin: 0 0 12px;
	color: #fff;
}

body.lightMode .experience__categories-head {
	color: #000;
}

.experience__categories-content {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-between;
	position: relative;
	overflow: scroll;
	scrollbar-width: none;
	width: calc(100% + 32px);
	margin-left: -16px;
	padding-left: 16px;
}

.experience__category-item {
	background-color: transparent !important;
	font-size: 10px;
	text-align: center;
	border-radius: 6px;
	font-weight: 500;
	display: flex;
	flex-wrap: nowrap;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	aspect-ratio: 1 / 1;
	position: relative;
}

.experience__category-item:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	right: 0;
	background: #fdfbec;
	z-index: -1;
	border-radius: 7px;
	display: none;
}

.experience__category-image {
	max-width: 100%;
	width: inherit;
	height: inherit;
	border-radius: inherit;
}

.experience__category-item.blue {
	background-color: (89, 164, 255, 0.3);
}

.experience__category-item.light-green {
	background-color: rgba(5, 107, 107, 0.15);
}

.experience__category-item.yellow {
	background-color: rgba(253, 231, 35, 0.5);
}

.experience__category-item.light-red {
	background-color: rgba(239, 5, 61, 0.1);
}

.experience__category-item.light-yellow {
	background-color: rgba(253, 231, 35, 0.2);
}

.experience__category-item.light-aqua {
	background-color: rgba(97, 255, 255, 0.2);
}

.experience__category-item img {
	margin: 0 0 8px;
	position: absolute;
	left: 0;
	top: 0;
	object-fit: cover;
}

.experience__category-title {
	position: absolute;
	bottom: 20px;
	color: #fff;
	font-size: 12px;
	font-weight: 500;
}

.experience__category-item:last-child {
	margin-right: 0;
}

.experience__category-item img {
	margin: 0 0 8px;
	width: inherit;
	height: inherit;
	object-fit: cover;
	border-radius: 10px;
}

.experience__topRated-head {
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	margin: 0 0 12px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 5px 0 5px;
}

.topRated-head-right {
	cursor: pointer;
}

body.lightMode .experience__topRated-head {
	color: #056b6b;
	font-size: 16px;
	font-weight: 800;
}

body.lightMode .see_all_experiences {
	color: #000;
	font-weight: 800;
	font-size: 14px;
}

.experience__topRated-head svg {
	vertical-align: middle;
	margin: 0 5px 0 0;
}

.experience__topRated-head svg path {
	stroke: #fde723;
}

body.lightMode .experience__topRated-head svg path {
	stroke: #111;
}

.experience__topRated-item .experience__topRated-imageBox img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	height: auto;
	border-radius: 10px;
}

.experience__topRated-imageBox {
	position: relative;
}

.experience__topRated-imageBox:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 20%;
	border-radius: 10px;
	background: linear-gradient(180deg, rgba(17, 17, 17, 0) 0%, #1111119e 100%);
	bottom: 3px;
}

.experience__topRated-badge {
	z-index: 1;
	position: absolute;
	top: 8px;
	color: #0d6b8e;
	left: -8px;
	font-size: 14px;
	font-weight: bold;
	background: yellow;
	padding: 0px 8px;
	line-height: 20px;
	border-radius: 4px;
	display: none;
}

.experience__topRated-bookmark {
	position: absolute;
	top: 4px;
	right: 4px;
}

.experience__topRated-bookmark svg {
	width: 12px;
	height: 12px;
}

.experience__topRated-bookmark svg path {
	fill: #fff;
}

.experience__topRated-title {
	position: absolute;
	bottom: 8px;
	font-size: 13px;
	color: #fff;
	left: 8px;
	width: calc(100% - 16px);
	line-height: 1.3;
	font-weight: 600;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.experience__topRated-bookmark {
	position: absolute;
	top: 4px;
	right: 4px;
}

.experience__topRated-bookmark svg {
	width: 12px;
	height: 12px;
}

.experience__topRated-bookmark svg path {
	fill: #fff;
}

.experience__topRated-category {
	font-size: 12px;
	margin-bottom: 4px;
	color: #bbb;
	display: flex;
	align-items: center;
	gap: 5px;
	font-weight: 600;
}

body.lightMode .experience__topRated-category {
	color: #000;
}

.experience__topRated-category svg {
	vertical-align: bottom;
	background: #fde723;
	height: 25px;
	width: 25px;
	padding: 5px;
	border-radius: 12px;

	path {
		fill: #000;
	}
}

.experience__topRated-hostRating {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	font-size: 10px;
	font-weight: 500;
	margin: 0 0 5px;
	color: #ddd;
}

body.lightMode .experience__topRated-hostRating {
	color: #000;
	font-weight: 600;
}

.experience__topRated-host {
	flex: 3;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.experience__topRated-rating {
	flex: 1.2;
	text-align: right;
}

.experience__topRated-hostRating .experience__topRated-rating svg {
	width: 12px;
	height: 12px;
	margin: 0 5px 0 0;
	vertical-align: baseline;
	color: #bbb;
}

.experience__topRated-hostRating .experience__topRated-rating svg path {
	fill: #fde723;
}

.experience__topRated-pricing {
	display: flex;
	flex-direction: row;
	font-size: 12px;
	color: #fde723;
	font-weight: 700;
	align-items: baseline;
}

body.lightMode .experience__topRated-pricing {
	color: #056b6b;
}

.experience__topRated-pricing span.item__price-slashed {
	font-size: 10px;
	padding: 0 0 0 5px;
	color: #666;
}

.experience__topRated-tax {
	color: #707070;
	font-size: 8px;
	font-weight: 400;
	padding: 0 0 0 5px;
}


.experiences__header {
	height: 350px;
	margin: 0 0 35px;
	border-radius: 0;
	position: relative;
	transition: height 0.7s ease;
	/* Add transition for smooth height change */
	box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
	border-radius: 0 0 30px 30px;
	background: white;
}

.experiences__background {
	width: 100%;
	height: 100%;
	position: relative;
	border-radius: inherit;
}

.experiences__background img {
	width: inherit;
	height: inherit;
	object-fit: cover;
	border-radius: inherit;
}

.experiences__background-overlay {
	position: absolute;
	z-index: 1;
	width: inherit;
	height: inherit;
	left: 0;
	top: 0;
	background: rgba(0, 0, 0, 0);
	border-radius: inherit;
}

.experiences__header-box {
	position: absolute;
	top: 120px;
	left: 0;
	right: 0;
	bottom: 15%;
	margin: auto;
	width: 600px;
	max-width: 90%;
	z-index: 2;
	height: 180px;
}

.experiences__header-subtitle h2 {
	font-size: 14px;
	display: block;
	line-height: 1;
	margin: -10px 0 5px;
	color: #fde723;
	text-align: center;
	font-weight: 600;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
}

.experiences__header-title h1 {
	color: #fff;
	font-size: 26px;
	margin: 0 0 40px;
	text-align: center;
	font-weight: 600;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
}

.experiences__header-search-box input {
	width: 100%;
	height: 50px;
	border-radius: 10px;
	border: 0;
	outline: 0;
	padding: 0 20px;
	font-size: 13px;
	color: #1e1e2d;
	/* background: rgb(255 253 253 / 20%); */
	font-weight: 500;
}

.experiences__header-search-btn {
	position: absolute;
	top: 4px;
	height: 42px;
	right: 4px;
	background: #fde723;
	width: 42px;
	display: flex;
	align-items: center;
	border-radius: 10px;
	justify-content: center;
}

.experiences__header-search-box {
	position: relative;
}

.experiences__header-search-btn svg {
	max-width: 25px;
	max-height: 25px;
}

.experiences__header-search-btn.hide-experience-results svg {
	width: 18px;
	height: auto;
}

.experiences__header-search-box input::placeholder {
	color: #bbb;
}

.experiences__search-categories {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	color: #fff;
	margin: 15px 7px 0;
}

.experiences__search-categories ul {
	padding: 0;
	margin: 0;
	display: flex;
	align-items: center;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
}

.experiences__search-categories.category-selected ul {
	display: none;
}

.experiences__search-categories ul li {
	list-style: none;
	margin: 0 7px;
	display: flex;
	align-items: center;
	flex-direction: row;
	font-size: 14px;
}

.experiences__search-categories ul li svg {
	width: 16px;
	height: 16px;
	margin: 0 8px 0 0;
}

.experiences__search-categories ul li svg path {
	stroke: #fff;
}

.experiences__search-categories ul li:last-child {
	margin-right: 0;
}

.experiences__search-categories span {
	font-weight: 500;
	font-size: 14px;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
}

.experiences__search-categories ul li:hover {
	font-weight: 600;
	transition: 0.15s linear;
	color: #fde723;
}

.experience__item,
.experience__topRated-item,
.experience__item-becomeExperienceProvider,
.experiences__search-categories ul li {
	cursor: pointer;
}

/*------------------ Thank You Page ------------------*/

.experience__thankYou {
	position: relative;
	top: -15px;
	background: url(/view/assets/img/experience__thankYou_background.png);
	height: 100vh;
	background-size: contain;
}

.experience__thankYou-head {
	text-align: center;
	position: relative;
	top: 72px;
	max-width: 90%;
	margin: auto;
}

.experience__thankYou-head img {
	width: 100%;
}

.experience__thankYou-user {
	position: absolute;
	display: flex;
	top: -20px;
	left: 0;
	align-items: flex-end;
	font-size: 12px;
	font-weight: 600;
	color: #707070;
	height: 50px;
}

.experience__thankYou-user img {
	width: 40px;
	border-radius: 50%;
	margin: 0 7px 0 0;
	height: 40px;
	object-fit: cover;
}

.experience__thankYou-booking__box {
	position: relative;
	top: 96px;
	width: 90%;
	margin: auto;
	background: linear-gradient(123.19deg, #fefefb 20.87%, #fde723 232.46%);
	border-radius: 10px;
	padding: 8px 16px;
	border: 0.5px solid #fde723;
}

.experience__thankYou-booking__box-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
}

.experienc__thankYou-booking__box-right svg {
	height: 15px;
	width: auto;
	margin: 0 0 0 5px;
}

.experienc__thankYou-booking__box-right svg path {
	fill: rgba(5, 107, 107, 1);
}

.experienc__thankYou-booking__box-right {
	font-weight: 700;
	font-size: 12px;
	line-height: 12px;
	letter-spacing: 0.01em;
	color: #056b6b;
	display: flex;
	align-items: center;
}

.experience__thankYou-booking__box-left svg path {
	stroke: #111;
}

.experience__thankYou-booking__box-left {
	font-size: 12px;
	color: #111;
	display: flex;
	align-items: center;
	font-weight: 500;
}

.experience__thankYou-booking__box-left svg {
	margin: 0 5px 0 0;
}

.experience__thankYou-booking__box-content {
	margin: 12px 0 0;
}

.experience__thankYou-booking__box-title {
	font-weight: 700;
	font-size: 16px;
	line-height: 1.4;
	letter-spacing: 0.01em;
	color: #000000;
	margin: 0 0 6px;
}

.experienc__thankYou-booking__box-location svg {
	height: 12px;
	width: auto;
	margin: 0 8px 0 0;
}

.experienc__thankYou-booking__box-location {
	display: flex;
	align-items: center;
	font-size: 12px;
	margin: 0 0 4px;
}

.experienc__thankYou-booking__box-host,
.order__details-price {
	font-size: 12px;
	font-weight: 500;
	margin: 0 18px 16px;
}

.experience__thankYou-back {
	position: relative;
	top: 140px;
	line-height: 40px;
}

.experience__thankYou-booking__button,
.experience__thankYou-back {
	position: relative;
	top: 124px;
	width: 250px;
	max-width: 70%;
	height: 40px;
	margin: auto;
	background: #fde723;
	border-radius: 4px;
	font-size: 14px;
	line-height: 40px;
	text-align: center;
	font-weight: 700;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: row;
	cursor: pointer;
}

.experience__thankYou-booking__button svg,
.experience__thankYou-back svg {
	height: 10px;
	width: auto;
	margin: 0 0 0 7px;
}

.experience__thankYou-back {
	top: 140px;
	background: transparent;
	color: #fff;
	font-weight: 500;
}

.experience__thankYou-back svg {
	margin: 0 7px 0 0;
}

.experience__thankYou-back svg path {
	stroke: white;
}

/*------------------ Order Details Page ------------------*/

.order__details-page {
	position: relative;
	top: -15px;
	background: #1e1e2d;
	min-height: 100vh;
}

.order__details-head {
	height: 50px;
	line-height: 50px;
	margin: 10px 0 14px;
	padding: 0 16px;
	display: flex;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
	align-items: center;
}

body.lightMode .order__details-head {
	color: #000;
}

.order__details-head span {
	width: 50px;
	margin-left: -20px;
	padding-left: 20px;
}

.order__details-head svg {
	height: 14px;
	width: auto;
	margin: 0 10px 0 0;
}

.order__details-head svg path {
	stroke: #fff;
}

body.lightMode .order__details-head svg path {
	stroke: #000;
}

.order__details-ticket .experience__thankYou-booking__box {
	position: static;
}

.order__details-ticket .experienc__thankYou-booking__box-host {
	margin-bottom: 2px;
}

span.order__details-price__amount {
	color: rgba(5, 107, 107, 1);
	font-weight: 700;
	padding: 0 5px;
	font-size: 14px;
}

span.order__details-price__tax {
	color: #707070;
	font-size: 10px;
}

.order__details-status {
	position: relative;
	margin: 25px 0 20px;
}

.order__details-status span {
	position: absolute;
	right: 0;
	top: -15px;
	height: 30px;
	font-size: 10px;
	background: #fde723;
	line-height: 30px;
	border-radius: 4px;
	padding: 0 8px;
	font-weight: 500;
}

.order__details-details {
	display: flex;
	padding: 0 0 8px;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-end;
}

.order__details-details-left {
	display: flex;
	flex: 2.5;
	align-items: flex-start;
	justify-content: space-between;
	padding: 0 30px 0 0;
}

.order__details-cancel__order {
	font-size: 13px;
	color: rgba(239, 5, 61, 1);
	text-decoration: underline;
}

.order__details-details-right {
	flex: 1.5;
}

.order__details-details__item {
	font-weight: 400;
	font-size: 10px;
	line-height: 12px;
	letter-spacing: 0.01em;
	color: #707070;
}

.order__details-details__item span {
	display: block;
	font-weight: 600;
	font-size: 12px;
	line-height: 15px;
	letter-spacing: 0.05em;
	color: #111111;
	padding: 5px 0 0;
}

.order__details-ticket {
	margin: 0 0 30px;
}

.order__details-status {
	position: relative;
	margin: 25px 0 20px;
}

.order__details-status span {
	position: absolute;
	right: 0;
	top: -15px;
	height: 30px;
	font-size: 10px;
	background: #fde723;
	line-height: 30px;
	border-radius: 4px;
	padding: 0 8px;
	font-weight: 500;
}

.order__details-details {
	display: flex;
	padding: 0 0 8px;
	flex-direction: row;
	justify-content: space-between;
	align-items: flex-end;
}

.order__details-details-left {
	display: flex;
	flex: 2.5;
	align-items: flex-start;
	justify-content: space-between;
	padding: 0 30px 0 0;
}

.order__details-cancel__order {
	font-size: 13px;
	color: rgba(239, 5, 61, 1);
	text-decoration: underline;
}

.order__details-details-right {
	flex: 1.5;
}

.order__details-details__item {
	/* flex: 1; */
	font-weight: 400;
	font-size: 10px;
	line-height: 12px;
	letter-spacing: 0.01em;

	/* Grey 2 */
	color: #707070;
}

.order__details-details__item span {
	display: block;
	font-weight: 600;
	font-size: 12px;
	line-height: 15px;
	/* identical to box height */
	letter-spacing: 0.05em;

	/* Black 2 */
	color: #111111;
	padding: 5px 0 0;
}

.order__details-ticket {
	margin: 0 0 30px;
}

.order__details-meetings_instructions {
	margin: 30px 0 0;
	padding: 0 16px;
}

.order__details-meetings_content p,
.order__details-meetings_content ul li,
.order__details-meetings_content ol {
	font-weight: 400;
	font-size: 13px;
	line-height: 150%;
	letter-spacing: 0.01em;
	color: white;
	font-family: inherit;
}

body.lightMode .order__details-meetings_content p,
body.lightMode .order__details-meetings_content ul li,
body.lightMode .order__details-meetings_content ol {
	color: #111;
}

.order__details-meetings_head {
	font-size: 15px;
	font-weight: 600;
	color: #fff;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

body.lightMode .order__details-meetings_head {
	color: #000;
}

.order__details-meetings_content ul {
	margin: 0;
	padding: 0 0 0 30px;
}

.order__details-bottomCTAs {
	position: fixed;
	bottom: 0;
	width: 420px;
	left: 0;
	max-width: 100%;
	right: 0;
	margin: auto;
	height: 60px;
	line-height: 60px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.order__details-invoice,
.order__details-support {
	flex: 1;
	font-size: 16px;
	line-height: 20px;
	/* identical to box height */
	text-align: center;
	letter-spacing: 0.01em;
	font-weight: 700;
	height: inherit;
	line-height: inherit;
}

.order__details-support {
	background: #fde723;
}

.order__details-support a {
	color: inherit;
	text-decoration: none;
	height: inherit;
	display: block;
	width: inherit;
}

.order__details-invoice {
	background: #15151d;
	color: #fff;
}

.order__details-invoice svg,
.order__details-support svg {
	margin: 0 8px 0 0;
	height: 17px;
}

span.order__details-host {
	display: flex;
	align-items: center;
	font-size: 10px;
	color: #fde723;
	cursor: pointer;
	height: 50px;
	margin-top: -25px;
	padding-top: 30px;
}

body.lightMode span.order__details-host {
	color: #056b6b;
}

span.order__details-host svg path {
	stroke: #fde723;
}

body.lightMode span.order__details-host svg path {
	stroke: #056b6b;
}

.order__details-contact__host {
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: space-between;
	max-width: 90%;
	margin: auto;
	background: #fde723;
	margin: -20px auto 0;
	padding: 20px 0 0;
	border-radius: 10px;
}

.order__details-contact__host-chat,
.order__details-contact__host-call {
	text-align: center;
	flex: 1;
	height: 45px;
	line-height: 50px;
	font-size: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 500;
	cursor: pointer;
}

.order__details-contact__host-chat svg,
.order__details-contact__host-call svg {
	height: 18px;
	width: auto;
	margin: 0 10px 0 0;
}

.order__details-contact__host-call {
	border-left: 1px solid #1e1e2d;
}

/*------------------ Contact Us ------------------*/

.contacUs__masthead {
	margin: 0 0 50px;
	color: #fff;
}

.contactUs__masthead-item {
	margin: 0 0 25px;
	padding: 0 16px;
}

.contactUs__masthead-item__title {
	font-size: 16px;
	font-weight: 600;
	color: #fde723;
	margin: 0 0 10px;
}

body.lightMode .contactUs__masthead-item__title {
	color: #056b6b;
}

.contactUs__masthead-item__content {
	font-size: 12px;
	line-height: 1.5;
	color: #eeee;
}

body.lightMode .contactUs__masthead-item__content {
	color: #1d1d1d;
}

.contactUs__masthead-item__content a {
	color: #eee;
	padding: 0 0 0 5px;
}

body.lightMode .contactUs__masthead-item__content a {
	color: #000;
}

form#contactUs__form {
	padding: 0 25px;
	color: #fff;
}

body.lightMode form#contactUs__form {
	color: #000;
}

form#contactUs__form .form__row {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	flex-wrap: nowrap;
	margin: 0 0 15px;
}

form#contactUs__form .form__column {
	flex: 1;
}

form#contactUs__form label {
	display: block;
	margin: 0 0 10px;
	font-size: 12px;
}

body.lightMode form#contactUs__form label {
	font-weight: 600;
}

form#contactUs__form input {
	width: 100%;
	height: 40px;
	border: 0;
	border-radius: 5px;
	outline: 0;
	padding-left: 15px;
	background: #0c0c18;
	color: #fff;
	font-family: inherit;
	font-size: 14px;
}

body.lightMode form#contactUs__form input {
	background: #eee;
	color: #000;
}

textarea#contactUs__description {
	width: 100%;
	border: 0;
	border-radius: 5px;
	padding: 15px;
	background: #0c0c18;
	color: #fff;
	outline: 0;
	font-family: inherit;
	font-size: 14px;
}

body.lightMode textarea#contactUs__description {
	background: #ccc;
	color: #000;
}

.contactUs__form-head {
	color: #fff;
	margin: -25px 0 15px;
	font-size: 16px;
	color: #fde723;
	font-weight: 700;
	padding: 0 16px;
}

body.lightMode .contactUs__form-head {
	color: #056b6b;
	font-weight: 700;
}

form#contactUs__form .form__submit button {
	width: 175px;
	height: 45px;
	background: #fde723;
	border: 0;
	border-radius: 6px;
	font-size: 16px;
	font-weight: 600;
}

.contactUs__page {
	padding: 0 0 50px;
}

form#contactUs__form .form__err p {
	font-size: 14px;
	background: #cf000f;
	padding: 15px;
	color: #fff;
}

.contactUs__masthead-item__content ul {
	margin: 0;
	padding: 0;
	display: flex;
	justify-content: flex-start;
}

.contactUs__masthead-item__content ul li {
	list-style: none;
	margin: 0 10px 0 0;
}

.contactUs__masthead-item__content ul li svg {
	height: 18px;
	width: auto;
}

.contactUs__masthead-item__content ul li svg path {
	fill: white;
}

body.lightMode .contactUs__masthead-item__content ul li svg path {
	fill: #000;
}

form#contactUs__form input::placeholder,
textarea#contactUs__description::placeholder {
	font-size: 12px;
}

/*---------------- Sky Scanner ----------------*/

a.head__skyScanner:after {
	content: "New";
	position: absolute;
	top: -6px;
	right: -14px;
	font-size: 8px;
	background: #cf000f;
	height: 12px;
	width: 25px;
	line-height: 12px;
	border-radius: 2px;
	animation: blinker 1s linear infinite;
}

@keyframes blinker {
	50% {
		opacity: 0;
	}
}

/*---------------- Flights & Hotels ----------------*/

div#main__flightHotels-box {
	position: absolute;
	width: 100%;
	height: 100vh;
	border-radius: 10px 10px 0 0;
	overflow-y: scroll;
}

body.lightMode div#main__flightHotels-box {
	background: inherit;
}

div#main__flightHotels-box {
	background-color: #15151f;
}

body.lightmode div#main__flightHotels-box {
	background-color: #fdfdfd;
}

.flightHotels__header {
	line-height: 65px;
	text-align: center;
	font-size: 18px;
	font-weight: 600;
	color: #fde723;
}

body.lightMode .flightHotels__header {
	background: #1d1d1d;
}

.flights_background_info {
	position: relative;
}

.flights_description {
	background: linear-gradient(180deg,
			#15151f 10.73%,
			rgb(30 30 45 / 57%) 41.38%,
			rgba(30, 30, 45, 0.1) 83.55%,
			rgba(30, 30, 45, 0) 132.34%);
	margin: 0 0px;
	position: absolute;
	top: 0px;
	/* height: 50%; */
	font-size: 14px;
	text-align: center;
	color: #eee;
	letter-spacing: 0.5px;
	line-height: 1.5;
}

body.lightMode .flights_description {
	background: linear-gradient(180deg,
			#fdfdfd 10.73%,
			#fdfdfd4f 41.38%,
			#fdfdfd00 83.55%,
			#fdfdfd00 196.34%);
}

.hotels_description {
	background: linear-gradient(180deg,
			#15151f 10.73%,
			rgb(30 30 45 / 65%) 41.38%,
			rgba(30, 30, 45, 0.1) 83.55%,
			rgba(30, 30, 45, 0) 132.34%);
	position: absolute;
	height: 60%;
	margin: 0px;
	color: #eee;
	text-align: center;
	top: -1px;
	letter-spacing: 0.5px;
	line-height: 1.5;
}

body.lightMode .hotels_description {
	background: linear-gradient(180deg,
			#fdfdfd 10.73%,
			#fdfdfd4f 41.38%,
			#fdfdfd00 83.55%,
			#fdfdfd00 196.34%);
	color: #111;
}

.flightHotels__offer {
	max-height: 400px;
	margin: 0;
}

.flightHotels__offer img {
	max-height: inherit;
	object-fit: cover;
}

.flightHotels__offer.hotelsImage {
	margin: 0px;
}

.hotelsImage img {
	height: 60vh;
	width: 100%;
	margin: 0px;
}

.flights_description p,
.hotels_description p {
	font-size: 13px;
	padding: 0 40px;
	line-height: 1.5;
	font-weight: 100;
}

body.lightMode .flights_description p {
	color: #111;
	font-weight: 500;
}

.flights_description h3,
.hotels_description h3 {
	font-size: 18px;
	font-weight: 600;
}

body.lightMode .flights_description h3,
body.lightMode .hotels_description h3 {
	font-weight: 600;
}

.flight_hotel-title {
	display: none;
}

@media screen and (max-width: 376px) {
	.flights_description {
		height: 40%;
	}

	body.lightMode .flights_description {
		background: linear-gradient(180deg,
				#fdfdfd 10.73%,
				#fdfdfd3b 41.38%,
				#fdfdfd00 83.55%,
				#fdfdfd00 196.34%);
	}

	.hotels_description {
		height: 50%;
	}
}

@media screen and (max-height: 680px) {
	.flights_description {
		background: linear-gradient(180deg,
				#15151f 10.73%,
				rgba(30, 30, 45, 0.86) 41.38%,
				rgba(30, 30, 45, 0.1) 83.55%,
				rgba(30, 30, 45, 0) 132.34%);
		margin: 0 0px;
		height: 30%;
	}

	body.lightMode .flights_description {
		background: linear-gradient(180deg,
				#fdfdfd 10.73%,
				#fdfdfd 41.38%,
				#fdfdfd00 83.55%,
				#fdfdfd00 196.34%);
	}

	.flightHotels__offer {
		max-width: 450px;
		float: right;
		margin: 0px 0;
	}

	.hotels_description {
		height: 57%;
	}
}

/*--------------- My Orders ---------------*/

div#secondary .secondary__tab.ordersBody {
	background: #15151f;
}

div#secondary .secondary__tab.ordersBody .drawerHeader {
	display: flex;
	max-height: 60px;
}

.allOrders__page {
	padding: 60px 0;
}

.allOrders__item {
	background: #1e1e2d;
	border-radius: 10px;
	padding: 10px 16px;
	width: 95%;
	margin: 0 auto 10px;
	cursor: pointer;
}

body.lightMode .allOrders__item {
	background-color: #f5f5f5;
}

.allOrders__item-head {
	display: flex;
	align-items: top;
	flex-direction: row;
	justify-content: space-between;
	margin: 0 0 15px;
}

.allOrders__item-head__left {
	flex: 3;
}

.allOrders__item-head__right {
	flex: 1;
	text-align: right;
}

.allOrders__item-head__left h4 {
	font-size: 14px;
	color: #fff;
	line-height: 1.5;
	margin: 0 0 4px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

body.lightMode .allOrders__item-head__left h4 {
	color: #000;
}

.allOrders__item-host {
	color: #bbb;
	font-size: 10px;
	margin: 0 0 4px;
}

body.lightMode .allOrders__item-host {
	color: #555;
}

.allOrders__item-price {
	font-size: 12px;
	color: #eee;
	display: flex;
	justify-content: space-between;
}

body.lightMode .allOrders__item-price {
	color: #111;
}

.allOrders__item-price span {
	color: #fde723;
	font-size: 13px;
	padding: 0 0 0 5px;
	font-weight: 500;
}

body.lightMode .allOrders__item-price span {
	color: #056b6b;
	font-weight: 600;
}

.allOrders__item-slots {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	align-items: flex-start;
	margin: 0 0 10px;
}

.allOrders__item-slot {
	color: #fff;
}

span.allOrders__item-slot__head {
	display: block;
	font-size: 10px;
	color: #bbb;
}

body.lightMode span.allOrders__item-slot__head {
	color: #555;
}

span.allOrders__item-slot__content {
	display: block;
	font-size: 12px;
	margin: 4px 0 0;
	font-weight: 600;
	color: #eee;
}

body.lightMode span.allOrders__item-slot__content {
	color: #111;
}

.allOrders__item-details {
	color: #fde723;
	font-size: 12px;
	font-weight: 600;
	text-align: right;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

body.lightMode .allOrders__item-details {
	color: darkcyan;
	font-weight: 500;
}

.allOrders__item-details svg {
	margin: 0 0 0 5px;
}

.allOrders__item-details svg path {
	stroke: #fde723;
}

body.lightMode .allOrders__item-details svg path {
	stroke: darkcyan;
}

.allOrders__item-status {
	height: 20px;
	font-size: 8px;
	padding: 0 10px;
	background: #056b6b;
	display: inline-block;
	line-height: 20px;
	border-radius: 4px;
	color: #fff;
	font-weight: 600;
	text-transform: capitalize;
}

.allOrders__item-payNow {
	width: calc(100% + 32px);
	margin: 15px -16px -10px;
	text-align: center;
	line-height: 48px;
	background: #fde723;
	border-radius: 0 0 10px 10px;
	color: #111;
	font-size: 16px;
	font-weight: 600;
	display: flex;
	justify-content: center;
	align-items: center;
}

.allOrders__item-payNow svg {
	margin: 0 0 0 5px;
}

.allOrders__item-payNow svg path {
	stroke: #000;
}

.allOrders__noOrders-text {
	text-align: center;
	padding: 10px 0 25px;
	font-size: 18px;
	color: #fff;
	border-bottom: 1px solid #1e1e2d;
	margin: 0 auto 25px;
	max-width: 80%;
}

body.lightMode .allOrders__noOrders-text {
	color: #000;
	border-color: #eee;
}

.allOrders__noOrders-button {
	width: 250px;
	max-width: 100%;
	height: 40px;
	margin: auto;
	text-align: center;
	background: #fde723;
	line-height: 40px;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

/*----------------- Coupon Drawer -----------------*/

.coupon__item {
	margin: 0 16px;
	background: #15151d;
	display: flex;
	border-radius: 10px;
	cursor: pointer;
}

.coupon__type {
	flex: 1;
	background-color: #fde723;
	position: relative;
	border-radius: 10px 0 0 10px;
}

.coupon__type span {
	transform: rotate(-90deg);
	color: #111111;
	font-size: 12px;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	line-height: 18px;
	letter-spacing: 0.12px;
	word-wrap: break-word;
	display: block;
	width: 100px;
	height: 106px;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	text-align: center;
	padding: 8px 0 0;
	text-transform: uppercase;
}

.coupon__box {
	flex: 12;
	padding: 11px 16px;
}

.coupon__box-head {
	display: flex;
	margin: 0 0 12px;
	justify-content: space-between;
}

.coupon__title {
	font-size: 16px;
	color: #fff;
	font-weight: 600;
}

.coupon__subTitle {
	font-size: 12px;
	margin: 4px 0 0;
	color: #ddd;
	font-weight: 600;
}

.coupon__box-description {
	font-size: 11px;
	line-height: 1.5;
	color: #b9af2e;
	font-weight: 600;
}

.coupon__apply {
	font-size: 14px;
	color: #fde723;
	font-weight: 600;
}

/*---------------- Feed Login ----------------*/

.feed__login-sticky {
	position: fixed;
	bottom: 70px;
	height: 110px;
	background: #fde723;
	color: black;
	display: flex;
	z-index: 5;
	font-size: 16px;
	padding: 0 16px;
	justify-content: space-between;
	align-items: center;
	line-height: 1.4;
	width: 100%;
	display: none;
}

body.lightMode .feed__login-sticky {
	background: #fde723;
	color: #111;
	font-weight: 600;
}

.feed__login-right {
	display: flex;
	/* justify-content: space-between; */
	flex-direction: column-reverse;
	align-items: center;
	gap: 5px;

}

.feed__login-cta {
	line-height: 28px;
	border-radius: 6px;
	background: #61ffff;
	margin: 0 5px;
	color: #000;
	font-weight: 500;
	cursor: pointer;
	font-size: 0.75rem;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (min-width: 576px) {
	.feed__login-sticky {
		height: 80px;
	}

	.feed__login-cta {
		width: 100px;
		padding: 0;
	}
}

@media screen and (max-width: 380px) {
	.feed__login-cta {
		font-size: 0.6rem;
	}
}

.feed__login-login {
	background: #000;
	margin-right: 0;
	color: white;
}

/*------------------- Services -------------------*/

.marketplace__localServices-box {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	max-width: 760px;
	margin: auto;
	gap: 30px 15px;
}

.main__container_services {
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	display: inline-flex;
	/* background: #1e1e2d; */
	cursor: pointer;
	flex: 1;
}

.second__container_services {
	width: 364px;
	height: 231px;
	position: relative;
	background: #1e1e2d;
	border-radius: 10px;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
	max-width: 100%;
}

body.lightMode .second__container_services {
	background: #fdfdfd;
}

.service_container_info_box {
	width: 348px;
	height: 56px;
	left: 8px;
	top: 156px;
	position: absolute;
	background: #1e1e2d;
}

body.lightMode .service_container_info_box {
	background: #fdfdfd;
	color: #1d1d1d;
}

.service_category_box {
	width: 136px;
	height: 12px;
	left: 0;
	top: 24px;
	position: absolute;
}

.service_catgeory_icon {
	width: 12px;
	height: 12px;
	left: 0;
	top: 0;
	position: absolute;
}

.chat__with-icon {
	width: 110px;
	height: 30px;
	left: 246px;
	top: 191px;
	position: absolute;
}

.chat__text {
	left: 0;
	top: 7px;
	position: absolute;
	text-align: center;
	color: #eee;
	font-size: 14px;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	letter-spacing: 0.14px;
	word-wrap: break-word;
}

body.lightMode .chat__text {
	color: #111;
}

.service__image {
	width: 364px;
	height: 148px;
	left: 0;
	top: 0;
	position: absolute;
	border-radius: 10px;
	object-fit: cover;
}

.service__provider-rating {
	left: 18px;
	top: 2px;
	position: absolute;
	color: #fff;
	font-size: 10px;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	letter-spacing: 0.1px;
	word-wrap: break-word;
}

.service__name {
	width: 220px;
	left: 0;
	top: 0;
	position: absolute;
	color: #fff;
	font-size: 13px;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	letter-spacing: 0.16px;
	word-wrap: break-word;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 80ch;
	white-space: nowrap;
}

body.lightMode .service__name {
	color: #111;
	font-size: 15px;
}

.service__provider-name {
	width: 180px;
	left: 0;
	top: 44px;
	position: absolute;
	color: #bbb;
	font-size: 10px;
	font-family: "Montserrat", sans-serif;
	font-weight: 600;
	letter-spacing: 0.1px;
	word-wrap: break-word;
	overflow: hidden;
	max-width: 80ch;
	white-space: nowrap;
	text-overflow: ellipsis;
}

body.lightMode .service__provider-name {
	color: #111;
	font-weight: 700;
	font-size: 11px;
}

.service__location {
	width: 100px;
	right: 0px;
	top: 5px;
	color: #fde723;
	text-overflow: ellipsis;
	word-wrap: break-word;
	overflow: hidden;
	max-width: 40ch;
	white-space: nowrap;
	position: absolute;
	text-align: right;
	padding: 0 10px 0 0;
	font-size: 12px;
	font-weight: 600;
}

.service__type {
	left: 20px;
	top: 4px;
	position: absolute;
	color: #ddd;
	font-size: 9px;
	font-family: "Montserrat", sans-serif;
	font-weight: 500;
	letter-spacing: 0.08px;
	width: 100%;
	word-wrap: break-word;
}

body.lightMode .service__type {
	color: #111;
}

.service__icon {
	max-width: 15px;
	max-height: 15px;
	background: #fff;
}

.service__cost {
	width: 130px;
	right: 0;
	top: 1px;
	position: absolute;
	text-align: right;
}

.service_cost_info {
	color: #fde723;
	font-size: 12px;
	font-family: "Montserrat", sans-serif;
	font-weight: 600;
	letter-spacing: 0.12px;
	word-wrap: break-word;
}

body.lightMode .service_cost_info {
	color: #056b6b;
	font-weight: 700;
}

.service_costPerTime {
	color: #ffffff;
	font-size: 8px;
	font-family: "Montserrat", sans-serif;
	font-weight: 600;
	letter-spacing: 0.1px;
	word-wrap: break-word;
}

body.lightMode span.service_costPerTime {
	color: #707070;
	font-weight: 500;
	font-size: 10px;
}

.hidden_id span {
	display: none;
}

.services__booking-box {
	display: block;
}

.services__booking-box .services__booking-cta {
	width: 100%;
}

span.experience__price-gst.request__price {
	display: none;
}

span.experience__price.request__price {
	font-size: 18px;
}

.service__attributes-box,
.services__map-box {
	padding: 0 16px;
}

.service__attributes-head,
.services__map-head {
	font-size: 14px;
	color: #fff;
	margin: 0 0 20px;
	font-weight: 600;
}

body.lightMode .service__attributes-head,
body.lightMode .services__map-head {
	color: #000;
}

.service__attributes {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
}

.service__attribute svg {
	max-width: 10px;
	height: auto;
	margin: 0 5px 0 0;
}

.service__attribute {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	margin: 0 10px 10px 0;
	height: 30px;
	padding: 0 8px;
	background-color: #cdc475;
	border-radius: 14px;
	font-size: 10px;
	font-weight: 500;
}

body.lightMode .service__attribute {
	background-color: #f5f5f5;
	border: 0.5px solid var(--grey-1, #797886);
}

.services__map-box {
	margin: 25px 0 0;
}

.services__map-head span {
	font-size: 12px;
	display: block;
	color: #bbb;
	margin: 5px 0 15px;
	display: flex;
	align-items: center;
	flex-direction: row;
}

.services__map-head span svg {
	width: 10px;
	height: auto;
	margin: 0 5px 0 0;
}

.services__map-head span svg path {
	stroke: white;
}

body.lightMode .services__map-head span svg path {
	stroke: #111;
}

.services__map-map iframe {
	border: 0;
	margin: 0;
}

span.cost__duration {
	font-size: 12px;
}

.services__head-search__box {
	padding: 0 0 20px;
}

body .services__head-search__box .experiences__search-box input {
	background: #1e1e2d;
	height: 50px;
}

body.lightMode .services__head-search__box .experiences__search-box input {
	background: #f5f5f5;
}

body .services__head-search__box .experiences__search-box {
	height: auto;
}

.interests__container {
	width: 100%;
	height: 48px;
	background: white;
	backdrop-filter: blur(50px);
}

.back__icon_container {
	width: 24px;
	height: 24px;
	left: 16px;
	top: 12px;
	position: absolute;
	justify-content: center;
	align-items: center;
	display: inline-flex;
}

.back__icon-inner {
	width: 24px;
	height: 24px;
	position: relative;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	display: flex;
}

.back__icon {
	width: 16px;
	height: 9.85px;
	border: 0.75px #111 solid;
}

.name__user {
	width: 200px;
	left: 48px;
	top: 14px;
	position: absolute;
	color: #111;
	font-size: 16px;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	letter-spacing: 0.16px;
	word-wrap: break-word;
}

.follow__container {
	width: 72px;
	height: 24px;
	left: 268px;
	top: 12px;
	position: absolute;
}

.empty_div2 {
	width: 72px;
	height: 24px;
	left: 0;
	top: 0;
	position: absolute;
	background: #056b6b;
	border-radius: 4px;
}

.empty_div3 {
	left: 24px;
	top: 4px;
	position: absolute;
	color: #fff;
	font-size: 12px;
	font-family: "Montserrat", sans-serif;
	font-weight: 500;
	letter-spacing: 0.12px;
	word-wrap: break-word;
}

.empty_div4 {
	width: 12px;
	height: 12px;
	left: 8px;
	top: 6px;
	position: absolute;
	justify-content: center;
	align-items: center;
	display: inline-flex;
}

.empty_div5 {
	width: 12px;
	height: 12px;
	position: relative;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	display: flex;
}

.empty_div6 {
	width: 6px;
	height: 6px;
	position: relative;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	display: flex;
}

.empty_div7 {
	width: 24px;
	height: 24px;
	left: 356px;
	top: 12px;
	position: absolute;
	justify-content: center;
	align-items: center;
	display: inline-flex;
}

.empty_div8 {
	width: 24px;
	height: 24px;
	position: relative;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	display: flex;
}

.empty_div9 {
	width: 3.69px;
	height: 16px;
	position: relative;
}

.empty_div10 {
	width: 3.69px;
	height: 3.69px;
	left: 0;
	top: 6.15px;
	position: absolute;
	background: #111;
}

.empty_div11 {
	width: 3.69px;
	height: 3.69px;
	left: 0;
	top: 0;
	position: absolute;
	background: #111;
}

.empty_div12 {
	width: 3.69px;
	height: 3.69px;
	left: 0;
	top: 12.31px;
	position: absolute;
	background: #111;
}


.title {
	left: 24px;
	top: 0;
	position: absolute;
	opacity: 0.85;
	color: #056b6b;
	font-size: 16px;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	letter-spacing: 0.16px;
	word-wrap: break-word;
}

.icon-container {
	width: 20px;
	height: 20px;
	left: 0;
	top: 0;
	position: absolute;
	opacity: 0.85;
	justify-content: center;
	align-items: center;
	display: inline-flex;
}

.icon-box {
	width: 20px;
	height: 20px;
	position: relative;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	display: flex;
}

.icon {
	width: 13.33px;
	height: 13.32px;
	background: #056b6b;
}

.top__bar {
	width: 100%;
	height: 48px;
	background: #000;
	flex-shrink: 0;
	backdrop-filter: blur(25px);
}

.back__icon {
	display: flex;
	width: 24px;
	height: 24px;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
}

.user__name {
	display: flex;
	width: 200px;
	left: 48px;
	top: 14px;
	position: absolute;
	flex-direction: column;
	flex-shrink: 0;
	color: white;
	font-family: "Montserrat", sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
	letter-spacing: 0.16px;
}

.follow__button {
	width: 72px;
	height: 24px;
	flex-shrink: 0;
	left: 268px;
	top: 12px;
	position: absolute;
	font-size: 12px;
	font-family: "Montserrat", sans-serif;
	font-weight: 500;
	background: #056b6b;
	border-radius: 4px;
	color: #fff;
	letter-spacing: 0.12px;
	word-wrap: break-word;
	text-align: center;
}

.menu__icon {
	display: flex;
	width: 24px;
	height: 24px;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
}

.TopBar {
	width: 396px;
	height: 48px;
	position: relative;
}

.Rectangle2 {
	width: 396px;
	height: 48px;
	left: 0px;
	top: 0px;
	position: absolute;
	background: white;
	backdrop-filter: blur(50px);
}

.Group33716 {
	width: 72px;
	height: 24px;
	left: 268px;
	top: 12px;
	position: absolute;
}

.Rectangle9 {
	width: 72px;
	height: 24px;
	left: 0px;
	top: 0px;
	position: absolute;
	background: #056b6b;
	border-radius: 4px;
}

.Follow {
	left: 24px;
	top: 4px;
	position: absolute;
	color: white;
	font-size: 12px;
	font-family: "Montserrat", sans-serif;
	font-weight: 500;
	letter-spacing: 0.12px;
	word-wrap: break-word;
}

.Icons {
	width: 12px;
	height: 12px;
	left: 8px;
	top: 6px;
	position: absolute;
	justify-content: center;
	align-items: center;
	display: inline-flex;
}

.Component3 {
	width: 12px;
	height: 12px;
	padding: 1.76px;
	justify-content: center;
	align-items: center;
	display: inline-flex;
}

.Vector {
	width: 6px;
	height: 6px;
	transform: rotate(-45deg);
	transform-origin: 0 0;
	border: 0.75px white solid;
}

.AishaChawla {
	width: 200px;
	left: 48px;
	top: 14px;
	position: absolute;
	color: #111111;
	font-size: 16px;
	font-family: "Montserrat", sans-serif;
	font-weight: 700;
	letter-spacing: 0.16px;
	word-wrap: break-word;
}

.Group {
	flex: 1 1 0;
	align-self: stretch;
	position: relative;
}

.Icons {
	width: 24px;
	height: 24px;
	left: 356px;
	top: 12px;
	position: absolute;
	justify-content: center;
	align-items: center;
	display: inline-flex;
}

.Component3 {
	width: 24px;
	height: 24px;
	padding-top: 4px;
	padding-bottom: 4px;
	justify-content: center;
	align-items: center;
	display: inline-flex;
}

.Vector {
	width: 3.69px;
	height: 3.69px;
	left: 0px;
	top: 6.15px;
	position: absolute;
	background: #111111;
}

.Vector {
	width: 3.69px;
	height: 3.69px;
	left: 0px;
	top: 0px;
	position: absolute;
	background: #111111;
}

.Vector {
	width: 3.69px;
	height: 3.69px;
	left: 0px;
	top: 12.31px;
	position: absolute;
	background: #111111;
}

.Icons {
	width: 24px;
	height: 24px;
	left: 16px;
	top: 12px;
	position: absolute;
	justify-content: center;
	align-items: center;
	display: inline-flex;
}

.Component3 {
	width: 24px;
	height: 24px;
	padding-top: 7.08px;
	padding-bottom: 7.07px;
	padding-left: 4px;
	padding-right: 4px;
	justify-content: center;
	align-items: center;
	display: inline-flex;
}

.Vector {
	width: 16px;
	height: 9.85px;
	border: 0.75px #111111 solid;
}

.addPost__icon-container {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	justify-content: center;
	align-items: center;
}

/*---------------- LFB ----------------*/

.lfb__page {
	padding: 0 0 50px;
}

.lfb__item {
	padding: 16px 24px;
	color: #fff;
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: flex-start;
	margin: 0 0 10px;
	background: #1e1e2d;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
	cursor: pointer;
}

body.lightMode .lfb__item {
	background: #f5f5f5;
	color: #111;
}

.lfb__item-left {
	flex: 1;
}

.lfb__item-right {
	flex: 8;
}

.lfb__item-left svg {
	width: 20px;
	height: auto;
}

.lfb__item-left svg path {
	stroke: #fff;
}

body.lightMode .lfb__item-left svg path {
	stroke: #111;
}

.lfb__item-location {
	font-size: 16px;
	color: #fde723;
	margin: 0px 0 6px;
	font-weight: 600;
}

body.lightMode .lfb__item-location {
	color: #056b6b;
}

.lfb__item-line {
	font-size: 14px;
	color: #eee;
}

body.lightMode .lfb__item-line {
	color: #111;
}

/*----------------- Contacted Leads -----------------*/

.leads__tab {
	display: flex;
	color: #bbb;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	flex-wrap: nowrap;
	height: 60px;
	padding: 0 24px;
}

.leads__tab-item {
	text-align: center;
	flex: 1;
	height: inherit;
	cursor: pointer;
	font-size: 14px;
	font-weight: 500;
	line-height: 60px;
}

.leads__tab-item.active {
	color: #fff;
	border-bottom: 4px solid #fde723;
}

body.lightMode .leads__tab-item.active {
	color: #000;
}

.leads__tab-body {
	color: #eee;
	padding: 25px 0 50px;
}

.leads__noLeads {
	font-size: 18px;
	text-align: center;
}

.lead__item {
	margin: 0 0 10px;
	background: #1e1e2d;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: row;
	padding: 16px 24px;
	cursor: pointer;
}

.lead__item-left img {
	width: 60px;
	height: 60px;
	object-fit: cover;
	border-radius: 50%;
}

.lead__item-content {
	padding: 0 0 0 15px;
	flex: 6;
}

.lead__item-top {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: flex-start;
	margin: 0 0 15px;
}

.lead__item-top-left {
	flex: 4;
}

.lead__item-top-right {
	flex: 1;
}

.lead__item-bottom-header {
	font-size: 13px;
	color: #fff;
	font-weight: 500;
	padding: 0 0 5px;
	display: none;
}

.lead__item-connect {
	background: #fde723;
	color: #000;
	font-size: 12px;
	padding: 7px 10px;
	border-radius: 5px;
	font-weight: 500;
}

.lead__item-titbits svg {
	width: 10px;
	height: auto;
	margin: 0 5px 0 0;
}

.lead__item-titbits {
	font-size: 12px;
	color: #bbb;
	margin: 7px 0 0;
}

.lead__item-titbits svg path {
	fill: white;
}

.lead__item-name {
	font-size: 14px;
	font-weight: 600;
}

.lead__item-bottom {
	font-size: 12px;
	color: #eee;
}

.lead__item-listing {
	padding: 0 0 5px;
}

.lead__item-date {
	font-size: 10px;
	color: #bbb;
}

span.lead__item-followers {
	padding: 0 5px 0 0;
}

span.lead__item-posts {
	padding: 0 0 0 5px;
}

.leads__tab-body-item {
	display: none;
}

.leads__tab-body-item.active {
	display: block;
}

/*------------ This is for Shots feed Cards ------------*/

.shots_container {
	position: relative;
	background: #1e1e2d;
	margin: 0 0 15px;
	border-radius: 5px;
	box-shadow: black 0px 0px 10px 1px;
	box-sizing: border-box;
	color: white;
	padding: 16px 0 16px 16px;
}

body.lightMode .shots_container {
	background: #fff;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.11);
}

body.lightMode .shots_container {
	background: #fff;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.11);
}

.shots_thumbnail {
	width: 100%;
	background-repeat: no-repeat;
	background-size: contain;
	height: inherit;
	border-radius: 8px;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);
	position: relative;
}

.shots_wrapper {
	width: 100%;
	height: 400px;
	position: relative;
	margin: 0px 0 0 10px;
}

.shots-slide {
	text-align: center;
	font-size: 18px;
	background: inherit;
	display: flex;
	justify-content: center;
	align-items: center;
	height: inherit;
	cursor: pointer;
	border-radius: 8px;
}

.shots_redirect {
	display: flex;
	font-size: 11px;
	justify-content: flex-end;
	right: 10px;
	align-items: center;
	font-weight: 500;
	color: #eee;
	cursor: pointer;
}

body.lightMode .shots_redirect {
	color: #8f8f8f;
	font-size: 13px;
	font-weight: 500;
}

body.lightMode .shots_redirect {
	color: #8f8f8f;
	font-size: 13px;
	font-weight: 500;
}

.shots_redirect svg {
	margin: 0 6px 0 0;
	width: 15px;
	height: auto;
}

.shot_row {
	display: flex;
	place-content: center space-between;
	align-items: flex-end;
	margin: 0 0 16px;
	padding: 0 16px 0 0;
}

.shots_thumbnail video {
	height: inherit;
	width: 100%;
	object-fit: cover;
	border-radius: 6px;
}

.shots_redirect svg path {
	fill: white;
}

.shots_thumbnail svg path {
	fill: white;
}

body.lightMode .shots_redirect svg path {
	fill: #1d1d1d;
}

.shot_row h4 {
	margin: 0px;
	color: #fde726;
}

body.lightMode .shot_row h4 {
	color: #1d1d1d;
	font-weight: 600;
}

.shots_thumbnail span {
	position: absolute;
	bottom: 10px;
	font-size: 13px;
	left: 14px;
	color: rgb(241, 241, 241);
	font-weight: normal;
	letter-spacing: 0.5px;
}

body.lightMode .shots_thumbnail span {
	color: #ffffff;
	font-weight: 600;
	font-size: 13px;
}

.shots_thumbnail svg {
	padding: 7px;
	position: absolute;
	top: 0px;
	right: 0px;
}

/*----- Partner cards ----- */

.topCard.topCardSwiper {
	margin: 0 0 15px 0px;
	width: 100%;
	position: relative;
	box-shadow: 0px 4px 5px 0 rgb(0 0 0 / 80%);
	max-width: 470px;
	margin: 0 auto 15px;
	overflow: hidden;
}

body.lightMode .topCard {
	box-shadow: 0px 1px 5px 1px #d6d6d6;
}

.top_card-wrapper {
	height: inherit;
	width: inherit;
	display: flex;
}

.top_card-slide {
	height: 100%;
	margin: inherit;
	position: relative;
	display: flex;
	flex-shrink: 0;
	justify-content: space-evenly;
	width: 100%;
	align-items: center;
	flex-direction: row;
}

img#top_card_image {
	height: fit-content;
	max-height: 200px;
	width: 100%;
}

/* Styles for screen size 520px to 699px */
@media (min-width: 520px) and (max-width: 699px) {
	img#top_card_image {
		max-height: 250px;
	}
}

/* Styles for screen size 700px to 2280px */
@media (min-width: 700px) and (max-width: 2280px) {
	img#top_card_image {
		max-height: 350px;
	}
}

/*------Travel Influencer------*/

.influencer_container {
	height: 100%;
	border-radius: 3px;
	box-sizing: border-box;
	color: white;
	padding: 16px;
}

body.lightMode .influencer_container {
	background: #fff;
	border-radius: 8px 0 0px 8px;
	color: black;
	margin-bottom: 8px;
}


.influencer_title_box u {
	padding: 0;
	/* display: none; */
}

.influencer_wrapper {
	display: flex;
	position: relative;
	overflow: auto;
	scrollbar-width: none;
	width: calc(100% + 32px);
}

.influencer_title_box h4 {
	font-size: 13px;
	cursor: pointer;
	font-weight: 400;
}

h4#card_title {
	margin: 0 0 0 10px;
	font-weight: 600;
	font-size: 15px;
}

.influencer_title_box {
	display: flex;
	place-content: center space-between;
	align-items: center;
	height: 30px;
	padding: 0 0 13px;
}

.inf_profile_box {
	min-width: 40%;
	margin: 5px 0px 10px 10px;
	box-shadow: black 0px 1px 2px 0px;
	border-radius: 4px;
	text-align: center;
	height: 340px;
	cursor: pointer;
	border: .1px solid yellow;
	width: fit-content;
	max-width: 50%;
}

body.lightMode .inf_profile_box {
	background: #fde723;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.11);
	border: 1px solid #d4d4d4;
	border-radius: 5px;
}


.inf_back_box {
	height: 45%;
	width: auto;
	position: relative;
}

.inf_back_box img {
	height: 100%;
	width: 100%;
	border-radius: 6px;
	object-fit: cover;
}

.inf_back_box:before {
	content: "";
	background: rgb(0, 0, 0);
	background: linear-gradient(180deg,
			rgba(0, 0, 0, 1) 0%,
			rgb(27 26 26 / 83%) 40%,
			rgb(255 255 255 / 0%) 100%);
	position: absolute;
	width: 100%;
	height: 60%;
	left: 0;
	border-radius: 4px;
}

body.lightMode .inf_back_box:before {
	background: linear-gradient(180deg,
			rgba(0, 0, 0, 0.4) 10%,
			rgb(27 26 26 / 10%) 40%,
			rgb(255 255 255 / 0%) 100%);
}

.location_title {
	text-align: right;
	padding: 0;
	color: #fde723;
	font-size: 13px;
	font-weight: 500;
	top: 0;
	right: 0;
	margin: 10px 10px 0 0;
	position: absolute;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.profile_info {
	position: relative;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	margin-bottom: 10px;
	color: #fde723;
}

.profile_info img {
	height: 100px;
	width: 100px;
	border-radius: 10%;
	display: flex;
	top: -40px;
	position: relative;
	justify-content: flex-end;
	/* margin: 0 0 0 8px; */
	align-content: flex-end;
	flex-direction: row;
	align-items: center;
}

p.expertise {
	margin: 3px 0 0 0px;
	font-size: 12px;
	text-align: center;
	font-weight: 500;
}

.name_expertise_box {
	float: right;
	margin-right: 20px;
	margin-top: 2px;
}

h4.prof_name {
	font-size: 18px;
	margin: 0px;
	text-align: center;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	word-break: break-word;
	font-weight: 600;
}

body.lightMode h4.prof_name {
	font-weight: 600;
	color: #1d1d1d;
}

.name_expertise_box {
	float: right;
	margin-right: 20px;
	margin-left: 10px;
	margin-top: -30px;
}

body.lightMode .name_expertise_box,
body.lightMode .infl_category_box {
	color: #000;
}

.infl_category_box {
	padding: 6px 0 0;
	color: #fde723;
}

li.infl_categories img {
	width: 25px;
	height: auto;
	padding: 0 0 5px;
}

body.lightMode .infl_categories img {
	background: #000;
}

ul.infl_category_type {
	list-style: none;
	display: flex;
	justify-content: center;
	align-content: space-around;
	align-items: center;
	flex-direction: row;
	padding: 0px;
	margin: 0px;
	font-size: 10px;
}

li.infl_categories {
	display: flex;
	flex-direction: column;
	margin: -7px 8px 0px 8px;
	align-items: center;
	font-size: 8px;
	font-weight: 500;
	gap: 5px;
}

li.infl_categories svg {
	padding: 0px 0px 4px 0;
	height: 20px;
	width: auto;
}

/* ------ premium cards style --------- */

.premium_cards_container {
	margin-bottom: 8px;
	box-sizing: border-box;
	height: 100%;
	width: 100%;
	position: relative;
}

.premium_cards_slider img {
	width: 100%;
	box-shadow: 3px 3px 5px 0 rgb(0 0 0 / 80%);
}

body.lightMode .premium_cards_slider img {
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.11);
}

/* ------------ Trending Shots Cards ---------- */

.trending_locations_wrapper {
	height: 165px;
	width: 100%;
	position: relative;
	margin: 0 0 15px 10px;
	overflow: auto;
	scrollbar-width: none;
	display: flex;
	flex-direction: row;
	gap: 10px;
}

.trending_locations_titlebox {
	color: #fde726;
	padding: 9px 0px 20px 12px;
	font-family: inherit;
	font-size: 14px;
}

h4#trend_locations {
	margin: 0px;
}

body.lightMode h4#trend_locations {
	color: #1d1d1d;
	font-weight: 600;
}

.trending_locations_cardbox {
	width: 100%;
	height: auto;
	position: relative;
	font-size: 16px;
	background: #1e1e2d;
	box-shadow: 3px 3px 5px 0 rgb(0 0 0 / 80%);
	padding: 10px 12px 0px;
	margin-bottom: 8px;
}

h5#name_locations {
	font-size: 16px;
	font-weight: 500;
}

body.lightMode .trending_locations_cardbox {
	background: #fff;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.11);
}

body.lightMode .trending_locations_cardbox {
	background: #fff;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.11);
}

.name_views_box {
	position: absolute;
	bottom: 0px;
	color: white;
	font-weight: normal;
	left: 10px;
	font-size: 20px;
	z-index: 1;
}

.no_of_views_box {
	position: absolute;
	font-size: 12px;
	display: flex;
	align-items: center;
	bottom: 4px;
	left: 10px;
	color: white;
	z-index: 1;
}

span#no_of_views {
	margin-left: 8px;
	font-size: 12px;
}

.no_of_views_box svg {
	width: 18px;
}

.trending_location_indvcard {
	min-width: 50%;
	position: relative;
	height: 150px;
	cursor: pointer;
}

.trending_location_indvcard:before {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
	z-index: 1;
	border-radius: 10px;
}

.trending_location_indvcard img {
	height: inherit;
	width: 100%;
	position: relative;
	z-index: 0;
	object-fit: unset;
	border-radius: 10px;
}

/*---------------- LFB ----------------*/

.lfb__page {
	padding: 0 0 50px;
}

.lfb__item {
	padding: 16px 24px;
	color: #fff;
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: flex-start;
	margin: 0 0 10px;
	background: #1e1e2d;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
	cursor: pointer;
}

.lfb__item-left {
	flex: 1;
}

.lfb__item-right {
	flex: 8;
}

.lfb__item-left svg {
	width: 20px;
	height: auto;
}

.lfb__item-left svg path {
	stroke: #fff;
}

.lfb__item-location {
	font-size: 16px;
	color: #fde723;
	margin: 0px 0 6px;
	font-weight: 600;
}

.lfb__item-line {
	font-size: 14px;
	color: #eee;
}

/*----------------- Contacted Leads -----------------*/

.leads__tab {
	display: flex;
	color: #bbb;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	flex-wrap: nowrap;
	height: 60px;
	padding: 0 24px;
}

.leads__tab-item {
	text-align: center;
	flex: 1;
	height: inherit;
	cursor: pointer;
	font-size: 14px;
	font-weight: 500;
	line-height: 60px;
}

.leads__tab-item.active {
	color: #fff;
	border-bottom: 4px solid #fde723;
}

.leads__tab-body {
	color: #eee;
	padding: 25px 0 50px;
}

.leads__noLeads {
	font-size: 18px;
	text-align: center;
}

.lead__item {
	margin: 0 0 10px;
	background: #1e1e2d;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: row;
	padding: 16px 24px;
	cursor: pointer;
}

.lead__item-left img {
	width: 60px;
	height: 60px;
	object-fit: cover;
	border-radius: 50%;
}

.lead__item-content {
	padding: 0 0 0 15px;
	flex: 6;
}

.lead__item-top {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: flex-start;
	margin: 0 0 15px;
}

.lead__item-top-left {
	flex: 4;
}

.lead__item-top-right {
	flex: 1;
}

.lead__item-bottom-header {
	font-size: 13px;
	color: #fff;
	font-weight: 500;
	padding: 0 0 5px;
	display: none;
}

.lead__item-connect {
	background: #fde723;
	color: #000;
	font-size: 12px;
	padding: 7px 10px;
	border-radius: 5px;
	font-weight: 500;
}

.lead__item-titbits svg {
	width: 10px;
	height: auto;
	margin: 0 5px 0 0;
}

.lead__item-titbits {
	font-size: 12px;
	color: #bbb;
	margin: 7px 0 0;
}

.lead__item-titbits svg path {
	fill: white;
}

.lead__item-name {
	font-size: 14px;
	font-weight: 600;
}

.lead__item-bottom {
	font-size: 12px;
	color: #eee;
}

.lead__item-listing {
	padding: 0 0 5px;
}

.lead__item-date {
	font-size: 10px;
	color: #bbb;
}

span.lead__item-followers {
	padding: 0 5px 0 0;
}

span.lead__item-posts {
	padding: 0 0 0 5px;
}

.leads__tab-body-item {
	display: none;
}

.leads__tab-body-item.active {
	display: block;
}

/*-------------------- Service Provider Dashboard ----------------------*/

div#main__spDashboard-box {
	position: absolute;
	z-index: 5;
	width: 100%;
	background: #1e1e2d;
	height: 90vh;
	border-radius: 10px 10px 0 0;
	overflow-x: hidden;
}

body.lightMode div#main__spDashboard-box {
	background: #f5f5f5;
	border-radius: 0px;
}

.spDashboard__masthead,
.spDashboard__tod,
.spDashboard__listings {
	padding: 16px;
	background: #15151f;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
}

body.lightMode .spDashboard__tod,
body.lightMode .spDashboard__listings {
	background: #fff;
}

.spDashboard__masthead h3 {
	color: #fff;
	font-weight: 500;
	font-size: 22px;
	margin: 0 0 32px;
}

.spDashboard__masthead h3 span {
	padding: 0 0 0 5px;
	font-weight: 700;
}

.spDashboard__masthead-insights__box {
	display: flex;
	justify-content: space-between;
	flex-wrap: nowrap;
	align-items: flex-start;
	color: #fff;
}

.spDashboard__masthead-insights__item {
	flex: 1;
	text-align: center;
	cursor: pointer;
}

span.spDashboard__masthead-insights__item-number {
	display: block;
	font-size: 25px;
	font-weight: 600;
}

span.spDashboard__masthead-insights__item-text {
	font-size: 11px;
	color: #bbb;
}

.spDashboard__masthead p {
	font-size: 14px;
	margin: 0 0 20px;
	color: #ccc;
}

.spDashboard__masthead p {
	font-size: 14px;
	margin: 0 0 20px;
	color: #ccc;
}

.spDashboard__tod {
	margin: 6px 0;
	display: flex;
}

.spDashboard__tod-right {
	margin: 0 0 0 14px;
}

.spDashboard__tod-subtext {
	color: #bbb;
	font-size: 12px;
	margin: 0 0 5px;
}

body.lightMode .spDashboard__tod-subtext {
	color: #797886;
}

.spDashboard__tod-text {
	font-size: 14px;
	color: #eee;
	font-weight: 500;
	line-height: 1.5;
}

body.lightMode .spDashboard__tod-text {
	color: #111;
}

.spDashboard__listings-title,
.spDashboard__visiting-title,
.spDashboard__nearby-title {
	font-size: 14px;
	font-weight: 500;
	color: #fff;
	margin: 0 0 16px;
	display: flex;
	justify-content: space-between;
}

body.lightMode .spDashboard__listings-title,
body.lightMode .spDashboard__visiting-title,
body.lightMode .spDashboard__nearby-title {
	color: #111;
}

.spDashboard__listiting-item__image img {
	max-height: 100%;
	width: 100%;
	object-fit: cover;
	height: 100%;
	border-radius: 10px 10px 0 0;
	max-width: 100%;
}

.spDashboard__listiting-item__image {
	height: 40%;
	width: 100%;
	position: relative;
}

.spDashboard__listings-box {
	overflow: hidden;
}

.spDashboard__listings-status {
	position: absolute;
	top: 5px;
	right: 10px;
	font-size: 12px;
	text-transform: capitalize;
	font-weight: 600;
	z-index: 1;
	padding: 4px 15px;
	background: #fde723;
	color: #111;
	border-radius: 6px;
}

.spDashboard__listing-item__content {
	background: #1e1e2d;
	border-radius: 0 0 10px 10px;
}

body.lightMode .spDashboard__listing-item__content {
	background: #f5f5f5;
}

.spDashboard__listing-item__host-left img {
	width: 30px;
	height: 30px;
	border-radius: 50%;
}

.spDashboard__listing-item__ctas {
	display: flex;
	justify-content: space-between;
	line-height: 40px;
	text-align: center;
}

.spDashboard__listing-item__cta {
	flex: 1;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
}

.spDashboard__listing-item__cta-edit {
	background: #fde723;
	border-radius: 0 0 0 10px;
}

.spDashboard__listing-item__cta-delete {
	background: #252537;
	color: #fff;
}

.spDashboard__listing-item__cta-preview {
	background: #252537;
	color: rgb(97, 255, 255);
	border-radius: 0 0 10px 0;
	border-left: 1px solid #505069;
}

.spDashboard__listing-item__cta {
	flex: 1;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
}

.spDashboard__listing-item__ratings {
	padding: 5px 16px;
	font-size: 10px;
	color: #bbb;
	display: flex;
	justify-content: flex-start;
}

body.lightMode .spDashboard__listing-item__ratings {
	color: #333;
}

.spDashboard__listings-item__name {
	padding: 0 16px 3px;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
}

body.lightMode .spDashboard__listings-item__name {
	color: #111;
}

.spDashboard__listing-item__pricing {
	padding: 5px 16px 15px;
	font-size: 12px;
	color: #fde723;
	font-weight: 500;
}

body.lightMode .spDashboard__listing-item__pricing {
	color: #056b6b;
	font-weight: 600;
}

.spDashboard__listing-item__host {
	display: flex;
	padding: 0 16px 20px;
}

.spDashboard__listing-item__host-right {
	padding: 0 0 0 10px;
	font-size: 12px;
	color: #ccc;
}

body.lightMode .spDashboard__listing-item__host-right {
	color: #333;
}

.spDashboard__listing-item__host-right span {
	display: block;
	font-weight: 700;
}

.spDashboard__listings-item-add {
	height: 336px;
	text-align: center;
	border: 1px solid #bbb;
	border-radius: 10px;
	display: flex;
	align-items: center;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: center;
	cursor: pointer;
}

body.lightMode .spDashboard__listings-item-add {
	background: #f0f0f0;
	border: none;
}

.spDashboard__listings-item-add span.addListing__icon {
	display: block;
	margin: 0 0 30px;
}

.spDashboard__listings-item-add span.addListing__icon svg {
	width: 30px;
	height: auto;
}

.spDashboard__listings-item-add span.addListing__icon svg path {
	stroke: #eee;
}

body.lightMode .spDashboard__listings-item-add span.addListing__icon svg path {
	stroke: #111;
}

.spDashboard__listings-item-add span:last-child {
	color: #eee;
}

body.lightMode .spDashboard__listings-item-add span:last-child {
	color: #111;
}

.spDashboard__listing-item__ratings span.rating__item-stars svg {
	width: 10px;
	height: auto;
}

.spDashboard__listing-item__ratings span.rating__item-stars {
	width: auto;
	padding: 0 3px 0 0;
}

.spDashboard__visiting {
	padding: 24px 16px;
	background: #15151f;
}

body.lightMode .spDashboard__visiting {
	background: #fff;
}

.spDashboard__visiting-item {
	background: #1e1e2d;
	color: #fff;
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
	border-radius: 6px;
	padding: 8px 12px 0;
}

body.lightMode .spDashboard__visiting-item {
	background: #fff;
}

.spDashboard__visiting-image {
	width: 50px;
	height: 50px;
}

.spDashboard__visiting-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}

.spDashboard__visiting-innertitle {
	display: flex;
	justify-content: flex-start;
	flex-wrap: nowrap;
	flex-direction: row;
	align-items: center;
	cursor: pointer;
}

.spDashboard__visiting-content {
	font-size: 14px;
	font-weight: 400;
	padding: 0 0 0 10px;
}

span.spDashboard__visiting-name {
	display: block;
	font-size: 14px;
}

body.lightMode span.spDashboard__visiting-name {
	font-weight: 500;
	color: #000;
}

span.spDashboard__visiting-destination {
	font-size: 12px;
	color: #bbb;
}

body.lightMode span.spDashboard__visiting-destination {
	color: #797886;
}

.spDashboard__visiting-description {
	margin: 15px 0;
	font-size: 12px;
	color: #eee;
	line-height: 1.5;
	font-weight: 300;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: 54px;
}

body.lightMode .spDashboard__visiting-description {
	color: #797886;
}

.spDashboard__visiting-cta {
	line-height: 30px;
	background: #fde723;
	color: #000;
	text-align: center;
	font-size: 12px;
	font-weight: 500;
	width: calc(100% + 24px);
	margin-left: -12px;
	border-radius: 0 0 6px 6px;
	cursor: pointer;
}

body.lightMode .spDashboard__visiting-cta {
	background: #6c984d;
	color: #fff;
}

.spDashboard__visiting-title-right,
.spDashboard__queries-title-right {
	font-size: 12px;
	color: #ccc;
	position: relative;
}

body.lightMode .spDashboard__visiting-title-right,
body.lightMode .spDashboard__queries-title-right {
	color: #707070;
}

.spDashboard__visiting-title-right:after,
.spDashboard__queries-title-right:after {
	content: "";
	position: absolute;
	width: 100%;
	height: 1px;
	bottom: 1px;
	background: #ccc;
	left: 0;
}

.spDashboard__nearby {
	padding: 24px 16px 50px;
}

.spDashboard__nearby-item img {
	width: 100%;
	height: auto;
	border-radius: 50%;
	object-fit: cover;
	max-height: 80px;
}

.spDashboard__nearby-item {
	text-align: center;
}

.spDashboard__nearby-item span {
	font-size: 11px;
	color: #fff;
	font-weight: 400;
	margin: 10px 0 0;
	display: block;
	line-height: 1.5;
}

body.lightMode .spDashboard__nearby-item span {
	color: #111;
	font-weight: 500;
}

/*-------------- ADD LISTING ---------------*/

div#secondary .secondary__tab.addListingBody {
	position: fixed;
	width: 100%;
	max-width: 420px;
	height: 100vh;
	top: 0;
	z-index: 6;
	background-color: #15151f;
}

body.lightMode div#secondary .secondary__tab.addListingBody {
	background-color: #fdfdfd;
}

div#secondary .secondary__tab.addListingBody .drawerBody {
	height: 100%;
	top: 0;
	padding: 0;
}

.addListing__page {
	position: relative;
	height: inherit;
	display: none;
}

.addListings__header {
	height: 50px;
	line-height: 50px;
	padding: 0 16px;
	font-size: 16px;
	color: #fff;
	font-weight: 500;
}

.addListings__footer {
	position: absolute;
	bottom: 0;
	left: 0;
	height: 60px;
	width: 100%;
	background: #fde723;
	line-height: 60px;
	text-align: center;
	box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.1);
}

.addListings__footer.draft,
.addListings__footer.publish {
	position: absolute;
	bottom: 0;
	/* left: 3px; */
	height: 60px;
	width: 50%;
	background: #fde723;
	line-height: 60px;
	text-align: center;
	box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.1);
}

.addListings__footer.publish {
	left: 211px;
}

form#addListings__form {
	height: inherit;
}

.addListings__page {
	height: inherit;
}

.addListing__page.addListing__home {
	display: block;
}

.addListings__back,
.addListings__exit {
	display: inline-block;
	height: 100%;
	width: 46px;
	margin-left: -16px;
	padding-left: 16px;
}

.addListings__header svg {
	width: 20px;
	height: auto;
	margin: 0 10px 0 0;
}

.addListings__header svg path {
	stroke: #fff;
}

body.lightMode .addListings__header svg path {
	stroke: #111;
}

.addListings__home-image {
	padding: 100px 0 0;
	width: 90%;
	margin: auto;
	max-width: 350px;
}

.addListings__home-image img {
	width: 100%;
	margin: auto;
}

.addListing__home .addListings__body,
.addListing__thankYou .addListings__body {
	background: url(/view/assets/img/addListings-home-bg.jpg);
	background-size: cover;
	background-position: center;
}

.addListings__home-content {
	text-align: center;
	color: #fff;
	margin: 26px 0 0;
}

.addListings__home-content span {
	font-size: 12px;
}

.addListings__home-content p {
	margin: 6px 0 0;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: row;
	font-weight: 600;
	font-size: 20px;
}

.addListings__home-content svg {
	margin: 0 0 0 10px;
}

.addListings__footer,
.addListings__home-content,
.addListings__back,
.addListings__exit,
span.addListing__steps,
.form__upload-box__button,
.addListing__form-service,
.addListings__thankYou-back,
.form__checkbox-item,
span.form__image-container__small-remove {
	cursor: pointer;
}

.addListings__footer svg {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 30px;
	width: 30px;
	transform: rotate(180deg);
	height: auto;
	margin: auto;
}

.addListing__steps-info {
	bottom: 0;
	background: #1e1e2d;
	padding: 15px 16px 50px 32px;
	font-size: 14px;
	width: 115%;
	color: #fff;
	letter-spacing: 0.3px;
	margin: 0 0px 0 -16px;
}

body.lightMode .addListing__steps-info {
	background-color: #f5f5f5;
	color: #000;
}

.addListing__steps-info h4 {
	margin: 0 0 20px;
	font-weight: 600;
	color: #fde723;
}

body.lightMode .addListing__steps-info h4 {
	color: #056b6b;
}

.addListing__steps-info ul {
	margin: 0;
	padding: 0;
}

.addListing__steps-info ul li {
	list-style: none;
	padding: 0 0 10px;
	font-size: 12px;
}

.addListing__steps-info ul li b {
	padding: 0 5px 0 0;
}

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

.addListing__home .addListings__header {
	display: block;
}

span.addListing__steps {
	font-size: 12px;
	background: #056b6b;
	width: 100px;
	text-align: center;
	height: 32px;
	line-height: 28px;
	border-radius: 10px;
	border: none;
}

body.lightMode span.addListing__steps {
	background-color: #fdfbec;
	border: 2px solid #fde723;
}

span.addListing__steps svg {
	width: 10px;
	vertical-align: middle;
	height: auto;
	margin: 0 0 0 5px;
	display: none;
}

.addListing__form-services {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
}

.addListing__form-service {
	flex: 40%;
	text-align: center;
	padding: 10px;
	margin: 0 5px 10px;
	background: #bdbdbd;
	border-radius: 10px;
	color: #000;
	font-weight: 600;
}

body.lightMode .addListing__form-service {
	background-color: #f5f5f5;
}

.addListing__form-service span {
	display: block;
	padding: 3px 5px 0;
	font-size: 10px;
}

.addListing__form-service input {
	display: none;
}

.addListings__body label {
	font-size: 14px;
	color: #fff;
	font-weight: 600;
	margin: 0 0 15px;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}

body.lightMode .addListings__body label {
	color: #111;
}

.addListing__form-service img {
	opacity: 0.8;
	height: 64px;
	width: auto;
}

.addListing__form-service.active {
	color: #000;
	background: #fde723;
	border-radius: 10px;
	font-weight: 600;
}

body.lightMode .addListing__form-service.active {
	background: #fde723;
}

.addListing__form-service.active img {
	opacity: 1;
}

.addListing__page-2 .form__row {
	margin: 0 0 30px;
}

.addListings__page .form__row.error input[type="text"],
.addListings__page .form__row.error input[type="number"],
.addListings__page .form__row.error textarea {
	border: 2px solid #cf000f;
	background: #cf000f14;
}

body.lightMode .addListings__page .form__row.error input[type="text"],
body.lightMode .addListings__page .form__row.error input[type="number"],
body.lightMode .addListings__page .form__row.error textarea {
	border: 2px solid #cf000f;
	background: #cf000f14;
}

.addListings__page .form__row input[type="text"],
.addListings__page .form__row input[type="number"] {
	width: 100%;
	height: 40px;
	padding: 15px;
	border-radius: 6px;
	border: 1px solid #1e1e2d;
	font-size: 12px;
	font-family: inherit;
	margin: 0 0 16px;
	background-color: #1e1e2d;
	color: #fff;
	outline: none;
}

body.lightMode .addListings__page .form__row input[type="text"],
body.lightMode .addListings__page .form__row input[type="number"] {
	background-color: #eee;
	border: 1px solid #eee;
	color: #000;
}

.addListings__page .form__row input[type="text"]:focus,
.addListings__page .form__row input[type="number"]:focus {
	border-color: #fde723;
}

body.lightMode .addListings__page .form__row input[type="text"]:focus,
body.lightMode .addListings__page .form__row input[type="number"]:focus {
	border-color: #fde723;
}

.addListings__page .form__row textarea {
	width: 100%;
	height: auto;
	border: 1px solid #1e1e2d;
	padding: 15px;
	border-radius: 6px;
	background-color: #1e1e2d;
	font-size: 12px;
	font-family: inherit;
	margin: 0 0 16px;
	resize: none;
	color: #fff;
	outline: none;
}

body.lightMode .addListings__page .form__row textarea {
	background-color: #eee;
	border-color: #eee;
	color: #000;
}

.addListings__page .form__row textarea:focus {
	border-color: #fde723;
}

body.lightMode .addListings__page .form__row textarea:focus {
	border-color: #fde723;
}

.addListing__form-tip {
	display: flex;
	font-size: 10px;
	color: #ddd;
	line-height: 1.5;
	letter-spacing: 0.3px;
	font-weight: 100;
}

body.lightMode .addListing__form-tip {
	color: #505050;
}

.addListing__form-tip svg {
	margin: 0 10px 0 0;
	flex-shrink: 0;
}

body.lightMode .addListing__form-tip svg path {
	stroke: #056b6b;
}

.addListings__body label .character__count {
	font-size: 12px;
	color: #707070;
	font-weight: 400;
}

.form__search-box {
	position: relative;
}

.form__search-box span {
	position: absolute;
	right: 4px;
	top: 4px;
	line-height: 35px;
	width: 32px;
	text-align: center;
	background: #fde723;
	border-radius: 6px;
	height: 32px;
}

.form__search-box span svg {
	width: 16px;
	height: auto;
}

hr {
	margin: 20px 0 30px;
	border-top: #707070;
}

span.sub-label {
	color: #bbb;
	font-weight: 400;
	margin: -10px 0 20px;
	display: block;
	letter-spacing: 0.4px;
	font-size: 12px;
}

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

.form__upload-box__button {
	width: 48%;
	text-align: center;
	max-width: 170px;
	height: 40px;
	line-height: 40px;
	font-size: 12px;
	border-radius: 4px;
	display: flex;
	align-items: center;
	font-weight: 500;
	justify-content: center;
}

.form__upload-box__button-gallery {
	background: #056b6b;
	color: #fff;
}

.form__upload-box__button svg {
	margin: 0 10px 0 0;
}

.form__upload-box__button-camera {
	background: #fde723;
}

.form__upload-box__button-camera svg path {
	fill: #1d1d1d;
}

.form__image-containter {
	width: 100%;
	margin-left: 0px !important;
	padding: 15px;
	background: #1e1e2d;
	border-radius: 10px;
}

body.lightMode .form__image-containter {
	background-color: #f5f5f5;
}

.form__row.form__upload-box {
	padding: 0 0 25px;
}

.form__image-containter h5 {
	margin: 0 0 10px;
	font-size: 12px;
	color: #707070;
}

.form__image-containter h6 {
	margin: 0 0 10px;
	font-size: 10px;
	color: #707070;
	font-weight: 400;
}

.form__image-containter .row {
	margin: 0 0 16px;
}

.form__image-container__larger {
	width: 100%;
	height: 150px;
	background: #555;
	border-radius: 10px;
}

body.lightMode .form__image-container__larger {
	background-color: #d7d7d7;
}

.form__image-containter .row.flex {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	align-content: space-around;
	flex-direction: row;
	justify-content: space-between;
}

.form__image-container__small {
	width: 22%;
	height: 80px;
	margin: 0 0 10px;
	background: #555;
	border-radius: 10px;
	position: relative;
}

body.lightMode .form__image-container__small {
	background-color: #d7d7d7;
}

.form__image-containter .row:last-child {
	margin: 0;
}

.addListing__page-4 .addListing__form-tip {
	margin: 25px 0 0;
}

.switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
}

.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.slider:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

input:checked+.slider {
	background-color: #2196f3;
}

input:focus+.slider {
	box-shadow: 0 0 1px #2196f3;
}

input:checked+.slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
	border-radius: 34px;
}

.slider.round:before {
	border-radius: 50%;
}

.form__pricing-box {
	position: relative;
	color: #fff;
}

body.lightMode .form__pricing-box {
	color: #111;
}

.addListings__page .form__row .form__pricing-box input[type="number"] {
	padding-left: 40px;
}

.form__pricing-box__currency {
	font-weight: 600;
	position: absolute;
	top: 0;
	height: 40px;
	line-height: 40px;
	left: 15px;
	font-size: 18px;
}

.form__pricing-sub__box {
	display: flex;
	align-items: center;
	flex-direction: row;
	flex-wrap: nowrap;
	margin: 0 0 25px;
}

.form__pricing-sub__box p {
	margin: 0;
	font-size: 12px;
	color: #707070;
	flex: 1.5;
	padding: 0 10px 0 0;
	line-height: 1.5;
}

.form__pricing-sub__box select {
	flex: 1;
	height: 40px;
	padding: 0 15px;
	border-radius: 6px;
	border: 1px solid #1e1e2d;
	font-size: 12px;
	font-family: inherit;
	margin: 0;
	background-color: #1e1e2d;
	color: #fff;
	outline: none;
}

body.lightMode .form__pricing-sub__box select {
	background-color: #f5f5f5;
	border-color: #f5f5f5;
	color: #000;
}

.form__pricing-addLater {
	width: calc(100% + 32px);
	padding: 4px 16px;
	background: #1e1e2d;
	margin-left: -16px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

body.lightMode .form__pricing-addLater {
	background: #fff8c7;
}

.form__row.form__contactHelp {
	padding: 95px 0 0;
	text-align: center;
}

.form__contactHelp-sub {
	font-size: 12px;
	color: #fff;
	padding: 0 0 6px;
}

body.lightMode .form__contactHelp-sub {
	color: #000;
	font-weight: 600;
}

.form__contactHelp-title {
	font-size: 20px;
	color: #fde723;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: underline;
}

body.lightMode .form__contactHelp-title {
	color: #056b6b;
}

.form__contactHelp-title svg {
	margin-left: 10px;
}

.form__contactHelp-title svg path {
	fill: #fff;
}

body.lightMode .form__contactHelp-title svg path {
	color: #111;
}

.form__pricing-addLater span {
	color: #fff;
	font-weight: 500;
	font-size: 14px;
}

body.lightMode .form__pricing-addLater span {
	color: #000;
}

.form__pricing-addLater__toggle .switch {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 16px;
	float: right;
	top: 3px;
}

.addListing__thankYou .addListings__header {
	display: block;
}

.addListing__thankYou .addListings__body {
	height: calc(100vh - 50px);
}

.addListing__thankYou .addListings__footer {
	display: none;
}

.addListings__thankYou-review {
	text-align: center;
	padding: 25px 0 50px;
}

.addListings__thankYou-back {
	width: 250px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	flex: 100%;
	flex-direction: row;
	flex-wrap: nowrap;
	background: #fde723;
	height: 45px;
	font-size: 14px;
	font-weight: 500;
	border-radius: 6px;
	margin: auto;
}

.addListings__thankYou-back svg {
	height: 12px;
	width: auto;
	margin: 0 15px 0 0;
}

.addListings__thankYou-review img {
	border-radius: 10px;
	width: 80%;
}

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

.form__checkbox-item {
	width: 32%;
	margin: 0 0 16px;
	text-align: center;
	line-height: 32px;
	font-size: 12px;
	background: #1e1e2d;
	border-radius: 20px;
	color: #eee;
	padding: 3px;
}

body.lightMode .form__checkbox-item {
	color: #111;
	background-color: #f5f5f5;
	border: 1px solid #bbb;
}

.form__checkbox-item svg {
	max-height: 13px;
	max-width: 15px;
	margin: 0 5px 0 0;
}

.form__checkbox-item span {
	display: flex;
	align-items: center;
	justify-content: center;
}

.form__checkbox-item.active {
	background: #fde723;
	border-color: #fde723;
	font-weight: 600;
	color: #111;
}

body.lightMode .form__checkbox-item.active {
	color: #111;
	background-color: #fdfbec;
	border: 2px solid #fde723;
}

.addListing__page-4 .form__pricing-addLater {
	margin: 25px 0 25px -16px;
}

.addListing__page-4 .form__pricing-addLater svg {
	margin: 0 6px 0 0;
}

.addListing__page-4 .form__pricing-addLater svg path {
	fill: #ffffff;
}

body.lightMode .addListing__page-4 .form__pricing-addLater svg path {
	fill: #111;
	stroke: #111;
}

.addListing__page-4 .form__row {
	margin: 0 0 25px;
}

.form__image-container__small img {
	width: 100%;
	height: inherit;
	overflow: hidden;
	border-radius: 10px;
	object-fit: cover;
}

.form__image-container__small span.form__image-container__small-remove {
	position: absolute;
	width: 22px;
	height: 22px;
	line-height: 15px;
	font-size: 12px;
	background: #707070;
	text-align: center;
	border-radius: 50%;
	color: #fff;
	bottom: -2px;
	right: -2px;
	border: 2px solid #f5f5f5;
}

.addListing__page-5 .addListing__form-tip {
	margin: 25px 0 0;
}

.form__cluster-row {
	position: relative;
}

.addListings__page .form__row .form__cluster-row input {
	padding-left: 40px;
}

.form__cluster-row svg {
	position: absolute;
	max-width: 18px;
	max-height: 18px;
	left: 11px;
	top: 11px;
}

.form__cluster-row svg path {
	fill: #fff;
}

body.lightMode .form__cluster-row svg path {
	fill: #000;
	stroke: #fff;
}

/*------------ Ads ------------*/


.support__travelBuddy {
	width: 100%;
	background: #fde723;
	bottom: 0;
	border-radius: 10px 10px 0 0;
	font-size: 13px;
	padding: 0 16px 0;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.premium_cards_container .support__travelBuddy {
	position: relative;
	border-radius: 0;
	top: -5px;
	z-index: 1;
}

.ad_wrapper {
	padding: 0 0 5px;
	position: relative;
	cursor: pointer;
}

.support__travelBuddy p {
	margin: 10px 5px 10px 0;
	line-height: 1.3;
	font-size: 16px;
	font-weight: 600;
}

.support__travelBuddy span {
	display: block;
	height: 45px;
	line-height: 45px;
	background: #000;
	width: 280px;
	color: #fde723;
	text-align: center;
	font-size: 18px;
	border-radius: 6px;
	cursor: pointer;
	font-weight: 600;
}

/*-------------- ADD LISTING ---------------*/

div#secondary .secondary__tab.addListingBody .drawerBody {
	height: 100%;
	top: 0;
	padding: 0;
}

.addListing__page {
	position: relative;
	height: inherit;
	display: none;
}

body.lightMode .addListings__header {
	color: #111;
	font-weight: 500;
}

form#addListings__form {
	height: inherit;
}

.addListings__page {
	height: inherit;
}

.addListing__page.addListing__home {
	display: block;
}

.addListings__back,
.addListings__exit {
	display: inline-block;
	height: 100%;
	width: 46px;
	margin-left: -16px;
	padding-left: 16px;
}

.addListings__header svg {
	width: 20px;
	height: auto;
	margin: 0 10px 0 0;
}

.addListings__home-image {
	padding: 100px 0 0;
	width: 90%;
	margin: auto;
}

.addListings__home-image img {
	width: 100%;
	margin: auto;
}

.addListings__body {
	position: absolute;
	top: 50px;
	height: calc(100% - 110px);
	overflow: hidden;
	overflow-y: scroll;
	width: 100%;
	padding: 25px 16px 0;
}

.addListing__page-5 .addListings__body {
	padding: 25px 0;
}

.addListing__home .addListings__body,
.addListing__thankYou .addListings__body {
	background: url(/view/assets/img/addListings-home-bg.jpg);
	background-size: cover;
	background-position: center;
}

.addListings__home-content {
	text-align: center;
	color: #fff;
	margin: 26px 0 0;
}

.addListings__home-content span {
	font-size: 12px;
}

.addListings__home-content p {
	margin: 6px 0 0;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: row;
	font-weight: 600;
	font-size: 20px;
}

.addListings__home-content svg {
	margin: 0 0 0 10px;
}

.addListings__footer svg {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 30px;
	width: 30px;
	transform: rotate(180deg);
	height: auto;
	margin: auto;
}

.addListing__steps-info ul {
	margin: 0;
	padding: 0;
}

.addListing__steps-info ul li {
	list-style: none;
	padding: 0 0 10px;
	font-size: 12px;
}

.addListing__steps-info ul li b {
	padding: 0 5px 0 0;
}

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

.addListing__home .addListings__header {
	display: block;
}

span.addListing__steps svg {
	width: 10px;
	vertical-align: middle;
	height: auto;
	margin: 0 0 0 5px;
	display: none;
}

.addListing__form-services {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
}

.addListing__form-service input {
	display: none;
}

.addListing__page-2 .form__row {
	margin: 0 0 30px;
}

.addListings__body label .character__count {
	font-size: 12px;
	color: #707070;
	font-weight: 400;
}

.form__search-box {
	position: relative;
}

.form__search-box span {
	position: absolute;
	right: 4px;
	top: 4px;
	line-height: 35px;
	width: 32px;
	text-align: center;
	background: #fde723;
	border-radius: 6px;
	height: 32px;
}

.form__search-box span svg {
	width: 16px;
	height: auto;
}

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

.form__upload-box__button {
	width: 48%;
	text-align: center;
	max-width: 170px;
	height: 40px;
	line-height: 40px;
	font-size: 12px;
	border-radius: 4px;
	display: flex;
	align-items: center;
	font-weight: 500;
	justify-content: center;
}

.form__upload-box__button-gallery {
	background: #056b6b;
	color: #fff;
}

.form__upload-box__button svg {
	margin: 0 10px 0 0;
}

.form__upload-box__button-camera {
	background: #fde723;
}

.form__upload-box__button-camera svg path {
	fill: #1d1d1d;
}

.form__row.form__upload-box {
	padding: 0 0 25px;
}

.switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
}

.switch input {
	opacity: 0;
	width: 0;
	height: 0;
}

.slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.slider:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

input:checked+.slider {
	background-color: #2196f3;
}

input:focus+.slider {
	box-shadow: 0 0 1px #2196f3;
}

input:checked+.slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
	border-radius: 34px;
}

.slider.round:before {
	border-radius: 50%;
}

.form__pricing-sub__box {
	display: flex;
	align-items: center;
	flex-direction: row;
	flex-wrap: nowrap;
	margin: 0 0 25px;
}

.form__pricing-sub__box p {
	margin: 0;
	font-size: 12px;
	color: #707070;
	flex: 1.5;
	padding: 0 10px 0 0;
	line-height: 1.5;
}

.form__row.form__contactHelp {
	padding: 95px 0 0;
	text-align: center;
}

.form__contactHelp-title svg {
	margin-left: 10px;
}

.addListing__thankYou .addListings__header {
	display: block;
}

.addListing__thankYou .addListings__body {
	height: calc(100vh - 50px);
}

.addListing__thankYou .addListings__footer {
	display: none;
}

.addListings__thankYou-review {
	text-align: center;
	padding: 25px 0 50px;
}

.addListings__thankYou-back {
	width: 250px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	flex: 100%;
	flex-direction: row;
	flex-wrap: nowrap;
	background: #fde723;
	height: 45px;
	font-size: 14px;
	font-weight: 500;
	border-radius: 6px;
	margin: auto;
}

.addListings__thankYou-back svg {
	height: 12px;
	width: auto;
	margin: 0 15px 0 0;
}

.addListing__page-4 .form__row {
	margin: 0 0 25px;
}

.form__cluster-row {
	position: relative;
}

.addListings__page .form__row .form__cluster-row input {
	padding-left: 40px;
}

/* -------- Recommended Followers card and page */

.recommended_for_follow_card_mainBox {
	width: 100%;
	height: 370px;
	box-shadow: 3px 3px 5px 0 rgb(0 0 0 / 80%);
	padding: 10px;
}

body.lightMode .recommended_for_follow_card_mainBox {
	box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.11);
}

.main_following_box {
	color: #eee;
	margin: 15px 0 0 0;
	font-family: inherit;
	background-color: #1e1e2d;
}

body.lightMode .main_following_box {
	background: #f9f9f9;
	color: #313131;
	font-weight: 700;
}

h4#card_title-recommended {
	margin: 0px 0 10px 12px;
	color: #fde726;
	font-size: 15px;
}

body.lightMode h4#card_title-recommended {
	color: #1d1d1d;
}

.notfollowing_creative {
	height: auto;
	width: 90%;
	margin: auto;
	border-radius: 5px;
}

.notfollowing_creative img {
	height: auto;
	width: 100%;
	object-fit: contain;
	border-radius: 5px;
}

.recommended_for_follow_card_box {
	width: 100%;
	height: auto;
}

.traveller_card_backgroundPic img {
	height: 130px;
	width: 100%;
	object-fit: cover;
	border-radius: 8px 8px 0 0;
}

.follow_button-cards {
	display: flex;
	position: absolute;
	right: 0;
	color: #fde726;
	font-size: 10px;
	align-items: center;
	bottom: 7px;
	left: 10px;
	background: #15151f;
	width: 80px;
	border-radius: 20px;
	cursor: pointer;
	line-height: 15px;
	justify-content: center;
	flex-direction: row;
}

body.lightMode .follow_button-cards {
	font-weight: 400;
	background: #1d1d1d;
	color: #fde720;
}

.rating_stars_icons span.rating__item-stars {
	width: 65px;
}

.traveller_card_info {
	margin: 0 10px 0 10px;
}

.recommended_for_follow_card {
	position: relative;
	width: 70%;
	height: 325px;
	border-radius: 10px;
	box-shadow: 0px 0px 4px 0 black;
	margin: 0 0 0 15px;
}

body.lightMode .recommended_for_follow_card {
	background: #fff;
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.11);
}

.recommended_for_follow_card:first-child {
	margin: 0px 0 0 5px;
}

.traveller_pfp img {
	height: 40px;
	width: 40px;
	object-fit: unset;
	border-radius: 50%;
	cursor: pointer;
}

.traveller_pfp-name_box {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	margin: 3px 0 0 7px;
}

.traveller_number_of_followers_box {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	font-size: 10px;
	margin: 0 0 0 10px;
}

.traveller_name-pfp-follow_box {
	display: flex;
}

.traveller-name-location_row {
	margin: 5px 0 0 15px;
	text-align: left;
	max-width: 300px;
}

h5#traveller-card_name {
	margin: 0px 0 2px 0;
	font-size: 14px;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	cursor: pointer;
	letter-spacing: 0.5px;
}

body.lightMode h5#traveller-card_name {
	color: #000000;
	font-weight: 600;
}

p#traveller-card_location {
	margin: 0px 0px 4px 0;
	font-size: 13px;
	color: #61ffff;
	cursor: pointer;
}

body.lightMode p#traveller-card_location {
	color: #056b6b;
	font-weight: 500;
}

.recommended_for_follow_card_mainBox.mySwiper {
	box-shadow: 0 0 9px 4px black;
}

p#traveller_intro-info {
	font-size: 11px;
	margin: 10px 0px 10px 10px;
	/* height: 60px; */
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	line-height: 1.5;
}

body.lightMode p#traveller_intro-info {
	color: #1d1d1d;
	font-weight: 500;
}

.traveller-rating_box {
	font-size: 10px;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	margin: 0 0 0 10px;
}

p.number_of-followers-cards {
	margin: 0px 6px 0 5px;
	color: #fde723;
	font-size: 13px;
}

.follow_button-cards svg {
	height: auto;
	width: 11px;
	text-align: center;
	/* stroke: #fde726 !important; */
	margin: 0 5px 0 0;
}

.follow_button-cards svg path {
	stroke: #fde723;
}

.traveller-rating-followers_box {
	display: flex;
	align-items: center;
}

p#traveller_rating-number {
	font-size: 12px;
	margin: 0 0px 0 0px;
}

body.lightMode p#traveller_rating-number {
	color: #313131;
	font-weight: 500;
}

.traveller-rating_box svg {
	width: 12px;
}

/* ----------------- Settings Page --------------------*/

h4.settings_labels {
	margin: 4px;
	font-size: 14px;
	cursor: pointer;
	font-weight: 600;
}

.main_settings_container {
	margin: 0px 0px 0 0;
}

/* .settings_box {
	background: #1e1e30;
	color: #eee;
	border-radius: 3px;
	padding: 10px 16px;
	margin: 0 0 5px;
	position: relative;
	box-shadow: 0px 3px 5px 0 rgb(0 0 0 / 16%);
} */

body.lightMode .settings_box {
	/* background: #f5f5f5;
	box-shadow: 0px 2px 3px 0 rgb(0 0 0 / 10%); */
	color: #1d1d1d;
}

/* .settings_box:hover {
	background-color: #15151f;
}
body.lightMode .settings_box:hover {
	background-color: #e3e3e3;
} */

.settings_options {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}

.switch {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 16px;
	float: right;
	top: -23px;
}

.switch input {
	opacity: 0;
	width: 0;
	height: 0;
	position: relative;
}

.slider {
	position: absolute;
	cursor: pointer;
	top: -1px;
	left: -9px;
	right: 0px;
	bottom: -1px;
	background-color: #707070;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

.slider:before {
	position: absolute;
	content: "";
	height: 21px;
	width: 21px;
	left: 1.5px;
	top: 2.5px;
	margin: 0px 0px 0 0px;
	background-color: white;
	-webkit-transition: 0.4s;
	transition: 0.4s;
}

input:checked+.slider::before {
	background-color: #1e1e30;
}

input:checked+.slider {
	background-color: #fde726;
}

input:focus+.slider {
	box-shadow: 0 0 1px #2196f3;
}

input:checked+.slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
}

/* Rounded sliders */

.switch .slider.round {
	border-radius: 34px;
	width: 50px;
}

.slider.round:before {
	border-radius: 50%;
}

.deactivate_acc_warning {
	color: #cf7272;
	/* background-color: #f5d1d1; */
	margin: 0;
	border-radius: 5px;
	padding: 0 6px;
	width: 300px;
	line-height: 1.5;
}

.deactivate_acc_warning p {
	margin: 0px;
	font-size: 10px;
	padding: 0;
}

.deactivate_account.settings_box {
	display: flex;
	justify-content: center;
}

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

svg.back-arrow {
	position: absolute;
	top: 0;
	left: 0;
	margin: 7px 5px;
	cursor: pointer;
}

span.header_title {
	margin: 0 0 0;
	display: flex;
	font-size: 18px;
	padding: 8px;
	font-weight: normal;
	justify-content: center;
	align-items: center;
	color: #fde726;
}

.drop_down_info_box {
	background: teal;
	height: auto;
	width: 250px;
	font-size: 8px;
	padding: 0px 5px;
	visibility: collapse;
	border-radius: 5px;
	opacity: 0.7;
}

body.lightMode .drop_down_info_box {
	opacity: 1;
}

.label_deactive_acc svg {
	height: 18px;
	width: auto;
}

.labe_deactivate_acc svg path {
	stroke: #fde723;
}

.tool_tip_settings:hover .drop_down_info_box {
	visibility: visible;
}

.drop_down_boxPos1 {
	position: absolute;
	right: 150px;
	bottom: -20px;
	z-index: 1;
}

.drop_down_boxPos2 {
	position: absolute;
	right: 100px;
	width: 200px;
	bottom: -20px;
	z-index: 1;
}

.label_deactive_acc svg {
	height: 15px;
	width: auto;
	margin-right: 5px;
	transform: rotate(180deg);
	cursor: pointer;
}

.label_deactive_acc svg path {
	stroke: #fde723;
}

body.lightMode .label_deactive_acc svg path {
	stroke: #056b6b;
}

.tool_tip_settings {
	margin: 4px;
}

body.lightMode .tool_tip_settings svg path {
	fill: #000;
}

/* -------------- Change Password(settings) ------------ */

.change_pass_box {
	background: #1e1e2d;
	width: 100%;
	display: flex;
	margin: 5px auto;
	flex-direction: column;
	padding: 0px 16px 10px 16px;
	border-radius: 5px;
	position: relative;
}

body.lightMode .change_pass_box {
	background: #f5f5f5;
	color: #000;
}

label.pass_label {
	margin: 10px 0px;
	padding: 0px;
	color: #fff;
	font-size: 14px;
}

body.lightMode label.pass_label {
	color: #000;
	font-weight: 600;
}

.change_password_input {
	padding: 0 0 0 15px;
	border: 0px;
	outline: none;
	border-radius: 6px;
	box-sizing: border-box;
	transition: 0.3s;
	background-color: #15151d;
	height: 40px;
	font-size: 15px;
	color: #fff;
}

body.lightMode .change_password_input {
	color: #000;
	background-color: #fdfdfd;
}

button.confirm_pass_button {
	position: absolute;
	right: 0;
	left: 0;
	width: 85%;
	margin: 10px auto;
	height: 50px;
	padding: 4px;
	font-size: 15px;
	background: #fde726;
	color: black;
	border: 0px;
	cursor: pointer;
	border-radius: 4px;
	font-weight: 600;
}

#change_pass_form {
	margin: 10px 0 0 0;
}

.show_change-pass svg {
	position: absolute;
	top: 48px;
	right: 30px;
	stroke: #fde723;
	cursor: pointer;
}

body.lightMode .show_change-pass svg {
	stroke: #ccc;
}

/*-------------- Deactivate Account(settings) -----------------*/

.main_deactivate_box {
	color: #eee;
	font-family: "Montserrat", sans-serif;
	font-size: 15px;
}

body.lightMode .main_deactivate_box {
	color: #000;
	font-weight: 600;
}

h4.reason_deactivate {
	font-weight: normal;
	padding: 0 20px;
}

.deactivate_reason:after {
	content: "";
	height: 0.5px;
	width: 100%;
	position: absolute;
	background: #939393;
	bottom: -10px;
	opacity: 0.5;
	left: -15px;
}

form.deactivate_form_box {
	background: inherit;
	margin: 35px 0;
	border-radius: 5px;
}

.deactivate_reasons_input {
	display: block;
	position: relative;
	padding-left: 35px;
	margin-bottom: 20px;
	cursor: pointer;
	font-size: 14px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.deactivate_reasons_input input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
}

.checkmark_deactivate_input {
	position: absolute;
	border: 3px solid #bbb;
	top: 0;
	left: 0;
	height: 24px;
	width: 24px;
	border-radius: 50%;
}

.deactivate_reasons_input:hover input~.checkmark_deactivate_input {
	background-color: #ccc;
}

.deactivate_reasons_input input:checked~.checkmark_deactivate_input {
	background-color: #fdfdfd;
	border-color: #fde723;
}

.checkmark_deactivate_input:after {
	content: "";
	position: absolute;
	display: none;
}

.deactivate_reasons_input input:checked~.checkmark_deactivate_input:after {
	display: block;
}

.deactivate_reasons_input .checkmark_deactivate_input:after {
	top: 3px;
	left: 3px;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: #fde723;
}

.deactivate_options_box {
	margin: 0px 15px;
}

textarea#any-other-reasons_box {
	display: block;
	resize: none;
	width: 95%;
	border: none;
	margin: 10px 0;
	border-radius: 5px;
	outline: none;
	padding: 5px;
	padding: 16px;
	resize: vertical;
	font-family: inherit;
	font-size: 12px;
}

body.lightMode textarea#any-other-reasons_box {
	border: 1px solid #eee;
	background: #f5f5f5;
}

/*---------------- Profile Interests -----------------*/

.profileInterests__tab-item {
	display: none;
}

.profileInterests__tab-item.active {
	display: block;
}

.profileInterests__tabs {
	display: flex;
	box-shadow: 0px 3px 6px #0d0d1a;
	margin: 15px 0 0;
}

body.lightMode .profileInterests__tabs {
	box-shadow: 0px 3px 6px #f0f0f0;
}

.profileInterests__tabBody {
	padding: 0 16px;
}

.profileInterests__tab {
	height: 60px;
	color: #fff;
	font-size: 14px;
	flex: 1;
	text-align: center;
	position: relative;
	cursor: pointer;
}

body.lightMode .profileInterests__tab {
	color: #000;
}

.profileInterests__tab svg {
	width: 15px;
	height: 15px;
	margin: 0 0 5px;
}

.profileInterests__tab span {
	display: block;
}

.profileInterests__tab svg path {
	stroke: white;
}

body.lightMode .profileInterests__tab svg path {
	stroke: #505050;
}

.profileInterests__tab:first-child svg path {
	fill: #fff;
}

.profileInterests__tab.active svg path {
	stroke: #fde723;
}

body.lightMode .profileInterests__tab.active svg path {
	stroke: #056b6b;
}

.profileInterests__tab.active:first-child svg path {
	fill: #fde723;
}

body.lightMode .profileInterests__tab.active:first-child svg path {
	fill: #056b6b;
}

.profileInterests__tab.active:after {
	content: "";
	position: absolute;
	height: 3px;
	background: #fde723;
	width: 100%;
	left: 0;
	bottom: 0;
	border-radius: 0 0 10px 10px;
}

.profileInterests__tab-item-head h4 {
	font-size: 16px;
	font-weight: 600;
	color: cyan;
}

body.lightMode .profileInterests__tab-item-head h4 {
	color: #056b6b;
}

.profileInterests__tab-item-head h4 svg {
	width: 15px;
	height: 15px;
	margin: 0 5px 0 0;
}

.profileInterests__tab-item-head h4 svg path {
	fill: cyan;
}

body.lightMode .profileInterests__tab-item-head h4 svg path {
	fill: #056b6b;
}

.profileInterests__tab-item-body {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	align-items: center;
	justify-content: flex-start;
	gap: 0 12px;
}

.profileInterests__interest {
	margin: 0 0 15px;
	padding: 0 15px;
	background: #343447;
	font-size: 13px;
	line-height: 40px;
	border-radius: 20px;
	text-align: center;
	font-weight: 500;
	color: #fff;
	max-width: 180px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

body.lightMode .profileInterests__interest {
	background: #fde723;
	color: #111;
	box-shadow: 0px 0px 5px 0px #bababa;
}

.profileInterests__interest svg {
	width: 15px;
	height: 15px;
	margin: 0 3px 0 0;
}

.profileInterests__interest svg path {
	stroke: white;
}

body.lightMode .profileInterests__interest svg path {
	stroke: #056b6b;
}

.profileInterests__social-link {
	width: 100%;
	margin: 0 0 30px;
}

.profileInterests__tab-item__social {
	margin: 30px 16px 0;
}

.profileInterests__social-link a {
	display: flex;
	flex-direction: row;
	width: 100%;
	flex: 1;
	text-decoration: none;
}

.profileInterests__social-link-left {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: #343447;
	display: flex;
	align-items: center;
	justify-content: center;
}

.profileInterests__social-link-left svg {
	max-width: 24px;
	max-height: 24px;
}

.profileInterests__social-link-left svg path {
	fill: #fff;
}

.profileInterests__social-link-right {
	margin: 0 0 0 20px;
	color: #fff;
}

body.lightMode .profileInterests__social-link-right {
	color: #000;
	font-weight: 500;
}

.profileInterests__social-link-right span {
	display: block;
	font-size: 12px;
	color: #bbb;
}

.profileInterests__social-link.website svg path {
	fill: transparent;
	stroke: #fff;
}

/* ------------- Day Night settings ------------ */

.day-night_toggle_box {
	display: none;
	align-items: center;
	justify-content: space-between;
}

.day_night_switch {
	opacity: 0;
	position: absolute;
}

.day_night_switch-label {
	background-color: #111;
	width: 50px;
	height: 26px;
	border-radius: 50px;
	position: relative;
	padding: 5px;
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.fa-moon {
	color: rgb(213, 212, 212);
}

.fa-sun {
	color: #f39c12;
}

.day_night_switch-label .day_night_checkbox-ball {
	background-color: #fff;
	width: 21px;
	height: 21px;
	position: absolute;
	left: 2px;
	top: 2.5px;
	border-radius: 50%;
	transition: transform 0.2s linear;
}

.day_night_switch:checked+.day_night_switch-label .day_night_checkbox-ball {
	transform: translateX(24px);
}

input:checked+.day_night_checkbox-ball {
	background-color: red;
}

.desktopMenu-item.active {
	color: #fde723;
}

body.lightMode .desktopMenu-item.active {
	color: #056b6b;
	font-weight: 600;
}

.desktopMenu-apps .desktopMenu-item.active {
	background: #000;
	padding: 0 10px;
	border-radius: 10px;
}

body.lightMode .desktopMenu-apps .desktopMenu-item.active {
	color: #eee;
}

.desktopMenu-apps .desktopMenu-item.active svg {
	margin: 0 10px 0 0;
}

.desktopMenu-item.active svg path {
	fill: #fde723;
}

.desktopMenu-services.active svg path {
	stroke: #fde723;
}

body.lightMode .desktopMenu-services.active svg path {
	stroke: #056b6b;
}

body.lightMode .desktopMenu-item.active svg path {
	fill: #056b6b;
}

body.lightMode .desktopMenu-apps .desktopMenu-item.active svg path {
	fill: #fde723;
}

.profile__head-delete-cover {
	left: 220px;
}

.profile__head-add-cover {
	right: 230px;
}

/*-------------------- Desktop Mode ----------------------*/

div#desktop__menu {
	position: fixed;
	/* Changed from absolute to fixed for better scrolling behavior */
	height: 100vh;
	left: 0;
	top: 0;
	width: 280px;
	/* Set explicit width instead of commenting it out */
	padding: 22px 0;
	background-color: #111;
	/* Added background color */
	transition: width 0.3s ease;
	/* Added transition for collapsible functionality */
	z-index: 100;
	/* Added z-index to ensure it stays above other content */
	box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1);
	/* Added subtle shadow */
}

body.lightMode div#desktop__menu {
	background-color: #fff;
	/* Light mode background */
}

.desktopMenu-box {
	margin-left: 30px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	height: 100%;
	overflow-y: auto;
	/* Added scrolling for overflow content */
	padding-right: 10px;
	/* Added padding for scrollbar */
}

.desktopMenu-section svg,
.desktopMenu-section img {
	width: 22px;
	height: 22px;
	margin: 0 20px 0 0;
	transition: transform 0.2s ease;
	/* Added transition for icon animations */
}

.desktopMenu-section img {
	object-fit: cover;
	border-radius: 50%;
}

.desktopMenu-section .overlap__influencerTag {
	top: 7px !important;
}

.desktopMenu-section {
	margin: 0 0 15px;
	padding-bottom: 15px;
	/* Added padding for better spacing */
	border-bottom: 1px solid #353535;
	transition: padding 0.2s ease;
	/* Added transition */
}

body.lightMode .desktopMenu-section {
	border-bottom-color: #eee;
}

.desktopMenu-section:last-child {
	border: 0;
}

@media screen and (max-height: 800px) {
	.desktopMenu-section {
		margin: 0 0 10px;
	}

	.desktopMenu-item {
		margin: 0 0 5px;
	}
}

.desktopMenu-item {
	line-height: 35px;
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: flex-start;
	margin: 0 0 10px;
	font-size: 15px;
	color: #eee;
	font-weight: 500;
	cursor: pointer;
	position: relative;
	transition: all 0.2s ease;
	/* Added transition for smooth hover effects */
	border-radius: 8px;
	/* Added rounded corners */
	padding: 2px 10px 2px 5px;
	/* Added padding for better touch targets */
}

.desktopMenu-item:hover {
	background-color: rgba(255, 255, 255, 0.1);
	/* Added hover background */
	transform: translateX(5px);
	/* Slight movement on hover */
}

.desktopMenu-item.active {
	background-color: rgba(255, 255, 255, 0.15);
	/* Active state background */
	color: #FDE723;
	/* Yellow highlight color for active item */
}

body.lightMode .desktopMenu-item {
	color: #111;
	font-weight: 500;
}



/*  */

.desktopMenu-section svg path {
	fill: #eee;
	transition: fill 0.2s ease;
	/* Added transition for color changes */
}



.desktopMenu-item.active svg path {
	fill: #FDE723 !important;
	/* Force yellow for active items */
}

body.lightMode .desktopMenu-section svg path {
	fill: #111;
}



body.lightMode .desktopMenu-hotels.desktopMenu-item svg path {
	fill: #111;
}

body.lightMode .desktopMenu-hotels.desktopMenu-item.active svg path {
	fill: #056b6b;
}

.noBorder {
	border: 0;
}

.desktopMenu-last {
	width: 100%;
	margin-top: auto;
	/* Push to bottom */
}

.desktopMenu-tertirary ul {
	display: flex;
	justify-content: flex-start;
	flex-direction: row;
	align-items: center;
	margin: 0;
	padding: 0;
	width: 100%;
}

.desktopMenu-tertirary ul li {
	list-style: none;
	color: #707070;
	font-size: 12px;
	padding: 0 10px 0 0;
	border-right: 1px solid #707070;
	margin: 0 10px 0 0;
	font-weight: 500;
	cursor: pointer;
	transition: color 0.2s ease;
	/* Added transition */
}

.desktopMenu-tertirary ul li:hover {
	color: #FDE723;
	/* Hover color for footer links */
}

body.lightMode .desktopMenu-tertirary ul li:hover {
	color: #056b6b;
	/* Light mode hover color */
}

.desktopMenu-tertirary ul li:last-child {
	border: 0;
}

.desktopMenu-appVersion {
	padding: 15px 0 0;
	font-size: 13px;
	font-weight: 500;
	color: #707070;
}

.desktopMenu-addPost svg path,
.desktopMenu-more svg path {
	stroke: #eee;
	fill: transparent;
	transition: stroke 0.2s ease;
	/* Added transition */
}

.desktopMenu-addPost:hover svg path,
.desktopMenu-more:hover svg path {
	stroke: #FDE723;
	/* Hover color */
}

body.lightMode .desktopMenu-addPost svg path,
body.lightMode .desktopMenu-more svg path {
	stroke: #111;
}

body.lightMode .desktopMenu-addPost:hover svg path,
body.lightMode .desktopMenu-more:hover svg path {
	stroke: #056b6b;
	/* Light mode hover color */
}

body.lightMode .desktopMenu-addPost.active svg path,
body.lightMode .desktopMenu-more.active svg path {
	stroke: #056b6b;
}

/* Added tooltip styles for better UX */
.desktopMenu-item::after {
	content: attr(data-item);
	position: absolute;
	left: 100%;
	top: 50%;
	transform: translateY(-50%);
	background-color: #333;
	color: white;
	padding: 5px 10px;
	border-radius: 4px;
	font-size: 12px;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease, transform 0.2s ease;
	transform: translateY(-50%) translateX(10px);
	z-index: 101;
	white-space: nowrap;
}

.desktopMenu-item:hover::after {
	opacity: 1;
	transform: translateY(-50%) translateX(5px);
}

body.lightMode .desktopMenu-item::after {
	background-color: #eee;
	color: #111;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* Added collapsible menu functionality */
.menu-collapsed div#desktop__menu {
	width: 70px;
}

.menu-collapsed .desktopMenu-box {
	margin-left: 15px;
}

.menu-collapsed .desktopMenu-item span,
.menu-collapsed .desktopMenu-last {
	display: none;
}

/* Animation for AI Buddy icon */
@keyframes pulse {
	0% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.1);
	}

	100% {
		transform: scale(1);
	}
}

.desktopMenu-aiBuddy svg {
	animation: pulse 2s infinite ease-in-out;
}

/* Notification badge */
.desktopMenu-notifications {
	position: relative;
}

.notification-badge {
	position: absolute;
	top: -5px;
	right: -5px;
	background-color: #ff3b30;
	color: white;
	border-radius: 50%;
	width: 18px;
	height: 18px;
	font-size: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: bold;
}

/* Add Post button special styling */
.desktopMenu-addPost {
	background-color: rgba(97, 255, 255, 0.1);
	border-radius: 8px;
	transition: background-color 0.3s ease, transform 0.2s ease;
}

.desktopMenu-addPost:hover {
	background-color: rgba(97, 255, 255, 0.2);
	transform: translateX(5px) scale(1.05);
}

/* body.lightMode .desktopMenu-addPost {
	background-color: rgba(5, 107, 107, 0.1);
} */

body.lightMode .desktopMenu-addPost:hover {
	background-color: rgba(5, 107, 107, 0.2);
}

/* Mobile responsiveness */
@media screen and (max-width: 768px) {
	div#desktop__menu {
		transform: translateX(-100%);
		transition: transform 0.3s ease;
	}

	div#desktop__menu.open {
		transform: translateX(0);
	}

	.menu-overlay {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.5);
		z-index: 99;
		display: none;
	}

	.menu-overlay.active {
		display: block;
	}
}


/*-------------------- Desktop Sidebar ----------------------*/

div#desktopContainer {
	width: 100%;
	position: absolute;
	max-width: 100%;
	display: none;
	top: 0;
	height: 100vh;
	left: 0;
	right: 0;
	z-index: -1;
	background: linear-gradient(200deg, #FFF9CF, white);
	background-size: 1000px 100%;
	animation: shimmer 2s linear 0s 10 forwards;
}

.desktopSideBar {
	position: absolute;
	top: 0px;
	right: 1%;
	max-width: 285px;
}

.desktopSideBar-section {
	padding: 15px;
	border-radius: 10px;
	background: #1e1e2d;
	margin: 0 0 15px;
}

.desktopSideBar-premium {
	background: #fde723;
}

body.lightMode .desktopSideBar-premium {
	background: #fde723;
}

.desktopSideBar-section h3 {
	margin: 0 0 15px;
	font-size: 18px;
	color: #eee;
	font-weight: 600;
}

body.lightMode .desktopSideBar-section h3 {
	color: #111;
	font-weight: 500;
}

.desktopSideBar-premium h3 {
	color: #111;
}

.desktopSideBar-premium p {
	font-size: 12px;
	line-height: 1.5;
	font-weight: 400;
	margin: -5px 0 15px;
}

.desktopSideBar-premium button {
	height: 35px;
	background: #111;
	border: 0;
	border-radius: 5px;
	font-size: 12px;
	color: #fff;
	font-weight: 600;
	padding: 0 15px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
}

button.desktopSideBar-premium-btn svg {
	width: 15px;
	height: auto;
	margin: 0 5px 0 0;
}

button.desktopSideBar-premium-btn svg path {
	fill: #fff;
}

.desktopSideBar-section h3 b {
	font-size: 12px;
}

.desktopSideBar-section h3 span {
	color: #fde723;
}

body.lightMode .desktopSideBar-section h3 span {
	color: #056b6b;
}

.desktopSideBar-experiences-item-author__left {
	flex: 2;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	color: #eee;
	margin: 0 10px 0 0;
}

body.lightMode .desktopSideBar-experiences-item-author__left {
	color: #111;
}

.desktopSideBar-experiences-item {
	margin: 0 0 16px;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	cursor: pointer;
}

.desktopSideBar-experiences-item__left img {
	width: 70px;
	height: 70px;
	margin: 0 10px 0 0;
	border-radius: 10px;
	object-fit: cover;
}

.desktopSideBar-experiences-item__right h4 {
	font-size: 14px;
	color: #fff;
	font-weight: 500;
	margin: 0 0 4px;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

body.lightMode .desktopSideBar-experiences-item__right h4 {
	color: #000;
	font-weight: 600;
}

.desktopSideBar-experiences-item-category svg {
	height: 7px;
	width: auto;
	margin: 0 5px 0 0;
}

.desktopSideBar-experiences-item-category {
	font-size: 10px;
	display: flex;
	align-items: center;
	color: #ddd;
}

body.lightMode .desktopSideBar-experiences-item-category {
	color: #111;
}

.desktopSideBar-experiences-item-category svg path {
	stroke: #eee;
}

body.lightMode .desktopSideBar-experiences-item-category svg path {
	stroke: #111;
}

.desktopSideBar-experiences-item-author {
	display: flex;
	align-items: center;
	margin: 6px 0 0 0;
	font-size: 10px;
	justify-content: space-between;
	width: 100%;
}

.desktopSideBar-experiences-item-author__right {
	flex: 1;
	color: #fde723d1;
	font-weight: 500;
	font-size: 14px;
	text-align: right;
}

body.lightMode .desktopSideBar-experiences-item-author__right {
	color: #056b6b;
	font-weight: 700;
}

.desktopSideBar-experiences-item__left {
	flex: 1;
}

.desktopSideBar-experiences-item__right {
	flex: 3;
}

.desktopSideBar-experiences,
.desktopSideBar-followers {
	min-height: 220px;
}

.desktopSideBar-experiences-item:last-child {
	margin: 0;
}

.desktopSideBar-followers-item {
	margin: 0 0 10px;
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: space-between;
}

.desktopSideBar-followers-item__left {
	display: flex;
	align-items: center;
	cursor: pointer;
}

.desktopSideBar-followers-item__left__left {
	width: 45px;
	height: 45px;
	position: relative;
}

.desktopSideBar-followers-item__left__left img {
	width: inherit;
	height: inherit;
	border-radius: 50%;
	object-fit: cover;
}

.desktopSideBar-followers-item__left__right {
	margin: 0 0 0 10px;
	flex: 1;
}

.desktopSideBar-followers-user {
	font-size: 13px;
	color: #fff;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-weight: 500;
}

body.lightMode .desktopSideBar-followers-user {
	color: #111;
}

.desktopSideBar-followers-location {
	font-size: 12px;
	margin: 3px 0 0;
	color: #bbb;
}

body.lightMode .desktopSideBar-followers-location {
	color: #777;
}

.desktopSideBar-followers-item__right a {
	cursor: pointer;
	display: block;
	padding: 7px 12px;
	text-align: center;
	font-size: 10px;
	background: #bbb;
	border-radius: 5px;
	font-weight: 500;
}

.desktopSideBar-followers-footer {
	padding: 10px 0 0;
	text-align: center;
	margin: 25px 0 0;
	border-top: 1px solid #353535;
	color: #bbb;
	font-size: 12px;
}

body.lightMode .desktopSideBar-followers-footer {
	color: #056b6b;
	border-top: 1px solid #ccc;
	font-weight: 500;
}

.desktopSideBar-followers-footer a {
	display: block;
}

.recommendedFollowers__list {
	padding: 0 0 50px;
}

.recommendedFollowers__list .desktopSideBar-followers-item {
	margin: 0 0 20px;
}

@media screen and (max-height: 800px) {
	.desktopSideBar-experiences-item__left img {
		width: 65px;
		height: 65px;
	}
}

/*------------ Search Filter ---------------*/

.filters {
	position: relative;
	border-radius: var(--br-xl);
	/* background-color: #1e1e2d; */
	width: 100%;
	overflow-y: auto;
	text-align: left;
	font-size: var(--font-size-sm);
	color: #fff;
	font-family: var(--font-source-sans-pro);
}

body.lightMode .filters {
	color: #111;
}

form#search-filter_form {
	margin: 10px 10px 10rem 10px;
}

.filter-boxes {
	margin: 20px 5px 40px;
}

.filter_sub_boxes_label {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	color: #111;
	margin: 10px 0;
}

.filter_sub_boxes_label svg,
.location_icon svg {
	height: 20px;
	width: 20px;
}

.filter_sub_boxes_label svg path,
.location_icon svg path {
	stroke: #fff;
}

/* .filter-by-location_box .filter_sub_boxes_label svg path {
	stroke: #707070;
} */

h4.filter_subCategory_title {
	margin: 0 10px;
	font-size: 14px;
	color: #fff;
	font-weight: 500;
	line-height: 1.5;
}

body.lightMode h4.filter_subCategory_title {
	color: #111;
}

.filter_gender_options {
	width: 100%;
	height: 62px;
	border: 1px solid #1e1e2d;
	border-radius: 10px;
	display: flex;
	background: #15151f;
	color: #111;
	font-weight: 500;
}

body.lightMode .filter_gender_options {
	background: inherit;
	color: #111;
	border-color: #ddd;
}

.gender_options_box {
	width: calc(100% / 4);
	height: 54.5px;
	display: inline-grid;
	justify-items: center;
	margin: 3px 3px;
	box-shadow: 0px 0px 4px 0px rgb(56 56 56 / 15%);
	font-size: 12px;
	border-radius: 7px;
	opacity: 0.5;
	cursor: pointer;
	background: #1e1e2d;
	color: #fff;
}

body.lightMode .gender_options_box {
	background: #f5f5f5;
	color: #111;
}

label.gender_options_box svg path {
	fill: #fff;
}

body.lightMode label.gender_options_box svg path {
	fill: #111;
}

label.gender_options_box.active svg path {
	fill: #111;
}

.gender_options_box.active,
.user_types_filter_options.active {
	background: #fde723;
	opacity: 1;
	color: #111;
	font-weight: 600;
}

body.lightMode .user_types_filter_options.active,
body.lightMode .gender_options_box.active {
	background: #fde723;
	opacity: 1;
	color: #111;
	font-weight: 600;
}

.gender_options_box input {
	display: none;
}

.gender_options_box svg {
	margin-top: 6px;
}

.filter-by-age_box {
	display: flex;
	justify-content: space-between;
}

.filter_age_boxDescription {
	width: 40%;
}

.filter_age_description_box {
	font-size: 10px;
	text-align: center;
	margin: 0px 20px;
	color: #707070;
	text-align: left;
}

.filter_age_description_box p {
	margin: -5px 0 5px;
	line-height: 1.5;
	color: #bbb;
}

.filter_age_inputBox_container {
	display: flex;
	width: auto;
}

.filter_age_from_box {
	width: 88px;
	position: relative;
	height: 48px;
	border: 1px solid #bbb;
	border-radius: 10px;
	margin: 10px 15px 0 0;
}

.filter_age_from_box.active {
	border: 2px solid #fff;
}

body.lightMode .filter_age_from_box {
	border-color: #cacac9;
}

body.lightMode .filter_age_from_box.active {
	border-color: #111;
}

.filter_age_till_box {
	width: 88px;
	position: relative;
	height: 48px;
	border: 1px solid #111;
	border-radius: 10px;
	margin: 10px 15px 0 0;
}

.filter_input_number {
	height: 60%;
}

.filter_input_number input {
	width: 90%;
	position: relative;
	height: 99%;
	border: none;
	outline: none;
	text-align: center;
	background: inherit;
	color: #fff;
}

body.lightMode .filter_input_number input {
	background: inherit;
	color: #111;
}

.filter_till_label {
	position: relative;
	top: -6px;
	left: 14px;
	background: #15151f;
	width: 23px;
	text-align: center;
	font-size: 8px;
	font-weight: 600;
}

body.lightMode .filter_till_label {
	color: inherit;
	background: #fdfdfd;
}

.filter_from_label {
	position: relative;
	top: -6px;
	left: 14px;
	background: #15151f;
	width: 30px;
	text-align: center;
	font-size: 8px;
	font-weight: 600;
}

body.lightMode .filter_from_label {
	background: #fdfdfd;
	color: #111;
}

.filter_userType_options {
	width: 100%;
	height: 64px;
	border: 1px solid #1e1e2d;
	border-radius: 10px;
	display: flex;
	background: #1e1e2d;
}

body.lightMode .filter_userType_options {
	background: inherit;
	border-color: #eee;
}

.user_types_filter_options {
	width: calc(100% / 3);
	height: 56px;
	text-align: center;
	margin: 3.5px 3.5px 0px 3.5px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	position: relative;
	opacity: 0.5;
	justify-content: space-evenly;
	color: #fff;
	cursor: pointer;
}

body.lightMode label.user_types_filter_options {
	color: inherit;
	background: inherit;
}

.user_types_filter_options img {
	max-height: 35px;
	max-width: 45px;
	margin: 5px;
	width: auto;
	height: auto;
}

.user_types_filter_options p {
	font-size: 12px;
}

.user_types_filter_options input {
	display: none;
}

.search__box,
.ai-location-search {
	position: relative;
	width: 100%;
	height: 50px;
}

.ai-location-search {
	margin-top: 13px;
}

.search__box button {
	position: absolute;
	right: 8px;
	top: 8px;
	height: 34px;
	width: 34px;
	border-radius: 7px;
	border: 0;
	background: #f6ee33;
	padding: 0;
	cursor: pointer;
}

.ai-location-search input::placeholder {
	color: #fff;
}

body.lightMode .ai-location-search {
	border: 1px solid #000;
	height: 52px;
}

.search__box input,
.ai-location-search input {
	width: 100%;
	height: 45px;
	border-radius: 5px;
	padding: 0 50px 0 20px;
	background: #58586459;
	color: #fff;
	border: 0;
	outline: 0;
	border: 1px solid #555564;
	font-family: 'Montserrat';
}

.recent_search_options li {
	display: flex;
	align-items: center;
	border: 1px solid #58586459;
	border-radius: 40px;
	padding: 5px;
	font-size: 12px;
	margin: 10px 5px;
	background: #58586459;
}

body.lightMode .recent_search_options li {
	background: #fdfdfd;
}

.recent_search_options li.active {
	border: 2px solid #fde723;
}

.recent_search_options svg {
	height: 12px;
	width: 12px;
	margin: 3px;
}

.recent_search_options svg path {
	fill: #fff;
}

body.lightMode .recent_search_options span svg path {
	fill: black;
}

.recent_search_options ul {
	display: flex;
	padding: 0px;
	margin: 0 0 0 5px;
}

.recent_search_options ul li p {
	margin: 2px;
	font-size: 13px;
}

.filter_options_box {
	width: 80px;
	height: 58px;
	display: inline-block;
	text-align: center;
	padding: 6px 0;
	border-radius: 6px;
	margin: 0 15px 0 0;
	border: 1px solid #b7b6b1;
	background: #f5f5f5;
	opacity: 0.5;
	color: #555;
	background: #cacac9;
	cursor: pointer;
}

.filter_options_box.active {
	background: #fde723;
	opacity: 1;
	color: #111;
	border: 0;
}

.filter_options_box p {
	padding: 0px;
	font-size: 8px;
	margin: 0px;
	font-weight: 600;
	position: relative;
	/* bottom: -3px; */
	text-align: center;
}

.filter-by-postType_box {
	/* display: flex; */
	width: 100%;
	display: block;
}

.types-filter_options {
	display: flex;
}

.types-filter_options svg {
	width: 25px;
	height: 30px;
}

.interest-filter_options {
	margin: 10px 0 20px;
}

.individual_int_opt {
	border: 1px solid #b7b6b1;
	width: 113px;
	height: auto;
	font-size: 12px;
	text-align: center;
	border-radius: 20px;
	padding: 5px;
	background: #f5f5f5;
}

.buttons_box-SubmitReset {
	position: relative;
	bottom: 0;
	margin: 50px -10px 0 -10px;
	max-width: 100%;
	margin: 50px auto 10px;
}

.buttons_box-SubmitReset button {
	font-size: 16px;
	box-shadow: 0px -4px 10px 0px rgba(0, 0, 0, 0.1);
}

button#search-filter_reset-button {
	position: inherit;
	width: 40%;
	height: 60px;
	text-align: center;
	border: none;
	font-weight: 600;
	background: #1e1e2d;
	border-radius: 5px 0 0 5px;
	cursor: pointer;
	color: #fff;
}

body.lightMode button#search-filter_reset-button {
	background: #fff;
	color: #111;
}

button#search_filter_submit-button {
	position: inherit;
	background: #fde723;
	outline: none;
	border: none;
	font-weight: 600;
	width: 60%;
	height: 60px;
	text-align: center;
	border-radius: 0 5px 5px 0;
	cursor: pointer;
}

/*-------------------------------Edit Profile final------------*/

.editProfile__title {
	padding: 0 16px;
	position: relative;
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	flex-wrap: nowrap;
}

.editProfile__title-first {
	padding: 0 16px;
	justify-content: space-between;
	align-content: center;
	margin: 0 0 16px;
}

.editProfile__photo {
	width: 108px;
	height: 108px;
	margin: -28px 0 0 -16px;
}

.editProfile__photo img {
	width: inherit;
	height: inherit;
	object-fit: cover;
	border-radius: 50%;
	border: 4px solid #1e1e2d;
}

.editProfile__title-second {
	flex: 1;
}

input#edit__name,
input#edit__location,
input#edit__email,
input#edit__dob,
input#edit__location {
	width: 100%;
	height: 48px;
	margin-bottom: 12px;
	padding: 15px 5px 0 10px;
	border: 1px solid #524e4e;
	background: transparent;
	border-radius: 6px;
	color: #eee;
	outline-color: white;
	font-weight: 500;
	font-size: 14px;
	appearance: none;
}

body.lightMode input#edit__name,
body.lightMode input#edit__location,
body.lightMode input#edit__email,
body.lightMode input#edit__dob,
body.lightMode input#edit__location,
body.lightMode input#edit__phone {
	color: #111;
	background: #f5f5f5;
	border-color: #c5c5c5;
	outline-color: #056b6b;
}

input#edit__email {
	cursor: not-allowed;
}

input#edit__phone {
	width: 100%;
	height: 48px;
	margin-bottom: 12px;
	padding: 0px 5px 0 15px;
	border: 1px solid #524e4e;
	background: transparent;
	border-radius: 6px;
	color: #eee;
	font-size: 14px;
	font-weight: 500;
	font-family: inherit;
}

input#edit__about {
	width: 100%;
	height: 200px;
	margin-bottom: 12px;
	padding: 12px;
	border: 1px solid #524e4e;
	background: transparent;
	border-radius: 6px;
	margin-top: 16px;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

.editProfile__page {
	position: relative;
	/* top: -75px; */
	z-index: 11;
	background: #1e1e2d;
}

body.lightMode .editProfile__page {
	background: #fdfdfd;
}

.editHanging__about {
	position: relative;
}

.editHanging__name {
	display: flex;
	position: relative;
}

.edit__row-phone span {
	top: -17px;
	font-size: 12px;
	left: 2px;
}

.editHanging__name span {
	display: block;
	position: absolute;
	top: 5px;
	left: 5px;
	font-size: 10px;
	background: inherit;
	padding: 0 7px;
	color: #eee;
	letter-spacing: 0.5px;
}

.edit__row-phone span {
	top: -20px;
	font-size: 12px;
	left: 5px;
}

body.lightMode .editHanging__name span {
	background-color: inherit;
	color: #056b6b;
	font-weight: 500;
}

span.editVerifyPhone.verify,
span.editVerifyPhone.verified,
span.editVerifyPhone.verifyOtp {
	display: flex;
	justify-content: flex-end;
	padding: 10px 5px 10px;
	font-size: 14px;
	text-transform: capitalize;
	color: #fde723;
	cursor: pointer;
	margin: -5px 0 0 0;
}

body.lightMode span.editVerifyPhone.verify,
body.lightMode span.editVerifyPhone.verified,
body.lightMode span.editVerifyPhone.verifyOtp {
	color: #056b6b;
	font-weight: 600;
	font-size: 20px;
}

span.editVerifyPhone.verified {
	cursor: not-allowed;
}

.tell__us {
	position: relative;
	font-size: 16px;
	letter-spacing: 0.01em;
	font-family: "Montserrat", sans-serif;
	color: white;
	text-align: left;
	opacity: 0.8;
	margin-left: 20px;
}

body.lightMode .tell__us {
	color: #000;
}

.edit__row {
	margin: 16px;
}

.edit__row-phoneNumber {
	margin: 30px 17px 0;
}

.form__row {
	margin: 16px;
}

textarea#editProfile__about {
	width: 100%;
	border: 1px solid #524e4e;
	background: transparent;
	border-radius: 6px;
	padding: 25px 16px 0 10px;
	font-family: inherit;
	font-size: 13px;
	color: #eee;
	resize: none;
	min-height: 115px;
}

body.lightMode textarea#editProfile__about {
	color: #111;
	font-weight: 500;
	background: #f5f5f5;
	border-color: #c5c5c5;
	outline-color: #056b6b;
}

.editHanging__about span {
	position: absolute;
	top: 6px;
	left: 3px;
	font-size: 10px;
	background: inherit;
	padding: 0 7px;
	color: white;
}

body.lightMode .editHanging__about span {
	color: #056b6b;
	font-weight: 500;
	background-color: inherit;
}

.edit_traveller-travelProvider_options_box {
	display: flex;
	align-items: flex-start;
	margin: 15px 0 15px;
}

.edit_traveller_travelProvider_description {
	flex: 1;
}

.edit_traveller_travelProvider_description h4 {
	margin: 20px 0 0;
	line-height: 1.5;
}

.edit_traveller_travelProvider_description p {
	font-size: 11px;
	max-width: 90%;
	margin: 5px 0 0;
	color: #bbb;
}

body.lightMode .edit_traveller_travelProvider_description p {
	color: #707070;
}

.edit_traveller_travelProvider_radioOptions {
	margin-top: 20px;
	display: flex;
	height: 104px;
	flex: 1;
	justify-content: center;
}

.edit_traveller_travelProvider_radioOptions label {
	margin-right: 2px;
}

.travel {
	margin-right: 15px;
	border: 1px solid white;
	border-radius: 4px;
	margin-left: 9px;
}

.service_provider {
	border: 1px solid white;
	border-radius: 4px;
}

.user__type-selected {
	background: #fde723;
}

.editProfile__activities {
	display: flex;
	padding: 20px 10px;
	justify-content: space-between;
	margin: 0 0 8px;
}

.local_exp_mainContainer {
	padding: 0px 16px 15px 16px;
	color: #eee;
	margin: 30px 0 0;
}

body.lightMode .local_exp_mainContainer {
	color: #111;
	font-weight: 600;
}

.local_exp_inputBox input {
	width: 71%;
	height: 50px;
	border-radius: 10px;
	padding: 0 50px 0 20px;
	background: #fff;
	color: #fff;
	border: 0;
	outline: 0;
}

.local_exp_inputBox button {
	position: relative;
	right: 45px;
	top: 12px;
	height: 34px;
	width: 34px;
	border-radius: 7px;
	border: 0;
	background: #f6ee33;
	padding: 0;
	cursor: pointer;
}

.local_exp_inputBox {
	width: 100%;
}

.local_expertise_box p {
	color: var(--grey-2, #707070);
	font-family: "Montserrat", sans-serif;
	font-size: 8px;
	font-style: normal;
	font-weight: 400;
	line-height: 150%;
	/* 12px */
	letter-spacing: 0.24px;
}

.edit__profile-pic-box__upload label {
	position: absolute;
	bottom: 75px;
	height: 30px;
	left: 55px;
	width: 30px;
	border-radius: 50%;
	background: rgb(238 228 228 / 32%);
}

.profile__head-add-cover input {
	display: none;
}

.profile__head-add-cover label {
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}

.profile__head-add-cover label svg {
	margin: 0 5px 0 0;
}

.edit__cover-buttons {
	display: flex;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	align-items: center;
	justify-content: center;
}

.profile__head-add-cover,
.profile__head-delete-cover {
	top: 70px;
	bottom: 0;
	z-index: 2;
	width: 140px;
	background: rgba(0 0 0 / 60%);
	font-size: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 500;
	color: #fff;
	line-height: 45px;
	height: 45px;
}

.profile__head-delete-cover svg {
	margin: 0 10px 0 0;
}

.profile__head-add-cover svg path,
.profile__head-delete-cover svg path {
	fill: #fff;
	stroke: #fff;
}

.edit__cover-grid {
	display: grid;
	grid-template-columns: 376px;
	grid-template-rows: repeat(10, 200px);
	grid-gap: 10px;
	justify-content: center;
	overflow-y: scroll;
	height: calc(94vh - 140px);
	max-height: 702px;
	padding: 10px;
}

.edit__cover-grid::-webkit-scrollbar {
	width: 0;
}

.edit__cover-grid::-webkit-scrollbar-track {
	background-color: transparent;
}

.edit__cover-grid::-webkit-scrollbar-thumb {
	background-color: transparent;
}

.edit__cover-grid div {
	border: 1px solid gray;
	display: inline-block;
	padding: 10px;
	text-align: center;
	position: relative;
	overflow: hidden;
	border-radius: 10px;
	align-items: center;
}

.edit__cover-grid div img {
	position: absolute;
	top: 0;
	left: 0;
	width: 376px;
	height: 200px;
	object-fit: cover;
}

.local__expertise {
	height: 40px;
	border-radius: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	line-height: 40px;
	background: #58586459;
	color: #eee;
	font-weight: 400;
	font-size: 12px;
	margin: 0 15px 15px 0;
	border: 1px solid #555564;
	padding: 0 15px;
}

body.lightMode .local__expertise {
	color: #111;
	background-color: #f5f5f5;
	border-color: #aaa;
}

.local__expertise label {
	cursor: pointer;
	width: 100%;
	height: 100%;
}

.local_expertise_box {
	display: flex;
	flex-wrap: wrap;
	width: 100%;
	padding-top: 16px;
	padding-left: 4px;
	justify-content: flex-start;
}

.editProfile-service__type {
	position: relative;
	color: #bbb;
	font-size: 8px;
	font-weight: 500;
	letter-spacing: 0.08px;
	word-wrap: break-word;
	display: flex;
	gap: 15px;
	margin-bottom: 30px;
	margin-top: 20px;
	display: none;
	flex-wrap: wrap;
	justify-content: center;
	border-bottom: 1px solid #524e4ea6;
	padding: 0 0 30px;
}

body.lightMode .editProfile-service__type {
	border-bottom-color: #e5e5e5;
}

.hotel input[type="checkbox"],
.transport input[type="checkbox"],
.travel-agent input[type="checkbox"],
.trek input[type="checkbox"],
.translation input[type="checkbox"],
.hostel input[type="checkbox"],
.local__expertise input[type="checkbox"] {
	width: 100%;
	height: 100%;
	position: absolute;
	cursor: pointer;
	display: none;
}

.hotel label,
.transport label,
.travel-agent label,
.trek label,
.translation label,
.hostel label {
	width: 100%;
	height: 100%;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
}

#editProfile .hotel,
#editProfile .transport,
#editProfile .travel-agent,
#editProfile .trek,
#editProfile .translation,
#editProfile .hostel {
	width: calc(100% / 3 - 15px);
	height: 110px;
	display: flex;
	flex-direction: column;
	align-items: center;
	background-color: transparent;
	border: 1px solid #524e4e;
	border-radius: 8px;
	position: relative;
	cursor: pointer;
}

body.lightMode #editProfile .hotel,
body.lightMode #editProfile .transport,
body.lightMode #editProfile .travel-agent,
body.lightMode #editProfile .trek,
body.lightMode #editProfile .translation,
body.lightMode #editProfile .hostel {
	background-color: #f5f5f5;
	color: #505050;
	border-color: #c5c5c5;
}

body.lightMode #editProfile .service_type-selected {
	background: #fde723;
}

#editProfile .hotel-icon,
#editProfile .transport-icon,
#editProfile .travel-agent-icon,
#editProfile .trek-icon,
#editProfile .translation-icon,
#editProfile .hostel-icon {
	width: 35px;
	height: 35px;
	margin: 0 0 10px;
}

#editProfile .hotel-icon svg,
#editProfile .transport-icon svg,
#editProfile .travel-agent-icon svg,
#editProfile .trek-icon svg,
#editProfile .translation-icon svg,
#editProfile .hostel-icon svg {
	width: inherit;
	height: inherit;
}

#editProfile .travel-agent-text,
#editProfile .hotel-text,
#editProfile .transport-text,
#editProfile .trek-text,
#editProfile .translation-text,
#editProfile .hostel-text {
	text-align: center;
	font-size: 12px;
	width: 100%;
}

.please__select {
	font-size: 13px;
	font-family: "Montserrat", sans-serif;
	display: none;
	font-weight: 300;
}

#editProfile .service_type-selected {
	border: black;
	background: #fde723;
	color: black;
	font-weight: 600;
}

#editProfile .service_type-selected svg path {
	fill: #000;
}

select#editProfile__countryCode {
	flex: 1;
	padding: 0px 5px;
	margin: 0 7px 0 0;
	background: #1e1e2d;
	color: #eee;
	border: 1px solid #524e4e;
	border-radius: 6px;
	max-width: 70px;
	min-width: 70px;
	height: 48px;
	text-align: center;
}

body.lightMode select#editProfile__countryCode {
	color: #111;
	background: #f5f5f5;
	border-color: #c5c5c5;
}

label#edit__gender {
	color: #eee;
}

body.lightMode label#edit__gender {
	color: #000;
	font-weight: 500;
}

input#edit__otp {
	height: 40px;
	margin-left: 76px;
	/* margin-bottom: 12px; */
	padding: 2px 5px 0 20px;
	border: 1px solid #524e4e;
	background: transparent;
	border-radius: 6px;
	color: #eee;
	font-size: 14px;
	width: 312px;
	margin-bottom: 10px;
}

body.lightMode input#edit__otp {
	color: black;
}

.editGender__checkbox .checkbox-item label {
	font-size: 14px;
	color: #eee;
	height: inherit;
	line-height: 55px;
	font-weight: 500;
}

body.lightMode .editGender__checkbox .checkbox-item label {
	color: #111;
}

.checkbox-item.checked label {
	color: #000;
	font-weight: 400;
}

.editProfileInterests__tabs {
	display: flex;
	margin: 15px 0 0;
	box-shadow: 0px 2px 10px 0px rgb(0 0 0 / 7%);
	padding: 15px 0px 0 0px;
	clip-path: inset(-10px 0px -10px 0px);
}

.editInterest__checkbox .checkbox-item {
	height: 55px;
	border-radius: 36px;
	font-size: 18px;
	padding: 0 30px;
	line-height: 32px;
	background: #58586459;
	color: #eee;
	font-weight: 400;
	font-size: 11px;
	margin: 0 15px 20px 0px;
	border: 1px solid #555564;
}

body.lightMode .editInterest__checkbox .checkbox-item {
	background-color: #fdfdfd;
	color: #505050;
	border-color: #c5c5c5;
}

body.lightMode .editInterest__checkbox .checkbox-item.checked {
	background-color: #fde723;
	border: none;
	color: #000;
}

.editGender__checkbox .checkbox-item {
	height: 55px;
	margin: 0 0 13px;
	border: 1px solid #524e4e;
	border-radius: 10px;
	font-size: 18px;
	padding: 0 30px;
	color: black;
}

.profileInterests__social-link label {
	display: flex;
	flex-direction: row;
	width: 100%;
	flex: 1;
	text-decoration: none;
}

input#edit__social-links {
	display: block;
	font-size: 12px;
	color: #bbb;
}

#editProfile .profileInterests__social-link-right {
	margin: 0 0 0 20px;
	color: #bbb;
	position: relative;
	height: 50px;
	font-size: 10px;
	padding: 8px 15px 0;
}

.profileInterests__social-link-right input {
	display: block;
	font-size: 12px;
	height: 50px;
	width: 250px;
	border: 1px solid #524e4e;
	background: transparent;
	border-radius: 6px;
	color: #fde723;
	padding: 15px 15px 0;
	position: absolute;
	top: 0;
	left: 0;
	font-weight: 700;
}

.edit__places {
	width: 100%;
	margin: auto;
	padding: 20px 0 0;
}

.editGender__checkbox .checkbox-item svg {
	max-width: 28px;
	max-height: 35px;
	vertical-align: middle;
}

.editPlaces__search-results {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-direction: row;
	flex-wrap: wrap;
	margin: 20px 0;
}

.hotel-icon svg path,
.transport-icon svg path,
.travel-agent-icon svg path,
.trek-icon svg path,
.translation-icon svg path,
.hostel-icon svg path {
	fill: #bbb;
}

body.lightMode .hotel-icon svg path,
body.lightMode .transport-icon svg path,
body.lightMode .travel-agent-icon svg path,
body.lightMode .trek-icon svg path,
body.lightMode .translation-icon svg path,
body.lightMode .hostel-icon svg path {
	fill: #505050;
}

.edit_traveller_travelProvider_description h4 {
	margin: 20px 0 0;
	line-height: 1.5;
}

#editProfile .profileInterests__interest {
	margin: 0 0 15px;
	padding: 0 10px;
	background: #343447;
	font-size: 13px;
	line-height: 40px;
	border-radius: 20px;
	text-align: left;
	font-weight: 500;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 185px;
	margin-right: 15px;
	/* white-space: nowrap; */
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	width: auto;
}

body.lightMode #editProfile .profileInterests__interest {
	background: #fde723;
	color: #111;
	box-shadow: 0px 0px 5px 0px #bababa;
}

.editGender__checkbox .checkbox-item svg path {
	fill: white;
}

body.lightMode .editGender__checkbox .checkbox-item svg path {
	fill: #000;
}

.editGender__checkbox .checkbox-item.checked svg path {
	fill: black;
}

.remove__place {
	float: right;
	margin-right: -4px;
	margin-top: 4px;
	margin-left: 8px;
	cursor: pointer;
}

.popup__master.popup__master--deleteCover.active .popup__container {
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	min-height: 180px;
	max-width: 90%;
	max-height: 90%;
	background: #fff;
	z-index: 1;
	border-radius: 20px;
	height: 1px;
	width: 400px;
}

/*------------------- Marketplace ----------------------*/

.marketplace__tabs,
.experiences__body-tabs {
	margin: 20px 16px;
	display: flex;
	align-items: center;
	flex-direction: row;
	justify-content: center;

}

.experiences__body-tabs.hide {
	display: none;
}

.single__marketplace-tab,
.experiences__body-tab {
	display: flex;
	align-items: center;
	align-content: center;
	flex-wrap: nowrap;
	flex-direction: row;
	font-size: 12px;
	height: 48px;
	background: rgba(255, 255, 255, 0.05);
	border-radius: 8px;
	font-weight: 500;
	color: #bbb;
	line-height: 1.3;
	justify-content: center;
	padding: 0 8px;
	cursor: pointer;
}

body.lightMode .experiences__body-tab,
body.lightMode .single__marketplace-tab {
	background: #f3f3f3;
	border: 1px solid black;
	color: black;
}

.single__marketplace-tab:nth-child(2) {
	margin: 0 15px;
}

.single__marketplace-tab svg,
.experiences__body-tab svg {
	margin: 0 8px 0 0;
}

.single__marketplace-tab svg path,
.experiences__body-tab svg path {
	fill: #bbb;
}

.single__marketplace-tab.active,
.experiences__body-tab.active {
	background-color: #fde723;
	color: #000;
	font-weight: 600;
}

body.lightMode .experiences__body-tab.active,
body.lightMode .single__marketplace-tab.active {
	background-color: #fde723;
	border: 1px solid black;
}

.single__marketplace-tab.active svg path,
.experiences__body-tab.active svg path {
	fill: #000;
}

.single__marketplace-tab:nth-child(2) svg path {
	stroke: #bbb;
}

.single__marketplace-tab:nth-child(2).active svg path {
	stroke: #000;
}

.marketplace__tab-item {
	display: none;
}

.marketplace__tab-item.active {
	display: block;
}

.marketplace__localServices h3 {
	margin: 20px 10px;
	font-size: 16px;
	color: #eee;
}

body.lightMode .marketplace__tab-item h3 {
	color: #000;
}

.header__menu ul li.head__long.active {
	color: #fde723;
}

.header__menu ul li.head__long.active svg path {
	stroke: #fde723;
}

/*-------------- Pull to Refresh ---------- */

.refresh__Feed {
	width: 100%;
	display: flex;
	justify-content: center;
	color: #eee;
	margin: 10px 0 0 0;
}

.refresh__icon {
	transform: rotate(45deg);
}

.feed__login-left {
	width: 300px;

	h3 {
		margin: 0;
		padding: 0;
		font-size: 17px;
	}

	p {
		margin: 0;
		padding: 0;
		font-weight: 600;
	}
}

/*-------------------- Desktop Mode ----------------------*/

.faq-info-box {
	display: flex;
	align-items: center;
	justify-content: space-around;
	font-size: 14px;
	color: #FFFFFF;
	cursor: pointer;
}

.faq-intro-left {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.faq-info-box h2 {
	color: white;
	text-decoration: underline;
	font-size: 14px;
}

.faq-intro-left {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

/*---------------------- Social Links Single Service Page ---------------*/

.social-icons-box {
	width: 396px;
	margin: auto;
}

.social-icons-box ul {
	list-style: none;
	color: #eee;
	display: inline-flex;
	overflow: hidden;
}

.social-icons-box ul li svg {
	height: 24px;
	width: 24px;
	margin-left: 10px;
	margin-right: 5px;
}

.social-icons-box ul li svg path {
	fill: white;
}

.social-icons-box ul {
	list-style: none;
	color: #eee;
	overflow: hidden;
	align-items: center;
	flex-wrap: wrap;
	display: flex;
	flex-direction: row;
	padding: 0px;
}

.social-icons-box li {
	display: flex;
	/* align-items: center;
  justify-content: center; */
}

li.twitter__social,
li.website__social {
	margin-top: 10px;
}

.social-icons-box ul li a {
	padding-left: 5px;
	font-size: 14px;
	color: #fde723;
}

body.lightMode .social-icons-box ul li a {
	color: #056b6b;
}

.filler-class-do-not-use {
	background: #ddd;
	height: 100%;
	text-align: center;
}

.experience_share {
	width: 300px;
	height: 323px;
	flex-shrink: 0;
	position: relative;
	background: #fff388;
}

.experience_share_box-inner {
	max-height: 400px;
	max-width: 100%;
}

.info_box-photoInfo {
	display: flex;
	width: 100%;
	overflow: hidden;
	align-items: center;
}

.info_box-photoInfo img {
	width: 100px;
	object-fit: contain;
	height: 100px;
	border-radius: 10px;
	margin: 1px;
	background: #000;
	margin: 0 0 0 5px;
}

.expereince-info_box {
	display: inline-table;
	flex-shrink: 0;
	text-align: left;
	margin: 0 10px;
	overflow: hidden;
	letter-spacing: 0.25px;
	width: calc(100% - 120px);
}

.exp_logo-name {
	display: flex;
	align-items: center;
	margin: 0 0 0 0;
}

.exp_logo-name h3 {
	margin: 3px 0px 0 5px;
	font-size: 8px;
	color: #eee;
	font-weight: 400;
}

.exp_logo-name svg {
	width: 12px;
	height: 12px;
}

.exp-name {
	margin: 0;
}

.exp-name h3 {
	margin: 0px 0 0 0px;
	font-weight: 500;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 13px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.exp-location {
	display: flex;
	align-items: center;
	margin-bottom: 5px;
}

.exp-location svg {
	max-width: 12px;
	max-height: 12px;
}

.exp-location svg path {
	fill: white;
}

.exp-location h5 {
	margin: 0px 0 0 5px;
	font-size: 10px;
	color: #eee;
	font-weight: 200;
}

.bottom_exp-info {
	text-align: left;
	margin: 15px 10px;
}

.bottom_exp-info h5 {
	margin: 0px;
	font-size: 11px;
	font-weight: 500;
}

.bottom_exp-info p {
	margin: 10px 0 0 0;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 9px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-height: 1.5;
	font-weight: 200;
	margin: 4px 0 0;
}

.bottom_exp-button {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fde723;
	font-weight: 700;
	border-radius: 0px 0px 8px 8px;
	padding: 8px;
}

.bottom_exp-button p {
	margin: 0px 5px 0 0;
	font-size: 14px;
	color: black;
}

.exp-price {
	color: #fde723;
	font-weight: 600;
	font-size: 12px;
}

input#share__location_lat,
input#share__location_lng,
input#findBuddy__location_lat,
input#findBuddy__location_lng,
input#findMeetups__location_lat,
input#findMeetups__location_lng,
input#ask__location_lat,
input#ask__location_lng {
	display: none;
}

span.size__limit {
	margin-top: 40px;
	color: #fde723;
	font-size: 10px;
	font-style: italic;
	font-family: SYSTEM-UI;
}

body.lightMode span.size__limit {
	color: #056b6b;
}


/**********  ADDEDD EXTRA *********/
.booking__box-slots {
	overflow: scroll;
	min-height: 100px;
	height: 150px;
}

.booking__box-slots::-webkit-scrollbar {
	display: none;
}


.signUp__login {
	color: white !important;
}

@media screen and (max-width: 700px) {

	/* .drawerHeader {
		display: none;
	} */
	.login__view,
	.reset__view,
	.otp__view {
		padding: 40px 20px;
	}
}

div#secondary,
.onboardingBody2 {
	width: 100% !important;
}

.feed__loader {
	display: flex;
	justify-content: center;
	max-width: 100%;
	background: #15151f;
}

.feed__loader span {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: white;
	padding: 0 15px 0 15px;
	min-width: 100%;
	text-align: center;
	font-size: 12px;
	font-family: inherit;

}

.feed__loader span svg {
	height: 35px;
	width: 35px;
}

.feed__loader.findExp {
	padding: 15px;
	background: #fde723;
	margin-bottom: 20px;

	span {
		color: black;
		font-size: 16px;
	}
}

.top-locals {
	padding: 0px 10px 0px 30px;
	color: #ddd;
	font-size: 16px;
	font-weight: 600;

	span {
		color: #F6EE33;
	}
}

body.lightMode .top-locals {
	color: #000;

	span {
		color: #59A4FF;
	}
}

@media (min-width: 768px) {
	.top-locals {
		padding: 25px 10px 5px 30px;
	}
}

/* Listings Card css */


.listing--card-header {
	background: #FFFD9E;
	padding: 0px 5px 0 5px;
	border-radius: 10px;
	/* position: relative; */
}

.listing--card {
	height: 320px;
	width: 220px;
	max-width: 100%;
	cursor: pointer;
	background: var(--White, #FFF);
	box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.15);
	border-radius: 10px;
}

body.lightMode .listing--card {
	border: 1px solid #000;
}

.listing-card-name {
	height: 66px;
	border-radius: 2px 2px 0px 0px;
	/*   padding: 10px 5px 0 5px; */
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 15px;
}

.profile-icon-left {
	position: relative;
}

.profile-icon-left img {
	height: 50px;
	width: 50px;
	border-radius: 50px;
}

.listing-card-owner-name {
	color: black;

	/*   padding:20px 10px; */
	p {
		font-size: 9.5px;
		font-style: normal;
		font-weight: 400;
		line-height: normal;
		letter-spacing: 0.095px;
		font-family: Montserrat;
		margin: 0;
		padding: 0;
	}

	h3 {
		margin: 0;
		padding: 0;
		text-decoration: underline;
		font-family: Montserrat;
		font-size: 12px;
		font-style: normal;
		font-weight: 700;
		line-height: normal;
		letter-spacing: 0.12px;
	}
}

.listed-image {
	width: 100%;
	height: 150px;
	flex-shrink: 0;
	/*   overflow:hidden; */
	object-fit: cover;
}

.listing-desc {
	/*   width:100%; */
	padding: 0px 10px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: space-between;
}

.listing-desc-price {
	height: 5px;
	margin: 5px 0 5px 0;
}

.listing-desc-name {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 25px;
	margin-top: 5px;

	h3 {
		margin: 0;
		padding: 0;
		font-size: 12px;
		font-style: normal;
		font-weight: 600;
		line-height: normal;
		letter-spacing: 0.12px;
		color: #000;
		font-family: Montserrat;
		max-width: 100px;
		line-break: auto;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}

	p {
		margin: 0;
		padding: 0 0 0 5px;
		color: #40404A;
		font-size: 10px;
		font-style: normal;
		font-weight: 600;
		line-height: normal;
		letter-spacing: 0.1px;
		font-family: Montserrat;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
}

.listing-desc-price p {
	margin: 0;
	padding: 0;
	/* margin-top: 5px; */
	font-family: Montserrat;
	font-size: 14px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	letter-spacing: 0.1px;
	color: #40404A;
}

.listing-trusted-badge {
	display: flex;
	align-items: center;
	justify-content: space-between;
	align-self: center;
	height: 50px;
}

.experience-type {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 5px 0 5px 12px;
	background-color: #F6EE33;
	border-radius: 100px;
	width: 170px;
	margin-top: 10px;
}

.experience-type svg {
	height: 24px;
	width: 24px;
	flex-shrink: 0;
}

.experience-type h3 {
	font-family: Montserrat;
	font-size: 9.5px;
	font-style: normal;
	font-weight: 500;
	line-height: normal;
	letter-spacing: 0.095px;
	margin: 0;
	padding: 0;
	color: #40404A;
}

.trusted-badge {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0;
	padding: 0;


}

.trusted-badge svg {
	height: 20px;
	width: 20px;
}

.listing-container {
	height: 100%;
	background: #1e1e2d;
	margin: 5px 0px 5px 0px;
	border-radius: 3px;
	/* box-shadow: black 0px 0px 10px 1px; */
	box-sizing: border-box;
	overflow: hidden;
	color: white;
	padding: 5px 5px 0 0;
}

body.lightMode .listing-container {
	background-color: #FFFFFF;
}

.listing_title_box {
	color: #f6ee33;
	display: flex;
	place-content: center space-between;
	align-items: center;
	height: 30px;
	font-size: 12px;
	padding: 0 0 5px;
}

body.lightMode .listing_title_box {
	color: #056B5B;
}

.listing--card--wrapper {
	height: 320px;
	width: 100%;
	position: relative;
	margin: 0 0 5px 5px;
	gap: 7.5px;
	overflow-x: scroll;
}

.listing--card--wrapper::-webkit-scrollbar {
	display: none;
}

.listing-service__icon {
	height: 25px;
	width: 25px;
}

@media (max-width: 767.98px) {
	.listing-container {
		margin: 5px 0px 5px 0px;
	}
}

.drawer::-webkit-scrollbar {
	display: none;
}

@media screen and (min-width: 768px) {
	.share__btn-hidden {
		display: none !important;
	}

	.copy-icon-first {
		order: 1;
	}
}

.messageDashboard {
	display: flex;
	flex-direction: column;
	padding: 10px;
}

body.lightMode .messageDashboard {
	background: white;
	border-radius: 10px;
}

input#share__upload {
	margin-bottom: 40px;
	color: #fde723;
	height: 50px;
}

body.lightMode input#share__upload {
	color: #000;
}

textarea#share__message {
	margin-bottom: 40px;
	height: 250px;
	padding: 15px;
	font-size: 12px;
	border-radius: 10px;
	border: 1px solid #1e1e2d;
}

select#message-cohorts {
	height: 50px;
	margin-bottom: 40px;
	border-radius: 10px;
	border: 1px solid #1e1e2d;
	padding: 10px;
}

button#send_message_dashboard {
	height: 50px;
	border-radius: 10px;
	background: yellow;
	color: black;
	font-family: "Montserrat", sans-serif;
	font-size: 18px;
	font-style: normal;
}

select#message_profile {
	height: 50px;
	margin-bottom: 40px;
	border-radius: 10px;
	border: 1px solid #1e1e2d;
	padding: 10px;
}

/* Enquiry Form css */
.enquiry__container__overlap {
	height: 570px !important;
	width: 760px !important;
}

@media (min-width: 770px) {
	.enquiry__container__overlap .popup__head {
		padding: 0px !important;
		width: 770px !important;
	}
}

.enquiry__form__container {
	display: flex;
	justify-content: center;
	max-width: 800px;
	margin: 0;
	position: absolute;
	top: 0%;
	color: white;
}

.form__right_header {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	align-content: center;
}

@media screen and (max-width: 768px) {
	.enquiry__form__container {
		/* max-width: 400px; */
		width: 400px;
	}

	.enquiry__container__overlap {
		width: 380px !important;
	}
}

.enquiry_form_right {
	background: #1e1e2d;
	max-width: 400px;
	width: 100%;
	height: 100%;
}

.cross-btn {
	display: flex;
	align-items: end;
	justify-content: flex-end;

	img {
		height: 20px;
		width: 20px;
		border-radius: 70px;
	}
}

.enquiry__form__input {
	padding: 0px 5px;
	background: #1e1e2d;
}

.travel__buddy__logo {
	display: flex;
	align-items: center;
	justify-content: center;

	img {
		height: 180px;
		width: 390px;
		border-radius: 10px;
		background: #1E1E2D;
		object-fit: cover;
		border: 4px solid #fde723;
	}
}

.header-head_line h4 {
	margin: 10px;
	font-size: 14px;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #F4F20E;
	max-width: 320px;
	text-align: center;
}

.enquiry_detailed_form {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	gap: 3px;

	label {
		font-size: 13px;
		font-weight: 700;
		margin-top: 5px;
	}

	input {
		background: #ccc;
		height: 35px;
		border: 1px solid white;
		border-radius: 5px;
		padding: 0 10px;
		font-size: 14px;
		color: black;
		font-weight: 540;
	}

	select {
		font-size: 14px;
		background: #ccc;
		height: 35px;
		border: 1px solid white;
		border-radius: 5px;
		padding: 0 10px;
		color: black;
		font-weight: 540;
	}
}

.call__us {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 5px;

	h3 {
		margin: 0;
		padding: 0;
		font-size: 12px;
	}

	span {
		font-size: 18px;
		color: #FDE723;
	}
}

.enquiry__form_cancel {
	position: absolute;
	top: 10px;
	right: 20px;
	cursor: pointer;

	img {
		z-index: 9;
		height: 30px;
		width: 30px;
		border-radius: 50%;
	}
}

.enquiry__form__details {
	padding: 0px 8px 8px 8px;
	display: flex;
	flex-direction: column;
	gap: 5px;
	height: 420px;
	overflow: scroll;
	scrollbar-width: none;
}

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

.name_input,
.number_input {
	max-width: 150px;
}

.submit-btn,
.analytics__refresh {
	display: flex;
	align-items: stretch;
	justify-content: space-evenly;
	margin-top: 5px;
	flex-direction: row;
	flex-wrap: nowrap;

	button {
		height: 40px;
		background: #F4F20E;
		border: none;
		padding: 0 20px;
		color: black;
		font-weight: 800;
		font-size: 14px;
		border-radius: 5px;
		margin-top: 10px;
	}
}

#enquiryCancel {
	background: transparent;
	color: lightgrey;
	/* border: 1px solid #FDE723; */
}


.enquiry-form-footer {
	height: 50px;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #000;

	h3 {
		margin: 0;
		padding: 0;
		font-size: 18px;
		font-weight: 600;
		color: #FDE723;
		margin-left: 2px;
	}

	span {
		font-weight: 900;
		font-size: 13px;
		color: white
	}
}

.price-input {
	width: 100%;
	display: flex;
	margin: 6px 0 15px;
}

/* Message Dashboard Analytics css */

.analytics__page {
	width: 100%;
	color: white;
	overflow: scroll;
}

.analytics__title {
	width: 100%;
	color: white;
}

table.dataTable tbody th,
table.dataTable tbody td {
	padding: 8px 30px;
	border: 1px solid black;
}

table.dataTable tbody tr {
	background-color: #000;
}

.dataTables_wrapper .dataTables_length select {
	border: 1px solid #fff;
	border-radius: 3px;
	padding: 5px;
	background-color: transparent;
	padding: 4px;
}

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter,
.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_processing,
.dataTables_wrapper .dataTables_paginate {
	color: #fff;
}

.dataTables_wrapper .dataTables_filter input {
	border: 1px solid #fff;
	border-radius: 3px;
	padding: 5px;
	background-color: transparent;
	margin-left: 3px;
	color: white;
}

table.dataTable.no-footer {
	border-bottom: 1px solid #fff;
	color: black;
	border: 1px solid;
	margin-top: 20px;
}

table.dataTable.tr.table__title {
	color: white;
	margin-top: 20px;
}

table.dataTable.tr {
	background: #000;
}

tbody#tableBody {
	color: black;
	font-size: 10px;
	font-family: "Montserrat", sans-serif;

}

button.dt-button.buttons-csv.buttons-html5 {
	background: yellow;
	border-radius: 20%;
	margin-left: 5px;
}

.analytics__refresh {
	margin-bottom: 10px;
}

.message__progress-bar {
	background: green;
	height: 20px;
}


/*   Experience Filter CSS  */

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

.filter_experience_category {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
}

/* price range slider css styling */

.slider-wrapper {
	width: 300px;
	background: #1e1e2d;
	border-radius: 10px;
	padding: 0px 10px 10px;
	box-shadow: 0 12px 35px rgba(0, 0, 0, 0.1);
	position: absolute;
	top: 96%;
	right: -4%;
}

.slider-wrapper::before {
	content: "";
	position: absolute;
	bottom: 100%;
	right: 50%;
	margin-left: -10px;
	border-width: 10px;
	border-style: solid;
	border-color: transparent transparent #1e1e2d transparent;
}

header h2 {
	font-size: 18px;
	font-weight: 600;
	color: #f6ee33;
}

header p {
	margin: 0;
	padding: 0;
	font-size: 14px;
	color: white;
}

.price-input {
	width: 100%;
	display: flex;
	margin: 6px 0 15px;
}

.price-input .field {
	display: flex;
	width: 100%;
	height: 45px;
	align-items: center;
	color: white;
}

.field input {
	width: 100%;
	height: 70%;
	outline: none;
	font-size: 19px;
	margin-left: 12px;
	border-radius: 5px;
	text-align: center;
	border: 1px solid #999;
	-moz-appearance: textfield;
	appearance: textfield;
}

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none;
}

.price-input .separator {
	width: 130px;
	display: flex;
	font-size: 19px;
	align-items: center;
	justify-content: center;
	color: white;
}

.slider-filter {
	height: 5px;
	position: relative;
	background: #ddd;
	border-radius: 5px;
	width: 98%;
}

.slider-filter .progress {
	height: 100%;
	left: 0%;
	right: 0%;
	position: absolute;
	border-radius: 5px;
	background: #f6ee33;
}

.range-input {
	position: relative;
}

.range-input input {
	position: absolute;
	width: 100%;
	height: 0px;
	left: -5px;
	top: -5px;
	background: none;
	pointer-events: none;
	-webkit-appearance: none;
	-moz-appearance: none;
}

input[type="range"]::-webkit-slider-thumb {
	height: 17px;
	width: 17px;
	border-radius: 50%;
	background: #f6ee33;
	pointer-events: auto;
	-webkit-appearance: none;
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
}

input[type="range"]::-moz-range-thumb {
	height: 17px;
	width: 17px;
	border: none;
	border-radius: 50%;
	background: #17a2b8;
	pointer-events: auto;
	-moz-appearance: none;
	box-shadow: 0 0 6px rgba(0, 0, 0, 0.05);
}

.apply-btn {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	cursor: pointer;
	margin-top: 20px;
	gap: 10px;
}

#applyPriceFilterBtn {
	padding: 5px 20px 5px 20px;
	background: #FDE723;
	border: none;
	border-radius: 5px;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
}

#cancel-filter-applied {
	padding: 5px 20px 5px 20px;
	background: #1E1E2D;
	border: 1px solid #FDE723;
	border-radius: 5px;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
	color: #FDE723;
}

/* category-filter css styling */

.filter-list-container-wrapper::before {
	content: "";
	position: absolute;
	left: 90%;
	margin-left: -10px;
	border-width: 10px;
	border-style: solid;
	border-color: transparent transparent #1e1e2d transparent;
}

.filter-list-container {
	max-width: 210px;
	max-height: 300px;
	overflow: auto;
	margin: 10px auto;
	background-color: #1e1e2d;
	border-radius: 8px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	padding: 10px;
	position: absolute;
	top: 92%;
	right: 0%;
	/* display: none; */

	h2 {
		margin: 0;
		padding: 0;
		color: #fde327 !important;
		font-size: 18px;
		font-weight: 500;
	}
}

.cancel-categories {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 10px 0;

	svg {
		height: 10px;
		width: 10px;
	}
}

div#cancel-filter-categories {
	width: 20px;
	height: 20px;
	background: #FDE723;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 20px;
	cursor: pointer;
}

.filter__select__list {
	list-style-type: none;
	padding: 0;
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-start !important;

	li {
		margin: 5px 0 !important;
		padding: 10px;
		border-bottom: 1px solid #ddd;
		transition: background-color 0.3s ease;
		font-size: 15px !important;
		color: white;
		width: 100%;
	}

	li:hover {
		background-color: #f6ee33;
		color: black !important;
	}
}

.filter-list-container::-webkit-scrollbar {
	display: none;
}

.filter__experience__date {
	display: none;
}

#datePickerIcon {
	display: flex !important;
	align-items: center !important;
}

.drp-buttons .drp-selected {
	display: none !important;
}

.daterangepicker {
	top: 375.5px !important;
	left: auto !important;
	right: 310px !important;
	background-color: #1e1e2d !important;
}

.price-range {
	position: relative;
	z-index: 1;
}

.filter-list-masked {
	position: relative;
	z-index: 1;
}

@media (max-width: 1400px) {
	.daterangepicker {
		right: 70px !important;
	}
}

@media (max-width: 1200px) {
	.daterangepicker {
		right: 5px !important;
	}
}

@media (max-width: 992px) {
	.daterangepicker {
		right: -22px !important;
	}
}

@media (max-width: 768px) {
	.daterangepicker {
		right: -177px !important;
	}
}

@media (max-width: 576px) {
	.daterangepicker {
		right: 22px !important;
		top: 362.5px !important;
	}

	.slider-wrapper {
		top: 103%;
	}

	.filter-list-container {
		top: 95%;
	}
}

@media (max-width: 475px) {
	.daterangepicker {
		right: 5px !important;
		top: 362.5px !important;
	}

	.slider-wrapper {
		top: 103%;
	}

	.filter-list-container {
		top: 92%;
	}
}

@media (max-width: 420px) {

	.experiences__header-title h1 {
		font-size: 23px;
	}

	.filter__date__experiences span {
		font-size: 10px;
	}

	.experiences__search-categories ul li {
		font-size: 10px;
	}

	.daterangepicker {
		right: 2px !important;
		top: 352px !important;
		width: 372px !important;
	}

	.slider-wrapper {
		top: 94%;
		right: 5%;
	}

	.filter-list-container {
		top: 89%;
		right: 4%;
	}

	.filter-list-container-wrapper::before {
		left: 80%;
	}

	.experiences__search-categories ul {
		width: 100%;
		justify-content: space-between;
	}

	/* .daterangepicker .drp-calendar.left {
		padding: 0px 0 0px 0px !important;
	} */
	.daterangepicker .drp-calendar {
		/* display: none; */
		max-width: 367px !important;
	}
}

@media (max-width: 300px) {
	.daterangepicker {
		right: 0px !important;
		top: 268px !important;
		width: 280px !important;
	}

	.filter-list-container {
		top: 109%;
	}

	.slider-wrapper {
		top: 114%;
	}
}

.daterangepicker .drp-calendar.right {
	padding: 8px 0 8px 8px !important;
}

.daterangepicker .calendar-table {
	border: 1px solid black !important;
	background-color: #000 !important;
}

.daterangepicker:after {
	top: -6px;
	border-right: 10px solid transparent !important;
	border-bottom: 10px solid #1e1e2d !important;
	border-left: 10px solid transparent !important;
	left: 6px !important;
}

.daterangepicker td.active,
.daterangepicker td.active:hover {
	background-color: #fde723 !important;
	color: #000 !important;
}

.daterangepicker .drp-buttons .btn {
	padding: 6px 20px !important;
	background: #1e1e2d !important;
	color: #fde723 !important;
	border: 1px solid !important;
}

.daterangepicker td.off,
.daterangepicker td.off.start-date,
.daterangepicker td.off.end-date {
	background-color: #000 !important;
	color: #fff !important;
}

.daterangepicker .calendar-table th,
.daterangepicker .calendar-table td {
	color: #fff !important;
}

.daterangepicker td.in-range {
	background-color: #fde723 !important;
	border-color: 1px solid #000 !important;
	color: #000 !important;
}

.daterangepicker .calendar-table .next span,
.daterangepicker .calendar-table .prev span {
	border: solid white !important;
	border-width: 0 2px 2px 0 !important;
}

.overlay-filter-wrapper {
	position: fixed;
	width: 100%;
	max-width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	margin: auto;
}

body.lightMode .chat_lightModeIcon svg path {
	fill: none !important;
}

body.lightMode .addPost_lightmode svg path {
	fill: none !important;
}

body.lightMode .onboarding__page-title h1,
body.lightMode .onboarding__page-title h4 {
	color: #000;
}

body.lightMode .onboarding__form-box label {
	color: #000;
}

body.lightMode .form__checkbox .checkbox-item label {
	color: #000;
}

body.lightMode .form__row input {
	border-color: #000;
}

body.lightMode .form__location input {
	border: 1px solid black;
}

body.lightMode .cancel__onboarding svg {
	stroke: #000;
}

body.lightMode .form__checkbox.checkbox__type svg path {
	fill: #000;
}

.see_all_experiences {
	color: #fde723;
	text-decoration: underline;
	cursor: pointer;
	font-size: 15px;
	font-weight: 400;
}

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

.overlap__influencerTag {
	position: absolute;
	top: 0;
	left: 0;
}

.footer-span {
	max-width: 80px;
}

.similar__plans {
	/* max-width: 470px;
    margin:auto; */
	display: flex;
	flex-direction: column;
}

/*---------------------- Find Buddy Group ----------------------*/

.checkBoxFind {
	display: flex;
	align-items: center;
	padding: 12px 16px;
	margin-top: 20px;
}

.checkBoxFind input[type="checkbox"] {
	appearance: none;
	border: 1px solid #c6c6c6;
	padding: 10px;
	border-radius: 4px;
	display: inline-block;
	position: relative;
	cursor: pointer;
}

.checkBoxFind input[type="checkbox"]:checked {
	background-color: #4CAF50;
	border-color: #4CAF50;
}

.checkBoxFind input[type="checkbox"]:checked:after {
	content: '\2714';
	font-size: 14px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: #fff;
}

.checkBoxFind label {
	margin-left: 10px;
	color: #61FFFF;
	font-size: 14px;
}

.checkBoxFind.exp {
	margin-bottom: 20px;
	padding: 0;
	margin-top: 0;
}

img.overlap__influencerTag {
	position: absolute;
	top: 0;
	left: 35%;
	transform: translateX(-50%);
}

.feed__head-img a .overlap__influencerTag,
.profile__photo .overlap__influencerTag {
	left: 50%;
}

body.lightMode .fas.fa-play {
	color: #1e1e2d;
}

.profile_info.clearfix {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.profile_info.clearfix .overlap__influencerTag {
	position: absolute;
	bottom: 0;
	top: -40px;
	transform: translateX(-50%);
	left: 50%;
}

body.lightMode .checkBoxFind label {
	color: black;
	font-weight: 600;
}

/*---------------------- Onboarding Video ----------------------*/

.onboardingVideo {
	width: 100%;
	height: 70px;
	background: yellow;
	text-align: center;
	font-size: 18px;
	font-family: "Montserrat", sans-serif;
	font-weight: 600;
	border-radius: 20px;
	z-index: 5;
	position: relative;
}

.onboarding__video {
	position: relative;
}


/*---------------------- Sub Menu ----------------------*/
.submenu {
	margin: 0 !important;
}

/*---------------------- Call To Action Button ----------------------*/
.exp_card {
	position: relative;
}

.callToAction {
	color: #fff;
	background: #1e1e2d;
	text-decoration: none;
	display: inline-block;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	font-size: 10px;
	border: 2px solid #fde723;
	border-radius: 1000px;
	padding: 10px 20px;
	box-shadow: 0 2px 5px 0 rgba(3, 6, 26, 0.15);
	transition: .5s all ease-in-out;
	cursor: pointer;
	position: absolute;
	bottom: 10%;
	right: 5%;
}

.button-wiggle {
	animation: wiggle 4s 2s infinite;
}

@keyframes wiggle {

	5%,
	50% {
		transform: scale(1);
	}

	10% {
		transform: scale(0.9);
	}

	15% {
		transform: scale(1.15);
	}

	20% {
		transform: scale(1.15) rotate(-5deg);
	}

	25% {
		transform: scale(1.15) rotate(5deg);
	}

	30% {
		transform: scale(1.15) rotate(-3deg);
	}

	35% {
		transform: scale(1.15) rotate(2deg);
	}

	40% {
		transform: scale(1.15) rotate(0);
	}
}

/*---------------------- Premium Card----------------------*/

.premium__form__container {
	max-height: 73% !important;
	top: -32% !important;
	position: absolute !important;
}

.premium_form_left {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
	width: 100%;

	img {
		height: 100%;
		width: 100%;
		border-radius: 20px;
	}
}

.premium-cross-btn {
	display: flex;
	align-items: end;
	justify-content: flex-end;
	position: absolute;
	top: 2%;
	right: 2%;

	img {
		height: 40px;
		width: 40px;
		border-radius: 70px;
	}
}

/*---------------------- Find Experiences ----------------------*/

#findExperiences__location_lat,
#findExperiences__location_lng {
	display: none;
}

.date-selection,
.price-selection {
	display: flex;
	justify-content: space-between;
}

.experience-date-select {
	width: 170px !important;
}

.experience-pricing input {
	width: 170px !important;
}

.category-experience-list {
	display: flex;
	align-items: center;
}

.category-dropdown ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.category-dropdown li {
	padding: 10px;
	cursor: pointer;
	border-bottom: 1px solid #ddd;
	transition: background-color 0.3s ease;
	font-size: 15px !important;
	color: white;
}

.category-dropdown li:hover {
	background-color: #fde723;
	color: #000;
}

.category-dropdown {
	display: none;
	position: absolute;
	width: 100%;
	background-color: #1e1e2d;
	border: 1px solid #fde723;
	z-index: 1;
	top: 105%;
	color: white;
	height: 300px;
	overflow: auto;
	scrollbar-width: none;
}

.category-dropdown.active {
	display: block;
}


.experience-pricing {
	display: flex;
	align-items: center;
	justify-content: center;

	i {
		position: absolute;
		left: 10px;
		top: 50%;
		transform: translateY(-50%);
		color: white;
		font-size: 12px;
		font-weight: 600;
	}

	input {
		padding: 0px 16px 0 25px !important;
	}
}


.experience-submit-btn {
	display: flex;
	align-items: center;
	justify-content: end;

	button {
		text-align: center;
		height: 40px;
		border: 0;
		outline: 0;
		width: 150px;
		font-size: 15px;
		background: #FDE723;
		border-radius: 4px;
		font-weight: 600;
		text-transform: capitalize;
		line-height: 24px;
		color: #000;
		display: flex;
		margin-top: 15px;
		align-items: center;
		justify-content: center;
		cursor: pointer;
	}
}

@media (min-width: 768px) {

	.filetered-experience-body,
	.groupTrips-experience-body {
		display: flex;
		flex-wrap: wrap;
	}
}

.findBuddies__image img {
	max-width: 100%;
}

li.no__show {
	position: relative;

}

.no__show-text {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	color: black;
	font-family: inherit;
}


/* ------------------- Desktop Changes  ----------------- */

.desktopSideBar-btn-wrapper {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 20px;
}

.desktopSideBar-install {
	background: #61ffff !important;
	color: black !important;
}



.experience__login__sticky {
	width: 52%;
}

/* ------------------------------- MENU STYLING ---------------------------- */
.sub-menu {
	display: none;
}

.sub-menu-settings {
	display: none;
}

.travel-store {
	text-decoration: none;
	color: #fff;
}

body.lightMode .travel-store {
	color: #000;
}

.shop-now-card {
	background: #3fc380;
	border: 1px solid #3FC380;
}


/* ------------------- Premium Changes  ----------------- */
.traveler-premium-wrapper {
	margin-top: 10px;
}

.title-premium-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}

.traveler-premium-title {
	display: flex;
	flex-direction: column;
	align-items: center;
	align-items: center;

	h3 {
		margin: 0;
		padding: 0;
		color: #FDE723;
		font-size: 18px;
		font-weight: 700;
		line-height: 22.27px;
	}

	p {
		margin: 0;
		padding: 0;
		color: #FFFFFF;
		font-size: 18px;
		font-weight: 400;
		line-height: 22.27px;
	}
}

.premiumAccess {
	color: #FDE327;
}

.traveler-title-down p {
	padding: 0;
	margin: 8px 0 0 0;
	color: #FFFFFF;
	font-size: 13px;
	font-weight: 400;
	line-height: 16.08px;
}

.buy-get {
	top: -15%;
	right: 73%;
	height: 50px;
	position: absolute;
}

.buy-get.mini {
	top: -20%;
	right: -15%;
}

.premium-description-wrapper {
	margin-top: 5px;
	flex-direction: column;
	display: flex;
	gap: 20px;
	padding: 0 10px;
}

.description-wrapper {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-left: 5px;
}

.description-image svg {
	height: 30px;
	width: 30px;

}

.description-image svg path {
	fill: white
}

.premium-description {
	color: #FFFFFF;

	h3 {
		font-size: 16px;
		font-weight: 600;
		line-height: 17.07px;
		margin: 0;
		padding: 0;
		margin-bottom: 5px;
		color: #FDE723;
	}

	p {
		margin: 0;
		padding: 0;
		font-weight: 400;
		font-size: 12px;
		line-height: 16.8px;
	}
}

.chat-unlimited {
	margin-top: 25px;
	padding: 0 5px 5px 10px;
}

.local-influencers-profile {
	margin-top: 20px;
}

.chat-unlimited-title {
	display: flex;
	align-items: center;
	justify-content: start;
	gap: 10px;
	color: white;
	text-decoration: none;
	margin-bottom: 10px;

	span svg {
		height: 30px;
		width: 30px;
	}

	h3 {
		margin: 0;
		padding: 0;
		font-size: 15px;
		line-height: 17.32px;
		font-weight: 600;
		color: #FDE723;
	}
}

.influencer-profile-image {
	display: flex;
	justify-content: flex-start;
	margin-top: 5px;
	gap: 20px;
	overflow: scroll;
	scrollbar-width: none;
	text-decoration: none;
	list-style-type: none;
	padding: 0px;
}

.influencer-profile {
	text-decoration: none;
	text-decoration: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	cursor: pointer;

	img {
		height: 90px;
		width: 90px;
		border-radius: 50px;
	}

	span {
		color: #FFFFFF;
		font-size: 14px;
		font-weight: 400;
		line-height: 12.37px;
		letter-spacing: 1%;
		max-width: 82px;
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
	}
}

.hear-user {
	margin-top: 25px;
}

.user-says-wrapper {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 15px;
	margin-top: 25px;
}

.review-wrapper {
	display: flex;
	align-items: start;
	justify-content: center;
	gap: 10px;
}

.review-user-profile-image img {
	height: 50px;
	width: 50px;
	border-radius: 50%;
}

.user-profile-desc-review {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.review-user-wrapper {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
}

.user-name-location {
	display: flex;
	flex-direction: column;
	/* align-items: center; */
	justify-content: center;
	gap: 15px;

	h3 {
		margin: 0;
		padding: 0;
		font-size: 16px;
		font-weight: 600;
		line-height: 14.84px;
		color: #61FFFF;
	}

	p {
		margin: 0;
		padding: 0;
		font-weight: 400;
		font-size: 14px;
		line-height: 12.37px;
		color: #FFFFFF;
	}
}

.user-rating {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	justify-content: center;
	margin-top: -18px;
}

.rating-icon-desc {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;

	svg {
		height: 50px;
		width: 50px;
	}

	h3 {
		font-size: 8px;
		font-weight: 400;
		line-height: 9.9px;
		color: #FFFFFF;
		margin: 0;
		padding: 0;
	}
}

.user-follower-following h3 {
	margin: 0;
	padding: 0;
	font-weight: 700;
	font-size: 14px;
	color: #FFFFFF;
	line-height: 17.32px;
}

.user-says p {
	color: #FFFFFF;
	font-weight: 500;
	font-size: 12px;
	line-height: 20.8px;
}

.group-trips-title h3 {
	color: #FDE723;
	margin: 0;
	padding: 0;
	font-size: 14px;
	font-weight: 700;
	line-height: 17.32px;
}

.exclusive-listings-wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	color: white;
	text-decoration: none;
}

.exlusive-listing {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;

	h3 {
		margin: 0;
		padding: 0;
		font-size: 14px;
		font-weight: 700;
		line-height: 17.32px;
		color: #61FFFF;
	}
}

.create-listing-premium h3 {
	font-size: 12px;
	font-weight: 600;
	line-height: 16.8px;
	color: #FFFFFF;
	margin: 0;
	text-decoration: underline;
	padding: 0;
	cursor: pointer;
}

@media (max-width: 576px) {
	.traveler-premium-wrapper {
		padding: 0 15px;
	}

	.user-name-location h3 {
		font-size: 14px;
	}

	.user-follower-following h3 {
		font-size: 12px;
	}
}

.premium-group-trips-wrapper {
	display: flex;
	flex-direction: row;
	gap: 19px;
	overflow-x: scroll;
	scrollbar-width: none;
	padding-bottom: 40px;

	.experience__item-title h3 {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
}

body.lightMode .traveler-premium-title h3,
body.lightMode .traveler-premium-title p,
body.lightMode .traveler-title-down p,
body.lightMode .pricing-card-inside h3,
body.lightMode .pricing-card-inside p,
body.lightMode .pricing-card-inside span,
body.lightMode .premium-description h3,
body.lightMode .premium-description p,
body.lightMode .user-name-location h3,
body.lightMode .user-name-location p,
body.lightMode .user-follower-following h3,
body.lightMode .user-says p,
body.lightMode .group-trips-title h3,
body.lightMode .exlusive-listing h3,
body.lightMode .create-listing-premium h3,
body.lightMode .user-follower-following h3,
body.lightMode .chat-unlimited-title h3,
body.lightMode .influencer-profile span,
body.lightMode .rating-icon-desc h3,
body.lightMode .description-image svg path,
body.lightMode .chat-unlimited-title svg path,
body.lightMode .exlusive-listing span svg path,
body.lightMode .chat-unlimited-title,
body.lightMode .premiumAccess {
	color: #000000;
	fill: #000000;
}

body.lightMode .pricing-card-active {
	background: #FDE723;
	color: #000000;
}

/* ------------------- Find Buddies Changes  ----------------- */

.heading-similar__trips,
.trip__description {
	display: flex;
	color: #61FFFF;
	justify-content: space-between;
	align-items: stretch;
	padding: 8px 16px;
	font-size: 14px;
	min-width: 32%;
}

.heading-similar__trips {
	justify-content: flex-end;
	display: none;
}

.popup__master.popup__master--findBuddySimilar .popup__container {
	height: fit-content;
	max-height: 84%;
	background: #1e1e2d;
	bottom: 5%;
	max-width: 100%;
}

.popup__master.popup__master--findBuddySimilar .popup__container .popup__head-title {
	color: #fde723;
}

.popup__master.popup__master--findBuddySimilar .popup__container .popup__head {
	margin: 0px;
	background: #1e1e2d;
	border-radius: 0px;
}

.popup__master.popup__master--findBuddySimilar .popup__container .popup__head-close svg path {
	fill: #fff;
}

.popup__master.popup__master--findBuddySimilar .popup__container .feed_item:first-child {
	margin: 0px;
	padding: 0px 25px;
}

.popup__master.popup__master--findBuddySimilar .popup__container .swiper-slide img {
	width: 100%;
	height: 60vh;
	object-fit: contain;
	object-position: center;
}

.popup__master.popup__master--findBuddySimilar .popup__container .completeness__popup-complete,
.popup__master.popup__master--findBuddySimilar .popup__container .more__trips-find {
	border-radius: 0px;
	background: #f6ee33;
	height: 50px;
	text-align: center;
	font-size: 18px;
	display: flex;
	align-items: center;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	flex-wrap: wrap;
	font-weight: 600;
	border-radius: 10px;
}

.popup__master.popup__master--findBuddySimilar .popup__container .feed__container {
	height: 60vh;
}

.popup__master.popup__master--findBuddySimilar .popup__container .feeds__sentinel__card {
	display: none;
}

.secondary__tab .feed__body-description pre strong,
.feed__body-description .truncate strong,
.profile__find-card__body pre strong {
	color: #FDE723;
	font-size: 14px;
	font-weight: 600;
}

.feed_item-find_buddy {
	padding: 1px;
	border-radius: 10px;
	background: #FFF;
	box-shadow: 0px 4px 20.8px 0px rgba(0, 0, 0, 0.16);
	margin: 10px 10px 21px 10px;
}

.feed_item-find_buddy .truncate {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
}

.feed_item-find_buddy .feed__body-readmore {
	display: flex;
	justify-content: flex-end;
	width: fit-content;
	margin-left: auto;
}

.feed_item-find_buddy a.feed__body-readmore:after {
	width: 100%;
}

.feed_item-find_buddy .feed___head-feedType {
	position: relative;
	font-size: 11px;
	color: yellow;
	font-weight: 600;
}


input#share__location_lat-find,
input#share__location_lng-find {
	display: none;
}

input#share__location-find {
	height: 50px;
	background: transparent;
	width: 100%;
	border: 1px solid #524e4e;
	border-radius: 10px;
	padding: 0 16px;
	font-size: 12px;
	color: #eee;
	outline: none;
}

body.lightMode input#share__location-find {
	font-size: 14px;
	color: #000;
	font-weight: 500;
}

input#share__location-find:focus {
	box-shadow: 0 0 10px #719ECE;
	transition: box-shadow 0.5s ease-in-out;
}

.trip__location {
	position: relative;
	padding: 12px 16px;

	span {
		position: absolute;
		top: 6px;
		left: 30px;
		font-size: 12px;
		background: #1e1e2d;
		padding: 0 7px;
		color: #61FFFF;
	}
}

.trip__dates {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	padding: 12px 16px;

	.form__row {
		margin: 0px
	}
}

#dropdownDuration {
	transition: all 0.5s ease-in-out;
	height: 45px;
	width: 125px;
	background: transparent;
	color: white;
	text-align: center;
	border-radius: 10px;
	outline: none;
	border: solid .1px black;
}

#dropdownDuration:focus {
	box-shadow: 0 0 10px #719ECE;
	transition: box-shadow 0.5s ease-in-out;
}

.flexible_dates,
.fixed_dates {
	display: flex;
	color: #FDE723;
	font-weight: 500;
	font-size: 12px;
	padding: 5px 5px;
	border-radius: 5px;
	border: 1px solid #555564;
	cursor: pointer;
	justify-content: space-evenly;
	align-items: center;
	border-radius: 10px;
	gap: 13px;
	height: 35px;
	align-items: center;
}

.invisible-checkbox-find {
	display: none;
}

.traveler__type,
.budget__type,
.date__type {
	display: flex;
	width: 100%;
	align-items: stretch;
	margin-top: 15px;
	margin-bottom: 30px;
}

.cat__types,
.cat_budget,
.cat_date {
	flex-direction: row;
	display: flex;
	flex-wrap: wrap;
	gap: 13px;
}

.selection {
	background: linear-gradient(45deg, #fff 0%, #fff 30%, #fde723 70%, #fef49d 100%);
	color: black;

}

.selection svg path {
	fill: black;
}

.selection #flexibleDate+.icon-flexibleDate svg path {
	fill: white;
}

.form__section.form__section-beige.relative.findBuddy {
	padding: 8px 16px;
}

.form__row.description-find {
	padding: 12px 16px;
}

.similar__trips {
	color: #fde723;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 15px;
	height: 35px;
}

img.view__similar-icon {
	height: 25px;
	width: 25px;
}

body.lightMode .similar__trips {
	color: black;
}

@keyframes blink {
	0% {
		opacity: 1;
	}

	10% {
		opacity: 0.7;
	}

	20% {
		opacity: 0.5;
	}

	30% {
		opacity: 0.3;
	}

	40% {
		opacity: 0.1;
	}

	50% {
		opacity: 0;
	}

	60% {
		opacity: 0.1;
	}

	70% {
		opacity: 0.3;
	}

	80% {
		opacity: 0.5;
	}

	90% {
		opacity: 0.7;
	}

	100% {
		opacity: 1;
	}
}

body.lightMode .secondary__tab .feed__body-description pre strong,
body.lightMode .feed__body-description .truncate strong,
body.lightMode .profile__find-card__body pre strong,
body.lightMode .feed___head-feedType,
body.lightMode .trip__location span,
body.lightMode .flexible_dates,
body.lightMode .fixed_dates,
body.lightMode .heading-similar__trips,
body.lightMode .trip__description,
body.lightMode #dropdownDuration {
	color: #000;
}

body.lightMode .secondary__tab .feed__body-description.findBud pre strong,
body.lightMode .feed__body-description.findBud .truncate strong,
body.lightMode .feed__body-description.findBud a.feed__body-readmore {
	color: #000;
}

body.lightMode .secondary__tab .noMedia .feed__body-description pre strong {
	color: #000;
}

body.lightMode .trip__location span,
body.lightMode .traveler__type,
body.lightMode .budget__type,
body.lightMode .date__type,
body.lightMode .trip__description {
	background: #fff;
	color: #000 !important;
	font-weight: 600;
	font-size: 13px;
}

body.lightMode .flexible_dates svg path {
	fill: #000;
}

#findStartDate {
	width: 150px;
	border: solid .1px black;
}

#dropdownDuration option {
	background: #1E1E2D;
	color: #fff;
}

body.lightMode #dropdownDuration option {
	background: #FFFFFF;
	color: black;
}

body.lightMode .icon-flexibleDate svg path {
	fill: white;
}

/* --------------------- Pagination Observer API --------------------- */

.sentinel,
.aiTrips__sentinel,
.sentinel__servicesAdmin,
.feeds__sentinel__card {
	width: 100%;
	height: 50px;
}

/* --------------------- LightMode Style Changes --------------------- */

body.lightMode .experience__topRated-item {
	background: linear-gradient(0deg, #FFF9CF, white);
	box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.3);
}

.experience__topRated-item {
	width: 245px;
	padding: 10px;
	border-radius: 12px;
	margin-right: 20px;
}

body.lightMode .noMedia span.feed__head-follow-icon svg path {
	fill: #000;
	stroke: #000;
}

.body.lightMode .feed_item-story span.feed__head-follow-icon svg path {
	fill: #000;
	stroke: #000;
}

.ad_container {
	margin-bottom: 10px;
}

body.lightMode .profile__activity-text span:last-child {
	font-weight: 400;
	font-size: 12px;
	line-height: 150%;
	letter-spacing: 0.01em;
	color: #000;
	font-weight: 600;
}

body.lightMode .experience__item-rating span {
	font-size: 10px;
	display: block;
	color: #000;
	padding: 3px 0 0;
	font-weight: 600;
}

body.lightMode span.experience__item-location {
	font-size: 13px;
	font-weight: 600;
}

/*-----------Styles for the AI BUDDY  part-------------*/


#ai_itinerary {
	padding: 45px 20px;
	height: 100%;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

#ai_itinerary input[type=checkbox]:checked {
	background-color: #a77e2d !important;
	color: #ffffff !important;
}

#ai_itinerary .drawerBody {
	overflow-y: scroll;
	scrollbar-width: none;
	height: 100%;
}

#ai_itinerary .experience__gallery-button svg {
	max-width: 15px;
	width: auto;
	height: auto;
	max-height: 15px;
}

.search-location h3 {
	font-size: 14px;
	font-weight: 450;
	line-height: 10px;
	color: white;
	margin: 20px 0 0 0;
	padding: 0;
}

.specific-date-selection {
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	color: #fff;
}

.duration__container select,
.duration__container input {
	height: 35px;
	background: #1E1E2D;
	width: 130px;
	border-radius: 5px;
	padding: 0 5px;
	color: #eee;
	font-size: 13px;
	font-weight: 500;
	font-family: 'Montserrat';
}

.duration__container svg {
	position: absolute;
	top: 42%;
	right: 10px;
	transform: translateY(-50%);
	cursor: pointer;
	height: 20px;
	fill: #fff;
}

.group-type {
	display: flex;
	align-items: unset;
	justify-content: space-between;
	margin-top: 20px;
	flex-wrap: wrap;
	gap: 10px;
}

.group-type-children {
	display: flex;
	align-items: unset;
	justify-content: flex-start;
	margin-top: 15px;
	flex-wrap: wrap;
	gap: 10px;
}

.group1 {
	width: 85px;
	height: 150px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0px;
	flex-direction: column;
	padding: 10px 3px;
	border-radius: 15px;

	label {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	h4 {
		color: #fff;
		font-size: 13px;
		margin: 0;
		padding: 0;
		font-weight: 500;
	}
}

.intrest {
	width: auto;
	border: 1px solid #555564;
	padding: 10px 7px;
	border-radius: 9px;
	background: #58586459;

	h4 {
		color: #eee;
		font-size: 13px;
		margin: 0;
		padding: 0;
		font-weight: 500;
	}
}

.group-type-image {
	padding: 2px;
	border-radius: 30px;
	margin-bottom: 7px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100px;
	width: 85px;
}

div#children-block {
	margin-top: 15px;
}


.intrest-selection {
	margin-top: 10px;
}

.intrest-type {
	display: flex;
	align-items: unset;
	justify-content: flex-start;
	margin-top: 20px;
	flex-wrap: wrap;
	gap: 10px;
}

.see-more-intrest {
	display: flex;
	align-items: center;
	justify-content: end;
	margin-top: -10px;

	h5 {
		color: #bbb;
		font-size: 13px;
		font-weight: 700;
		margin: 0;
		padding: 0;
	}
}

.less-intrest {
	display: flex;
	align-items: center;
	justify-content: end;
	margin-top: -10px;

	h5 {
		color: #bbb;
		font-size: 13px;
		font-weight: 700;
		margin: 0;
		padding: 0;
	}
}

.intrest-type-more {
	display: flex;
	align-items: unset;
	justify-content: flex-start;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 10px;
}

.budget-selection {
	margin-top: 10px;

	.group-type {
		margin-top: 20px;
	}
}

.get-itinerary {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 25px 0 20px 0;
	flex-direction: column;
}

.generateIti {
	font-size: 26px;
	width: 100%;
	font-weight: 500;
	border: none;
	border-radius: 5px;
	height: 45px;
	position: relative;
	overflow: hidden;
	font-family: 'Montserrat';
	color: #fde723;
	background: linear-gradient(90deg, transparent, #5a5969, transparent);
	background-size: 400% 100%;
	background-position: 400%;
	animation: shimmer 10s linear infinite;
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
	cursor: pointer;
}

@keyframes shimmer {
	0% {
		background-position: -100%;
	}

	5% {
		background-position: -75%;
	}

	10% {
		background-position: -50%;
	}

	15% {
		background-position: -25%;
	}

	20% {
		background-position: 0%;
	}

	25% {
		background-position: 25%;
	}

	30% {
		background-position: 50%;
	}

	35% {
		background-position: 75%;
	}

	40% {
		background-position: 100%;
	}

	45% {
		background-position: 125%;
	}

	50% {
		background-position: 150%;
	}

	55% {
		background-position: 175%;
	}

	60% {
		background-position: 200%;
	}

	65% {
		background-position: 225%;
	}

	70% {
		background-position: 250%;
	}

	75% {
		background-position: 275%;
	}

	80% {
		background-position: 300%;
	}

	85% {
		background-position: 325%;
	}

	90% {
		background-position: 350%;
	}

	95% {
		background-position: 375%;
	}

	100% {
		background-position: 400%;
	}
}

.generateIti:active {
	background-color: #5a5969;
	box-shadow: 0 0 5px #5a5969;
}


body.lightMode .search-location h3 {
	color: #000;
}

body.lightMode .ai-location-search {
	border: 1px solid #000;
	height: 52px;
}

body.lightMode .date-input input[type="text"] {
	background-color: #f5f5f5;
	border: 1px solid #000;
}

body.lightMode .group1 {
	border: 1px solid #000;
	background: #f5f5f5;

	h4 {
		color: #000;
	}
}

body.lightMode .intrest {
	background-color: #fde723;

	h4 {
		color: #000;
	}
}

body.lightMode .see-more-intrest h5 {
	color: #000;
}

body.lightMode .less-intrest h5 {
	color: #000;
}

.ai__trending {
	margin-top: 25px;
}

.findBuddies__image img {
	max-width: 100%;
}

.partners-image {
	height: 142px !important;
}

div#desktopAI {
	max-width: 50px;
	max-height: 50px;
	margin-left: -14px;
	color: #fde723;
}

div#desktopAI svg path {
	fill: #fde723;
}

body.lightMode div#desktopAI {
	color: #000;
}

body.lightMode div#desktopAI svg path {
	fill: #000;
}

.browse-app {
	color: #FDE723;
}

.profile_icon_ai_page {
	background-color: rgba(17, 17, 17, 0.45);
	color: #FFFFFF;
	padding: 10px 10px;
	border-radius: 5px;
	text-align: center;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	cursor: pointer;
	display: none;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	position: absolute;
	top: 11%;
	right: 0;

	svg {
		height: 15px;
		width: 15px;

		path {
			fill: white;
		}
	}

	h4 {
		margin: 0;
		padding: 0;
		font-weight: 600;
	}

	img {
		width: 35px;
		height: 35px;
		border-radius: 50%;
		object-fit: cover;
	}
}

.curated-by {
	font-size: 15px;
	font-weight: 500;
}

.itiUserContainer {
	display: flex;
	flex-direction: row;
	gap: 5px;
	align-items: center;
	color: #FDE327;
}

body.lightMode .daywise-itinerary.infAnchor .feed_type-locals,
.daywise-itinerary.infAnchor .feed_type-locals {
	background: #112728;
}

body.lightMode .daywise-itinerary.infAnchor .top-locals,
.daywise-itinerary.infAnchor .top-locals {
	color: white;

	span {
		color: #FDE723;
	}
}

body.lightMode .daywise-itinerary.infAnchor .feed_type-locals ul li span,
.daywise-itinerary.infAnchor .feed_type-locals ul li span {
	color: yellow;
	font-weight: 500;
	font-size: 12px;
}

/*---------------------Styles for the itinerary 2nd page starts here----------------------*/

.itinerary-result {
	/* padding: 5px 10px; */
	display: flex;
	flex-direction: column;
}

.itinerary-tab {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 10px;
	cursor: pointer;
}

.itinerary-part,
.experience-itinerary,
.locals-itinerary {
	background: #000;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 115px;
	height: 35px;
	border-radius: 5px;
	border: 1px solid #FDE723;
	color: #FDE723;
	font-size: 13px;
	font-weight: 500;
	padding: 10px;

}

.daywise-itinerary {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	border: none;
	padding: 0px 0px;
	cursor: pointer;
}

.day-sequence {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 8px;
	position: relative;
	flex-wrap: nowrap;
	justify-content: space-around;
}

.maps-button {
	/* position: absolute; */
	bottom: 0;
	right: 0;
	/* height: 25px; */
	background: transparent;
	color: yellow;
	font-size: 12px;
	font-family: 'Montserrat';
	display: flex;
	align-content: space-around;
	justify-content: space-between;
	align-items: center;
	flex-direction: row;
	flex-wrap: nowrap;
	margin-bottom: 10px;
	/* padding: 6px; */
	gap: 6px;
	margin-right: 5px;

}

.maps-button svg {
	width: 20px;
	height: 20px;
}

.maps-button.positioning {
	position: absolute;
}


.itinerary-image {
	position: relative;
}

.itinerary-image-container {
	flex: 1;
	display: flex;
	flex: 1;
	align-content: stretch;
	height: 100%;

	img {
		width: 100%;
		border-radius: 5px;
		object-fit: cover;
		max-height: 300px;
	}
}

.day-number {
	display: flex;
	justify-content: space-between;
	position: absolute;
	top: 5%;
	right: 5%;
	background: rgba(255, 255, 255, 0.5);
	border-radius: 5px;
	padding: 5px;
	flex-direction: row;
	flex-wrap: nowrap;
	margin: 0px;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.00938em;
	font-size: 10px;
	color: rgb(97, 70, 70);

	img {
		height: 10px;
		width: 15px;
	}

	span {
		font-size: 13px;
		font-weight: 600;
	}
}

.itinerary-desc ul {
	padding: 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 10px;

	li {
		color: #F0F0F0;
		list-style-type: none;
		background-repeat: no-repeat;
		background-size: 20px;
		/* Adjust as needed */
		padding-left: 30px;
		/* Add padding to make room for the icon */

		h4 {
			margin: 0;
			padding: 0;
			font-size: 15px;
			font-weight: 600;
			max-width: fit-content;
			max-height: fit-content;
			color: #FDE723;

		}

		p {
			max-height: 0;
			margin: 0;
			padding: 0;
			font-size: 13px;
			font-weight: 500;
			margin-top: 4px;
			overflow: hidden;
			transition: max-height 0.5s ease-out;
		}

		p.open {
			max-height: 250px;
			transition: max-height 0.5s ease-out;
			transition-delay: 0.3s;
			/* Delay of 0.5 seconds */
		}
	}
}


.ai__itinerary {
	font-family: 'Montserrat';
}

a.findBuddy__aI svg path {
	fill: #FDE723;
}

.findBuddy__aI {
	color: #FDE723;
	animation: shimmer 15s infinite;
	background: linear-gradient(to right, #FDE723 20%, #fff 50%, #FDE723 80%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

.invisible-checkbox-Ai {
	display: none;
}

.adventure,
.shopping,
.bleisure,
.backpacking,
.trekking,
.beaches,
.luxurious,
.mustSee,
.religious,
.romantic,
.volcanoes,
.star-gazing,
.themeParks,
.wildLife,
.weekend,
.roadTrip,
.family,
.boatRide,
.hiddenGems,
.cuisines,
.forts {
	display: flex;
	line-height: 32px;
	color: #FDE723;
	font-weight: 500;
	font-size: 12px;
	padding: 4px 8px;
	margin: 0 5px 10px 0px;
	border-radius: 5px;
	border: 1px solid #555564;
	cursor: pointer;
}

.adventure.active,
.shopping.active,
.bleisure.active,
.backpacking.active,
.trekking.active,
.beaches.active,
.luxurious.active,
.mustSee.active,
.religious.active,
.romantic.active,
.volcanoes.active,
.star-gazing.active,
.themeParks.active,
.wildLife.active,
.weekend.active,
.roadTrip.active,
.family.active,
.boatRide.active,
.hiddenGems.active,
.cuisines.active,
.forts.active {
	color: #000;
	background: yellow;
	-webkit-text-fill-color: black;
}

.adventure img,
.shopping img,
.bleisure img,
.backpacking img,
.trekking img,
.beaches img,
.luxurious img,
.mustSee img,
.religious img,
.romantic img,
.volcanoes img,
.star-gazing img,
.themeParks img,
.wildLife img,
.weekend img,
.roadTrip img,
.family img,
.boatRide img,
.hiddenGems img,
.cuisines img,
.forts img {
	max-width: 25px;
	max-height: 25px;
	margin-right: 8px;
	margin-top: 2px;
}


.aiTravelType {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-content: space-around;
	align-items: stretch;
	margin: 16px 0 15px;

}

.hold__horses {
	color: #FDE723;
	font-family: 'Montserrat';
}

@keyframes shimmer {
	0% {
		background-position: -500px;
	}

	100% {
		background-position: 500px;
	}
}


.itinerary-desc {
	display: flex;
	flex-direction: column;
	align-content: stretch;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: nowrap;
	width: 100%;
}

.header__imageAI,
.header__imageAI img {
	width: 100%;
	height: 45vh;
	object-fit: cover;
	position: relative;
}

.search-location.travelMonth {
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-content: space-between;
	flex-wrap: nowrap;
	flex-direction: row;
	margin-bottom: 18px;
	border-radius: 5px;
	padding: 5px;
}

.ai__title {
	font-size: 15px;
	font-weight: 600;
	color: #eee;
	align-content: center;
	font-family: 'Montserrat';
}

.locationTitle {
	font-size: 22px;
	color: #FDE723;
}

.itinerary-tab,
.daywise-itinerary {
	padding: 10px;
}

.itinerary-tab {
	display: none;
}

.itinerary-part.active,
.experience-itinerary.active,
.locals-itinerary.active {
	background: yellow;
	color: black;
}

.ai__footer-buttons {
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	align-content: center;
	flex-wrap: wrap;
	margin-top: 10px;
}

.ai__cards-container {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	background: #112728;
	border-radius: 5px;
	position: relative;
	box-shadow: 0 10px 15px -3px rgba(255, 255, 255, 0.1), 0 4px 6px -2px rgba(255, 255, 255, 0.05);
}

.ai__header__title {
	position: absolute;
	font-size: 18px;
	color: #eeeeeee3;
	text-align: center;
	width: 100%;
	font-weight: 500;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	flex-wrap: wrap;
	background-color: rgba(0, 0, 0, .45);
	top: 33.5%;
	align-items: center;
}

ul.ai__selections-title li {
	margin-left: 10px;
	background-repeat: no-repeat;
	background-size: 18px;
	padding-left: 25px;
	font-size: 14px;
	color: #fde723;
}

div#countdown {
	color: #eee;
	text-align: center;
	border: 1px solid #333;
	width: 100%;
	margin-top: 15px;
	font-size: 15px;
	font-family: 'Montserrat';
	padding: 10px;
	display: none;
}

.footer__ai {
	display: flex;
	flex-direction: row;
	width: 100%;
	justify-content: space-evenly;
	padding: 5px;
	margin-bottom: 30px;
	height: fit-content;
	margin-top: 5px;
}

.enquire__now,
.find__buddies {
	display: flex;
	padding: 5px;
	width: 48.5%;
	background: black;
	color: #eee;
	font-size: 12px;
	border-radius: 5px;
	font-family: 'Montserrat';
	box-shadow: 0 10px 15px -3px rgba(255, 255, 255, 0.1), 0 4px 6px -2px rgba(255, 255, 255, 0.05);
	align-content: center;
	align-items: center;
	justify-content: center;
	background: linear-gradient(90deg, transparent, #5a5969, transparent);
	background-size: 250% 100%;
	background-position: 250%;
	animation: shimmer 10s linear infinite;
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
	text-align: start;
	cursor: pointer;

}

#lottie__find,
#lottie__request,
#lottie__requestCards {
	max-width: 35px;
	max-height: 40px;
	margin-right: 4px;
}

.enquire__now.betweenCards {
	width: 100%;
	margin-bottom: 8px;
}

.ai__premium_box {
	display: flex;
	align-content: center;
	color: #fde723;
	font-size: 12px;
	font-weight: 500;
	border: 1px solid #fde723;
	width: 100%;
	flex-direction: column;
	flex-wrap: wrap;
	margin: 10px 0 10px 0;
	padding: 10px;
	border-radius: 10px;
	gap: 5px;
	display: none;
}

.ai__premium {
	width: 100%;
	display: none;
	flex-direction: row;
	align-content: space-around;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;

	h1 {
		color: #fde723;
		font-weight: 700;
		font-family: 'Montserrat';
		margin: 0;
		padding: 0;

	}

}

.ai__price-left,
.ai__price-right {
	height: 200px;
	width: 43%;
	border: 1px solid yellow;
	display: flex;
	flex-direction: column;
	align-content: space-around;
	justify-content: space-between;
	align-items: center;
	border-radius: 5px;
	cursor: pointer;
	background: linear-gradient(90deg, transparent, #5a5969, transparent);
	background-size: 400% 100%;
	background-position: 400%;
	animation: shimmer 10s linear infinite;
	transition: background-color 0.3s ease, box-shadow 0.3s ease;
	border-radius: 5px;
	font-size: 12px;
	margin-right: 8px;
}

.ai__premium-title,
.ai__premium-price,
.ai__premium-perks,
.ai__premium-duration {
	width: 100%;
	height: 25px;
	color: #fde723;
	align-items: center;
	align-content: space-around;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	margin-bottom: 5px;


}

.ai__premium-title {
	font-weight: 600;
	font-size: 20px;
	background: yellow;
	color: black;
	display: flex;
	justify-content: space-around;
	border-radius: 0px;
	height: 75px;
}

.ai__premium-price {
	font-weight: 700;
	font-size: 17px;
	font-family: 'Montserrat';
}

.head__addPost.head__long {
	display: flex;
	flex-direction: row;
	align-items: center;
}


.ai__header-home {
	color: #fde327;
	font-size: 15px;
	font-family: 'Montserrat';
	font-weight: 600;
}

img.ai_premium-icon {
	height: 20px;
	width: 60px;
}

.ai__premium-duration,
.ai__premium-price {
	border-radius: 0px;
}

body.lightMode div#secondary .secondary__tab.ai_itinerary {
	background: #15151f;
}

#lottiePremiumAi {
	height: 250px;
}

div#homePageAi {
	background-image: url(/view/assets/img/mini_experiences-bg.png);
	border-radius: 10px;
	position: relative;
}

.allAI__trips {
	display: flex;
	flex-direction: column;
	align-items: center;
	border-radius: 10px;
	margin: 0 10px 20px 10px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	position: relative;
	color: black;
	min-height: 200px;
	max-height: fit-content;
	border: .1px solid #fde723;


	.allAI__trips_image img {
		max-width: 100%;
		max-height: 300px;
		object-fit: cover;
		border-radius: 10px;
	}

	.allAI__trips_location {
		position: absolute;
		top: 6%;
		right: 5%;
		padding: 5px;
		border-radius: 5px;
		background: #fde723;
		max-width: 300px;

	}


}

body.lightMode .icon__dropDown svg path {
	stroke: #000;
}

body.lightMode .daywise-itinerary.expAnchor .experience__card.experience__topRated {
	background: transparent;
}


body.lightMode .daywise-itinerary.expAnchor .experience__card.experience__topRated {
	stroke: #000;
}

body.lightMode .daywise-itinerary.expAnchor .experience__card.experience__topRated svg path {
	stroke: #fde723;
}

body.lightMode .daywise-itinerary.expAnchor .experience__card.experience__topRated .experience__topRated-head {
	font-weight: 600;
	color: #fde723;
}

.saved-trips-overlay {
	background-color: rgba(17, 17, 17, 0.45);
	/* Premium blue background */
	color: #ffffff;
	/* White text */
	padding: 10px 20px;
	border-radius: 25px;
	/* Rounded corners */
	font-weight: 500;
	text-align: center;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	/* Subtle shadow for depth */
	cursor: pointer;
	margin-left: 30px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
}

img.header__myTrips {
	width: 20px;
	height: 20px;
}

/* --------------------- Hosteller Styles --------------------- */

.allHosteller,
.newHosteller,
.nearbyHosteller {
	display: flex;
	overflow-x: scroll;
	gap: 14px;
	padding: 12px;

	/* Hide scrollbar for Chrome, Safari, and Opera */
	::-webkit-scrollbar {
		display: none;
	}

	/* Hide scrollbar for IE, Edge, and Firefox */
	-ms-overflow-style: none;
	/* IE and Edge */
	scrollbar-width: none;
	/* Firefox */
}

.thirdParty__apis {
	width: 100%;
	display: flex;
	flex-direction: column;
	margin: 8px 0 8px 0;
	border-radius: 10px;
}

.hosteller__card {
	flex-direction: column;
	cursor: pointer;
	color: white;
	font-size: 14px;
	gap: 12px;
	font-size: 14px;
	font-weight: 600;
	min-width: 190px;
}

.hosteller__card_image {
	position: relative;
	display: block;
}

.hosteller__card_image img {
	width: 100%;
	height: 250px;
	border-radius: 12px;
	display: block;
}

a.hosteller__card_link {
	width: 200px;
	text-decoration: none;
}


.hosteller__card_content {
	display: flex;
	flex-direction: column;
	padding: 10px;
}

.hosteller__card_info,
.hosteller__card_name {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	color: #fde723;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 2px;
	font-size: 13px;
	font-weight: 600;
	border-top-left-radius: 12px;
	border-top-right-radius: 12px;
}

.hosteller__card_name {
	bottom: 0;
	border-radius: 0;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	font-size: 15px;
	color: #fde723;
	font-weight: 600;
	top: unset;
	padding: 3px;
	line-height: 23px;
}

.hosteller__card_amenities {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 8px;
	background: #fff;
	margin-top: 10px;
	border-radius: 12px;
	padding: 5px;
	justify-content: center;
	align-items: stretch;
	align-content: space-around;
	max-height: 30px;
	overflow: hidden;

}

.hosteller__card_price {
	margin-top: 10px;
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	align-content: space-around;
	flex-wrap: nowrap;
}

img.amenity-icon {
	height: 20px;
	width: 20px;
}

.titleHosteller {
	font-size: 18px;
	font-weight: 600;
	color: yellow;
	padding-left: 18px;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	border-radius: 10px;

}

.titleHosteller svg {
	height: 30px;
	width: 30px;
}

.titleHosteller svg path {
	stroke: #fde723;
}

span.hosteller__card_rating {
	right: 0;
	margin-left: 20%;
}

.hostellerPrice {
	color: #fde723;
	font-weight: 600;
	font-size: 23px;
}

.discount-banner {
	/* Banner styling */
	padding: 10px;
	background-color: #f2f2f2;
	text-align: center;
	border-radius: 5px;
	margin: 5px;
	cursor: pointer;
	position: relative;
}

.discount-highlight,
.coupon-code {
	/* Highlighting styling */
	font-weight: 800;
	color: blue;
}

.tabs::-webkit-scrollbar,
.content::-webkit-scrollbar {
	display: none;
	/* Hide scrollbar for Chrome, Safari, and Opera */
}

.blink {
	/* Blinking animation */
	animation: blink 1.5s linear infinite;
}

body.lightMode .thirdParty__apis,
body.lightMode .titleHosteller,
body.lightMode .hosteller__card_name,
body.lightMode .hosteller__card_amenities,
body.lightMode .hosteller__card_price,
body.lightMode .hostellerPrice {
	background: #fff;
	color: #000;
}

body.lightMode .hosteller__card_info svg path {
	stroke: #fff;
}

body.lightMode .titleHosteller svg path {
	stroke: #000;
}

/* --------------------- ManageListings Styles --------------------- */

div#manageListingsPage {
	height: 100vh;
}


.tabs {
	display: flex;
	justify-content: space-around;
	background-color: black;
	overflow-x: scroll;
	padding: 10px;
}

.tab {
	cursor: pointer;
	padding: 10px;
	background: black;
	color: yellow;
	font-size: 15px;
	font-weight: 600;
	border-radius: 10px;
}

.flights__ssr-container.tabs {
	position: fixed;
	width: 100%;
	z-index: 5;
}

.content {
	display: flex;
	flex-direction: column;
	height: calc(100% - 48px);
	/* Adjust based on tab height */
	overflow-y: auto;
}

.page {
	display: none;
	padding: 20px;
	flex-grow: 1;
	color: #fff;
}

/* -------------------- Cards Slider New ----------------- */
.carousel {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: fit-content;
}

.carousel-wrapper {
	display: flex;
	cursor: pointer;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	/* Smooth scrolling on iOS */
	scrollbar-width: none;
	/* For Firefox */
	-ms-overflow-style: none;

	/* For Internet Explorer and Edge */
	&::-webkit-scrollbar {
		display: none;
		/* For Chrome, Safari, and Opera */
	}
}

.carousel-slide {
	scroll-snap-align: start;
	min-width: 100%;
	box-sizing: border-box;
	height: 100%;
}

.carousel-slide img,
.carousel-slide video {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.carousel__indicators {
	position: absolute;
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 5px;
}

.carousel__indicators .indicator {
	width: 10px;
	height: 10px;
	background-color: #ccc;
	border-radius: 50%;
	cursor: pointer;
}

.carousel__indicators .indicator.active {
	background-color: #FDE723;
}



/******************* New Admin Package  *************************/


.signup-container {
	background-color: #fff;
	padding: 20px;
	border-radius: 5px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	width: 400px;
	position: absolute;
	top: -20%;
}

.signup-container h2 {
	margin-bottom: 20px;
	text-align: center;
}

.signup-container label {
	display: block;
	margin-bottom: 5px;
	font-weight: bold;
}

.signup-container input,
.signup-container select {
	width: 100%;
	padding: 8px 10px;
	margin-bottom: 10px;
	border: 1px solid #ccc;
	border-radius: 3px;
}

.signup-container .phone-input-group {
	display: flex;
}

.signup-container .phone-input-group select,
.signup-container .phone-input-group input {
	margin-right: 5px;
}

#dialcode {
	width: 25%;
}

.signup-container .phone-input-group input:last-child {
	margin-right: 0;
}

.signup-container .button-group {
	display: flex;
	justify-content: space-between;
}

.signup-container button {
	width: 48%;
	padding: 10px;
	border: none;
	border-radius: 3px;
	cursor: pointer;
	font-size: 16px;
}

.signup-container .cancel-button {
	background-color: #f44336;
	color: white;
}

.signup-container .cancel-button:hover {
	background-color: #d32f2f;
}

.signup-container .submit-button {
	background-color: #4CAF50;
	color: white;
}

.signup-container .submit-button:hover {
	background-color: #45a049;
}



/*ARROWS FOR TRENDING EXPERIENCES*/
.scroll-arrow {
	position: absolute;
	transform: translateY(-50%);
	background-color: white;
	/* color: white; */
	border: none;
	padding: 10px;
	cursor: pointer;
	z-index: 2;
	top: 50%;
	right: 10px;
	font-size: 18px;
}

.scroll-arrow:hover {
	background-color: rgba(0, 0, 0, 0.7);
}

.experience__topRated-body {
	overflow: scroll;
	width: calc(100% + 32px);
	margin: 0 0 0 -16px;
	padding: 0 0 0 16px;
	scrollbar-width: none;
	position: relative;
}

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

.scroll-arrow.right {
	/* left: 10px; */
	right: unset;
	border-radius: 0 10px 10px 0;
}

.scroll-arrow.left {
	right: 2%;
	border-radius: 10px 0 0 10px;
}

#allTimeFavTrips {
	display: none;
}

.feed-comment svg g {
	fill: #fff;
	stroke: #fff;
}

body.lightMode .feed-comment svg g {
	fill: #000;
	stroke: #000;
}

.feed__share svg {
	height: 25px;
	width: 25px;
}

.feed__share svg g {
	fill: #fff;
	stroke: #fff;
}

body.lightMode .feed__share svg g {
	fill: #000;
	stroke: #000;
}


/* ---- Enquiry Form Input bg color ------- */
.enquiry_detailed_form input {
	background-color: #ccc;
}

/* -------------------- TBO ----------------- */


.flights__bg,
.flights__header {
	width: 100%;
	height: 70vh;

	/* position: relative; */
	img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
}

body.lightMode .flights__bg.hidden {
	display: unset;
}

.flights__header-box,
.hostels__header-box {
	position: absolute;
	top: 0%;
	left: 0;
	right: 0;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	height: fit-content;
	z-index: 3;
	gap: 7px;
}

.hostels__header-box {
	top: 15%;
}

.flights__header-subtitle,
.hotels__header-subtitle {
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, .25);
}

.flights__header-title {
	font-size: 20px;
	color: #fde723;
	font-weight: 600;
	text-align: center;
	text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8);
}

.flights__header-picker {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 5px;
	margin-top: 20px;
}

.flights__header-picker svg {
	width: 20px;
	height: 20px;
}

.dropdown__airports-list {
	position: absolute;
	background: #fff;
	max-height: 50vh;
	overflow-y: auto;
	display: none;
	z-index: 1000;
	font-size: 14px;
	font-weight: 500;
	width: 80%;
	border-radius: 8px;
	color: #fff;
	padding: 5px;
	max-width: 420px;
	top: 95%;
}

div#destinationDropdown {
	top: 100%;
}

.dropdown-item-airport-list {
	padding: 10px;
	cursor: pointer;
	border-bottom: .1px solid #fde723;
	gap: 15px;
	display: flex;
	align-items: center;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	position: relative;
	font-size: 13px;
	margin: 10px;
	color: black;
}

.dropdown-item-airport-list:hover {
	background-color: #fde723;
	color: #000;
	border-radius: 5px;


}

.dropdown-item-airport-list:hover svg path {
	fill: #000;
}

.country-text {
	position: absolute;
	right: 10px;
	/* Adjust as needed */
	top: 50%;
	transform: translateY(-50%);
	font-size: 12px;
	/* Adjust as needed */
}

.picker-item {
	display: flex;
	align-items: center;
	gap: 5px;
	background: white;
	padding: 5px;
	border-radius: 10px;
	font-weight: 600;
}

/* Additional CSS for radio buttons */
.booking-option label {
	display: flex;
	align-items: center;
	gap: 5px;
	padding: 8px;
	border-radius: 20px;
	font-weight: 500;
	cursor: pointer;
	transition: background-color 0.3s ease;
	font-size: 14px;
	color: white;
	border: 1px solid yellow;
	justify-content: center;

}

.booking-option.experiencesToggle label {
	font-size: 15px;
	font-family: 'Montserrat';
	font-weight: 600;
	border-radius: 5px;
	padding: 10px;
	position: relative;
	width: 50%;
	text-align: center;
	border: unset;
	transition: background-color 0.3s ease, color 0.3s ease;
	/* Add transition for smooth effect */
	color: black;
}

label.hidden {
	display: none;
}

/* Adjust the hover effect for labels */
.booking-option label.checked {
	background-color: #fde723;
	color: #000;
	border-radius: 8px;
}

.flights__booking-container,
.hotels__booking-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 5px;
	border-radius: 8px;
	width: 100%;
	height: fit-content;
}

form#hotelsSearchForm {
	width: 100%;
}

.booking-option,
.booking-inputs,
.booking-selection {
	display: flex;
	/* gap: 35px; */
	width: inherit;
	justify-content: flex-start;
	/* height: 40px;*/
}

.booking-option {
	margin: 5px;
}

.booking-option.flightsSearch {
	display: flex;
	justify-content: center;
	gap: 15px;
}

.booking-option.flightsSearch label {
	background: rgba(30, 30, 45, 0.7);
}

input.hidden-input {
	display: none;
}

.booking-option-button,
.booking-select-button,
.hotel__booking-select-button {
	padding: 10px;
	border-radius: 8px;
	cursor: pointer;
	transition: transform 0.3sease;
	width: inherit;
	display: flex;
	gap: 20px;
	align-items: center;
	justify-content: flex-start;
	font-size: 14px;
	height: 50px;
	border: .1px solid #1e1e2d;
}

.booking-option-button svg,
.booking-select-button svg,
.hotel__booking-select-button svg {
	width: 20px;
	height: 20px;


}


/* Additional CSS for Tab selection Flights / Experiences input */

.booking-option.experiencesToggle {
	border: .1px solid #fde723;
	width: 98%;
	border-radius: 8px;
	display: flex;
	align-items: center;
	background: white;

}

input[type="radio"][name="searchToggle"] {
	display: none;
	height: 0px;
	width: 0px;
}

/* input[type='date'] {
	background: transparent;
	color: #ccc;
	font-family: 'Montserrat';
} */

input[type='date']::-webkit-calendar-picker-indicator {
	opacity: 0;
	width: 100%;
	-webkit-appearance: none;
	position: absolute;
	/* Position the indicator absolutely within the input */
	right: 0;
	/* Align the indicator to the right */
	cursor: pointer;
	/* Change cursor to indicate clickable area */
}

.flights__search__results-container {
	overflow: scroll;
	height: 100vh;
	padding: 5px;
}

.from__to-box {
	display: flex;
	flex-direction: row;
	width: inherit;
	gap: 5px;
	cursor: pointer;
}

.from__to-box.source-dest {
	display: flex;
	flex-direction: column;
	width: 100%;
	align-items: flex-start;
	position: relative;
}

.reverse__from-to {
	display: flex;
	position: absolute;
	top: 50%;
	left: 92%;
	transform: translate(-50%, -50%);
	z-index: 1;
	border: 1px solid #fde723;
	border-radius: 5px;
}

.reverse__from-to svg {
	width: 35px;
	height: 45px;
	cursor: pointer;
	transform: rotate(90deg);
	margin-right: 10%;


}

.reverse__from-to svg rect {
	fill: black;
}

.reverse__from-to svg path {
	fill: #fde723;
}


.search__flight,
.book__from-ssr,
.search__hotels {
	background: #fde723;
	text-align: center;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 600;
	margin-top: 5px;
	cursor: pointer;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #000;
	padding: 10px;
}

.book__from-ssr {
	width: 100%;
	padding: 24px;
	margin-top: 5%;
}

.location__selection {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 5px;
	width: 100%;
	border: .1px solid #1e1e2d;
	border-radius: 8px;
}

form#flightSearchForm {
	width: 100%;
}

.location__selection.source-dest {
	width: 100%;
	height: 70px;
}

.search-date-change {
	background: transparent;
	border: none;
}

label.location__label {
	padding-left: 12px;
	font-size: 14px;
	font-weight: 600;
}

input#flight__head-date {
	color: white;
	font-weight: 500;
	font-size: 14px;
	font-family: 'Montserrat';
}

.flights__input {
	width: 85%;
	height: 45px;
	border: 0px solid;
	padding-left: 12px;
	background: transparent;
	font-size: 16px;
	white-space: nowrap;
	/* Prevents text from wrapping */
	overflow: hidden;
	/* Hides overflow text */
	text-overflow: ellipsis;
	/* Adds ellipsis (...) for overflow text */
	font-weight: 600;

}

.flights__input:focus {
	outline: none;
}

/* .location__selection.returningDate {
    position: relative;
} */

.returning__cross_sign {
	position: absolute;
	right: 0;
	cursor: pointer;
	padding: 7px;
	user-select: none;
	color: white;
	font-size: 16px;
	font-weight: 700;
}

.icon__box {
	margin-top: 10px;
	margin-left: 5px;
}

.airport__search-container,
.hotel__search-container {
	width: 100%;
	display: flex;
	flex-direction: column;
}

.icon__box svg,
.dropdown-item-airport-list svg {
	width: 17px;
	height: 17px;


}


/* ------------- Search Results ------------------- */

div#secondary .drawerBody.flights__search,
div#secondary .drawerBody.flights__booking {
	justify-content: unset;
	align-content: unset;
	align-items: unset;
	display: flex;
	flex-direction: column;
	height: 100vh;
}

div#secondary .drawerBody.flights__booking,
div#secondary .drawerBody.flights__SSRPage {
	height: fit-content;
	display: flex;
	flex-direction: column;
}

div#secondary .drawerBody.flights__SSRPage {
	flex-direction: column;
	align-items: center;
}

.flight__card {
	border-radius: 8px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	margin: 5px 5px 10px 5px;
	overflow: hidden;
	cursor: pointer;
	transition: transform 0.3s ease;
	border: .1px solid #fde723;
}

.slide-left {
	transition: transform 0.7s ease-out, opacity 0.7s ease-out;
	transform: translateX(-100%);
	opacity: 0;
}

body.lightMode .flight__card {
	border: .1px solid #1e1e2d;
}

.flight__card__header,
.flight__card__body {
	display: flex;
	justify-content: center;
	padding: 5px;
	gap: 5px;
	flex-direction: column;
}

.flight__card__header {
	background-color: #1e1e1e;
	color: #fff;
}

body.lightMode .flight__card__header {
	background-color: white;
	color: black;
}

.flight__card__header__left,
.flight__card__header__right,
.flight__card__body__left,
.flight__card__body__right {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.flight__card__body__right__price {
	font-size: 16px;
	font-weight: 600;
	text-align: center;
	color: #fde723;
}

.flight__card__body__right__pax {
	font-size: 12px;
	font-weight: 500;
}

.flight__card__body__right__tax {
	font-size: 11px;
	color: #669b9b;
}

body.lightMode .flight__card__body__right__price {
	color: black;
}

.flight__card__header__left__city,
.flight__card__header__right__city,
.flight__card__body__left__flightNo {
	font-size: 14px;
	color: #666666;
}

.flight__card__body__right__book {
	background-color: #007bff;
	color: #ffffff;
	text-align: center;
	padding: 10px;
	margin-top: 10px;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

.flight__card__body__right__book:hover {
	background-color: #0056b3;
}

.flight__segment.outbound,
.flight__segment.inbound {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.flight__head {
	height: 60px;
	display: flex;
	gap: 10px;
	margin: 0px 5px 0 5px;
}


.flight__text__box {
	display: flex;
	align-items: center;
	justify-content: space-evenly;
}


.flight__head-left,
.flight__head-right {
	width: 50%;
	height: 55px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-content: flex-end;
	gap: 10px;
	padding: 5px;
	flex-wrap: wrap;
	color: #fde723;

	path {
		stroke: #fff;
	}
}

.flight__head-left svg,
.flight__head-right svg {
	width: 16px;
	height: 16px;
}

.flight__head-left svg path,
.flight__head-right svg path {
	stroke: #fff;
}

.flight__head-left {
	align-content: flex-start;

}

.flight__head-right {
	align-items: center;
	height: 40px;
}


.flight__title {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	gap: 10px;
	font-size: 14px;
	color: #fde723;
	font-weight: 600;
}

.flight__pax-title {
	font-size: 12px;
	font-weight: 500;
	color: #fff;
	display: flex;
	align-items: center;
	gap: 8px;
}

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

.flight__date-change i.fa-solid.fa-arrow-left,
.flight__date-change i.fa-solid.fa-arrow-right {
	color: #fff;
}

.flight__details__container {
	display: flex;
	width: 100%;
	height: fit-content;
	min-height: 90px;
	align-items: center;
}

div#secondary .drawerBody.flights__view {
	height: fit-content;
}

.flight__details__icon {
	width: 50px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
}

.flight__details__icon img {
	pointer-events: none;
	width: 25px;
	height: 25px;
	object-fit: contain;
}

.flight__details__name {
	text-align: center;
	font-size: 9px;
	font-weight: 500;
}

.flight__details__info {
	display: flex;
	flex: 1;
	align-items: center;
}

.flight__details__source,
.flight__details__destination,
.flight__details__time {
	flex: 1;
	text-align: center;
	font-size: 12px;
	font-weight: 500;
}

.flight__details__book {
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
}

.flight__details__book__button {
	padding: 5px 10px;
	cursor: pointer;
}

.flight__source_containier,
.flight__destination_containier,
.flight__time_containier {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 5px;
	flex: 0 0 30%;
}

.flight__time_containier {
	flex: 0 0 24%;
	margin-right: 14px;
	margin-left: 8px;
	align-items: center;
}

.layover {
	font-size: 8px;
	font-weight: 600;
	color: lightgrey;
}

body.lightMode .layover {
	color: black;
}

.flight-details__layover {
	color: black;
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	width: 100%;
}

.underline {
	border-bottom: 1px solid #fde723;
	height: 2px;
	width: 100%;
}

.flight__details__arr-time,
.flight__details__dep-time {
	font-size: 12px;
	font-weight: 600;
}

body.lightMode .flight__head,
body.lightMode .flights-filter-container,
body.lightMode .flights__dropdown-menu {
	color: black;
	background: #fff;
}

body.lightMode .flight__head-left svg path,
body.lightMode .flight__head-right svg path,
body.lightMode .flight__title svg path {
	stroke: black;
}

body.lightMode .flight__title,
body.lightMode .flight__pax-title,
body.lightMode input#flight__head-date {
	color: #000;
}

body.lightMode .flights-arrow {
	border-bottom: 8px solid #000;
}


/* --------------------- Flights Filters --------------------- */


.flights-filter-container {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 5px;
	margin: 0 5px 0 5px;
}

.flights-filter {
	display: flex;
	align-items: center;
	color: #fff;
	cursor: pointer;
}

.flights-filter svg {
	margin-right: 10px;
	width: 16px;
	height: 16px;
	transition: transform 0.2s ease-in-out;
}

.flights-filter svg path {
	stroke: white;
}

.flights-filter:hover svg {
	transform: scale(1.1);
}

.flights-count {
	font-size: 9px;
	color: #fff;
	font-weight: 500;
}

.flights__filter-sort-text {
	font-size: 17px;
	font-weight: 600;
}

.flights-sort {
	display: flex;
	align-items: center;
	gap: 10px;
	color: #fff;
	font-weight: 500;
}

.flights-select-sort-by {
	border: 1px solid white;
	border-radius: 5px;
	padding: 10px 20px;
	cursor: pointer;
	transition: background-color 0.2s ease-in-out;
	position: relative;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	font-size: 10px;
	color: #fff;
	gap: 5px;
}

.flights-select-header {
	display: flex;
	align-items: center;
	gap: 5px;
}

.flights-select-sort-by:hover {
	background-color: #444;
}

.flights-arrow {
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 8px solid white;
	transition: transform 0.2s ease-in-out;
}

.flights-select-sort-by:hover .flights-arrow {
	transform: rotate(180deg);
}

.filterBy-container {
	flex-direction: column;
	display: flex;
}

.flights__dropdown-menu {
	display: none;
	position: absolute;
	background-color: #000;
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
	z-index: 1;
	min-width: 160px;
	top: 100%;
	/* Position below the parent */
	left: 0;
	opacity: 0;
	transform: translateY(-10px);
	transition: opacity 0.3s ease, transform 0.3s ease;
}

.dropdown-item {
	padding: 12px 16px;
	cursor: pointer;
}

.dropdown-item:hover {
	background-color: #fde723;
	color: #000;
}

.flights-select-sort-by.active .flights__dropdown-menu {
	display: block;
	opacity: 1;
	transform: translateY(0);
}

.flights-select-sort-by.active .flights-arrow {
	transform: rotate(180deg);
	/* Rotate arrow when active */
}

body.lightMode .flights-select-sort-by {
	border: 1px solid black;
}

body.lightMode .flights-filter,
body.lightMode .flights-sort,
body.lightMode .flights-count,
body.lightMode .flights-select-sort-by {
	color: black;
}

body.lightMode .flights-select-sort-by:hover {
	background-color: #fff;
	color: #000;
}

body.lightMode .dropdown-item:hover {
	background-color: #000;
	color: #fff;
}

/* --------------------- Cabin & Travellers Styles --------------------- */

/* Flexbox layout for traveller options with improved spacing and typography */
.flight__traveller__class__body__traveller__option {
	display: flex;
	justify-content: center;
	align-items: stretch;
	margin-bottom: 20px;
	padding: 10px;
	font-size: 15px;
	font-weight: normal;
	background-color: #f9f9f9;
	flex-direction: column;
	flex: 1;
}

/* Enhanced style for custom radio buttons with better spacing and interaction cues */
.custom-radio {
	display: flex;
	align-items: center;
	cursor: pointer;
	transition: background-color 0.3s;
}

.custom-radio input[type="radio"] {
	margin-right: 15px;
	/* Increased space between radio and label text */
	cursor: pointer;
	/* Ensure the cursor changes on hover over the radio */
}

.custom-radio input[type="radio"]:checked+.checkmark {
	background-color: #007bff;
	/* Use a more standard highlight color */
	color: #ffffff;
	/* White text for contrast */
}

/* Additional style to visually indicate the entire div is selectable */
.custom-radio:hover {
	background-color: #e7e7e7;
	/* Slightly darker background on hover for feedback */
}

/* Style for the decrement and increment buttons for better usability */
.decrement,
.increment {
	color: #333;
	/* Dark text for contrast */
	border: none;
	/* Remove default border */
	padding: 5px 10px;
	/* Padding for a larger clickable area */
	font-size: 16px;
	/* Match font size with the rest */
	cursor: pointer;
	/* Cursor pointer to indicate clickable */
	border-radius: 7px;
	/* Rounded corners for a modern look */
	transition: background-color 0.2s;
	/* Smooth transition for visual feedback */
}

.decrement:hover,
.increment:hover {
	background-color: #d0d0d0;
	/* Darker on hover for visual feedback */
}

.counter {
	display: flex;
	gap: 10px;
	align-items: center;
	margin-top: 25px;
	border: 1px solid black;
	justify-content: space-between;
	font-size: 16px;
	border-radius: 7px;
}

.flight_options_box {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	padding: 8px;
	gap: 10px;
	justify-content: flex-start;
	align-items: stretch;
	align-content: center;
}

.flight_option {
	padding: 9px;
	border: 1px solid black;
	cursor: pointer;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 600;
}

.flight_option.selected {
	background: #fde723;
	color: black;
}

.flight_option input[type="radio"]:checked+label {
	background-color: #007bff;
	color: white;
}

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

.flight__traveller__class__body__class,
.flight__traveller__class__body__traveller {
	padding: 8px;
}

.flight__traveller__class__body__traveller__title,
.flight__traveller__class__body__class__title {
	font-weight: 600;
	font-size: 14px;
	margin-bottom: 10px;
}

span.description {
	font-size: 10px;
}

.popup__master--flightTravellerClass.active .popup__container {
	height: 490px;
	top: 10%;
}

.flight__traveller__class__body__traveller__options {
	display: flex;
}

/* --------------------- Return Journey Tabs --------------------- */

.flight__tabs {
	display: flex;
	justify-content: space-around;
	align-items: center;
	padding: 5px;
	border: 1px solid #fde723;
	border-radius: 8px;
	margin: 5px;
	width: 98%;
}

body.lightMode .flight__tabs {
	border: 1px solid #000;
}

.flight__tab {
	color: white;
	font-size: 14px;
	position: relative;
	overflow: hidden;
	transition: color 0.4s ease;
	cursor: pointer;
}

.flight__tab.active {
	padding: 10px;
	border-radius: 8px;
	color: black;
	background-color: #fde723;
}

body.lightMode .flight__tab.active {
	background-color: #000;
	color: #fde723;
}

body.lightMode .flight__tab {
	color: #000;
}














/* --------------------- Pax Details Form --------------------- */


.booking__form {
	padding: 5px;
	background: #1e1e2d;
	border-radius: 8px;
	margin-bottom: 10rem;
}


.booking__form h2,
.booking__form h3 {
	margin-bottom: 15px;
	color: yellow;
	font-size: 17px;
	font-weight: 600;
	display: flex;
	justify-content: flex-start;
}


body.lightMode .booking__form h2,
body.lightMode .booking__form h3 {
	color: #000;
}


.input__group {
	margin-bottom: 10px;
}


.input__group label {
	display: block;
	margin-bottom: 5px;
	color: #666;
}


.input__group input,
.input__group select {
	width: 100%;
	padding: 8px;
	border: 1px solid #ccc;
	border-radius: 4px;
}


.flight__ticketing {
	width: 100%;
	height: 50px;
}


.passenger__info {
	margin-bottom: 10px;
	padding: 10px;
	background-color: inherit;
}


.input__container,
.input__group {
	display: flex;
	flex-direction: column;
	color: #ccc;
}


body.lightMode .input__container,
body.lightMode .input__group {
	color: #000;
}


.title__group {
	flex: 1 1 100%;
}


.name__group {
	display: flex;
	gap: 5px;
}


.name__input {
	flex: 1 1 50%;
}


.input__group label {
	font-weight: 500;
}


.input__group input,
.input__group select {
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 5px;
	text-align: center;
}


.contact__details {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	margin-bottom: 20px;
	color: white;
	font-family: 'Montserrat';
	margin-top: 15px;
}

.booking__sent-to {
	margin: 16px 5px 15px 0;
	font-size: 14px;
	font-weight: 600;
	color: #fde723;
}

body.lightMode .booking__sent-to {
	color: #000;
	font-family: 'Montserrat';
}

body.lightMode .contact__details {
	color: #000;
}



.contact__details label {
	font-weight: 500;
	font-size: 14px;
}


.contact__details input {
	padding: 0.5rem;
	border: 1px solid #ccc;
	border-radius: 4px;
}


.date__selection {
	display: flex;
	gap: 1rem;
	align-items: center;
}


.date__input {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	flex: 1;
}


.date__input label {
	font-weight: 500;
	font-size: 14px;
	text-align: start;
}


.date__input input {
	padding: 8px;
	border: 1px solid #ccc;
	border-radius: 5px;
}

body.lightMode .date__input input {
	border: 1px solid #ccc;
}

select.dob__flights {
	height: 35px;
	border-radius: 8px;
	text-align: center;
}


.pax__type-title {
	font-weight: 500;
	font-size: 16px;
	margin-bottom: 10px;
	color: #ccc;
}

body.lightMode .pax__type-title {
	color: #000;
}

.traveller-info__form label {
	font-size: 12px;
}

.flights__footer {
	position: fixed;
	height: fit-content;
	contain-intrinsic-block-size: auto 100px;
	width: 100%;
	background: #fde723;
	width: 420px;
	max-width: 100%;
	z-index: 20;
	color: #000;
	font-size: 14px;
	font-weight: 500;
	bottom: 0;
	border-radius: 3px;
}

.flights__footer-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 8px;
	border-radius: 8px;
	gap: 10px;
}

.flights__footer-price {
	flex-direction: column;
	align-items: flex-start;
}

.flights__footer-price.hide {
	display: none;
}

.price {
	font-size: 1.5em;
	font-weight: 600;
}

.pax {
	font-size: 12px;
	font-weight: 500;
}

.flights__footer-continue {
	background-color: black;
	color: #fde723;
	border: none;
	padding: 10px 20px;
	font-size: 12px;
	cursor: pointer;
	font-family: 'Montserrat';
	border-radius: inherit;
	transition: transform 0.3s ease-in-out;
	/* Smooth transition for the raise effect */
}

.pax__details-title.hide,
.passenger__info.hide,
.contact__details.hide,
.gst__checkbox.hide,
#gstContainer.hide {
	display: none;
}


/* ------- Pass Port Details and GST Details ------- */


/* Common container styling */
.passport__info,
.gst__info {
	display: flex;
	flex-direction: column;
	gap: 5px;
	padding: 5px;
	border-radius: 8px;
	background-color: inherit;
}

.gst__info {
	margin-bottom: 20px;
}

.gst__checkbox {
	margin-bottom: 10%;
	color: #fff;
}

body.lightMode .gst__checkbox {
	color: #000;
}

.gst__checkbox.checked {
	margin-bottom: 0;
}

.passport__issue-country select {
	flex: 1;
	padding: 13px;
	background: inherit;
	color: #000;
	border: 1px solid #ccc;
	border-radius: 8px;
	text-align: start;
}


/* Common flex container for input fields */
.passport__input,
.passport__expiry,
.passport__issue-date,
.passport__issue-country,
.gst__input,
.gst__company-name,
.gst__contact-number,
.gst__email,
.gst__company-address {
	display: flex;
	flex-direction: column;
	gap: 5px;
}


/* Common label styling */
.passport__input label,
.passport__expiry label,
.passport__issue-date label,
.passport__issue-country label,
.gst__input label,
.gst__company-name label,
.gst__contact-number label,
.gst__email label,
.gst__company-address label {
	font-size: 12px;
	font-weight: 500;
	color: #fff;
}

body.lightMode .passport__input label,
body.lightMode .passport__expiry label,
body.lightMode .passport__issue-date label,
body.lightMode .passport__issue-country label,
body.lightMode .gst__input label,
body.lightMode .gst__company-name label,
body.lightMode .gst__contact-number label,
body.lightMode .gst__email label,
body.lightMode .gst__company-address label {
	color: #1e1e2d;
	/* Adjust the color for light mode */
}


/* Common input field styling */
.passport__input input,
.passport__expiry input,
.passport__issue-date input,
.passport__issue-country input,
.gst__input input,
.gst__company-name input,
.gst__contact-number input,
.gst__email input,
.gst__company-address input {
	padding: 10px;
	border: 1px solid #cccccc;
	border-radius: 5px;
	font-size: 14px;
	color: #fff;
	background-color: inherit;
}

body.lightMode .passport__input input,
body.lightMode .passport__expiry input,
body.lightMode .passport__issue-date input,
body.lightMode .passport__issue-country input,
body.lightMode .gst__input input,
body.lightMode .gst__company-name input,
body.lightMode .gst__contact-number input,
body.lightMode .gst__email input,
body.lightMode .gst__company-address input {
	color: #1e1e2d;
	/* Adjust the color for light mode */
}


.passport__input input:focus,
.passport__expiry input:focus,
.passport__issue-date input:focus,
.passport__issue-country input:focus,
.gst__input input:focus,
.gst__company-name input:focus,
.gst__contact-number input:focus,
.gst__email input:focus,
.gst__company-address input:focus {
	border-color: #007bff;
	box-shadow: 0 0 5px rgba(0, 123, 255, 0.5);
	outline: none;
}

.gst__checkbox label {
	font-size: 13px;
	display: flex;
	align-items: center;
	gap: 10px;
}

#gstContainer {
	margin-top: 10px;
}


/* ------ Coupon Code ------ */


/* Coupons Container */
.flight__coupons-container {
	display: flex;
	flex-direction: column;
	background-color: inherit;
	border-radius: 8px;
	padding: 5px;
	gap: 15px;
}

body.lightMode .flight__coupons-container {
	background-color: inherit;
}


/* Header Section */
.flight__coupons-header {
	display: flex;
	align-items: center;
}




.flight__coupons-icon {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: 15px;
}


.flight__coupons-icon img {
	width: 45px;
	height: 45px;
}


.flight__coupons-title h2 {
	font-size: 14px;
	margin-bottom: 5px;
	color: #fde723;
	font-weight: 600;
}


.flight__coupons-title p {
	font-size: 11px;
	color: #ccc;
	font-weight: 500;

	h2 {
		color: #fde723;
		font-weight: 600;
		margin-bottom: 0;

	}
}


.flight__coupons-arrow {
	margin-left: auto;
	cursor: pointer;
}


.flight__coupons-arrow svg {
	width: 20px;
	height: 20px;
	fill: yellow;
}

body.lightMode .flight__coupons-arrow svg {
	fill: #1e1e2d;
}


/* Input and Apply Button */
.flight__coupons-input {
	flex: 1;
	padding: 2px;
	/* border: none; */
	outline: none;
	background-color: inherit;
	color: #fde723;
	display: flex;
	border: 1px solid #ccc;
	border-radius: 8px;
}

body.lightMode .flight__coupons-input {
	border: 1px solid #1e1e2d;
}


.flight__coupons-input input {
	flex: 1;
	padding: 10px;
	border: none;
	outline: none;
	background-color: inherit;
	color: #fde723;
	font-family: 'Montserrat';
	font-size: 12px;
}

body.lightMode .flight__coupons-input input {
	color: #1e1e2d;
}


.flights__apply-coupon {
	background-color: #fde723;
	color: black;
	border: none;
	padding: 10px 15px;
	cursor: pointer;
	font-size: 12px;
	border-radius: 8px;
	font-weight: 600;
	font-family: 'Montserrat';
	transition: background-color 0.3s ease;

}


/* View Coupons Button */
.flight__coupons-view {
	background: none;
	border: none;
	padding: 10px;
	color: #fde723;
	cursor: pointer;
	font-size: 11px;
	font-family: 'Montserrat';
	text-align: center;
}

body.lightMode .flight__coupons-view {
	color: black;
}


/* ------ ------------ View Coupons List ------------ ------ */


/* Light Mode Styles */
.flight__coupon-container {
	background-color: #1e1e1e;
	border-radius: 8px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	padding: 20px;
	display: flex;
	flex-direction: column;
	height: 100vh;
	gap: 20px;
	color: #fff;

}


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


.flight__coupon-header img {
	width: 65px;
	height: 45px;
}


.flight__coupon-title {
	font-size: 1.5rem;
	/* Adjust font size as needed */
	font-weight: bold;
}


.flight__coupon-close {
	border: none;
	background: none;
	font-size: 20px;
	cursor: pointer;
	color: white;
}


.flight__coupon-input {
	display: flex;
	margin-bottom: 20px;
}


.flight__coupon-input input {
	flex: 1;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
	margin-right: 10px;
	font-size: 13px;
	font-weight: 500;
	font-family: 'Montserrat';
}


.flight__coupon-apply {
	background-color: yellow;
	color: black;
	border: none;
	padding: 10px 20px;
	border-radius: 4px;
	cursor: pointer;
	font-size: 13px;
	font-weight: 500;
	font-family: 'Montserrat';
	border: 1px solid black;
}


.flight__coupon-list {
	display: flex;
	flex-direction: column;
	gap: 20px;
	overflow-y: auto;
	margin-bottom: 40px;
}


.flight__coupon-item {
	display: flex;
	align-items: center;
	cursor: pointer;
	padding: 5px;
}


.flight__coupon-item input {
	margin-right: 10px;
}


.flight__coupon-details {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 8px;
}


.flight__coupon-code {
	font-weight: 600;
	font-size: 14px;
	color: #fde723;
}


.flight__coupon-description {
	color: #666;
	font-size: 12px;
	font-weight: 500;
}


.flight__coupon-tnc {
	color: #007bff;
	text-decoration: none;
}


.flight__coupon-icon {
	font-size: 1.2em;
}


/* Dark Mode Styles */
@media (prefers-color-scheme: dark) {
	.flight__coupon-container {
		background-color: inherit;
		color: #ffff00;
		box-shadow: 0 2px 4px rgba(255, 255, 0, 0.3);
	}


	.flight__coupon-input input {
		background-color: #111;
		color: #ffff00;
		border: 1px solid #ffff66;
	}


	.flight__coupon-apply {
		background-color: #ffff00;
		color: #000;
	}


	.flight__coupon-tnc {
		color: #ffff66;
	}


	.flight__coupon-item:hover {
		background-color: black;
		border-radius: 8px;
	}

}

body.lightMode .flight__coupon-item:hover {
	background-color: #fde723;
	border-radius: 8px;
}


body.lightMode .booking__form,
body.lightMode .input__group input,
body.lightMode .input__group select,
body.lightMode .contact__details input,
body.lightMode .date__input input,
body.lightMode .date__input select {
	background: #f9f9f9;
	color: #000;

}


body.lightMode .flight-booking-details {
	background: #1e1e1e;
}


body.lightMode .traveller-info__gender-btns button,
body.lightMode .traveller-info__form input[type="text"],
body.lightMode .traveller-info__form input[type="email"],
body.lightMode .traveller-info__form input[type="tel"],
body.lightMode input#ticketing__email,
body.lightMode input#ticketing__phone,
body.lightMode input#ticketing__address {
	background: #f9f9f9;
	color: #000;
	border: 1px solid #ccc;
}













/* --------------------- SSR -- SEATS --------------------- */


.airplane {
	border: 2px solid #fde723;
	border-radius: 25% / 10%;
	background-color: inherit;
	width: 80%;
	box-shadow: 0 0 10px 5px rgba(255, 255, 255, 0.2);
	position: fixed;
	top: 21%;
	bottom: 7%;
	overflow-y: auto;
	background-color: inherit;
	display: flex;
	flex-direction: column;
	align-items: center;
}

body.lightMode .airplane {
	border: 2px solid #1e1e2d;
}

.seats {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.row__ssr {
	display: grid;
	grid-template-columns: repeat(3, 30px) 30px repeat(3, 30px);
	justify-content: center;
	margin: 5px 0;
	gap: 2px;
}

.seat,
.aisle {
	width: 30px;
	height: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
}

.seat {
	background-color: white;
	cursor: pointer;
	border: 1px solid #555;
	box-shadow: 0 2px 4px rgba(255, 255, 255, 0.3);
	font-size: 13px;
	font-weight: 600;
}

.seat:hover {
	background-color: #555;
	/* Lighter on hover for interaction feedback */
	box-shadow: 0 2px 4px rgba(255, 255, 255, 0.5);
	/* Enhanced glow on hover */
}

.aisle {
	background: none;
	width: 20px;
}

.flights__ssr.tabs,
.flights__ssr.meal-tabs {
	color: white;
	padding: 10px;
	border-radius: 8px;
	text-align: center;
	display: flex;
	align-items: center;
	font-size: 13px;
	font-weight: 500;
	cursor: pointer;
}

.flights__ssr.meal-tabs {
	background: grey;
}

.flights__ssr.tabs.active,
.gender-btn.selected,
.flights__ssr.meal-tabs.active {
	background-color: black;
	color: #fde723;
	border: 1px solid;
}

.seat.free-seat {
	background: #A2FFC1;
	color: black;
}

.seat.mid-range-seat {
	background: #FFC1A2;
	color: black;
}

.seat.high-range-seat {
	background: lightblue;
	color: black;
}

.seat.booked {
	background-color: black;
	color: yellow;
}

.seat.seat__checked {
	background-color: #fde723;
	color: black;

}


/* Styles for seat legend */
.seat-legend {
	display: flex;
	justify-content: space-around;
	padding: 11px;
	position: fixed;
	width: 100%;
	top: 15%;
	z-index: 5;
}

.seat-label {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 5px 10px;
	border-radius: 5px;
	font-size: 12px;
	font-weight: 600;
}

.seat-label.free-seat {
	background-color: #A2FFC1;
	/* Match free seat color */
}

.seat-label.mid-range-seat {
	background-color: #FFC1A2;
	/* Match mid-range seat color */
}

.seat-label.high-range-seat {
	background-color: lightblue;
	/* Match high-range seat color */
}

.seat-label.booked-seat {
	background-color: #000;
	color: #fde723;
	border: 1px solid white;
}

.seat-label.selected-seat {
	background-color: #fde723;
	/* Match selected seat color */
}

/* --------------------- Get Booking Details --------------------- */
.flight__booking-details {
	background: #f8f9fa;
	border: 1px solid #dee2e6;
	border-radius: 8px;
	padding: 20px;
	margin: 20px 0;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	font-family: 'Montserrat';
}


.flight__booking-details p {
	margin: 10px 0;
	font-size: 16px;
	color: #343a40;
}


.flight__booking-details p strong {
	color: #007bff;
}

/* --------------------- Flight Filters --------------------- */


.flights-filter__container {
	display: flex;
	flex-direction: column;
	padding: 10px;
	font-family: 'Montserrat';
	background-color: black;
	color: white;
	gap: 35px;
}


.flights-filter__section {
	display: flex;
	gap: 15px;
	flex-direction: column;
}

.flights-filter__section.bottom-nav {
    margin-bottom: 10rem;
}


.flights-filter__title,
.flights-filter__section-title {
	font-weight: 600;
	color: white;
	/* Ensure text is visible on black background */
}

.flights-filter__section.hidden {
	display: none;
}


.flights-filter__button-group {
	display: flex;
	gap: 30px;
}

.flights-filter__button-group.bottom-nav {
	margin-bottom: 10%;
}


.flights-filter__button,
.flights-filter__selection-button,
.flights-filter__action-button {
	padding: 10px 15px;
	border-radius: 5px;
	font-weight: 500;
	cursor: pointer;
	border: 1px solid yellow;
	font-size: 14px;
	font-family: 'Montserrat';
	display: flex;
	align-items: center;
}


.flights-filter__button {
	background-color: #000;
	color: white;
}


.flights-filter__selection-button {
	flex: 1;
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: white;
	background: #15151f;
	border: 1px solid yellow;
	font-size: 16px;
	font-weight: 500;
	font-family: 'Montserrat';
}


.flights-filter__action-button {
	flex: 1;
	color: black;
	/* Ensure text is visible on light background */
}


.flights-filter__action-button.flights-filter__primary {
	background-color: #fde723;
	color: black;
	/* Ensure text is visible on blue background */
	font-size: 14px;
	font-weight: 600;
	display: flex;
	justify-content: center;

}


.flights-filter__toggle-option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: white;
	/* Ensure text is visible on black background */
}


.flights-filter__switch {
	position: relative;
	display: inline-block;
	width: 60px;
	height: 34px;
}


.flights-filter__slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #ccc;
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 34px;
}


.flights-filter__slider:before {
	position: absolute;
	content: "";
	height: 26px;
	width: 26px;
	left: 4px;
	bottom: 4px;
	background-color: white;
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 50%;
}


input:checked+.flights-filter__slider {
	background-color: #2196F3;
}


input:focus+.flights-filter__slider {
	box-shadow: 0 0 1px #2196F3;
}


input:checked+.flights-filter__slider:before {
	-webkit-transform: translateX(26px);
	-ms-transform: translateX(26px);
	transform: translateX(26px);
}


.flights-filter__round {
	border-radius: 34px;
}


.flights-filter__airport-info {
	font-size: 14px;
	margin-bottom: 10px;
	color: white;
	/* Ensure text is visible on black background */
}


.flights-filter__time-slots {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
	cursor: pointer;


}


.flights-filter__time-slot {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 10px;
	border: 1px solid #fde723;
	border-radius: 5px;
	min-width: 45%;
	text-align: center;
	color: white;
	background: black;
	font-weight: 500;
	font-size: 13px;
	justify-content: space-around;
}


.flights-filter__time-slot img {
	width: 30px;
	height: 30px;
	margin-bottom: 5px;
}


.flights-filter__option-description {
	font-size: 12px;
	margin-top: 5px;
	color: white;
	/* Ensure text is visible on black background */
}


.flights-filter__airline-options {
	display: flex;
	flex-direction: column;
	gap: 40px;
}


.flights-filter__airline-option {
	display: flex;
	gap: 10px;
	color: white;
	align-items: center;
	justify-content: space-between;

	input[type="checkbox"] {
		padding: 10px;
		height: 20px;
		padding: 10px;
		width: 15px;
	}

}


.flights-filter__airline-option img {
	width: 25px;
	height: 25px;
	object-fit: contain;
	border: 1px solid #1e1e2d;
	border-radius: 5px;
}


/* Font Awesome for icons */
.fa-plane,
.fa-suitcase {
	font-size: 1.2em;
	color: white;
	/* Ensure icons are visible on black background */
}

.morning__svg,
.afternoon__svg,
.evening__svg,
.night__svg {
	width: 30px;
	height: 30px;
}

body.lightMode morning__svg svg path,
body.lightMode .afternoon__svg svg path,
body.lightMode .evening__svg svg path,
body.lightMode .night__svg svg path {
	fill: black;
}


.flights-filter__selection-button.active,
.flights-filter__time-slot.active,
.flights-filter__button.active {
	background: yellow;
	color: black;

	svg path {
		fill: black;
	}
}

body.lightMode .flights-filter__time-slot.active svg path {
	fill: #fde723;
}


body.lightMode .morning__svg svg path {
	fill: black;
}

.flights-filter__action-button.flights-filter__reset {
	background: white;
	font-size: 14px;
	font-weight: 600;
	text-align: center;
	display: flex;
	justify-content: center;

}


.flights-filter__selection-button svg {
	stroke: white;
}

/* body.lightMode {
    background-color: white;
    color: black;
} */

body.lightMode .flights-filter__container {
	background-color: white;
	color: black;
}

body.lightMode .flights-filter__title,
body.lightMode .flights-filter__section-title,
body.lightMode .flights-filter__toggle-option,
body.lightMode .flights-filter__airport-info,
body.lightMode .flights-filter__option-description,
body.lightMode .flights-filter__airline-option,
body.lightMode .fa-plane,
body.lightMode .fa-suitcase {
	color: black;
}

body.lightMode .flights-filter__button,
body.lightMode .flights-filter__selection-button,
body.lightMode .flights-filter__action-button {
	background-color: white;
	color: black;
	border: 1px solid black;
}

body.lightMode .flights-filter__selection-button {
	background: #f0f0f0;
	border: 1px solid black;
}

body.lightMode .flights-filter__action-button.flights-filter__primary {
	background-color: #1e1e2d;
	color: white;
}

body.lightMode .flights-filter__time-slot {
	background: white;
	color: black;
	border: 1px solid #1e1e2d;
}

body.lightMode .flights-filter__selection-button.active,
body.lightMode .flights-filter__time-slot.active,
body.lightMode .flights-filter__button.active {
	background: #1e1e2d;
	color: #fde723;
}

body.lightMode .flights-filter__action-button.flights-filter__reset {
	color: black;
}

body.lightMode .flights-filter__slider {
	background-color: #ccc;
}

body.lightMode input:checked+.flights-filter__slider {
	background-color: #2196F3;
}

body.lightMode input:focus+.flights-filter__slider {
	box-shadow: 0 0 1px #2196F3;
}

body.lightMode .flights-filter__slider:before {
	background-color: white;
}




/* --------------------- Flights Book Page --------------------- */


.flight-booking-details {
	position: relative;
	/* Ensure the container is positioned relative to its normal position */
	display: flex;
	flex-direction: column;
	font-family: 'Montserrat';
	background-color: #1e1e1e;
	padding: 5px;
	color: black;
	/* Default text color to black */
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7);
	/* Add text shadow for better readability */
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	/* Add subtle shadow for depth */
}


.flight-booking-details .background-overlay {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-repeat: no-repeat;
	opacity: 0.3;
	/* Adjust the opacity as needed */
	z-index: 0;
	/* Ensure the overlay is behind the content */
	pointer-events: none;
	/* Ensure the overlay doesn't interfere with text interactions */
}


/* Ensure the text content is above the background overlay */
.flight-booking-details>* {
	position: relative;
	z-index: 1;
}






span.flight__trip-to {
	color: white;
}


.flight-booking-details__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
}


.flight-booking-details__header--title {
	text-align: center;
	flex: 0 0 95%;
}


.flight-booking-details__header--title h1 {
	font-size: 24px;
	font-weight: bold;
	margin: 0;
	color: white;
}


.flight-booking-details__flight-info {
	display: flex;
	flex-direction: column;
	padding: 5px;
	border-radius: 10px;
}

.flight-booking-details__flight-info-container {
	display: flex;
}

.flight-booking-details__section--icon svg {
	width: 15px;
	height: 15px;
}

.flight-booking-details__flight-info--logo {
	width: 25px;
	height: 25px;
	margin-right: 15px;
}


.flight-booking-details__flight-info--route {
	font-size: 18px;
	font-weight: 600;
	margin: 0;
	color: #fde723;
}


.flight-booking-details__flight-info--details,
.flight-booking-details__flight-info--class {
	font-size: 11px;
	font-weight: 500;
	margin: 5px 0 0 0;
	color: white;
}





.flight-booking-details__view-details-button {
	background-color: transparent;
	color: yellow;
	border: 1px solid transparent;
	padding: 12px 20px;
	border-radius: 8px;
	font-size: 15px;
	cursor: pointer;
	font-family: 'Montserrat';
	font-weight: 600;
}


.flight-booking-details__section {
	border-radius: 10px;
	padding: 5px;
	color: white;
}


.flight-booking-details__section.cancellation {
	display: none;
	font-size: 14px;
	margin-top: 10px;
}


.flight-booking-details__section.insurance {
	display: none;
}


.flight-booking-details__section--header {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 5px;
}


.flight-booking-details__section--content {
	display: flex;
	gap: 10px;
}


.flight-booking-details__section--header h2 {
	font-size: 16px;
	font-weight: 600;
	margin: 0;
}


.flight-booking-details__section--item {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 8px;
	font-weight: 600;
	justify-content: center;
}


.flight-booking-details__section--icon svg path {
	stroke: #fde723;

}


.flight-booking-details__section--message {
	display: flex;
	align-items: center;
	background-color: #f2f2f2;
	padding: 10px;
	border-radius: 5px;
	margin-bottom: 15px;
}


.flight-booking-details__section--button {
	background-color: yellow;
	color: black;
	border: none;
	padding: 12px 20px;
	border-radius: 5px;
	font-size: 16px;
	cursor: pointer;
	width: 100%;
}


.flight-booking-details__section--cancellation-item {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-size: 14px;
	font-weight: 600;
}


.drawerBody.cancel__policy {
	color: white;
}


body.lightMode .drawerBody.cancel__policy {
	color: black;
}


.cabin__baggage {
	display: flex;
	gap: 10px;
	align-items: center;

	p {
		font-size: 11px;
		font-weight: 500;
	}
}


.flight-booking-details__continue-button {
	background-color: yellow;
	color: black;
	border: none;
	padding: 12px 20px;
	border-radius: 5px;
	font-size: 16px;
	cursor: pointer;
	width: 100%;
}


.flight-booking-details__section--price {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
}


.flight-booking-details__section--price p:first-child {
	font-size: 18px;
	font-weight: bold;
	margin: 0;
}


.flight-booking-details__section--price p:last-child {
	font-size: 14px;
	color: #666;
	margin: 0;
}


.flight-booking-details__header--back-button,
.flight-booking-details__header--share-button,
.flight-booking-details__section--arrow,
.flight-booking-details__section--notification {
	width: 25px;
	height: 25px;
	background-color: #fde723;
	border-radius: 5px;
	padding: 5px;
}

.flight-booking-details__header--back-button svg,
.flight-booking-details__header--share-button svg,
.flight-booking-details__section--arrow svg,
.flight-booking-details__section--notification svg {
	width: 15px;
	height: 15px;
}


/*-------------- View Flight Fares Etc -----------------*/

.flight-details__container {
	display: flex;
	flex-direction: column;
	font-family: 'Montserrat';
	background-color: black;
	/* Assuming black background */
	height: fit-content;
	margin-bottom: 50%;
}

body.lightMode .flight-details__container,
body.lightMode .flight-details__body-container {
	background-color: white;
}


.flight-details__header {
	background-color: black;
	color: #fde723;
	padding: 10px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border: 1px solid yellow;
	border-radius: 10px;
	margin: 5px;
	position: sticky;
	top: 1.5%;
	z-index: 1000;
	gap: 20px;
}


.flight-details__city-pair {
	font-size: 15px;
	font-weight: 600;
	display: flex;
	align-items: center;
}


.flight-details__arrow {
	font-size: 1.5em;
}


.flight-details__info {
	font-size: 0.8em;
}






.flight-details__body {
	padding: 10px;
	color: white;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 10px;
}


.flight-details__body-container {
	background: black;
}


.flight-details__airline {
	display: flex;
	align-items: center;
	margin-bottom: 10px;
}


.flight-details__airline img {
	height: 20px;
	margin-right: 10px;
}


.flight-details__timings {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	width: 100%;
	border: 1px solid #fde723;
	border-radius: 10px;
	padding: 15px;
}


.flight-details__departure,
.flight-details__arrival {
	text-align: center;
	display: flex;
	flex-direction: column;
	gap: 5px;
	align-items: center;
	flex: 1;
}



.flight-details__duration {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	bottom: 10%;
	position: relative;
}


.flight-details__time {
	font-size: 1.5em;
	font-weight: bold;
	color: #fde723;
}




.flight-details__date,
.flight-details__location,
.flight-details__airport,
.flight-details__terminal,
.flight-details__checkin-kgs,
.flight-details__cabin-kgs {
	font-size: 11px;
	color: #ddd;
	min-height: 45px;
	display: flex;
	align-items: center;
}

body.lightMode .flight__type-header,
body.lightMode .flight-details__body,
body.lightMode .flight-details__time,
body.lightMode .flight-details__date,
body.lightMode .flight-details__location,
body.lightMode .flight-details__airport,
body.lightMode .flight-details__terminal,
body.lightMode .flight-details__checkin-kgs,
body.lightMode .flight-details__cabin-kgs,
body.lightMode .flight__coupons-title p,
body.lightMode .flight__coupon-close,
body.lightMode .flight__coupon-code,
body.lightMode .flight__coupon-tnc {
	color: black;
}

body.lightMode .flight-details__header,
body.lightMode .flight__coupon-container {
	background-color: white;
	color: black;
	border: 1px solid black;
}


.flight-details__services {
	margin-bottom: 20px;
	display: none;
}


.flight-details__service-option {
	border: 1px solid yellow;
	/* Yellow border */
	padding: 10px;
	margin-bottom: 10px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}


.flight-details__service-option input[type="radio"] {
	margin-right: 10px;
}


.flight-details__service-option h3 {
	margin-top: 0;
}


.flight-details__service-option p {
	font-size: 0.8em;
	color: #ddd;
	/* Light gray text on black background */
	margin-bottom: 10px;
}


.flight-details__service-option ul {
	list-style: none;
	padding: 0;
	margin: 0;
}


.flight-details__service-option li {
	font-size: 0.8em;
	margin-bottom: 5px;
	display: flex;
	align-items: center;
}


.flight-details__service-option i {
	margin-right: 5px;
}


.flight-details__show-more {
	font-size: 0.8em;
	color: yellow;
	/* Yellow text for button */
	cursor: pointer;
}


.flight-details__discount {
	background-color: #fff9c4;
	padding: 10px;
	margin-bottom: 10px;
	border-left: 5px solid #ffc107;
}


.flight-details__discount i {
	color: #ffc107;
	margin-right: 5px;
}


.flight-details__footer {
	display: none;
	justify-content: space-between;
	align-items: center;
	background-color: #111;
	/* Dark gray background for footer */
	padding: 10px;
}


.flight-details__lock-price {
	color: #28a745;
	font-weight: bold;
}


.flight-details__lock-price i {
	margin-right: 5px;
}


.flight-details__continue {
	background-color: yellow;
	/* Yellow button */
	color: black;
	/* Black text on yellow button */
	border: none;
	padding: 10px 20px;
	border-radius: 5px;
	cursor: pointer;
}


.flight-details__price-summary {
	background-color: yellow;
	color: black;
	padding: 10px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 5px;
	border-radius: 10px;
}


.flight-details__total-price {
	font-size: 1.2em;
	font-weight: bold;
}


.flight-details__passenger-info {
	font-size: 14px;
	font-weight: 500;
}


.layover__city {
	background: yellow;
	width: fit-content;
	padding: 5px;
	border-radius: 8px;
	text-align: center;
	font-size: 12px;
	font-weight: 600;
}


.flight-details__checkin-baggage,
.flight-details__cabin-baggage {
	font-size: 15px;
	color: white;
	font-weight: 800;
}


.flight__details_header-logo,
.flight__details_header-logo.pnr__flight {
	display: flex;
	align-items: center;
	gap: 10px;

	img {
		width: 25px;
		height: 25px;
		object-fit: contain;
	}
}

.flight__details_header-logo.pnr__flight {
	display: none;
}



.flight__type-header {
	color: white;
	font-size: 17px;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 10px;
}




/* --------------------- Flight Traveller Details Page --------------------- */


.traveller-info__container {
	display: flex;
	flex-direction: column;
	background-color: #000;
	border-radius: 10px;
	padding: 20px;
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
	height: 100vh;
	color: white;
}


.traveller-info__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
}


.traveller-info__close-btn {
	background: none;
	border: none;
	cursor: pointer;
}


.traveller-info__scan {
	display: flex;
	align-items: center;
	background-color: #111;
	/* Black background */
	border-radius: 8px;
	padding: 15px;
	margin-bottom: 20px;
	display: none;
}


.traveller-info__scan img {
	width: 40px;
	height: 40px;
	margin-right: 15px;
}


.traveller-info__scan-btn {
	background-color: #ffcc00;
	/* Yellow button */
	color: #000;
	/* Black text */
	border: none;
	border-radius: 5px;
	padding: 8px 15px;
	font-size: 14px;
	cursor: pointer;
	margin-left: auto;
}


.traveller-info__form {
	display: flex;
	flex-direction: column;
	gap: 10px;
}


.traveller-info__gender-btns {
	display: flex;
	justify-content: space-between;
	margin-bottom: 5px;
}


.traveller-info__gender-btns button {
	background-color: inherit;
	color: #fff;
	border-radius: 5px;
	padding: 10px;
	font-size: 12px;
	cursor: pointer;
	flex: 1;
	border: 1px solid yellow;
	font-family: 'Montserrat';
}


.traveller-info__gender-btns button:first-child {
	margin-right: 10px;
}


.traveller-info__form input[type="text"],
.traveller-info__form input[type="email"],
.traveller-info__form input[type="tel"],
input#ticketing__email,
input#ticketing__phone,
input#ticketing__address {
	border: 1px solid #ccc;
	border-radius: 5px;
	padding: 10px;
	font-family: 'Montserrat';
	background: inherit;
	color: #ccc;
}

.editHanging__name.flight__phone-container {
	gap: 10px;
	height: fit-content;
	background: inherit;
	margin-top: 20px;
}

select#flights__countryCode {
	flex: 1;
	padding: 13px;
	background: inherit;
	color: #eee;
	border: 1px solid #ccc;
	border-radius: 8px;
	max-width: 70px;
	min-width: 70px;
	text-align: center;
}

body.lightMode select#flights__countryCode {
	color: black;
}

span.flights__phone-title {
	top: -20px;
	font-size: 12px;
	left: 0px;
	padding: unset;
}

input#ticketing__phone {
	width: 100%;
}


.traveller-info__contact-header {
	font-weight: bold;
	margin-bottom: 5px;
}


.traveller-info__mobile {
	display: flex;
	align-items: center;
	border: 1px solid #ccc;
	border-radius: 5px;
	margin-bottom: 15px;
}


.traveller-info__mobile img {
	width: 20px;
	height: 15px;
	margin-right: 10px;
}


.traveller-info__mobile select {
	border: none;
	background: black;
	margin-right: 10px;
	padding: 10px;
	border-radius: 8px;
	color: white;
}


.traveller-info__mobile input[type="tel"] {
	border: none;
	flex: 1;
}


.traveller-info__wheelchair {
	display: flex;
	align-items: center;
	margin-bottom: 20px;
	display: none;
}


.traveller-info__wheelchair input[type="checkbox"] {
	margin-right: 10px;
}


.traveller-info__confirm-btn {
	background-color: #fde723;
	/* Yellow button */
	color: #000;
	/* Black text */
	border: none;
	border-radius: 5px;
	padding: 12px;
	font-size: 16px;
	cursor: pointer;
	font-weight: 600;
}




.traveller-info__gender-btns .gender-btn.selected {
	background-color: #fde723;
	/* Yellow background */
	color: #000;
	/* Black text */
}


/* ----------- Total Bill ------------- */

.bill-details__container {
	background-color: #1e1e2d;
	padding: 15px;
	border-radius: 8px;
	box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	gap: 10px;
	color: #ccc;
	border: 1px solid;

}

body.lightMode .bill-details__container {
	background-color: white;
	color: black;
}

.bill-details__heading {
	font-size: 17px;
	font-weight: 600;
}

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

.bill-details__item.hide,
.bill-details__saved-tag.hide {
	display: none;
}

span.flight__total_fare-title {
	font-size: 12px;
	font-weight: 500;
}

span.flights__bill-common {
	font-size: 14px;
}

.bill-details__item-left {
	display: flex;
	align-items: center;
}

.bill-details__item-left i {
	margin-right: 10px;
	font-size: 1.2rem;
}

.bill-details__item-right {
	font-weight: 600;
}

.bill-details__strikethrough {
	text-decoration: line-through;
	color: #ccc;
	font-weight: 400;
	margin-right: 5px;
}

.bill-details__saved-tag {
	background-color: rgba(0, 128, 0, 0.1);
	color: green;
	padding: 2px 8px;
	border-radius: 4px;
	font-size: 0.8rem;
	margin-left: 10px;
}

.bill-details__grand-total {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-weight: 600;
	font-size: 15px;
	color: #fde723;

}

body.lightMode .bill-details__grand-total {
	color: black;
}

.bill-details__savings {
	display: flex;
	align-items: center;
	background-color: #ccc;
	border-radius: 5px;
	justify-content: space-between;
}


.bill-details__savings-content {
	padding: 10px;
	border-radius: 8px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	z-index: 1;
	color: #1e1e2d;
	flex-direction: column;
}

.bill-details__savings-amount {
	font-size: 13px;
	font-weight: 600;
	color: green;
	padding: 8px;
}

.bill-details__savings-amount.coupon {
	font-size: 18px;
	padding: unset;
}

span.flights__bill-details,
span.bill-details__taxes-surcharges,
span.bill-details__handling-charges,
.bill-details__savings-amount.coupon,
span.bill-details__seat-price,
span.bill-details__meal-price {
	font-size: 14px;
	font-weight: 500;
}


/* --------------------- Flights You May Prefer --------------------- */
.flight-options__container {
	display: flex;
	gap: 16px;
	/* Adjust spacing between cards */
	cursor: pointer;
	margin: 5px 5px 0 5px;
}

.flight-options__card {
	display: flex;
	align-items: flex-end;
	padding: 8px;
	border-radius: 8px;
	background-color: #f5f5f5;
	/* Light grey background */
	flex: 1;
	/* Each card takes equal width */
}

.flight-options__card.active {
	background-color: #fde723;
}

.flight-options__icon {
	font-size: 18px;
	margin-right: 16px;
}

.flight-options__info {
	display: flex;
	flex-direction: column;
}

.flight-options__title {
	font-weight: bold;
	font-size: 13px;
	margin-bottom: 4px;
}

.flight-options__price {
	font-size: 14px;
	color: #555;
}

/* Media query for screens below 420px */
@media (max-width: 700px) {
	.flight-options__icon {
		font-size: 20px;
	}

	.flight-options__title {
		font-weight: 600;
		font-size: 12px;
	}

	.flight-options__price {
		font-size: 10px;
		font-weight: 500;
	}

	.flight-options__card {
		justify-content: flex-end;
	}

	.flight-options__card {
		padding: 5px;

	}
}



.support__message-flights {
	bottom: 12%;
	text-align: center;
	font-size: 16px;
	position: absolute;
	background: yellow;
	padding: 10px;
	margin: 10px;
	border-radius: 10px;
	color: black;
	font-family: 'Montserrat';
}

/*---------------------------- Booked Tickets List ----------------*/

.booked__tickets {
	/* Apply overall container styles */
	width: 100%;
}

.booked__tickets__ticket-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	padding: 5px;
	border-radius: 8px;
	background-color: inherit;
	color: #fde723;
	border: .1px solid #fde723;
	margin: 10px;
	gap: 20px;
}

.booked__tickets__ticket {
	width: 100%;
}


body.lightMode .booked__tickets__ticket-container {
	color: #1e1e2d;
	border: .1px solid;
}

body.lightMode .booked__tickets__ticket-status-date {
	color: #1e1e2d;
}

.booked__tickets__ticket-info {
	display: flex;
	align-items: center;
	gap: 5px;
}

.booked__tickets__ticket-logo {
	margin-right: 15px;
	border-radius: 8px;
}

.booked__tickets__ticket-logo img {
	width: 25px;
	height: 25px;
}

.booked__tickets__ticket-details {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.booked__tickets__ticket-status-date {
	font-size: 14px;
	color: #ccc;
}

.booked__tickets__ticket-route {
	display: flex;
	align-items: center;
	font-size: 12px;
	font-weight: 500;
}

.booked__tickets__ticket-flight,
.booked__tickets__ticket-passenger {
	color: #ccc;
	font-size: 11px;
}

body.lightMode .booked__tickets__ticket-flight,
body.lightMode .booked__tickets__ticket-passenger {
	color: #1e1e2d;
}

.booked__tickets__ticket-passenger {
	display: flex;
	align-items: center;
}


.flight-booking__card {
	background-color: #f9f9f9;
	/* Slightly darker background for better contrast */
	border: 2px solid #ddd;
	/* Add a border to make the box stand out */
	border-radius: 10px;
	/* Slightly larger border radius for a smoother look */
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
	/* Stronger shadow for more prominence */
	overflow: hidden;
	/* Hide overflowing content */
	display: flex;
	flex-direction: column;
	margin: 10px;
	/* Increase margin for better spacing */
	padding: 5px;
	/* Add padding for better content spacing */
	margin-bottom: 6%;
}

.flight-booking__card:hover {
	transition: transform 0.3s ease;
	transform: scale(1.01);
}

.flight-booking__header {
	padding: 8px;
	display: flex;
	justify-content: space-between;
	border-bottom: 1px solid #f0f0f0;
	font-size: 14px;
	font-weight: 600;
}

.flight-booking__title {
	font-weight: 500;
	color: #1e1e2d;
}

.flight-booking__dates {
	color: #666;
	margin: 5px 0 0;
}

.flight-booking__flight-info {
	display: flex;
	align-items: center;
	margin-top: 10px;
	font-size: 10px;
	gap: 5px;
}

.flight-booking__dot {
	width: 25px;
	height: 25px;
	border-radius: 50%;
	background-color: #ccc;
	display: inline-block;
}

.flight-booking__flight-count,
.flight-booking__class {
	color: #666;
}

.flight-expanded__container {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}

.flight-booking__status {
	background-color: yellow;
	color: #1e1e2d;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	display: inline-block;
	padding: 5px;
	font-size: 9px;
}

.flight-booking__details {
	padding: 8px;
	/* Adjust padding to only apply horizontally initially */
	display: none;
	/* Initially hidden */
	max-height: 0;
	transition: max-height 0.5s ease-out, padding 0.5s ease-out;
	overflow: hidden;
}

.flight-booking__details.expanded {
	display: block;
	max-height: 500px;
	/* Adjust this value based on your content */
	padding: 20px;
}

.flight-booking__toggle {
	transition: transform 0.5s ease-out;
}

.flight-booking__toggle.expanded {
	transform: rotate(180deg);
	/* Rotate the icon 180 degrees */
}

.flight-icon-airport__container {
	display: flex;
	align-items: center;
	gap: 10px;
}

.flight-booking__leg-details {
	display: flex;
	margin-bottom: 10px;
	gap: 15px;
	justify-content: space-between;
	align-items: center;
}

.flight-booking__leg-title {
	font-size: 11px;
	font-weight: 500;
	color: #1e1e2d;
}

.flight-booking__leg-airports,
.flight-booking__leg-times {
	font-size: 14px;
	color: #666;
	margin: 5px 0 0;
	font-weight: 600;
}

.flight-booking__leg-date {
	font-size: 11px;
	font-weight: 500;
	color: #1e1e2d;
}

.flight-booking__leg-details>span {
	/* Arrow in flight details */
	margin: 0 10px;
	color: #ccc;
}

.flight-booking__summary {
	padding-top: 15px;
	border-top: 1px solid #f0f0f0;
}

.flight-booking__summary>div {
	/* Container for summary items */
	display: flex;
	flex-direction: row;
	justify-items: stretch;
	align-content: space-around;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	font-size: 13px;
}

.flight-booking__summary-item {
	display: flex;
	align-items: center;
	margin-bottom: 10px;
	gap: 5px;
	justify-content: center;
}

.flight-booking__summary-item span:nth-child(2) {
	margin-right: 5px;
}

.flight-booking__toggle {
	background: transparent;
	border: none;
	cursor: pointer;
	width: 100%;
	padding: 2px;
	text-align: center;
}

.flight-booking__toggle-icon {
	transition: transform 0.3s ease-in-out;
}

.flight-booking__card.expanded .flight-booking__toggle-icon {
	transform: rotate(180deg);
}

.send__flight__details-container {
	display: flex;
	gap: 10px;
	align-items: center;
	justify-content: center;

}

.status__icons-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 5px;
}

.email__icon,
.whatsapp__icon {
	padding: 5px;
}

.email__icon svg,
.whatsapp__icon svg {
	width: 25px;
	height: 25px;
}

.whatsapp__icon svg {
	height: 20px;
}

/*---------------------- Coupon Header ------------------------*/

.flightsDiscount__header-container,
.flightsDiscount__header-container-add-post {
	height: fit-content;
	max-height: 300px;
	cursor: pointer;
}

.flightsDiscount__header-container img,
.flightsDiscount__header-container-add-post img {
	object-fit: cover;
	width: 100%;
	/* max-height: 195px; */
}

#flightsDiscount__header,
#flightsDiscount__strip,
#flightsDiscount__strip-findBuddy {
	width: 80px;
	height: 60px;
}

.flightsDiscount__container {
	display: flex;
	flex-direction: column;
}

.flightsDiscount__title-container {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 25px;
	font-weight: 700;
}

.flightsDiscount__header-description {
	text-align: center;
}

/*-------- Price challenge --------*/
.price__challenge img {
	width: 100%;
	height: 150px;
}

/*------- Custom Calendar Fare Picker -------*/


#custom_calendar_price__container {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: fixed;
	top: 0;
	z-index: 13;
	width: 100%;
	left: 0;
	height: 100vh;
	padding: 10px;
}

.custom_calendar_price__container {
	background-color: #ffffff;
	border-radius: 0.5rem;
	box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
	overflow: hidden;
	width: 100%;
	max-width: 28rem;
	color: #020817;
	padding: 10px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.custom_calendar_price__container.open {
	opacity: 1;
	visibility: visible;
}

.custom_calendar_price__header {
	padding: 0 5px 5px 5px;
}

.custom_calendar_price__title {
	font-size: 1.5rem;
	font-weight: 700;
	margin: 0 0 1rem;
}

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

.custom_calendar_price__nav button,
.custom_calendar_price__nav select {
	background: #ffffff;
	border: 1px solid #e2e8f0;
	color: #020817;
	border-radius: 0.375rem;
	padding: 0.5rem;
	cursor: pointer;
	transition: background-color 0.2s, color 0.2s;
	font-family: 'Montserrat';
	font-size: 18px;
}

.custom_calendar_price__weekdays {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	text-align: center;
	font-weight: 600;
	font-size: 16px;
	color: #64748b;
	margin-bottom: 0.5rem;
}

.custom_calendar_price__days {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	padding: 5px;
}

.custom_calendar_price__day {
	/* Style each day cell */
	aspect-ratio: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-color: #ffffff;
	cursor: pointer;
	transition: all 0.2s;
	font-size: 0.875rem;
}

.custom_calendar_price__day.selected {
	background-color: #fde723;
	color: #1e1e2d;
	border-color: #0284c7;
	font-weight: 700;
	border-color: #0284c7;
}

.custom_calendar_price__selected {
	text-align: center;
	padding: 1rem;
	font-size: 0.875rem;
	font-weight: 500;
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.custom_calendar_price__container {
		max-width: 100%;
	}
}

.custom_calendar_price__ctas {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 14px;
	padding: 10px;
	font-family: 'Montserrat';
	background: #ccc;
	border-radius: 8px;
	cursor: pointer;
}

.custom_calendar_price__body {
	font-family: 'Montserrat';
}

#depDate,
#returnDate,
#check-in,
#check-out {
	display: none;
}

.text__box {
	width: 85%;
	display: flex;
	flex-direction: column;
	padding: 10px 0 10px 0;
	gap: 15px;
	font-size: 15px;
}

.date__text-dep,
.date__text-return,
.check__out-text,
.check__in-text {
	height: fit-content;
	padding-left: 12px;
}

.date__text-return.adjust__font-size {
	font-size: 11px;
}

button#prevMonth {
	display: none;
}

.custom_calendar_price__day.disabled {
	pointer-events: none;
	opacity: 0.5;
	color: #ccc;
}

/* ---- Experience ------- */

.enquiry_detailed_form input {
	background-color: #ccc;
}

/*------ New Login Page ------*/
.website__login-popup {
	display: flex;
	justify-content: center;
	align-items: center;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 1000;
}

.website__login-popup-content {
	background-color: #fff;
	padding: 10px;
	border-radius: 10px;
	max-width: 500px;
	position: relative;
	display: flex;
	gap: 10px;
}

.website__login-close {
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
	font-size: 30px;
	height: 49px;
}

.website__login-left {
	background: black;
	color: yellow;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	flex: 1;
	text-align: left;
	padding: 20px;
	font-family: 'Montserrat';
}

.website__login-left h2 {
	margin-bottom: 15px;
	font-size: 18px;
	font-weight: 600;
}

.website__login-benefits {
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.website__login-benefits p {
	margin-bottom: 8px;
	font-weight: 400;
	font-size: 13px;
	color: white;
	font-family: 'Montserrat';
}

.website__login-benefits p.hidden {
	display: none;
}

.website__login-right {
	flex: 1;
	text-align: left;
	padding: 5px;
	background: white;
	border-radius: 5px;
}

.website__login-right h2 {
	margin-bottom: 15px;
}

.website__login-form {
	display: flex;
	gap: 20px;
	flex-direction: column;
}

.website__login-form label {
	display: block;
	margin-bottom: 5px;
	font-weight: bold;
}

.website__login-form input {
	width: calc(100% - 22px);
	padding: 10px;
	margin-bottom: 15px;
	border: 1px solid #ccc;
	border-radius: 5px;
}

.website__login-form button {
	padding: 12px 25px;
	background: yellow;
	color: black;
	border: none;
	border-radius: 25px;
	cursor: pointer;
	font-weight: bold;
	font-family: 'Montserrat';
	font-size: 15px;
}

/* Mobile View Adjustments */
@media (max-width: 768px) {
	.website__login-popup-content {
		gap: 0px;
	}

	.website__login-close {
		top: -1px;
		font-size: 26px;
	}

	.website__login-left h2 {
		font-size: 12px;
	}

	.website__login-benefits p {
		font-size: 11px;
	}

	.website__login-right h2 {
		font-size: 22px;
		top: 11px;
		position: relative;
	}

	.website__login-form label {
		font-size: 14px;
		top: 8px;
		position: relative;
	}

	.website__login-form button {
		font-size: 14px;
		width: 100px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}

.completeness__popup-complete.flight {
	border-radius: 0 0px 20px 20px;
}

/*------ PaxReviewSheet ------*/
.traveller-details-review__container {
	position: absolute;
	bottom: 7.2%;
	left: 0;
	width: 100%;
	background-color: #1e1e2d;
	box-shadow: rgba(0, 0, 0, 0.1) 0px -2px 10px;
	transform: translateY(100%);
	transition: transform 1s cubic-bezier(0.25, 0.1, 0.25, 1);
	z-index: 300;
	color: #ccc;
	border-radius: 8px 8px 0 0;

}

.traveller-details-review__overlay {
	position: absolute;
	left: 0;
	width: 101%;
	height: 100vh;
	background: rgba(0, 0, 0, 0.5);
	backdrop-filter: blur(1px);
	z-index: 200;
}

.close-button {
	position: absolute;
	top: 0px;
	right: 10px;
	background: none;
	border: none;
	color: #1e1e2d;
	font-size: 24px;
	cursor: pointer;
	z-index: 400;
	/* Ensure the button is above other content */
	padding: 10px;
}

.traveller-details-review__header {
	padding: 10px;
	background-color: #fde723;
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: #1e1e2d;
	border-radius: 8px 8px 0 0;
}

.traveller-details-review__title {
	font-size: 18px;
	font-weight: 600;
}

.traveller-details-review__close-btn {
	background: none;
	border: none;
	font-size: 22px;
	cursor: pointer;
	padding: 10px;
}

.traveller-details-review__content {
	padding: 20px;
	max-height: 500px;
	overflow-y: auto;
	border-radius: 8px;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.traveller-details-review__list {
	list-style: none;
	padding: 0;
	margin: 0;
	gap: 10px;
	display: flex;
	flex-direction: column;
}

.traveller-details-review__list-item,
.contact__details-container {
	padding: 15px;
	border: .1px solid;
	flex-direction: column;
	gap: 5px;
	display: flex;
	border-radius: 8px;
}

.traveller-details-review__details-label {
	font-weight: 600;
}

.traveller-details-review__details-value {
	margin-left: 10px;
}

.bill-details__item.promo_code.hide {
	display: none;
}

/*---------- Flights Page Picker ----------*/
.page__picker-container {
	display: flex;
	align-items: center;
	width: 100%;
	gap: 20px;
	justify-content: center;
	cursor: pointer;
}


.page__picker-left,
.page__picker-right {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 30px;
	width: 46%;
	border: .1px solid #fde723;
	padding: 10px;
	border-radius: 7px;
	box-shadow: 0 4px 6px rgba(253, 231, 35, 0.4),
		0 1px 3px rgba(253, 231, 35, 0.3),
		0 10px 20px rgba(253, 231, 35, 0.2);
	cursor: pointer;
}

div#payInstant-text,
div#selectSeats-text,
#login-text {
	font-size: 15px;
	font-weight: 500;
	color: #fde723;
}

div#price-decreased {
	height: 180px;
}

.price-change__container {
	height: 50vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 13px;
	text-align: center;
}

.bill-details__container.priceChange {
	width: 100%;
	margin-top: 15%;
}

/*------------ New Desktop Mode changes ---------------*/

@media screen and (min-width: 768px) {

	.price__challenge img {
		height: 200px;
	}
}


@media (min-width: 1280px) {

	div#app,
	.experiences__secondary .drawerHeader {
		margin: 0 30% 0 30%;
	}

	div#desktopContainer {
		display: block;
	}

	div#footer,
	.feed__login-sticky {
		width: 40%;
	}

	.feed__login-sticky {
		bottom: 0;
	}

	body.lightMode div#desktopContainer {
		background: #fff;
		/* background: linear-gradient(200deg, #FFF9CF, white); */
	}

	body.lightMode .desktopSideBar-section {
		background: transparent;
	}

	div#header {
		height: 0;
	}

	div#footer {
		display: none;
	}

	#main__experiences-box {
		height: 100%;
		top: 0;
	}

	div#main__spDashboard-box {
		height: 100vh;
	}

	.support__message-flights {
		width: 100%;
	}

	.airplane {
		width: 35%;
		top: 23%;
		bottom: 9%;
	}

	.seat-legend,
	.flights__ssr-container.tabs {
		width: 40%;
		gap: 35px;
	}

	.seat-legend {
		top: 16%;
	}

	.desktopSideBar-section.desktopSideBar-experiences {
		width: fit-content;
		height: 130px;
		padding: 0px;
		min-height: unset;
		object-fit: cover;
	}

	.desktopSideBar-section.desktopSideBar-experiences.flights__price {
		background: transparent;
		cursor: pointer;
	}

	.desktopSideBar-section.desktopSideBar-experiences img {
		width: 285px;
		height: 140px;
		object-fit: contain;
		border-radius: 10px;
	}



}

/*------------ Feed Cheapest Flight Cards ---------------*/
.cheap__flights-card {
	width: 100%;
	height: 250px;
	overflow: hidden;
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
	transition: all 0.3s ease;
	position: relative;
	background-image: url('/view/assets/img/cheap_flights.jpg');
	background-size: cover;
	background-position: center;
}

.cheap__flights-card-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.7));
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	padding: 10px;
	color: white;
}

.cheap__flights-card-header {
	display: flex;
	justify-content: flex-end;
	align-items: start;

}

.cheap__flights-card-title {
	font-size: 22px;
	font-weight: 600;
}

.cheap__flights-badge {
	color: #fde723;
	font-size: 22px;
	font-weight: 600;
}

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

.cheap__flights-card-destination {
	display: flex;
	align-items: center;
	gap: 15px;

}

.cheap__flights-destination-name {
	font-size: 22px;
	font-weight: 600;
}

.cheap__flights-card-price {
	text-align: right;
}

.cheap__flights-price {
	font-size: 27px;
	font-weight: bold;
	margin: 0;
}

.cheap__flights-book-button {
	width: 100%;
	background-color: transparent;
	color: #fde723;
	border: 1px solid;
	padding: 12px 16px;
	border-radius: 10px;
	font-size: 18px;
	font-weight: 500;
	cursor: pointer;
	transition: background-color 0.3s ease, color 0.3s ease;
}

.cheap__flights-book-button:hover {
	background-color: #fde723;
	color: #1e1e2d;
}

/*----------- New Caraousel Styles ---------------*/
.premium-carousel {
	position: relative;
	width: 100%;
	margin: auto;
	overflow-x: auto;
	/* Enable horizontal scrolling */
	overflow-y: hidden;
	/* Disable vertical scrolling */
	white-space: nowrap;
	/* Prevent line breaks */
	cursor: pointer;
	scroll-snap-type: x mandatory;
	/* Enable scroll snapping */
	scroll-behavior: smooth;
	/* Smooth scrolling */
}

.premium-carousel-inner {
	display: inline-flex;
	/* Use inline-flex to keep items in a single line */
	transition: transform 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
	/* Smoother transition */
	display: flex;
	width: 100%;
}

.premium-carousel-item {
	min-width: 100%;
	box-sizing: border-box;
	display: inline-block;
	/* Ensure items are inline */
	scroll-snap-align: start;
	/* Snap items to the start */
}

.premium-carousel-item img {
	width: 100%;
	display: block;
	border-radius: 10px;
}

.premium-carousel-item.landingPage {
	max-height: 162px;
}


.premium-carousel-indicators {
	position: absolute;
	bottom: 25px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 5px;
}

.premium-carousel-indicator {
	width: 10px;
	height: 10px;
	background-color: #fff;
	border-radius: 50%;
	opacity: 0.5;
	cursor: pointer;
}

.premium-carousel-indicator.active {
	opacity: 1;
}

/* ---------- Cancellation ---------- */

.flight-booking__cancel {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 5px;
	font-size: 18px;
	border: 1px solid;
	border-radius: 8px;
	cursor: pointer;
}

.cancel__ticket__container {
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid yellow;
	border-radius: 8px;
	padding: 5px;
	font-size: 20px;
	text-align: center;
	cursor: pointer;
}

.cancellation__charges__container {
	border: 1px solid #ccc;
	padding: 20px;
	width: 300px;
	margin: 20px auto;
	border-radius: 8px;
}

.cancellation__charges__details {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.cancellation__charge,
.refund__amount {
	display: flex;
	justify-content: space-between;
	font-size: 16px;
}

.cancellation__charges__cta {
	display: flex;
	justify-content: space-around;
	align-items: center;
}

div#stopCancelTicket {
	border: 1px solid yellow;
	border-radius: 8px;
	padding: 8px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
}

div#cancelTicket {
	cursor: pointer;
}

/*---------- Flights Fare Types ----------*/

.flight__fares {
	display: flex;
	flex-direction: column;
	gap: 5px;
	border-top: .1px solid;
}

.flight__details__name.fareType {
	text-align: start;
	font-size: 11px;
	font-weight: 600;
}


.flight__fare_inclusions-list {
	font-size: 11px;
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
	gap: 5px;
	padding-left: 5px;
}

.fare__incl-item {
	list-style-type: none;
	display: flex;
	align-items: center;
	gap: 14px;
}

.fare__incl-item.hide.show {
	display: none;
}

.fare__incl-item svg {
	width: 20px;
	height: 20px;
}

.fare__incl-item.darkMode svg path {
	fill: #fde723;
}

.show-more-fare-inclusions {
	font-size: 14px;
	font-weight: 600;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 13px;
	padding: 5px;
	margin-left: -3px;
	text-decoration: underline;
}

.flight__details__container.fare-types {
	display: flex;
	justify-content: space-between;
}

.flight__fare-inclusions {
	display: flex;
	align-items: center;
}

.book__flight {
	background: #fde723;
	padding: 5px;
	border-radius: 10px;
	font-weight: 600;
	font-size: 14px;
	color: #1e1e2d;
}


.flight__fares__title {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 5px;
}

/* ---------- Meal Selection ---------- */
/* styles.css */

.flights__meal_tabs-container {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 5px;
	justify-content: space-around;
	align-items: center;
	border: 1px solid;
	border-radius: 8px;
	padding: 5px;
}

#website__flight-meal-options {
	padding: 20px;
	background-color: #e5e5e5;
	border-radius: 8px;
}

body.lightMode #website__flight-meal-options {
	background-color: transparent;
}

.website__flight-meal-title {
	font-size: 24px;
	margin-bottom: 20px;
	text-align: center;
}

.selection-counter {
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 20px;
	color: #333;
}

.website__flight-meal-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	justify-content: center;
	flex-direction: column;
	align-items: center;
}

.website__flight-meal-card {
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 8px;
	padding: 15px;
	width: 100%;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.website__flight-meal-card:last-child {
	margin-bottom: 10%;
}

.website__flight-meal-name {
	font-size: 14px;
	margin-bottom: 10px;
	font-weight: 600;
}

.website__flight-meal-code {
	font-size: 11px;
	color: #666;
	margin-bottom: 10px;
}

.website__flight-meal-price-select {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.website__flight-meal-price {
	font-size: 15px;
	font-weight: 600;
	color: #333;
}

.website__flight-meal-select-button {
	background-color: #fde723;
	color: #1e1e2d;
	border: none;
	border-radius: 4px;
	padding: 8px 12px;
	cursor: pointer;
	font-weight: 600;
	font-size: 14px;
}

.website__flight-meal-select-button:disabled {
	background-color: #ccc;
	cursor: not-allowed;
}

.meal-counter {
	display: flex;
	align-items: center;
}

.counter-btn {
	background-color: #fde723;
	color: #1e1e2d;
	border: none;
	border-radius: 4px;
	padding: 4px 8px;
	cursor: pointer;
}

.counter-value {
	margin: 0 10px;
	font-size: 16px;
	font-weight: 600;
}

/* ---------- Tbo Hotels ---------- */
.hotel-booking-container {
	padding: 20px;
	height: 40vh;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	justify-content: space-around;
}

.hotel-booking-details {
	display: flex;
	flex-direction: column;
	gap: 25px;
	color: #1e1e2d;
}

.hotel-booking-label {
	font-weight: 500;
	font-size: 18px;
}

.hotel-booking-select {
	padding: 5px;
	font-size: 16px;
	border-radius: 5px;
	border: 1px solid #ccc;
	background-color: #fff;
	cursor: pointer;
	width: 30%;
	text-align: center;
	font-family: 'Montserrat';
}

.hotel-booking-cta {
	display: flex;
	justify-content: center;
	margin-top: 20px;
	align-items: center;
}

#bookHotel {
	padding: 10px 20px;
	background-color: #fde723;
	color: #1e1e2d;
	border-radius: 5px;
	cursor: pointer;
	font-weight: 600;
	text-align: center;
	width: 100%;
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
}

#stopBookHotel {
	background-color: #dc3545;
}

.hotel-booking-room,
.hotel-booking-adults,
.hotel-booking-children {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/*----------- Hotel Search Results -----------*/

.hotel-card {
	display: flex;
	flex-direction: column;
	border: 1px solid #e0e0e0;
	/* Light gray border */
	border-radius: 8px;
	overflow: hidden;
	/* Hide overflowing content, especially the image */
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	/* Subtle shadow */
	margin: 10px;
}

.hotel-card__image-container {
	position: relative;
	overflow: hidden;
	/* Essential for proper image cropping */
}

.hotel-card__image {
	width: 100%;
	display: block;
	/* Prevents a small gap below the image */
	max-height: 300px;
}

.hotel-card__favorite-button {
	position: absolute;
	top: 10px;
	right: 10px;
	background: rgba(255, 255, 255, 0.8);
	/* Semi-transparent white background */
	border: none;
	border-radius: 50%;
	padding: 8px;
	cursor: pointer;
}

.hotel-card__favorite-button svg {
	width: 20px;
	height: 20px;
}

.hotel-card__image-carousel-indicator {
	position: absolute;
	bottom: 10px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
}

.hotel-card__image-carousel-indicator span {
	display: inline-block;
	width: 8px;
	height: 8px;
	margin: 0 4px;
	background-color: rgba(255, 255, 255, 0.6);
	/* Light gray dots */
	border-radius: 50%;
	cursor: pointer;
	/* Indicate interactivity */
}

.hotel-card__content {
	padding: 0 16px 16px 16px;
}

.hotel-card__title {
	font-size: 1.2rem;
	margin-bottom: 4px;
	font-weight: 600;
}

.hotel-card__subtitle {
	font-size: 0.9rem;
	color: #888;
	/* Slightly muted gray */
	margin-bottom: 8px;
}

.hotel-card__details {
	font-size: 0.9rem;
	color: #888;
	margin-bottom: 12px;
}

.hotel-card__price-container {
	display: flex;
	align-items: baseline;
	/* Align price and details */
}

.hotel-card__price {
	font-size: 1.1rem;
	font-weight: 600;
	margin-right: 4px;
}

.hotel-card__price-details {
	font-size: 0.9rem;
	color: #888;
}

/*------------- Hotel Details / Drill Down Page ---------------*/
.hotel-details {
	display: flex;
	flex-direction: column;
	font-family: sans-serif;
	/* Or your preferred font */

}

.hotel-details__image-container {
	position: relative;
	overflow: hidden;
	/* To contain the image within bounds */

}

.hotel-details__image {
	width: 100%;
	display: block;
	/* Prevents a small gap below the image */

}

.hotel-details__image-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: flex-start;
	/* Align items to top */
	justify-content: space-between;
	/* Space buttons on sides */
	padding: 16px;
	/* Padding around the overlay content */

}


.hotel-details__back-button,
.hotel-details__share-button,
.hotel-details__favorite-button {
	background-color: rgba(255, 255, 255, 0.7);
	/* Semi-transparent white background */
	border: none;
	border-radius: 50%;
	/* Round buttons */
	padding: 8px;
	cursor: pointer;
	color: #333;
	/* Darker icon color */

}

.hotel-details__top-right-buttons {
	display: flex;
	gap: 8px;
	/* Spacing between share & favorite buttons */

}

.hotel-details__image-counter {
	position: absolute;
	bottom: 16px;
	/* Spacing from bottom */
	right: 16px;
	/* Spacing from right */
	background-color: rgba(0, 0, 0, 0.5);
	/* Semi-transparent black */
	color: white;
	padding: 4px 8px;
	/* Smaller padding */
	border-radius: 4px;
	/* Slightly rounded corners */
	font-size: 14px;

}


.hotel-details__content {
	padding: 16px;

}

.hotel-details__title {
	font-size: 1.5rem;
	margin-bottom: 8px;

}


/* ... (rest of your previous CSS) ...*/


.hotel-details__booking-info {
	display: flex;
	align-items: center;
	/* Vertically align icon and text */
	margin-top: 16px;
	gap: 12px;
	/* Space between the icon and text */

}

.hotel-details__booking-icon {
	/* Styles for the icon's container (if needed) */
	width: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 5px;

}

/* Style the SVG icon directly */
.hotel-details__booking-icon svg {
	fill: #e55c60;
	width: 20px;
	height: 20px;
}


.hotel-details__booking-title {
	font-weight: 600;
	/* Bold title */
	margin-bottom: 4px;
	/* Small margin below the title */

}

.hotel-details__booking-subtitle {
	font-size: 0.9rem;
	color: #777;
	/* Slightly lighter text */

}



.hotel-details__host {
	display: flex;
	align-items: center;
	margin-top: 16px;
	/* Spacing above host section */
	gap: 12px;
	/* Space between image and text */

}

.hotel-details__host-image {
	width: 40px;
	/* Adjust as needed */
	height: 40px;
	border-radius: 50%;
	/* Make it circular */
	object-fit: cover;
	/* Ensure image covers the area */

}

.hotel-details__host-name {
	font-weight: 600;
	/* Slightly bolder */
	margin-bottom: 2px;
	/* Small margin below name */

}

.hotel-details__host-details {
	font-size: 0.9rem;
	/* Slightly smaller */
	color: #777;
	/* Slightly lighter text */
}


.hotel-details__amenity {
	display: flex;
	/* Use flexbox */
	align-items: center;
	/* Align icon and text vertically */
	margin-top: 16px;
	/* Add some margin */
	gap: 8px;
	/* Add spacing between the icon and text */

}


.hotel-details__parking-icon {
	width: 20px;
	height: 20px;
	fill: #000;
	/* Icon color - black */

}

.hotel-details__amenity-text {
	font-size: 0.9rem;

}

.hotel-details__bottom-section {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 20px;
	padding-top: 20px;
	/* Padding to separate from above content */
	border-top: 1px solid #eee;
	/* Thin gray line as separator */

}


.hotel-details__price {}

.hotel-details__price-amount {
	font-size: 1.2rem;
	font-weight: bold;

}

.hotel-details__price-details,
.hotel-details__dates {
	font-size: 0.9rem;
	color: #777;
	/* Slightly muted gray for details */
}


.hotel-details__reserve-button {
	background-color: #e55c60;
	/* Your desired pink */
	color: white;
	border: none;
	padding: 10px 20px;
	/* Increase button padding */
	border-radius: 8px;
	/* Rounded corners */
	font-weight: 600;
	cursor: pointer;
}




/* --------- New Premium Page Styles --------- */

#premiumContainer {
	display: none;
	/* Initially hidden */
	opacity: 0;
	/* Initially transparent */
	transition: opacity 0.5s ease;
	/* Smooth opacity transition */
}

#premiumContainer.active {
	display: flex;
	opacity: 1;
	flex-direction: column;
	background-image: url(https://prodmedia.beatravelbuddy.com/uploads/app-banners/bgnew.webp);
	/* background-repeat: round; */
	max-height: 99vh;
	overflow-y: scroll;
	overflow-x: hidden;
	color: #FFF7F7;
}

/* Premium Header */
.premium__header-new {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 10px 10px 0 10px;
	gap: 5px;
}

.premium__title-one {
    font-size: 20px;
    font-weight: bold;
    font-family: 'Nunito';
    color: #CFC2B9;
}

.premium__title-two {
	font-size: 24px;
	font-weight: 800;
	text-align: center;
	color: #FFF7F7;
}

.premium__title-three {
    font-family: 'Montserrat';
    font-size: 24px;
    font-weight: 500;
}

/* Premium Tabs */

.premium__tabs {
	padding: 15px 15px 0 15px;
}

.premium__tab-container {
	display: flex;
	align-items: center;
	justify-content: space-around;
    background: linear-gradient(90deg, #6B3458, #1C0B19);
	border-radius: 17px;
	box-shadow: inset -3px 3px 2.5px rgba(0, 0, 0, 0.03);
	/* Inner shadow */

}

.premium__tab {
	font-size: 16px;
	color: #fff;
	cursor: pointer;
	padding: 12px;
	transition: all 0.3s ease;
	opacity: 0.4;
	font-weight: 600;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.premium__tab--active {
    border-radius: 50px;
    background: linear-gradient(90deg, #591B47, #BFAEA7);
    font-size: 16px;
    /* color: #000; */
    opacity: 1;
    box-shadow: 4px 4px 6px 0px rgba(0, 0, 0, 0.15);
}

.premium__tab-subtitle {
	font-size: 9px;
	margin-top: 4px;
	text-align: center;
	font-weight: bold;
	opacity: 0.6;
}

/* Premium Price Content */
.pricing-card-wrapper {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 20px;
}

.pricing-card {
	flex: 1;
	transition: transform 0.3s ease, opacity 0.3s ease;
	cursor: pointer;
	opacity: 0.5;
	transform: scale(0.8);
}

.pricing-card-active {
	flex: 2;
	opacity: 1;
	transform: scale(1);
}

.pricing-card-inside {
	background: #fff;
	border-radius: 10px;
	padding: 20px;
	text-align: center;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.striked-text p {
	text-decoration: line-through;
	color: #999;
}

.pricing-card h3 {
	margin: 10px 0;
}

.pricing-card span {
	display: block;
	margin-top: 10px;
}


/* Benefits Section */
.premium__benefits-container {
	background: linear-gradient(90deg, #6B3458, #1C0B19);
	border-radius: 53px;
	padding: 0 30px 30px 30px;
	box-shadow: 5px 2px 8px 2px rgba(0, 0, 0, 0.15);
	margin-bottom: 8%;
	color: #FFF3F3;
}

.tag__icon.apply__coupon-btn {
	cursor: pointer;
	background: linear-gradient(90deg, #6B3458, #1C0B19);
}

.premium__benefits-title,
.faq__benefits-title {
	display: flex;
	justify-content: center;
	font-family: 'Nunito';
	font-size: 23px;
	font-weight: 700;
	margin-top: 25px;
}

.faq__benefits-title {
	color: black;
}

.premium__benefits-sub-container,
.faq__benefits-sub-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
	/* Add this line */
}

.premium__benefits {
	display: flex;
	align-items: center;
	padding: 0 5px;
	margin-top: 26px;
	gap: 25px;
	justify-content: space-between;
	width: 100%;
}

.premium__benefits.benefit-7,
.premium__benefits.benefit-8,
.premium__benefits.benefit-9,
.premium__benefits.benefit-10,
.premium__benefits.benefit-11,
.premium__benefits.benefit-12,
.premium__benefits.benefit-13,
.premium__benefits.benefit-14,
.premium__benefits.faq-5,
.premium__benefits.faq-6,
.premium__benefits.faq-7,
.premium__benefits.faq-8,
.premium__benefits.faq-9 {
	display: none;
}


.premium__benefits-text {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.premium__benefits-image img {
	width: 110px;
	height: fit-content;
	max-height: 100px;
	object-fit: cover;
	border-radius: 10px;
}


.premium__title {
	font-size: 16px;
	font-weight: 600;
}

.premium__sub-title {
	font-size: 10px;
}

.view__all-premium,
.view__all-premium-faqs {
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
	background: linear-gradient(24deg, #7A4A6F, #AF9798);
	padding: 6px;
	border-radius: 8px;
	font-size: 13px;
	font-family: 'Nunito';
	font-weight: 600;
	cursor: pointer;
	bottom: -5.5%;
	width: 35%;
}

.view__all-premium-faqs {
	bottom: -13%;
}

/* Premium Coupon */

.premium__coupons {
	
	display: flex;
	flex-direction: column;
	border-radius: 14px;
	background: linear-gradient(0deg, #633252, #2B1324);
	align-items: flex-start;
	padding: 15px;
	margin: 15px 15px 15px 15px;
	gap: 25px;
	box-shadow: 4px 2px 4px 1px rgba(0, 0, 0, 0.1);
}

.section__title {
    color: #FFF7F7;
}

input#premmium_coupon {
    flex: 1;
    padding: 5px;
    border: none;
    outline: none;
    background-color: inherit;
    font-family: 'Montserrat';
    font-size: 14px;
    font-weight: 500;
    color: #fff;
}

.coupon__apply-container {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    flex-wrap: wrap;

}

.tag__container {
    display: flex;
    align-items: center;
    gap: .5rem;
    border: .1px solid;
    border-radius: 8px;
    padding: 5px;
}

.tag__icon {
    background: #FBE861;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
}

.apply__text {
    font-size: 14px;
    font-weight: 600;
    display: flex;
    align-items: center;
	text-align: center;
}

.find__section__title {
	font-family: 'Nunito';
	font-size: 24px;
	font-weight: 700;
}

.section__button {
	font-size: 11px;
	font-weight: 600;
	font-family: 'Nunito';
	border: .1px solid black;
	border-radius: 11px;
	padding: 5px;
}

.find__section-wrapper {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
}

.find__trip-partner-container {
	display: flex;
	overflow-x: scroll;
	gap: 15px;
	scroll-behavior: smooth;
	color: #FFF3F3;
}

.find__trip-partner-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-evenly;
}

.find__trip-partner {
	padding: 20px;
	display: flex;
	flex-direction: column;
	gap: 15px;
}

.find__trip-partner-image img {
	width: 140px;
	height: 140px;
	object-fit: cover;
	border-radius: 30%;
	background: grey;
}

.find__trip-partner-image {
    height: 220px;
    display: flex;
    gap: 7px;
    flex-direction: column;
	background: linear-gradient(24deg, #653555, #2B1325);
    border-radius: 27px;
    text-align: center;
    align-items: center;
    justify-content: center;
    width: 150px;
    border: .1px solid #fff;
    box-shadow: 0px 4px 7px 0px rgba(0, 0, 0, 0.15);
}

.find__trip-partner-name {
	font-family: 'Nunito';
	font-size: 14px;
	font-weight: 600;
}

.find__trip-partner-followers {
	font-size: 10px;
	font-family: 'Nunito';
	font-weight: bold;
	margin-top: 7px;
}

/* User Testimonials */

.testimonial__container {
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 20px;
	bottom: 7%;
}

.testimonial__title {
	font-size: 23px;
	font-family: 'Nunito';
	font-weight: 700;
	padding: 0px 20px;
	margin-top: 20px;
}

.testimonial__slider {
	display: flex;
	transition: transform 1.5s ease;
}

.testimonial__item {
	flex: 0 0 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0px;
	box-sizing: border-box;
	border-radius: 32px;
	position: relative;
	background: linear-gradient(180deg, #2B1325 0%, #442039 100%);
	max-height: 335px;
}

.testimonial__content {
	text-align: center;
	position: relative;
	padding: 0 18px 18px 18px;
	background: #fff;
	border-radius: 20px;
	box-shadow: 0px 4px 7px 0px rgba(0, 0, 0, 0.08);
	min-height: 190px;
	max-height: 190px;
	/* Set max height */
	overflow: hidden;
	/* Prevent content overflow */
}

.testimonial__quote {
	color: #607D8B;
	font-size: 11px;
	line-height: 1.4;
	font-weight: 600;
	overflow-wrap: break-word;
}

.testimonial__quote-marks {
	position: absolute;
	font-size: 120px;
	color: #FFE074;
	line-height: 0.8;
	font-family: 'Nunito';
}

.testimonial__quote-marks--open {
	top: 0;
	left: 20px;
}

.testimonial__quote-marks--close {
	bottom: -47%;
	right: 20px;
}

.testimonial__image {
	width: 68px;
	height: 68px;
	margin: -34px auto 0;
	/* Center the image between the two boxes */
	border-radius: 50%;
	overflow: hidden;
	border: 2px solid white;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	position: relative;
	z-index: 1;
}

.testimonial__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.testimonial__details {
	text-align: center;
	margin-top: 34px;
	/* Adjust to match the image margin */
}

.testimonial__rating {
	color: #2D3648;
	font-size: 24px;
	letter-spacing: 4px;
	color: #FFF3F3;
}

.testimonial__name {
	color: #FFF3F3;
	font-size: 16px;
	font-weight: 600;
	margin-top: 10px;
}

/* Footer Section */

.hero__container {
	display: flex;
	flex-direction: column;
	padding: 20px;
	margin-bottom: 50%;
	margin-top: 5%;
}

.hero__content {
	display: flex;
	flex-direction: column;
	/* margin: 0 auto; */
	width: 100%;
}

.hero__title-primary {
	font-size: 48px;
	/* color: #FFF3F3; */
	font-weight: bolder;
	/* margin-bottom: 20px; */
	font-family: 'Nunito';
	margin-bottom: -6%;
}

.hero__title-secondary {
	display: flex;
	flex-direction: row;
	/* margin-bottom: 20px; */
	gap: 5px;
	align-items: center;
}

.hero__title-secondary--left {
	font-size: 48px;
	/* color: #FFF3F3; */
	font-weight: 500;
	font-family: 'Nunito';
}

.hero__title-secondary--right {
	font-size: 60px;
	/* color: #FFF3F3; */
	font-weight: bold;
	font-family: 'Nunito';
}

.hero__footer {
	font-size: 24px;
	/* color: #FFF7F7; */
	display: flex;
	align-items: center;
	gap: 10px;
	font-family: 'Nunito';
	font-weight: 500;
}

/* FAQs Section */
.premium__benefits-container.faq__container {
	margin-top: 5%;
	background: linear-gradient(200deg, #AF9798, #FFF3F3);
	border-radius: 110px;
	display: flex;
	flex-direction: column;
	position: relative;
	box-shadow: unset;
}

.faq__benefits-sub-container {
	padding: 10px;
}

.faq__container .premium__benefits-title {
	padding: 0 20px;
}

.premium__benefits-container.faq__container .premium__title {
	font-size: 13px;
	font-weight: 600;
	color: #000;
}

.premium__benefits-container.faq__container .premium__sub-title {
	font-size: 10px;
	font-weight: 400;
	color: grey;
}


.faq__benefits-sub-container .premium__benefits-text {
	max-width: 100%;
}



/* Pricing Slider */

.price-slider {
	padding: 18px 35px 0 35px;
	width: 100%;
	display: flex;
	justify-content: center;
	color: #FFF7F7;
}

.price-slider__container {
	position: relative;
	cursor: pointer;
}

.price-slider__card {
	position: relative;
    padding: 1rem;
    border-radius: 40px;
    box-shadow: 6px 6px 10px 0px rgba(0, 0, 0, 0.15);
    background: linear-gradient(90deg, #7A4A6F, #1C0B19);
    border-bottom: 1px solid;
}

.price-slider__tag {
	position: absolute;
	right: 5%;
	top: 4%;
	padding: 0.25rem 1rem;
	border-radius: 0.5rem;
	background: linear-gradient(90deg, #6B3458, #AF9798 100%);
}

.price-slider__tag-text {
	/* color: black; */
	font-weight: 600;
	font-size: 14px;
}

.price-slider__content {
	text-align: center;
	padding-top: 3rem;
}



.price-slider__title {
	font-size: 20px;
	font-weight: 600;
	/* margin-bottom: 0.5rem; */
}



.price-slider__subtitle {
	font-size: 20px;
	font-weight: bolder;
	letter-spacing: 0.05em;
	animation: cubic-bezier(0.075, 0.82, 0.165, 1);
}

.price-slider__savings {
	font-size: 11px;
	/* color: #374151; */
}

.price-slider__strikethrough-price {
	font-size: 12px;
	color: #FF6B6B;
	text-decoration: line-through;
	margin-top: 5px;
	font-weight: 500;
	opacity: 0.8;
}

.price-slider__price {
	display: flex;
	align-items: center;
	justify-content: center;
	/* gap: 8px; */
	/* margin-bottom: 1.5rem; */
	padding: 0px 5px 0 17px;
}

.price-slider__currency {
	font-size: 36px;
	font-weight: 600;
	margin-top: 0.5rem;
}

.price-slider__amount {
	font-size: 4.5rem;
	font-weight: 700;
}

.price-slider__period {
	font-size: 13px;
	font-weight: 700;
	margin-top: 1rem;
	left: -1%;
	position: relative;
}

.price-slider__users {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.2rem;
	padding: 10px;
}

.price-slider__avatars {
	display: flex;
	margin-right: 0.5rem;
}

.price-slider__avatar {
	width: 15px;
	height: 15px;
	border-radius: 9999px;
	background-color: #d1d5db;
	border: .5px solid white;
	margin-left: -0.5rem;
}

.price-slider__avatar:first-child {
	margin-left: 0;
}

.price-slider__users-text {
	font-size: 14px;
	font-weight: 600;
}

.price-slider__users-text strong {
	font-weight: 900;
}

.price-slider__cta {
	margin-top: 1rem;
	padding: 5px;
	font-size: 10px;
	font-weight: 700;
	border: .1px solid black;
	border-radius: 11px;
	background: transparent;
	cursor: pointer;
	transition: all 0.2s ease;
	margin-bottom: 12px;
	width: 110px;
	box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
}

.price-slider__cta-now {
	color: #FFF7F7;
	font-family: 'Nunito';
	font-size: 14px;
}

/* Already a Premium Member */
.title-premium-wrapper-new {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0 20px 20px 20px;
	text-align: center;
	font-family: 'Nunito';
}

.traveler-premium-title-new p {
	font-size: 18px;
	font-weight: 500;
	/* color: #333; */
	margin-bottom: 15px;
}

.traveler-title-down-new p {
	margin: 5px 0;
}

.premiumAccess-new {
	font-size: 24px;
	font-weight: bold;
	/* color: #2d2d2d; */
	margin-bottom: 20px;
}

.pricing-card-wrapper-new {
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
}

.premium-packages-box-new {
	background: linear-gradient(24deg, #653555, #2B1325);
	border-radius: 16px;
	padding: 24px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.premium-packages-item-new {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.premium-package-item-subTitle-new {
	font-size: 14px;
	font-weight: bold;
	color: #fff;
}

.premium-package-item-title-new {
	font-size: 22px;
	font-weight: bold;
	color: yellow;
}

.premium-package-item-price-new {
	font-size: 20px;
	color: #fff;
}

.premium-package-item-orderId-new {
	font-size: 14px;
	color: grey;
	margin-top: 8px;
}

/* Accreditation Section */
.accreditations__sub-container {
	display: flex;
	align-items: center;
}

.accreditations__benefits img {
	width: 95%;
}

.accreditations__benefits {
	display: flex;
	align-items: center;
	margin-top: 7%;
}

.accreditations__container {
	margin-top: 5%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 20px;
}

.accreditations__title {
	font-family: 'Nunito';
	font-size: 22px;
	font-weight: 600;
	font-size: 23px;
	font-weight: 700;
}

.accreditations__sub-title {
	font-size: 12px;
	font-weight: 500;
	/* margin-top: 0%; */
}

/* New Landing Page */

.homepage {
	/* max-width: 1200px; */
	/* margin: 0 auto; */
	background-image: url(/view/assets/img/bg-lp.webp);
	background-repeat: round;
	height: 98vh;
	overflow-y: auto;
	font-family: 'Montserrat';
	display: none;
}


.homepage__container {
	padding: 0 10px;
}

.premium-carousel.landingPage {
	margin: 0;
}

.homepage.active {
	display: block;
}

.homepage__header {
	text-align: center;
	/* margin-bottom: 2rem; */
	background-image: url(/view/assets/img/conf-lp.webp);
	height: 110px;
	background-repeat: round;
	display: flex;
	flex-direction: column;
	align-content: center;
	align-items: center;
	justify-content: center;
	position: relative;
	/* Add this line */
}

.close_lp {
	position: absolute;
	top: 10px;
	right: 10px;
	background-color: #fff;
	border-radius: 50%;
	width: 21px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	font-size: 14px;
	font-weight: 600;
	color: #333;
	padding: 2px;
	font-family: 'Montserrat';
}

.homepage__title {
	font-size: 30px;
	font-weight: 900;
	margin: 0;
}

.homepage__subtitle {
	color: #333;
	font-size: 14px;
	font-weight: 600;
	opacity: 0.8;
}

.homepage__hero {
	display: flex;
	align-items: center;
	justify-content: space-between;
	/* margin-bottom: 3rem; */
}

.homepage__hero-title {
	font-size: 24px;
	width: 40%;
}

.homepage__hero-content {
	display: flex;
	align-items: center;
	justify-content: space-around;
}

.homepage__hero-title-sub {
	color: #666;
}

/* Search Box */

.search__box-homePage {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2%;
    box-shadow: var(--shadow);
}

input#searchPageInputHome {
    width: 100%;
    height: 60px;
    border-radius: 10px;
    padding: 0 50px 0 20px;
    color: #fff;
    border: 0;
    outline: 0;
    border: 1px solid #1e1e2d;
    font-family: 'Montserrat';
}

.search__button-homePage {
    position: absolute;
    right: 8px;
    height: 34px;
    width: 34px;
    border-radius: 7px;
    border: 0;
    background: #f6ee33;
    padding: 0;
    cursor: pointer;
}



.homepage__grid {
	display: flex;
	grid-template-columns: repeat(2, 1fr);
	gap: 8px;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	margin-top: 3%;
}

.premium-carousel-indicators.landingPage {
	bottom: 1%;
}

.homepage__card {
	background: white;
	border-radius: 10px;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	height: 235px;
	box-shadow: 2px 0px 7.5px -1px rgba(0, 0, 0, 0.11);
	max-width: 49%;
	flex: 1;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: flex-start;
	transition: transform 0.3s ease-in-out;
}

.homepage__card.big {
	transform: scale(1.2);
	z-index: 10;
}

img.homepage__hero-image {
	height: 100px;
}


.homepage__card-title {
	margin: 0;
	font-size: 18px;
	font-weight: bolder;
	background: linear-gradient(45deg, #0C0B00 0%, #FFE109 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	color: transparent;
}

.homepage__card-description {
	color: #666;
	margin: 0;
	font-size: 10px;
	font-weight: 600;
}

.homepage__badge {
	display: inline-block;
	/* background: #fff4d4; */
	/* padding: 0.5rem 1rem; */
	border-radius: 8px;
	font-size: 8px;
	/* font-weight: 500; */
	background: linear-gradient(45deg, #FFE109 0%, #FFF 100%);
	padding: 6px;
}

.homepage__card-image img {
	width: 180px;
	height: 120px;
}

.homepage__badge strong {
	font-weight: 600;
}

.homepage__card-image {
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: stretch;
}

.text-container {
	gap: 10px;
	display: flex;
	flex-direction: column;
	padding: 17px 17px 0 17px;
}



/* #ai-lp {
	height: 115px;
    width: 137px;
}

#ai-lp svg {
	margin-top: 8%;
} */

@media (max-width: 720px) {
	.homepage__grid {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 8px;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		margin-top: 3%;

	}

	.homepage__hero {
		flex-direction: column;
		text-align: center;
	}

	.homepage__card {
		width: 100%;
		max-width: unset;
	}

	.homepage__hero-title {
		font-size: 16px;
	}

	.homepage__card-description {
		font-size: 9px;
	}

	.homepage__badge {
		font-size: 7px;
	}
}



/* Desktop Mode  New Premium*/
@media screen and (min-width: 768px) {
	.hero__title-primary {
		font-size: 60px;
		margin-bottom: -1%;
	}


	.premium__benefits-text {
		max-width: 40%;
	}

	.premium__benefits-container.faq__container {
		margin-top: 10%;
	}


}



/* New Login Page */
/* Container Styles */
.login {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 1rem;
    background-image: url(/view/assets/img/login-bg.webp);
    background-repeat: round;
    flex-direction: column;
}

@media screen and (max-height: 852px) {
	/* .login {
		padding: 1rem 1rem 10rem 1rem;
	} */

}

.login__box {
	width: 100%;
	max-width: 400px;
	font-family: 'Montserrat';
}

/* Header Styles */
.login__header {
	text-align: center;
    /* margin-bottom: 10px; */
    margin-top: 10px;
}

.login__title {
	font-size: 30px;
	font-weight: bold;
	color: #1a1a1a;
	margin-bottom: 0.5rem;
	/* font-family: 'Nunito'; */
}

.login__subtitle {
	font-size: 20px;
	color: #4a4a4a;
	line-height: 1.3;
	font-weight: 600;
}

/* Form Styles */
.form {
	display: flex;
	flex-direction: column;
	font-family: 'Montserrat';
}

.form__group {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 20px;
	margin-bottom: 15px;
}

.form__input,
.form__password {
	height: 48px;
	width: 100%;
	padding: 0 1rem;
	font-size: 14px;
	border: 1px solid #e5e5e5;
	border-radius: 0.5rem;
	background-color: rgba(255, 255, 255, 0.9);
}

.form__forgot-password {
	text-align: right;
}

.form__forgot-password-link {
	color: #6b7280;
	text-decoration: none;
}

/* Button Styles */
.btn {
	height: 48px;
	border: none;
	border-radius: 0.5rem;
	font-size: 20px;
	cursor: pointer;
	transition: background-color 0.2s;
}

.btn-primary {
	background-color: #4a4a4a;
	color: white;
	width: 100%;
	font-family: 'Nunito';
}

.btn-primary:hover {
	background-color: #363636;
}

.btn-link {
	background: none;
	color: #494949;
	text-decoration: none;
	width: 100%;
	margin: 1rem 0;
	font-size: 14px;
	font-weight: 600;
	font-family: 'Montserrat';
}

.forgot__password {
	text-align: right;
	margin-bottom: 20px;
	font-size: 14px;
	font-weight: 500;
	color: #626262;
	cursor: pointer;
}

.password-container {
	width: 100%;
	position: relative;
}

.pass__toggle {
	right: 7px;
	top: 5.5px;
	position: absolute;
	padding: 10px;
}

/* Social Login Section */
.social {
	text-align: center;
	font-family: 'Nunito';
}

.social__text {
	color: #6b7280;
	margin-bottom: 1rem;
	font-size: 14px;
	font-weight: 600;
}

.social__buttons {
	display: flex;
	justify-content: center;
	gap: 1rem;
}

.social__btn {
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.social__btn svg {
	width: 70px;
	height: 70px;
}

.custom-select-container {
	position: relative;
	width: 28%;
	display: none;
}

.phone__dial-container {
	width: 100%;
	display: flex;
	justify-content: space-between;
}

.custom-select {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.custom-select input {
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 5px;
	width: 100%;
	box-sizing: border-box;
	height: 48px;
}

.custom-select-dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	background: white;
	border: 1px solid #ccc;
	border-radius: 5px;
	max-height: 200px;
	overflow-y: auto;
	z-index: 1000;
	display: none;
}

.custom-select-dropdown div {
	padding: 10px;
	cursor: pointer;
	color: #000;
	font-size: 12px;
}

.custom-select-dropdown div:hover {
	background: #f0f0f0;
}

.btn.btn.btn-primary-email {
	height: 48px;
	font-size: 14px;
	font-family: 'Montserrat';
	font-weight: 500;
	cursor: pointer;
	transition: background-color 0.2s;
}

/* Onboarding New Page */

/* body {
    min-height: 100vh;
    background-color: #FFF9EA;
} */

.onboarding__page-container {
	width: 100%;
	margin: 0 auto;
	background-image: url(/view/assets/img/bg-onboard.webp);
	background-repeat: round;
	height: 110vh;
	font-family: 'Montserrat';
}

.onboarding__page-title {
	text-align: center;
	font-size: 20px;
	margin-bottom: 24px;
	padding: 0 20px;
	padding: 20px 20px;
	font-weight: 600;
	margin-top: 10%;
	color: #000;
}

.onboarding__page-background-image {
	position: relative;
	width: 100%;
	height: 40vh;
	margin-bottom: 16px;
	background-color: #b3d4fc;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #555;
	font-size: 18px;
	border-radius: 0 0px 40px 40px;
}

.onboarding__page-background-image img {
	object-fit: cover;
	height: 40vh;
	border-radius: 0 0px 40px 40px;
	width: 100%;
}

.onboarding__page-edit-button {
	position: absolute;
	top: 16px;
	right: 16px;
	width: 40px;
	height: 40px;
	border-radius: 25%;
	background: rgba(255, 255, 255, 0.8);
	backdrop-filter: blur(4px);
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 6px;
	z-index: 1000;
}

.onboarding__page-profile-card {
	background: white;
	border-radius: 24px;
	padding: 24px;
	margin: -20% 5% 0;
	position: relative;
	z-index: 1;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
	color: #000;
}

.onboarding__page-profile-header {
	display: flex;
	align-items: center;
	gap: 16px;
	margin-bottom: 15%;
}

.onboarding__page-avatar-container {
	position: relative;
	width: 110px;
	height: 110px;
}

.onboarding__page-avatar {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background-color: #ddd;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #666;
	font-size: 14px;
}

.onboarding__page-avatar img {
	height: 110px;
	width: 110px;
	border-radius: 50%;
}


.onboarding__page-profile-info h2 {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 20px;
	margin-bottom: 4px;
	font-weight: 600;
}

.onboarding__page-verified-badge {
	background: #E6F4EA;
	padding: 4px;
	border-radius: 50%;
	display: inline-flex;
}

.onboarding__page-verified-badge img {
	width: 30px;
	height: 30px;
}

.onboarding__page-phone-number {
	color: #666;
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 11px;
	flex-wrap: wrap;
}

.onboarding__page-gender-options {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
	margin-bottom: 15%;
}

.onboarding__page-gender-option {
	padding: 16px;
	border-radius: 12px;
	border: 2px solid transparent;
	background: none;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	transition: background 1s, border-color 1s;
	/* Specify properties for smooth transition */
	height: 110px;
	justify-content: space-between;
}

.onboarding__page-gender-option.active {
	background: linear-gradient(to bottom, #FEF08A, #FDE047);
	border-color: #FCD34D;
}

.onboarding__page-gender-option:not(.active):hover {
	background: #f5f5f5;
}

.onboarding__page-gender-icon {
	mask-size: cover;
}

.onboarding__page-gender-icon img {
	width: 35px;
	height: 35px;
}

.onboarding__page-gender-label {
	font-size: 14px;
	font-weight: 500;
	color: #333;
}

.onboarding__page-frame-text {
	color: #999;
	font-size: 14px;
	margin-bottom: 24px;
}

.onboarding__page-done-button {
	width: 50%;
	padding: 16px;
	border: none;
	border-radius: 8px;
	background: linear-gradient(to right, #FCD34D, #FDE047);
	color: black;
	font-size: 15px;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.2s;
	margin-left: 25%;
}

.onboarding__page-done-button:hover {
	background: linear-gradient(to right, #FBC02D, #FCD34D);
}

/* New Photo Picker */
.photo-picker-container {
	text-align: center;
	margin: 20px 0;
}

.cropper-container {
	margin: 20px 0;
}

.controls {
	margin: 20px 0;
}

.controls button {
	margin: 0 5px;
	padding: 10px 20px;
	background-color: #007bff;
	color: white;
	border: none;
	border-radius: 5px;
	cursor: pointer;
	transition: background-color 0.3s;
}

.controls button:hover {
	background-color: #0056b3;
}

.cropped-result {
	margin-top: 20px;
}

.cropper-modal,
.cropper-container.cropper-bg,
.cropper-canvas,
.cropper-wrap-box {
	border-radius: 0 0px 40px 40px;
}






/* Card Container */
.experience__topRated-item {
	width: 245px;
	padding: 12px;
	border-radius: 16px;
	margin-right: 20px;
	transition: all 0.3s ease;
	position: relative;
	overflow: hidden;
	background: linear-gradient(0deg, #f9f9f9, white);
	box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.1);
	border: 1px solid rgba(0, 0, 0, 0.05);
}

body.lightMode .experience__topRated-item {
	background: linear-gradient(0deg, #fff9cf, white);
	box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.1);
}

.experience__topRated-item:hover {
	transform: translateY(-5px);
	box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.15);
}

/* EMI Badge */
.experience__topRated-badge {
	z-index: 1;
	position: absolute;
	top: 16px;
	left: -4px;
	font-size: 13px;
	font-weight: 700;
	background: linear-gradient(135deg, #ffd700, #ffc107);
	color: #0d4b6b;
	padding: 4px 10px;
	line-height: 20px;
	border-radius: 0 6px 6px 0;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.experience__topRated-badge:before {
	content: "";
	position: absolute;
	left: 0;
	bottom: -6px;
	width: 6px;
	height: 6px;
	background: #c79500;
	border-radius: 0 0 0 6px;
	z-index: -1;
}

/* Image Container */
.experience__topRated-imageBox {
	position: relative;
	border-radius: 12px;
	overflow: hidden;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.experience__topRated-imageBox:before {
	content: "";
	position: absolute;
	width: 100%;
	height: 40%;
	border-radius: 10px;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
	bottom: 0;
	z-index: 1;
}

.experience__topRated-item .experience__topRated-imageBox img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	height: auto;
	border-radius: 10px;
	transition: transform 0.5s ease;
}

.experience__topRated-item:hover .experience__topRated-imageBox img {
	transform: scale(1.05);
}

/* Title */
.experience__topRated-title {
	position: absolute;
	bottom: 12px;
	font-size: 14px;
	color: #fff;
	left: 12px;
	width: calc(100% - 24px);
	line-height: 1.4;
	font-weight: 600;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	z-index: 2;
	text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.8);
}

/* Bookmark Button */
.experience__topRated-bookmark {
	position: absolute;
	top: 10px;
	right: 10px;
	z-index: 2;
	transition: transform 0.2s ease;
}

.experience__topRated-bookmark svg {
	width: 24px;
	height: 30px;
	filter: drop-shadow(0px 1px 2px rgba(0, 0, 0, 0.3));
}

.experience__topRated-bookmark svg path {
	fill: white;
	transition: fill 0.2s ease;
}

.experience__topRated-item:hover .experience__topRated-bookmark {
	transform: scale(1.1);
}

.experience__topRated-bookmark:hover svg path {
	fill: #ff385c;
}

/* Content Box */
.experience__topRated-contentBox {
	padding: 12px 0 0;
}

/* Category */
.experience__topRated-category {
	display: flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: #555;
	margin-bottom: 8px;
	font-weight: 500;
}

.experience__topRated-category svg {
	width: 14px;
	height: 14px;
}

/* Host and Rating */
.experience__topRated-hostRating {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 8px;
}

.experience__topRated-host {
	font-size: 13px;
	font-weight: 600;
	color: #333;
}

.experience__topRated-rating {
	display: flex;
	align-items: center;
	gap: 4px;
	font-size: 14px;
	font-weight: 700;
	color: #222;
}

.experience__topRated-rating svg {
	width: 16px;
	height: 16px;
}

/* Pricing */
.experience__topRated-pricing {
	display: flex;
	align-items: center;
	justify-content: flex-start;
}

.experience__topRated-price {
	font-size: 16px;
	font-weight: 700;
	color: #222;
	display: flex;
	align-items: center;
	gap: 2px;
}

.experience__topRated-price span:first-child {
	font-size: 14px;
}

.item__price-slashed {
	font-size: 13px;
	font-weight: 400;
	color: #777;
	text-decoration: line-through;
	margin-left: 6px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
	.experience__topRated-item {
		width: 220px;
	}
}

@media (max-width: 480px) {
	.experience__topRated-item {
		width: 180px;
		padding: 8px;
	}

	.experience__topRated-title {
		font-size: 12px;
	}
}


.experience__item {
	width: calc(100% - 32px);
	margin: 0 auto 25px;
	display: flex;
	flex-direction: column;
	border-radius: 16px;
	z-index: 1;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
	transition: all 0.3s ease;
	overflow: hidden;
	border: 1px solid rgba(255, 255, 255, 0.1);
	background: linear-gradient(145deg, rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0.05));
	transform: translateY(0);
}

.experience__item:hover {
	transform: translateY(-5px);
	box-shadow: 0 15px 40px rgba(0, 0, 0, 0.2);
}

.experience__item-image {
	flex: 2;
	position: relative;
	height: 220px;
	overflow: hidden;
}

.experience__item-image:before {
	content: "";
	width: 100%;
	position: absolute;
	height: 150px;
	border-radius: 16px 16px 0 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.7) 20%, rgba(0, 0, 0, 0) 60%);
	z-index: 1;
}

.experience__item-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 16px 16px 0 0;
	max-height: 250px;
	transition: transform 0.5s ease;
}

.experience__item:hover .experience__item-image img {
	transform: scale(1.05);
}

body.lightMode span.experience__item-location {
	font-size: 13px;
	font-weight: 600;
	background: rgba(0, 0, 0, 0.6);
	padding: 4px 12px;
	border-radius: 20px;
}

span.experience__item-location {
	position: absolute;
	font-size: 12px;
	color: #fff;
	left: 15px;
	top: 15px;
	font-weight: 600;
	z-index: 2;
	display: -webkit-box;
	line-clamp: 1;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	background: rgba(0, 0, 0, 0.6);
	padding: 4px 12px;
	border-radius: 20px;
	letter-spacing: 0.5px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

.experience__item-content {
	flex: 3;
	padding: 16px 20px 20px;
	background: linear-gradient(145deg, rgba(255, 255, 255, 0.03), rgba(0, 0, 0, 0.03));
}

.experience__item-title {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-direction: row;
	flex-wrap: nowrap;
	margin-bottom: 8px;
}

body.lightMode .experience__item-title h3 {
	color: #000;
	font-weight: 700;
}

.experience__item-title h3 {
	margin: 0 0 5px;
	font-size: 16px;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	color: #fff;
	font-weight: 700;
	letter-spacing: 0.3px;
}

.experience__item-bookmark svg {
	width: 20px;
	height: 20px;
	cursor: pointer;
	transition: transform 0.2s ease, fill 0.2s ease;
}

.experience__item-bookmark svg:hover {
	transform: scale(1.1);
	fill: #fde723;
}

body.lightMode .experience__item-category {
	color: #000;
	font-size: 12px;
	font-weight: 600;
	background: rgba(0, 0, 0, 0.05);
}

.experience__item-category {
	font-size: 11px;
	margin: 0 0 12px;
	color: #ddd;
	display: inline-block;
	padding: 4px 10px;
	border-radius: 4px;
	background: rgba(255, 255, 255, 0.1);
	letter-spacing: 0.5px;
	text-transform: uppercase;
}

body.lightMode .experience__item-hostRating {
	color: #111;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.experience__item-hostRating {
	display: flex;
	justify-content: space-between;
	color: #ddd;
	padding-top: 12px;
	margin-top: 12px;
	border-top: 1px solid rgba(255, 255, 255, 0.1);
}

body.lightMode .experience__item-host {
	color: #111;
	font-size: 13px;
	font-weight: 600;
}

.experience__item-host {
	font-size: 12px;
	margin: 0;
	font-weight: 500;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 150px;
	color: #ddd;
}

.experience__item-host span {
	font-weight: 700;
	position: relative;
}

.experience__item-host span:after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 100%;
	height: 1px;
	background: currentColor;
	opacity: 0.5;
}

.experience__item-rating {
	font-size: 13px;
	font-weight: 700;
	text-align: right;
	display: flex;
	align-items: center;
	gap: 4px;
}

.experience__item-rating svg {
	width: 14px;
	height: 14px;
	fill: #fde723;
}

.experience__item-rating span {
	font-size: 10px;
	opacity: 0.7;
	display: block;
	margin-top: 2px;
}

body.lightMode .experience__item-price {
	color: #056b6b;
	background: rgba(5, 107, 107, 0.1);
}

.experience__item-price {
	font-size: 18px;
	color: #fde723;
	font-weight: 700;
	margin-top: 15px;
	padding: 8px 15px;
	border-radius: 8px;
	display: inline-block;
	background: rgba(253, 231, 35, 0.1);
	position: relative;
}

.experience__item-price span:first-child {
	margin-right: 2px;
}

.item__price-slashed {
	font-size: 14px;
	text-decoration: line-through;
	opacity: 0.6;
	margin-left: 8px;
	font-weight: 400;
	position: relative;
}


/* ---- New group Trips Home Page ---- */
:root {
	--primary: #2563eb;
	--primary-dark: #1d4ed8;
	--primary-light: #3b82f6;
	--primary-lighter: #93c5fd;
	--secondary: #f97316;
	--secondary-dark: #ea580c;
	--accent: #FFF9CF;
	--accent-hover: #FFF08C;
	--text-dark: #1e293b;
	--text-light: #64748b;
	--text-lighter: #94a3b8;
	--bg-light: #f8fafc;
	--bg-white: #ffffff;
	--bg-dark: #0f172a;
	--shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
	--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
	--shadow-hover: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
	--radius: 0.5rem;
	--radius-lg: 1rem;
	--radius-full: 9999px;
	--transition: all 0.3s ease;
	--transition-slow: all 0.5s cubic-bezier(0.19, 1, 0.22, 1);
}

/* Base Styles */
.header-content {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.logo {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--primary);
	display: flex;
	align-items: center;
	gap: 0.5rem;
	transition: var(--transition);
}

.logo:hover {
	transform: scale(1.05);
}

.logo svg {
	width: 24px;
	height: 24px;
}

/* Home Page Carousel */
.home-carousel {
	position: relative;
	height: 500px;
	overflow: hidden;
	margin-bottom: 2rem;
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
	margin-top: 8px;
}

.carousel-container {
	display: flex;
	height: 100%;
	transition: transform 0.5s ease-in-out;
}

.carousel-slide {
	flex: 0 0 100%;
	position: relative;
}

.carousel-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.carousel-content {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 3rem 4rem 2rem;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
	color: white;
	z-index: 2;
}

.carousel-title {
	font-size: 2.5rem;
	font-weight: 800;
	margin-bottom: 0.75rem;
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.carousel-description {
	font-size: 1.1rem;
	max-width: 600px;
	margin-bottom: 1.5rem;
	opacity: 0.9;
}

.carousel-controls {
	position: absolute;
	bottom: 1.5rem;
	right: 1.5rem;
	display: flex;
	gap: 0.5rem;
	z-index: 10;
}

.carousel-dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.5);
	cursor: pointer;
	transition: var(--transition);
}

.carousel-dot.active {
	background-color: white;
	transform: scale(1.2);
}

.carousel-arrows {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	display: flex;
	justify-content: space-between;
	transform: translateY(-50%);
	z-index: 10;
}

.carousel-arrow {
	width: 3rem;
	height: 3rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(255, 255, 255, 0.2);
	border-radius: 50%;
	cursor: pointer;
	transition: var(--transition);
	backdrop-filter: blur(4px);
}

.carousel-arrow:hover {
	background-color: rgba(255, 255, 255, 0.4);
	transform: scale(1.1);
}

.carousel-arrow svg {
	width: 1.5rem;
	height: 1.5rem;
	color: white;
	filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3));
}

/* Filters Section */
.filters {
	background-color: var(--bg-white);
	padding: 1.5rem;
	border-radius: var(--radius-lg);
	margin: 1.5rem 0;
	box-shadow: var(--shadow);
	transition: var(--transition);
	border: 1px solid rgba(0, 0, 0, 0.05);
}

.filters:hover {
	box-shadow: var(--shadow-lg);
}

.filter-row {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem;
	margin-bottom: 1.5rem;
}

.filter-group {
	flex: 1;
	min-width: 200px;
}

.filter-group label {
	display: block;
	margin-bottom: 0.5rem;
	font-weight: 600;
	color: var(--text-dark);
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.filter-group select,
.filter-group input,
.enquiry-form input,
.enquiry-form select,
.enquiry-form textarea {
	width: 100%;
	padding: 0.75rem 1rem;
	border: 1px solid #e2e8f0;
	border-radius: var(--radius);
	font-family: inherit;
	transition: var(--transition);
	background-color: var(--bg-light);
	font-size: 0.95rem;
}

.filter-group select:focus,
.filter-group input:focus,
.enquiry-form input:focus,
.enquiry-form select:focus,
.enquiry-form textarea:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.filter-actions {
	display: flex;
	justify-content: flex-end;
	gap: 1rem;
}

button {
	padding: 0.75rem 1.5rem;
	border: none;
	border-radius: var(--radius);
	cursor: pointer;
	font-weight: 600;
	transition: var(--transition);
	font-size: 0.9rem;
	letter-spacing: 0.03em;
}

/* Overriding the Onboarding Button */

.onboarding__page-avatar-edit {
	position: absolute;
	bottom: 5%;
	right: 2%;
	width: 32px;
	height: 32px;
	background: white;
	border-radius: 25%;
	border: none;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	padding: 5px;
}

.onboarding__page-avatar-edit svg {
	width: 32px;
	height: 32px;
}

/* End of Overriding the Onboarding Button */

.btn-outline {
	background-color: transparent;
	border: 1px solid var(--text-lighter);
	color: var(--text-dark);
}

.btn-outline:hover {
	background-color: #f1f5f9;
	transform: translateY(-2px);
}

.btn-submit {
	background-color: var(--primary);
	color: white;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	width: 100%;
}

.btn-submit:hover {
	background-color: var(--primary-dark);
	transform: translateY(-2px);
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.15);
}

/* Trip Cards Grid */
.trips-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 2.5rem;
	margin: 2.5rem 0;
}

.trip-card {
	background-color: var(--bg-white);
	border-radius: var(--radius-lg);
	overflow: hidden;
	box-shadow: var(--shadow);
	transition: var(--transition-slow);
	cursor: pointer;
	position: relative;
	display: flex;
	flex-direction: column;
	height: 100%;
	border: 1px solid rgba(0, 0, 0, 0.05);
}

.trip-card:hover {
	transform: translateY(-8px);
	box-shadow: var(--shadow-hover);
}

.trip-image {
	height: fit-content;
	overflow: hidden;
	position: relative;
}

.trip-image img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: transform 0.7s ease;
}

.trip-card:hover .trip-image img {
	transform: scale(1.08);
}

.trip-category {
	position: absolute;
	top: 1rem;
	left: 1rem;
	background-color: var(--primary);
	color: white;
	padding: 0.35rem 1rem;
	border-radius: var(--radius-full);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	transition: var(--transition);
}

.trip-card:hover .trip-category {
	background-color: var(--primary-dark);
	transform: translateY(-2px);
}

.trip-content {
	padding: 1rem;
	display: flex;
	flex-direction: column;
	flex-grow: 1;
}

.trip-title {
	font-size: 1.25rem;
	font-weight: 700;
	margin-bottom: 0.75rem;
	color: var(--text-dark);
	line-height: 1.4;
	transition: var(--transition);
}

.trip-card:hover .trip-title {
	color: var(--primary);
}

.trip-location {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--text-light);
	margin-bottom: 1rem;
	font-size: 0.875rem;
}

.trip-location svg {
	width: 16px;
	height: 16px;
	color: var(--secondary);
}

.trip-card p {
	color: var(--text-light);
	font-size: 0.9rem;
	line-height: 1.6;
	margin-bottom: 1.5rem;
	flex-grow: 1;
}

.trip-details {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: auto;
	padding-top: 1rem;
	border-top: 1px solid #e2e8f0;
}

.trip-price {
	font-weight: 700;
	color: var(--primary);
	font-size: 1.1rem;
}

.trip-price span {
	font-size: 0.8rem;
	font-weight: 400;
	color: var(--text-light);
	display: block;
}

.trip-action {
	background: linear-gradient(180deg, var(--accent) 0%, var(--accent) 100%, var(--accent-hover) 100%);
	color: #1e1e2d;
	padding: 0.5rem 1.25rem;
	border-radius: var(--radius);
	font-weight: 600;
	font-size: 0.875rem;
	transition: var(--transition);
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.trip-card:hover .trip-action {
	background: linear-gradient(180deg, var(--accent-hover) 0%, var(--accent) 100%);
	transform: translateY(-2px);
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Modal Styles */
.modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	overflow: hidden;
	backdrop-filter: blur(5px);
	transition: opacity 0.3s ease;
	opacity: 0;
}

.modal.show {
	opacity: 1;
}

.modal-content {
	background-color: var(--bg-white);
	margin: 2rem auto;
	width: 90%;
	max-width: 900px;
	border-radius: var(--radius-lg);
	overflow: hidden;
	position: relative;
	box-shadow: var(--shadow-lg);
	transform: translateY(30px);
	transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
	display: flex;
	flex-direction: column;
	max-height: calc(100vh - 4rem);
}

.modal.show .modal-content {
	transform: translateY(0);
}

/* Fixed header section with gallery */
.modal-fixed-header {
	position: sticky;
	top: 0;
	z-index: 20;
	background-color: var(--bg-white);
}

/* Close button */
.modal-close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	background-color: rgba(255, 255, 255, 0.9);
	border-radius: 50%;
	width: 2.5rem;
	height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 30;
	transition: var(--transition);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.modal-close:hover {
	background-color: white;
	transform: rotate(90deg);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

/* Header Carousel - Fixed, not scrollable */
.modal-header {
	position: relative;
	height: 350px;
	overflow: hidden;
}

.modal-header-carousel {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.modal-carousel-container {
	display: flex;
	height: 100%;
	transition: transform 0.5s ease-in-out;
}

.modal-carousel-slide {
	flex: 0 0 100%;
	height: 100%;
	position: relative;
}

.modal-carousel-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.modal-carousel-controls {
	position: absolute;
	bottom: 1.5rem;
	right: 1.5rem;
	display: flex;
	gap: 0.5rem;
	z-index: 10;
}

.modal-carousel-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background-color: rgba(255, 255, 255, 0.5);
	cursor: pointer;
	transition: var(--transition);
}

.modal-carousel-dot.active {
	background-color: white;
	transform: scale(1.2);
}

.modal-carousel-arrows {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	display: flex;
	justify-content: space-between;
	padding: 0 1rem;
	transform: translateY(-50%);
	z-index: 10;
}

.modal-carousel-arrow {
	width: 2.5rem;
	height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba(255, 255, 255, 0.2);
	border-radius: 50%;
	cursor: pointer;
	transition: var(--transition);
	backdrop-filter: blur(4px);
}

.modal-carousel-arrow:hover {
	background-color: rgba(255, 255, 255, 0.4);
	transform: scale(1.1);
}

.modal-carousel-arrow svg {
	width: 1.25rem;
	height: 1.25rem;
	color: white;
	filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3));
}

.modal-header-content {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 3rem 2rem 2rem;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.85), transparent);
	color: white;
	z-index: 2;
	transform: translateY(20px);
	opacity: 0;
	transition: transform 0.6s ease 0.2s, opacity 0.6s ease 0.2s;
}

.modal.show .modal-header-content {
	transform: translateY(0);
	opacity: 1;
}

.modal-title {
	font-size: 2.25rem;
	font-weight: 800;
	margin-bottom: 0.75rem;
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.modal-location {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	font-size: 1.1rem;
	opacity: 0.9;
}

.modal-location svg {
	width: 20px;
	height: 20px;
	filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.3));
}

/* Gallery Styles - Also fixed with header */
.modal-gallery {
	padding: .5rem;
	background-color: #f8fafc;
	border-bottom: 1px solid #e2e8f0;
	transform: translateY(20px);
	opacity: 0;
	transition: transform 0.6s ease 0.3s, opacity 0.6s ease 0.3s;
}

.modal.show .modal-gallery {
	transform: translateY(0);
	opacity: 1;
}

.gallery-container {
	display: flex;
	gap: 0.75rem;
	overflow-x: auto;
	padding-bottom: 0.75rem;
	scrollbar-width: thin;
	scrollbar-color: #cbd5e1 #f1f5f9;
}

.gallery-container::-webkit-scrollbar {
	height: 6px;
}

.gallery-container::-webkit-scrollbar-track {
	background: #f1f5f9;
	border-radius: 10px;
}

.gallery-container::-webkit-scrollbar-thumb {
	background-color: #cbd5e1;
	border-radius: 10px;
}

.gallery-image {
	flex: 0 0 auto;
	width: 120px;
	height: 80px;
	border-radius: var(--radius);
	cursor: pointer;
	transition: all 0.3s ease;
	border: 2px solid transparent;
	object-fit: cover;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.gallery-image:hover {
	transform: translateY(-3px) scale(1.05);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.gallery-image.active {
	border-color: var(--primary);
	box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.3);
}

/* Scrollable content */
.modal-scrollable-content {
	overflow-y: auto;
	max-height: calc(100vh - 4rem - 350px - 120px);
	/* Viewport height minus margins, header height, and gallery height */
}

/* Modal Body */
.modal-body {
	padding: 2.5rem;
	transform: translateY(20px);
	opacity: 0;
	transition: transform 0.6s ease 0.4s, opacity 0.6s ease 0.4s;
}

.modal.show .modal-body {
	transform: translateY(0);
	opacity: 1;
}

.modal-section {
	margin-bottom: 2.5rem;
	animation: fadeIn 0.5s ease forwards;
	opacity: 0;
}

.modal-section:nth-child(1) {
	animation-delay: 0.5s;
}

.modal-section:nth-child(2) {
	animation-delay: 0.6s;
}

.modal-section:nth-child(3) {
	animation-delay: 0.7s;
}

.modal-section:nth-child(4) {
	animation-delay: 0.8s;
}

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

.modal-section-title {
	font-size: 1.35rem;
	font-weight: 700;
	margin-bottom: 1.25rem;
	color: var(--text-dark);
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding-bottom: 0.5rem;
	border-bottom: 2px solid #f1f5f9;
}

.modal-section-title svg {
	width: 22px;
	height: 22px;
	color: var(--primary);
}

.trip-description {
	color: var(--text-light);
	margin-bottom: 1.5rem;
	line-height: 1.8;
	font-size: 1rem;
}

.trip-highlights {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 1rem;
	margin-bottom: 1.5rem;
}

.highlight-item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 1rem;
	background-color: #f1f5f9;
	border-radius: var(--radius);
	transition: var(--transition);
}

.highlight-item:hover {
	background-color: #e2e8f0;
	transform: translateY(-2px);
}

.highlight-item svg {
	width: 18px;
	height: 18px;
	color: var(--primary);
}

/* Itinerary Styles - Collapsible */
.itinerary-list {
	border-left: 3px solid #e2e8f0;
	padding-left: 2rem;
	margin-left: 0.75rem;
}

.itinerary-day {
	position: relative;
	margin-bottom: 1.5rem;
	transition: var(--transition);
}

.itinerary-day::before {
	content: '';
	position: absolute;
	left: -2.25rem;
	top: 0.5rem;
	width: 1.25rem;
	height: 1.25rem;
	background-color: var(--primary);
	border-radius: 50%;
	transition: var(--transition);
	box-shadow: 0 0 0 5px rgba(37, 99, 235, 0.1);
}

.day-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
	padding: 0.5rem 0;
	transition: var(--transition);
}

.day-header:hover {
	color: var(--primary);
}

.day-title {
	font-weight: 700;
	color: var(--text-dark);
	font-size: 1.1rem;
	transition: var(--transition);
}

.day-toggle {
	width: 24px;
	height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.3s ease;
}

.day-toggle svg {
	width: 18px;
	height: 18px;
	color: var(--text-light);
}

.day-content {
	color: var(--text-light);
	line-height: 1.7;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.5s ease, padding 0.5s ease;
}

.itinerary-day.active .day-content {
	max-height: 1000px;
	padding-top: 0.75rem;
}

.itinerary-day.active .day-toggle {
	transform: rotate(180deg);
}

.day-content ul {
	padding-left: 1.5rem;
}

.day-content li {
	margin-bottom: 0.5rem;
}

/* Day Images */
.day-image-container {
	margin-top: 1.25rem;
	border-radius: var(--radius);
	overflow: hidden;
	max-height: 200px;
	box-shadow: var(--shadow);
	transition: var(--transition);
}

.day-image-container:hover {
	box-shadow: var(--shadow-lg);
	transform: scale(1.02);
}

.day-image {
	width: 100%;
	height: auto;
	object-fit: cover;
	border-radius: var(--radius);
	transition: transform 0.5s ease;
}

.day-image-container:hover .day-image {
	transform: scale(1.05);
}

/* Modal Footer */
.modal-footer {
	padding: 1rem 2rem;
	background-color: #f8fafc;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-top: 1px solid #e2e8f0;
	transform: translateY(20px);
	opacity: 0;
	transition: transform 0.6s ease 0.5s, opacity 0.6s ease 0.5s;
	position: sticky;
	/* bottom: 40px; */
	z-index: 10;
}

.modal.show .modal-footer {
	transform: translateY(0);
	opacity: 1;
}

.modal-price {
	font-size: 1.2rem;
	font-weight: 800;
	color: var(--primary);
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.modal-price span {
	font-size: 1rem;
	font-weight: 400;
	color: var(--text-light);
	display: block;
}

.modal-actions {
	display: flex;
	gap: 1rem;
}

/* WhatsApp Button */
.btn-whatsapp,
#modal-enquiry-btn {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.75rem 1.5rem;
	background-color: #25D366;
	color: white;
	border: none;
	border-radius: var(--radius);
	font-weight: 600;
	cursor: pointer;
	transition: var(--transition);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	justify-content: center;
}

#modal-enquiry-btn {
	background-color: var(--primary);
}

.btn-whatsapp:hover {
	background-color: #128C7E;
	transform: translateY(-3px);
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15);
}

.btn-whatsapp svg {
	transition: transform 0.3s ease;
}

.btn-whatsapp:hover svg {
	transform: scale(1.2);
}

/* Enquiry Form */
.enquiry-form-container {
	background-color: var(--bg-white);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow-lg);
	margin: 3rem 0;
	overflow: hidden;
	transition: var(--transition);
	border: 1px solid rgba(0, 0, 0, 0.05);
}

.enquiry-form-container:hover {
	box-shadow: var(--shadow-hover);
	transform: translateY(-5px);
}

.enquiry-form-header {
	background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
	color: white;
	padding: 1rem;
	position: relative;
	overflow: hidden;
}

.enquiry-form-header h2 {
	font-size: 1.75rem;
	font-weight: 700;
	margin-bottom: 0.5rem;
	position: relative;
	z-index: 1;
}

.enquiry-form-header p {
	font-size: 1rem;
	opacity: 0.9;
	max-width: 600px;
	position: relative;
	z-index: 1;
}

.enquiry-form-header::before {
	content: '';
	position: absolute;
	top: -50px;
	right: -50px;
	width: 200px;
	height: 200px;
	background-color: rgba(255, 255, 255, 0.1);
	border-radius: 50%;
}

.enquiry-form-header::after {
	content: '';
	position: absolute;
	bottom: -80px;
	left: -80px;
	width: 300px;
	height: 300px;
	background-color: rgba(255, 255, 255, 0.05);
	border-radius: 50%;
}

.enquiry-form {
	padding: 1rem;
}

.form-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: .5rem;
}

.form-group.full-width {
	grid-column: span 2;
}

.form-group label {
	display: block;
	margin-bottom: 0.2rem;
	font-weight: 600;
	color: var(--text-dark);
	font-size: 0.8rem;
}

.form-group input,
.form-group select,
.form-group textarea {
	width: 100%;
	border: 1px solid #e2e8f0;
	border-radius: var(--radius);
	font-family: inherit;
	transition: var(--transition);
	padding: 0.6rem .9rem;
}

.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
	outline: none;
	border-color: var(--primary);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.form-group textarea {
	resize: vertical;
	min-height: 100px;
}

.form-submit {
	grid-column: span 2;
	margin-top: 1rem;
}

.form-error {
	color: #ef4444;
	font-size: 0.875rem;
	margin-top: 0.5rem;
	display: none;
}

/* Success Message */
.success-message {
	display: none;
	background-color: #10b981;
	color: white;
	padding: 1rem;
	border-radius: var(--radius);
	margin-bottom: 1rem;
	animation: slideDown 0.5s ease forwards;
}

@keyframes slideDown {
	from {
		opacity: 0;
		transform: translateY(-20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Popup Enquiry Form */
.enquiry-popup {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	z-index: 2000;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
	backdrop-filter: blur(5px);
}

.enquiry-popup.show {
	opacity: 1;
	visibility: visible;
}

.enquiry-popup-content {
	background-color: var(--bg-white);
	width: 90%;
	max-width: 600px;
	border-radius: var(--radius-lg);
	overflow: hidden;
	box-shadow: var(--shadow-lg);
	transform: translateY(30px);
	transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
	max-height: 95%;
}

.enquiry-popup.show .enquiry-popup-content {
	transform: translateY(0);
}

.enquiry-popup-close {
	position: absolute;
	top: 1rem;
	right: 1rem;
	background-color: rgba(255, 255, 255, 0.9);
	border-radius: 50%;
	width: 2.5rem;
	height: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 10;
	transition: var(--transition);
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.enquiry-popup-close:hover {
	background-color: white;
	transform: rotate(90deg);
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

/* Floating Action Buttons */
.floating-buttons {
	position: fixed;
	bottom: 2rem;
	right: 2rem;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	z-index: 99;
}

.floating-button {
	width: 3.5rem;
	height: 3.5rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: var(--shadow-lg);
	cursor: pointer;
	transition: var(--transition);
	position: relative;
}

.floating-button:hover {
	transform: translateY(-5px) scale(1.05);
	box-shadow: var(--shadow-hover);
}

.floating-button svg {
	width: 1.5rem;
	height: 1.5rem;
}

.floating-button::before {
	content: attr(data-tooltip);
	position: absolute;
	right: calc(100% + 10px);
	top: 50%;
	transform: translateY(-50%);
	background-color: var(--bg-dark);
	color: white;
	padding: 0.5rem 1rem;
	border-radius: var(--radius);
	font-size: 0.875rem;
	white-space: nowrap;
	opacity: 0;
	visibility: hidden;
	transition: var(--transition);
}

.floating-button:hover::before {
	opacity: 1;
	visibility: visible;
}

.btn-enquiry {
	background-color: var(--primary);
	color: white;
}

.btn-whatsapp-float {
	background-color: #25D366;
	color: white;
}

/* Pagination */
.pagination {
	display: flex;
	justify-content: center;
	gap: 0.75rem;
	margin: 3rem 0;
	flex-wrap: wrap;
	padding: .5rem;
}

.pagination button {
	width: 2.75rem;
	height: 2.75rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: var(--radius);
	background-color: var(--bg-white);
	color: var(--text-dark);
	font-weight: 600;
	box-shadow: var(--shadow);
	transition: var(--transition);
}

.pagination button:hover:not(:disabled) {
	transform: translateY(-3px);
	box-shadow: var(--shadow-lg);
	background-color: #f1f5f9;
}

.pagination button.active {
	background-color: var(--primary);
	color: white;
}

.pagination button.active:hover {
	background-color: var(--primary-dark);
}

.pagination button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Loading and No Results */
.no-results {
	text-align: center;
	padding: 4rem 2rem;
	color: var(--text-light);
	background-color: var(--bg-white);
	border-radius: var(--radius-lg);
	box-shadow: var(--shadow);
	margin: 2rem 0;
}

.no-results h3 {
	font-size: 1.5rem;
	margin-bottom: 1rem;
	color: var(--text-dark);
}

.loading {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 250px;
}

.loading-spinner {
	width: 50px;
	height: 50px;
	border: 4px solid rgba(37, 99, 235, 0.1);
	border-left-color: var(--primary);
	border-radius: 50%;
	animation: spin 1s linear infinite;
}

@keyframes spin {
	to {
		transform: rotate(360deg);
	}
}

/* Animations */
@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(20px);
	}

	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes pulse {
	0% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.05);
	}

	100% {
		transform: scale(1);
	}
}

/* Responsive Styles */
@media (max-width: 992px) {
	.trips-grid {
		grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
		gap: 2rem;
	}

	.modal-title {
		font-size: 1.75rem;
	}

	.form-grid {
		grid-template-columns: 1fr;
	}

	.form-group.full-width {
		grid-column: span 1;
	}

	.form-submit {
		grid-column: span 1;
	}

	.home-carousel {
		height: 400px;
	}

	.carousel-title {
		font-size: 2rem;
	}

	.floating-buttons {
		bottom: 1.5rem;
		right: 1.5rem;
	}

	.modal-scrollable-content {
		max-height: calc(100vh - 4rem - 300px - 100px);
	}
}

@media (max-width: 768px) {
	.trips-grid {
		grid-template-columns: 1fr;
		gap: 1.5rem;
	}

	.filter-row {
		flex-direction: column;
		gap: 1rem;
	}

	.modal-content {
		width: 95%;
		margin: 1rem auto;
	}

	.modal-header {
		height: 200px;
	}

	.modal-scrollable-content {
		max-height: calc(100vh - 2rem - 250px - 80px);
	}

	.modal-body {
		padding: 1.5rem;
	}

	.modal-title {
		font-size: 1.5rem;
	}

	.modal-footer {
		flex-direction: column;
		gap: .5rem;
		align-items: stretch;
	}

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

	.modal-actions {
		flex-direction: column;
	}

	.trip-highlights {
		grid-template-columns: 1fr;
	}

	.gallery-image {
		width: 100px;
		height: 70px;
	}

	.enquiry-form-header h2 {
		font-size: 1.5rem;
	}

	.home-carousel {
		height: 300px;
	}

	.carousel-title {
		font-size: 1.75rem;
	}

	.carousel-description {
		font-size: 0.95rem;
	}

	.floating-button::before {
		display: none;
	}
}

@media (max-width: 480px) {
	.modal-header {
		height: 200px;
	}

	.modal-scrollable-content {
		max-height: calc(100vh - 2rem - 200px - 70px);
	}

	.modal-title {
		font-size: 1.25rem;
	}

	.modal-location {
		font-size: 0.9rem;
	}

	.modal-section-title {
		font-size: 1.1rem;
	}

	.pagination {
		gap: 0.5rem;
	}

	.pagination button {
		width: 2.25rem;
		height: 2.25rem;
	}

	.home-carousel {
		height: 250px;
	}

	.carousel-title {
		font-size: 1.5rem;
	}

	.carousel-description {
		font-size: 0.9rem;
		margin-bottom: 1rem;
	}

	.carousel-arrow {
		width: 2.5rem;
		height: 2.5rem;
	}

	.floating-buttons {
		bottom: 4rem;
		right: 1rem;
	}

	.floating-button {
		width: 3rem;
		height: 3rem;
	}
}

/* ===== CRITICAL FIX FOR DESKTOP SCROLLING ===== */
/* Completely revise the modal structure for better content visibility */

/* First, ensure the modal takes proper space */
.modal {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	overflow: hidden;
	backdrop-filter: blur(5px);
	transition: opacity 0.3s ease;
	opacity: 0;
}

/* Adjust modal content to use more viewport space */
.modal-content {
	background-color: var(--bg-white);
	margin: 1rem auto;
	width: 95%;
	max-width: 1200px;
	border-radius: var(--radius-lg);
	overflow: hidden;
	position: relative;
	box-shadow: var(--shadow-lg);
	transform: translateY(30px);
	transition: transform 0.5s cubic-bezier(0.19, 1, 0.22, 1);
	display: flex;
	flex-direction: column;
	max-height: 95vh;
	/* Use almost full viewport height */
}

/* Make header more compact on desktop */
.modal-header {
	position: relative;
	height: 200px;
	/* Reduced from 350px */
}

/* Make gallery more compact */
.modal-gallery {
	padding: 0.25rem;
	max-height: 80px;
	/* Reduced height */
}

/* CRITICAL FIX: Completely revise scrollable content area */
.modal-scrollable-content {
	overflow-y: auto;
	flex: 1;
	/* Let it take available space */
	min-height: 300px;
	/* Ensure minimum height */
	max-height: unset;
	/* Remove restrictive max-height */
}

/* Ensure modal body takes proper space */
.modal-body {
	padding: 1.5rem;
}

/* Make container properly scrollable */
.container,
.experiences__container-new {
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 .5rem;
	position: relative;
	overflow-y: auto !important;
	overflow-x: hidden;
	height: auto !important;
	max-height: none !important;
	max-height: 96vh;
}

.container .enquiry-form-container {
	display: none;
}

/* Desktop-specific improvements */
@media (min-width: 992px) {


	.modal-scrollable-content {
		min-height: 400px;
	}

	/* Reduce fixed elements heights */
	.modal-fixed-header {
		max-height: 350px;
	}

	.modal-header {
		height: 200px;
	}

	.modal-gallery {
		max-height: 70px;
	}

	/* Ensure footer doesn't take too much space */
	.modal-footer {
		padding: 1rem 2rem;
		bottom: 10px;
	}
}

/* Large desktop improvements */
@media (min-width: 1200px) {
	.modal-content {
		/* max-height: 85vh; */
		/* margin: 3rem auto; */
		width: 60%;
	}

	.modal-scrollable-content {
		min-height: 450px;
	}
}

/* Fix for any parent elements that might be constraining height */
html,
body {
	height: 100%;
	overflow: auto;
}

/* Ensure the modal shows properly when active */
.modal.show .modal-content {
	transform: translateY(0);
}

/* Fix for gallery images to take less space */
.gallery-image {
	width: 100px;
	height: 60px;
}




/* Fix for the Image Upload Module */

.media-upload__container {
	background-color: #fafafa;
	/* max-width: 55%; */
	margin: 0 auto;
	width: 100%;
	color: #262626;
	padding: 20px;
	display: none;
}

.media-upload__title {
	font-size: 28px;
	font-weight: 600;
	margin-bottom: 20px;
	text-align: center;
	background: linear-gradient(45deg, #1e1e2d 0%, #1e1e2d 30%, #fde723 70%, #1e1e2d 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	display: inline-block;
}

.media-upload__header {
	text-align: center;
	margin-bottom: 30px;
	width: 100%;
}

.media-upload__subtitle {
	font-size: 16px;
	color: #8e8e8e;
	max-width: 600px;
	margin: 0 auto 20px;
}

/* Uploader styles */
.uploader {
	background-color: white;
	border-radius: 12px;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
	padding: 30px;
	margin-bottom: 8px;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	width: 100%;
}

.uploader:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
}

.uploader__area {
	border: 2px solid #dbdbdb;
	border-radius: 12px;
	padding: 40px 20px;
	text-align: center;
	cursor: pointer;
	transition: all 0.3s ease;
	background-color: #fafafa;
}

.uploader__area:hover {
	border-color: #fde723;
	background-color: rgba(253, 231, 35, 0.05);
}

.uploader__area--dragging {
	border-color: #fde723;
	background-color: rgba(253, 231, 35, 0.1);
	transform: scale(1.02);
}

.uploader__icon {
	width: 80px;
	height: 80px;
	background: linear-gradient(45deg, #fff 0%, #fff 30%, #fde723 70%, #fef49d 100%);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 24px;
	box-shadow: 0 4px 12px rgba(30, 30, 45, 0.15);
}

.uploader__icon svg {
	width: 40px;
	height: 40px;
}

.uploader__text {
	margin-bottom: 24px;
}

.uploader__heading {
	font-size: 22px;
	font-weight: 600;
	margin-bottom: 8px;
}

.uploader__description {
	font-size: 16px;
	color: #8e8e8e;
}

.btn--outline {
	background-color: transparent;
	color: #1e1e2d;
	border: 1px solid #1e1e2d;
}

.btn--outline:hover {
	background-color: rgba(30, 30, 45, 0.1);
}

.btn--icon {
	padding: 8px;
}

.btn--icon svg {
	margin-right: 0;
}

.btn--gradient {
	background: linear-gradient(45deg, #fff 0%, #fff 30%, #fde723 70%, #fef49d 100%);
	box-shadow: 0 4px 12px rgba(30, 30, 45, 0.2);
	color: #1e1e2d;
}

.btn--gradient:hover {
	opacity: 0.9;
}

.media-upload__hidden {
	display: none !important;
}

/* Editor styles */
.editor__header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	width: 100%;
}

.editor__title {
	font-size: 22px;
	font-weight: 600;
	color: #262626;
}

.editor__container {
	display: flex;
	gap: 30px;
	flex-wrap: wrap;
	width: 100%;
}

.editor__main {
	flex: 1;
	min-width: 300px;
	width: 100%;
}

.editor__sidebar {
	width: 300px;
}

.preview {
	position: relative;
	width: 100%;
	margin-bottom: 20px;
	border-radius: 12px;
	overflow: hidden;
	background-color: #f5f5f5;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.preview__image {
	width: 100%;
	max-height: 350px;
	object-fit: contain;
	display: block;
}

.preview__canvas {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: auto;
	z-index: 10;
	touch-action: none;
}

.text-overlay {
	position: absolute;
	cursor: move;
	user-select: none;
	padding: 5px;
	border: 2px solid transparent;
	z-index: 20;
	touch-action: none;
}

.text-overlay--active {
	border: 2px dashed #0095f6;
}

.text-overlay__content {
	padding: 5px;
	background-color: rgba(255, 255, 255, 0.7);
	border-radius: 4px;
}

.emoji-overlay {
	position: absolute;
	cursor: move;
	user-select: none;
	padding: 5px;
	border: 2px solid transparent;
	z-index: 20;
	touch-action: none;
}

.emoji-overlay--active {
	border: 2px dashed #0095f6;
}

.emoji-overlay__content {
	font-size: 30px;
}

.preview__crop-btn {
	position: absolute;
	top: 10px;
	right: 10px;
	background-color: rgba(255, 255, 255, 0.9);
	border: none;
	border-radius: 8px;
	padding: 8px 12px;
	font-size: 14px;
	cursor: pointer;
	display: flex;
	align-items: center;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	transition: all 0.2s ease;
	z-index: 30;
	-webkit-tap-highlight-color: transparent;
}

.preview__crop-btn:hover {
	background-color: white;
	transform: translateY(-2px);
}

.preview__crop-btn:active {
	transform: translateY(0);
}

/* Thumbnails */
.thumbnails {
	display: flex;
	gap: 10px;
	margin-top: 20px;
	overflow-x: auto;
	padding-bottom: 10px;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
	scrollbar-color: #dbdbdb transparent;
}

.thumbnails::-webkit-scrollbar {
	height: 6px;
}

.thumbnails::-webkit-scrollbar-track {
	background: transparent;
}

.thumbnails::-webkit-scrollbar-thumb {
	background-color: #dbdbdb;
	border-radius: 6px;
}

.thumbnail {
	width: 80px;
	height: 80px;
	min-width: 80px;
	border-radius: 8px;
	overflow: hidden;
	cursor: pointer;
	border: 3px solid transparent;
	transition: all 0.2s ease;
	position: relative;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
	-webkit-tap-highlight-color: transparent;
}

.thumbnail--active {
	border-color: #fde723;
}

.thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.thumbnail__remove {
	position: absolute;
	top: -8px;
	right: -8px;
	background-color: #ff3b30;
	color: white;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 12px;
	cursor: pointer;
	opacity: 0;
	transition: opacity 0.2s ease;
	z-index: 2;
}

.thumbnail:hover .thumbnail__remove {
	opacity: 1;
}

/* Make remove button always visible on touch devices */
@media (pointer: coarse) {
	.thumbnail .thumbnail__remove {
		opacity: 1;
		width: 24px;
		height: 24px;
		font-size: 14px;
	}
}

/* Editor tools */
.editor__tools {
	background-color: white;
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 20px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	width: 100%;
}

.editor__tools-header {
	display: flex;
	border-bottom: 1px solid #dbdbdb;
	margin-bottom: 20px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.editor__tools-header::-webkit-scrollbar {
	display: none;
}

.editor__tab {
	padding: 10px 15px;
	font-size: 14px;
	font-weight: 500;
	color: #8e8e8e;
	cursor: pointer;
	border-bottom: 2px solid transparent;
	transition: all 0.2s ease;
	white-space: nowrap;
	-webkit-tap-highlight-color: transparent;
}

.editor__tab--active {
	color: #fde723;
	border-bottom-color: #fde723;
}

.editor__tool-content {
	display: none;
}

.editor__tool-content--active {
	display: block;
}

.editor__tool-title {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 15px;
	color: #262626;
}

/* Drawing tools */
.color-picker {
	display: flex;
	gap: 8px;
	margin-bottom: 15px;
	flex-wrap: wrap;
}

.color-picker__option {
	width: 24px;
	height: 24px;
	border-radius: 50%;
	cursor: pointer;
	border: 2px solid #dbdbdb;
	transition: transform 0.2s ease;
	-webkit-tap-highlight-color: transparent;
}

.color-picker__option:hover {
	transform: scale(1.1);
}

.color-picker__option--active {
	border-color: #1e1e2d;
	transform: scale(1.1);
}

.brush-size {
	margin-bottom: 15px;
}

.brush-size__label {
	display: block;
	font-size: 14px;
	margin-bottom: 8px;
	color: #8e8e8e;
}

/* Text tools */
.text-input {
	width: 100%;
	padding: 10px;
	border: 1px solid #dbdbdb;
	border-radius: 8px;
	margin-bottom: 15px;
	font-size: 14px;
}

.text-options {
	display: flex;
	gap: 8px;
	margin-bottom: 15px;
	flex-wrap: wrap;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	padding-bottom: 5px;
}

.text-options__font {
	padding: 6px 10px;
	border-radius: 4px;
	cursor: pointer;
	background-color: #f5f5f5;
	font-size: 14px;
	transition: background-color 0.2s ease;
	white-space: nowrap;
	-webkit-tap-highlight-color: transparent;
}

.text-options__font:hover,
.text-options__font--active {
	background-color: #e0e0e0;
}

/* Emoji picker */
.emoji-picker {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 10px;
	margin-bottom: 15px;
}

.emoji-picker__option {
	font-size: 20px;
	cursor: pointer;
	text-align: center;
	padding: 5px;
	border-radius: 4px;
	transition: all 0.2s ease;
	-webkit-tap-highlight-color: transparent;
}

.emoji-picker__option:hover {
	background-color: #f5f5f5;
	transform: scale(1.2);
}

/* Filters */
.filters {
	margin-bottom: 20px;
}

.filters__title {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 15px;
	color: #262626;
}

.filters__scroll {
	overflow-x: auto;
	white-space: nowrap;
	padding-bottom: 8px;
	scrollbar-width: thin;
	scrollbar-color: #dbdbdb transparent;
	-webkit-overflow-scrolling: touch;
}

.filters__scroll::-webkit-scrollbar {
	height: 6px;
}

.filters__scroll::-webkit-scrollbar-track {
	background: transparent;
}

.filters__scroll::-webkit-scrollbar-thumb {
	background-color: #dbdbdb;
	border-radius: 6px;
}

.filters__list {
	display: inline-flex;
	gap: 16px;
	padding: 4px;
}

.filter {
	display: flex;
	flex-direction: column;
	align-items: center;
	cursor: pointer;
	opacity: 0.7;
	transition: opacity 0.2s ease;
	-webkit-tap-highlight-color: transparent;
}

.filter:hover,
.filter--active {
	opacity: 1;
}

.filter__preview {
	width: 64px;
	height: 64px;
	border-radius: 4px;
	overflow: hidden;
	margin-bottom: 8px;
}

.filter__preview-inner {
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, #8a3ab9 0%, #e95950 100%);
	opacity: 0.5;
}

.filter__name {
	font-size: 12px;
	font-weight: 500;
}

/* Caption */
.caption {
	background-color: white;
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 20px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	width: 100%;
}

.caption__label {
	display: block;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 10px;
	color: #262626;
}

.caption__textarea {
	width: 100%;
	border: 1px solid #dbdbdb;
	border-radius: 8px;
	padding: 12px;
	font-size: 14px;
	resize: vertical;
	min-height: 100px;
}

.caption__textarea:focus {
	outline: none;
	border-color: #fde723;
}

/* Upload progress */
.progress {
	margin-bottom: 20px;
	width: 100%;
}

.progress__bar {
	height: 4px;
	background-color: #efefef;
	border-radius: 2px;
	overflow: hidden;
}

.progress__fill {
	height: 100%;
	background-color: #fde723;
	width: 0%;
	transition: width 0.1s ease;
}

.progress__text {
	text-align: right;
	font-size: 12px;
	color: #8e8e8e;
	margin-top: 4px;
}

.actions {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	width: 100%;
}

/* Cropper styles */
.cropper {
	position: relative;
	width: 100%;
	height: 500px;
	background-color: #f5f5f5;
	border-radius: 12px;
	overflow: hidden;
	margin-bottom: 20px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	touch-action: none;
}

.cropper__image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.cropper__overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	touch-action: none;
}

.cropper__window {
	position: absolute;
	border: 2px solid white;
	cursor: move;
	touch-action: none;
}

.cropper__handle {
	position: absolute;
	width: 20px;
	height: 20px;
	background-color: white;
	border-radius: 50%;
	touch-action: none;
}

.cropper__handle--nw {
	top: -10px;
	left: -10px;
	cursor: nw-resize;
}

.cropper__handle--ne {
	top: -10px;
	right: -10px;
	cursor: ne-resize;
}

.cropper__handle--sw {
	bottom: -10px;
	left: -10px;
	cursor: sw-resize;
}

.cropper__handle--se {
	bottom: -10px;
	right: -10px;
	cursor: se-resize;
}

.cropper__tools {
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
	width: 100%;
}

/* Instagram-like filters */
.filter--clarendon {
	filter: contrast(1.2) saturate(1.35);
}

.filter--gingham {
	filter: brightness(1.05) hue-rotate(-10deg) sepia(0.2);
}

.filter--moon {
	filter: grayscale(1) brightness(1.1) contrast(1.1);
}

.filter--lark {
	filter: brightness(1.1) contrast(0.9) saturate(1.1) sepia(0.1);
}

.filter--reyes {
	filter: sepia(0.4) brightness(1.1) contrast(0.9) saturate(0.9);
}

.filter--juno {
	filter: saturate(1.4) contrast(1.1) brightness(1.1);
}

.filter--slumber {
	filter: brightness(1.05) saturate(0.8) sepia(0.2);
}

.filter--crema {
	filter: brightness(1.1) contrast(0.95) saturate(0.9) sepia(0.2);
}

.filter--ludwig {
	filter: contrast(1.1) brightness(1.1) saturate(1.2) sepia(0.2);
}

/* Features section */
.features {
	margin-top: 40px;
	margin-bottom: 40px;
	width: 100%;
}

.features--animate {
	animation: slideUp 0.5s ease forwards;
}

.features__title {
	font-size: 24px;
	font-weight: 600;
	margin-bottom: 30px;
	text-align: center;
	color: #262626;
}

.features__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 20px;
}

.feature-card {
	background-color: white;
	border-radius: 12px;
	padding: 24px;
	text-align: center;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.feature-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.feature-card__icon {
	width: 60px;
	height: 60px;
	background: linear-gradient(45deg, #1e1e2d 0%, #1e1e2d 30%, #fde723 70%, #fef49d 100%);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 16px;
}

.feature-card__icon svg {
	width: 30px;
	height: 30px;
	color: white;
}

.feature-card__title {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 12px;
	color: #262626;
}

.feature-card__description {
	font-size: 14px;
	color: #8e8e8e;
	line-height: 1.5;
}

/* Animations */
@keyframes fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes slideUp {
	from {
		transform: translateY(20px);
		opacity: 0;
	}

	to {
		transform: translateY(0);
		opacity: 1;
	}
}

.animate-fade {
	animation: fadeIn 0.5s ease forwards;
}

.animate-slide {
	animation: slideUp 0.5s ease forwards;
}

/* Responsive styles */
@media (max-width: 768px) {

	.editor__container {
		flex-direction: column;
		gap: 20px;
	}

	.editor__sidebar {
		width: 100%;
	}

	.features__grid {
		grid-template-columns: 1fr;
	}

	.uploader__heading {
		font-size: 18px;
	}

	.uploader__description {
		font-size: 14px;
	}

	.uploader__icon {
		width: 60px;
		height: 60px;
	}

	.uploader__icon svg {
		width: 30px;
		height: 30px;
	}

	.btn {
		padding: 10px 20px;
		font-size: 14px;
	}

	.editor__title {
		font-size: 18px;
	}

	.editor__tab {
		padding: 8px 12px;
		font-size: 13px;
	}

	.emoji-picker {
		grid-template-columns: repeat(5, 1fr);
	}

	.cropper__handle {
		width: 24px;
		height: 24px;
	}

	.cropper {
		height: 350px;
	}
}

@media (max-width: 480px) {

	.media-upload__title {
		font-size: 22px;
	}

	.media-upload__subtitle {
		font-size: 14px;
	}

	.uploader {
		padding: 20px;
	}

	.uploader__area {
		padding: 30px 15px;
	}

	.emoji-picker {
		grid-template-columns: repeat(4, 1fr);
		gap: 8px;
	}

	.filter__preview {
		width: 50px;
		height: 50px;
	}

	.cropper {
		height: 300px;
	}

	.actions {
		flex-direction: column;
	}

	.actions .btn {
		width: 100%;
	}
}


/* New Feed with Videos */
.app-container {
	max-width: 600px;
	margin: 0 auto;
	padding-top: 60px;
	padding-bottom: 60px;
}

.header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 60px;
	background-color: white;
	border-bottom: 1px solid #dbdbdb;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10;
}

.header h1 {
	font-size: 24px;
	font-weight: 600;
}

.feed-item {
	background-color: white;
	border: 1px solid #dbdbdb;
	border-radius: 3px;
	margin-bottom: 20px;
}

.feed-header {
	display: flex;
	align-items: center;
	padding: 14px 16px;
}

.avatar {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	margin-right: 10px;
	background-color: #efefef;
	overflow: hidden;
}

.avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.username {
	font-weight: 600;
	font-size: 14px;
}

.video-container {
	position: relative;
	width: 100%;
	background-color: black;
	aspect-ratio: 1/1;
	overflow: hidden;
}

.video-player {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.video-controls {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(transparent, rgba(0, 0, 0, 0.5));
	padding: 10px;
	display: flex;
	align-items: center;
	opacity: 0;
	transition: opacity 0.3s;
}

.video-container:hover .video-controls {
	opacity: 1;
}

.play-pause-btn {
	background: none;
	border: none;
	color: white;
	font-size: 24px;
	cursor: pointer;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.progress-container {
	flex: 1;
	height: 4px;
	background-color: rgba(255, 255, 255, 0.3);
	border-radius: 2px;
	margin: 0 10px;
	position: relative;
	cursor: pointer;
}

.progress-bar {
	height: 100%;
	background-color: white;
	border-radius: 2px;
	width: 0%;
}

.buffer-bar {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background-color: rgba(255, 255, 255, 0.5);
	border-radius: 2px;
	width: 0%;
}

.volume-btn {
	background: none;
	border: none;
	color: white;
	font-size: 20px;
	cursor: pointer;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.feed-actions {
	padding: 8px 16px;
	display: flex;
	align-items: center;
}

.action-btn {
	background: none;
	border: none;
	font-size: 24px;
	margin-right: 16px;
	cursor: pointer;
}

.feed-caption {
	padding: 0 16px 16px;
	font-size: 14px;
	line-height: 1.4;
}

.caption-username {
	font-weight: 600;
}

.loading-indicator {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 40px;
	height: 40px;
	border: 3px solid rgba(255, 255, 255, 0.3);
	border-radius: 50%;
	border-top-color: white;
	animation: spin 1s linear infinite;
	display: none;
}

@keyframes spin {
	to {
		transform: translate(-50%, -50%) rotate(360deg);
	}
}

.play-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 60px;
	height: 60px;
	background-color: rgba(0, 0, 0, 0.5);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 30px;
	opacity: 0;
	transition: opacity 0.3s;
}

.video-container.paused .play-icon {
	opacity: 1;
}

.footer {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	height: 50px;
	background-color: white;
	border-top: 1px solid #dbdbdb;
	display: flex;
	align-items: center;
	justify-content: space-around;
	z-index: 10;
}

.footer-btn {
	background: none;
	border: none;
	font-size: 24px;
	cursor: pointer;
}

@media (max-width: 600px) {
	.app-container {
		padding-top: 50px;
		padding-bottom: 50px;
	}

	.header {
		height: 50px;
	}

	.header h1 {
		font-size: 20px;
	}
}

/* Popup */
/* Popup Container */
.popup {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1000;
}

/* Popup Content Container */
.popup__content {
	position: relative;
	max-width: 90%;
	max-height: 90vh;
	display: flex;
	justify-content: center;
	align-items: center;
}

/* Popup Image */
.popup__image {
	max-width: 100%;
	max-height: 90vh;
	object-fit: contain;
	border-radius: 8px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
	display: block;
	/* Ensure image is displayed as block */
}

/* Close Button */
.cross-button {
	position: absolute;
	/* absolute, not fixed */
	top: 10px;
	right: 10px;
	background: rgba(255, 255, 255, 0.9);
	border: none;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	font-size: 35px;
	line-height: 1;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #333;
	transition: all 0.2s ease;
	z-index: 1001;
}

.cross-button:hover {
	background: rgba(255, 255, 255, 1);
	transform: scale(1.1);
}

/* Animation */
.popup {
	animation: fadeIn 0.3s ease;
}

.popup__content {
	animation: scaleIn 0.3s ease;
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes scaleIn {
	from {
		transform: scale(0.95);
		opacity: 0;
	}

	to {
		transform: scale(1);
		opacity: 1;
	}
}

/* Responsive Adjustments */
@media screen and (max-width: 768px) {
	.popup__content {
		max-width: 95%;
	}

	.cross-button {
		top: 10px;
		right: 10px;
		font-size: 24px;
	}
}

/* Instagram-style grid for find posts */
.profile__find-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2px;
	margin: 0 -16px;
	width: calc(100% + 32px);
}

.profile__find-grid-item {
	position: relative;
	aspect-ratio: 1;
	overflow: hidden;
	cursor: pointer;
	transition: transform 0.2s ease;
}

.profile__find-grid-item:hover {
	transform: scale(1.02);
}

.profile__find-image-container {
	position: relative;
	width: 100%;
	height: 100%;
}

.profile__find-image {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.profile__find-overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(transparent 0%,
			rgba(0, 0, 0, 0.4) 50%,
			rgba(0, 0, 0, 0.8) 100%);
	padding: 20px 12px 12px;
	color: #fff;
	transition: transform 0.3s ease;
}

.profile__find-grid-item:hover .profile__find-overlay {
	transform: translateY(0);
}

.profile__find-location {
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 4px;
	text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}

.profile__find-type {
	font-size: 11px;
	font-weight: 500;
	color: #f6ee33;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
	display: none;
}

/* Alternative overlay that's always visible */
.profile__find-overlay-always {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	background: linear-gradient(transparent 0%,
			rgba(0, 0, 0, 0.3) 30%,
			rgba(0, 0, 0, 0.7) 100%);
	padding: 12px;
	color: #fff;
}

/* If you prefer always visible text, replace .profile__find-overlay with .profile__find-overlay-always */

/* Mobile responsive */
@media (max-width: 768px) {
	.profile__find-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 1px;
	}

	.profile__find-location {
		font-size: 12px;
	}

	.profile__find-type {
		font-size: 9px;
	}

	.profile__find-overlay {
		padding: 15px 8px 8px;
	}
}

@media (max-width: 480px) {
	.profile__find-grid {
		margin: 0 -12px;
		width: calc(100% + 24px);
	}

	.profile__find-location {
		font-size: 11px;
	}

	.profile__find-type {
		font-size: 8px;
	}

	.profile__find-overlay {
		padding: 12px 6px 6px;
	}
}

/* Loading state */
.profile__find-grid-item.loading {
	background: #2a2a3a;
	animation: pulse 1.5s ease-in-out infinite;
}

@keyframes pulse {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 0.7;
	}

	100% {
		opacity: 1;
	}
}

/* Optional: Add click feedback */
.profile__find-grid-item:active {
	transform: scale(0.98);
}

/* Markup Popup */
#markup-popup {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 9999;
	display: flex;
	justify-content: center;
	align-items: center;
}

.popup-box input {
	width: 100%;
	padding: 8px;
	margin-bottom: 10px;
}

.popup-close {
	position: absolute;
	top: 10px;
	right: 15px;
	background: none;
	border: none;
	font-size: 24px;
	cursor: pointer;
	color: #999;
}

.popup-close:hover {
	color: #333;
}

.popup-box {
	background: #fff;
	padding: 20px;
	border-radius: 10px;
	width: 300px;
	text-align: center;
	position: relative;
	/* Add this */
}

/* Remove old card styles - these are no longer needed */
.profile__find-card {
	display: none;
}

/* Optional: Add click feedback */
.profile__find-grid-item:active {
	transform: scale(0.98);
}

/*----- Coupon PopUp for Premium --------*/
.coupon-premium-popup-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.35);
	z-index: 10000;
	display: flex;
	align-items: center;
	justify-content: center;
}

.coupon-premium-popup-box {
	background: #fff;
	border-radius: 24px;
	box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
	padding: 0;
	max-width: 420px;
	width: 95vw;
	position: relative;
	overflow: hidden;
}

.coupon-premium-popup-close {
	position: absolute;
	top: 18px;
	right: 24px;
	background: none;
	border: none;
	font-size: 2rem;
	color: #888;
	cursor: pointer;
	z-index: 2;
	transition: color 0.2s;
}

.coupon-premium-popup-close:hover {
	color: #222;
}

.coupon-premium-coupon-card {
	font-family: 'Inter', 'Open Sans', Arial, sans-serif;
}

.coupon-premium-ticket {
	background: linear-gradient(90deg, #fffbe6 0%, #ffe066 100%);
	border-radius: 24px 24px 0 0;
	display: flex;
	align-items: stretch;
	min-height: 180px;
	position: relative;
	overflow: hidden;
}



.coupon-premium-ticket-left {
	display: flex;
	align-items: center;
	background: none;
	padding: 0 0 0 18px;
	min-width: 60px;
	justify-content: center;
}

.coupon-premium-discount {
	writing-mode: vertical-rl;
	transform: rotate(180deg);
	font-weight: 700;
	font-size: 2rem;
	letter-spacing: 2px;
	color: #222;
	background: none;
	text-align: center;
	margin: 0;
	padding: 0;
}

.coupon-premium-ticket-main {
	flex: 1;
	padding: 24px 24px 16px 24px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.coupon-premium-title-row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 12px;
}

.coupon-premium-title {
	font-weight: 700;
	font-size: 1.1rem;
	margin-bottom: 2px;
	letter-spacing: 0.5px;
}

.coupon-premium-save {
	font-size: 1rem;
	font-weight: 500;
	color: #222;
	margin-bottom: 4px;
}

.coupon-premium-apply {
	background: none;
	color: #1bbf4c;
	font-weight: 700;
	border: none;
	font-size: 1rem;
	cursor: pointer;
	margin-top: 2px;
	transition: color 0.2s;
}

.coupon-premium-apply:hover {
	color: #0e8c36;
}

.coupon-premium-dotted {
	border-bottom: 1.5px dashed #bdb76b;
	margin: 10px 0 8px 0;
}

.coupon-premium-desc {
	font-size: 0.98rem;
	color: #444;
	margin-bottom: 6px;
}

.coupon-premium-more {
	font-weight: 600;
	color: #222;
	font-size: 1rem;
	margin-top: 2px;
}

.coupon-premium-terms {
	background: #fff;
	border-radius: 0 0 24px 24px;
	padding: 18px 24px 18px 24px;
}

.coupon-premium-terms-title {
	font-weight: 700;
	font-size: 1.08rem;
	margin-bottom: 8px;
	color: #222;
}

.coupon-premium-terms ul {
	margin: 0;
	padding-left: 18px;
	font-size: 0.98rem;
	color: #222;
}

.coupon-premium-terms li {
	margin-bottom: 6px;
	line-height: 1.5;
}

@media (max-width: 600px) {
	.coupon-premium-popup-box {
		max-width: 99vw;
		border-radius: 14px;
	}

	.coupon-premium-ticket {
		border-radius: 14px 14px 0 0;
		min-height: 120px;
	}

	.coupon-premium-ticket-main {
		padding: 14px 10px 10px 10px;
	}

	.coupon-premium-terms {
		border-radius: 0 0 14px 14px;
		padding: 12px 10px 12px 10px;
	}

	.coupon-premium-discount {
		font-size: 1.2rem;
	}
}

/* Go Ads Free */
.go__ads-free {
    display: flex;
    align-items: center;
    justify-content: space-around;
	background: aqua;
    border-radius: 8px;
	cursor: pointer;
}

/*------------------ Chat Send Message - Feed ------------------*/

.feed__send-bottom {
	position: absolute;
	bottom: 60px;
	width: 100%;
	height: 85px;
	display: flex;
	padding: 0 16px;
	align-items: center;
	flex-wrap: wrap;
	background: #1e1e2e;
	border-top: 1px solid #15151d;
}
body.lightMode .feed__send-bottom {
	background-color: #fdfdfd;
	border-color: #bbb;
}

.feed__send-share__options {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row;
	align-content: center;
	width: 100%;
}

.feed__send-profiles,
.feed__send-search-box,
.feed__send-groups-tab {
	height: calc(94vh - 265px);
	overflow-y: scroll;
	padding: 0 16px 40px;
	margin: 25px 0 0;
}

.feed__send-groups-tab {
	height: calc(94vh - 185px);
}


.feed__send-profile-left {
	flex: 3;
	display: flex;
	justify-content: flex-start;
	flex-direction: row;
	align-items: center;
	gap: 0 15px;
}

.feed__send-profile-right {
	flex: 1;
	display: flex;
	justify-content: flex-end;
}

.feed__send-profile-left__image {
	width: 45px;
	height: 45px;
	border-radius: 50%;
	position: relative;
	min-width: 45px;
}

.feed__send-profile-left__image img {
	width: inherit;
	height: inherit;
	object-fit: cover;
	border-radius: inherit;
	position: absolute;
}

body.lightMode .feed__send-profile-left__name {
	color: #111;
}

span.feed__send-selector {
	width: 25px;
	height: 25px;
	border: 3px solid #bbb;
	border-radius: 50%;
}

.feed__send-share__option {
	display: flex;
	flex-direction: column;
	flex: 1;
	align-items: center;
	cursor: pointer;
}

.feed__send-share__option span {
	font-size: 10px;
	color: #bbb;
	font-weight: 500;
}
body.lightMode .feed__send-share__option span {
	color: #111;
}

.feed__send-share__option svg path {
	fill: #bbb;
}

.feed__send-share__option-icon {
	border-radius: 50%;
	background: #fde723;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 5px;
}
body.lightMode .feed__send-share__option-icon {
	background-color: #000;
}

.feed__send-share__option-icon svg {
	width: 18px;
	height: 18px;
}

.feed__send-share__option-icon svg path {
	fill: #111;
}
body.lightMode .feed__send-share__option-icon svg path {
	fill: #fff;
}

.feed__send-search {
	padding: 0 16px;
	position: relative;
}

.feed__send-search input {
	width: 100%;
	height: 40px;
	padding: 0 40px 0 20px;
	font-family: inherit;
	color: #111;
	/* background: #15151d; */
	border: 0;
	border-radius: 10px;
	outline: 0;
}
body.lightMode .feed__send-search input {
	background-color: #f5f5f5;
}

.feed__send-search span {
	position: absolute;
	right: 21px;
	width: 30px;
	height: 30px;
	top: 5px;
	background: #fde723;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.feed__send-search span svg {
	width: 15px;
	height: 15px;
}

.feed__send-search span.close {
	cursor: pointer;
}

.feed__send-profile.active span.feed__send-selector {
	border-color: #fde723;
	position: relative;
}

.feed__send-profile.active span.feed__send-epicenter {
	position: absolute;
	width: 13px;
	height: 13px;
	background: #fde723;
	border-radius: 50%;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
}

.feed__send-btn {
	display: none;
	position: absolute;
	width: 100%;
	background: #1e1e2d;
	height: 100%;
	left: 0;
	top: 0;
	padding: 0 16px;
}
body.lightMode .feed__send-btn {
	background-color: #fdfdfd;
}

.feed__send-btn button {
	width: 100%;
	height: 45px;
	border: 0;
	border-radius: 10px;
	background: #fde723;
	color: #111;
	font-size: 18px;
	/* text-transform: uppercase; */
	font-weight: 600;
	margin: 20px 0;
	cursor: pointer;
}
body.lightMode .feed__send-btn button {
	background: #056b6b;
	color: #fff;
}

.feed__send-tabs ul {
	padding: 0 16px;
	margin: 0 0 15px;
	display: flex;
	width: 100%;
	justify-content: space-between;
	align-items: center;
}

.feed__send-tabs ul li {
	flex: 1;
	text-align: center;
	list-style: none;
	height: 40px;
	color: #fff;
	cursor: pointer;
    padding: 5px;
    font-weight: 600;
}

body.lightMode .feed__send-tabs ul li {
    color: #111;
}

.feed__send-tabs ul li.active {
	position: relative;
}

.feed__send-tabs ul li.active:before {
	content: "";
	width: 100%;
	height: 3px;
	position: absolute;
	bottom: 0;
	background: #fde723;
	left: 0;
}