/*
  Theme Name: Agota - Minimal Ecommerce HTML5 Template
  Author: Theme_Pure
  Support: https://help.themepure.net/support/
  Description: Agota - Minimal Ecommerce HTML5 Template
  Version: 1.0.1
*/

/* CSS Index
-----------------------------------
1. Theme default css
2. header
3. slider
4. feature
5. product area
6. product offer area
7. blog area
8. instagram area
9. modal box
10. store product area
11. welcome area
12. service feature area
13. big img product area
14. cart page area
15. Shop-page-area
16. blog sidebar none area
17. blog box landing area
18. blog gird page area
19. blog page area
20. about us area
21. about page  area
22. no page area
23. contact page
24. login area
25. footer area
26. extra info css
*/


/* 1. Theme default css
-------------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;500&display=swap');

@font-face {
	font-family: 'Plus Jakarta Sans', 'Cairo', 'Urbanist', sans-serif;
	src: url("../fonts/FuturaStd-Book/35e5d1a7aa6da471de4cfb4a47ebaca8.eot");
	/* IE9*/
	src: url("../fonts/FuturaStd-Book/35e5d1a7aa6da471de4cfb4a47ebaca8.eot?#iefix") format("embedded-opentype"),
		/* IE6-IE8 */
		url("../fonts/FuturaStd-Book/35e5d1a7aa6da471de4cfb4a47ebaca8.woff2") format("woff2"),
		/* chrome、firefox */
		url("../fonts/FuturaStd-Book/35e5d1a7aa6da471de4cfb4a47ebaca8.woff") format("woff"),
		/* chrome、firefox */
		url("../fonts/FuturaStd-Book/35e5d1a7aa6da471de4cfb4a47ebaca8.ttf") format("truetype"),
		/* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
		url("../fonts/FuturaStd-Book/35e5d1a7aa6da471de4cfb4a47ebaca8.svg#FuturaStd-Book") format("svg");
	/* iOS 4.1- */
}

body {
	/* font-family: "Outfit"; */
	font-family: 'Plus Jakarta Sans', 'Cairo', 'Urbanist', sans-serif;
	font-weight: 400;
}

/* Apply single font to whole site */




h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
	color: inherit;
}

h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover {
	color: #006699
}

h1 {
	font-size: 150px;
	font-weight: 400;
	line-height: 150px;
	color: #ffffff;
}

h2 {
	font-size: 40px;
	line-height: 40px;
}

h3 {
	font-size: 36px;
}

h4 {
	font-size: 22px;
}

h5 {
	font-size: 16px;
}

p {
	font-size: 16px;
	font-weight: 400;
	line-height: 28px;
	color: #222222;
}

span,
input,
img {
	transition: all .3s ease-out;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
}

.table td,
.table th {
	border-top: 1px solid #dee2e6;
}

ul {
	margin: 0px;
	padding: 0px;
}

li {
	list-style: none
}

img {
	max-width: 100%;
	transition: all 0.3s ease-out 0s;
}

a:not([href]):not([class]),
a:not([href]):not([class]):hover {
	text-decoration: none;
}

a {
	text-decoration: none;
}

.fix {
	overflow: hidden;
}

a:focus,
.button:focus {
	text-decoration: none;
	outline: none;
}

a:focus,
a:hover {
	color: inherit;
	text-decoration: none;
}



.container-wrapper {
	/* max-width: 1430px; */
	margin: 0 auto;
}

.container-wrapper-home4 {
	max-width: 1480px;
	margin: 0 auto;
}

.extra-padding-40 {
	padding-left: 40px;
	padding-right: 40px;
}

.slider-wrapper {
	max-width: 1820px;
	margin: 0 auto
}

.home-page-4-bg {
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: top center;
	background-color: #f5f5f5;
}

a,
button,
li {
	transition: .3s;
	-webkit-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	-ms-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
}

.over-hidden {
	overflow: hidden;
}

.clear-both {
	clear: both;
}

.over-scroll {
	overflow: scroll;
}

.over-x-hidden {
	overflow-x: hidden;
}

.over-x-scroll {
	overflow-y: scroll;
}

.transition-3 {
	transition: .3s;
}

.mlr-15 {
	margin-left: -15px;
	margin-right: -15px;
}

a:focus,
button:focus,
.btn:focus {
	text-decoration: none;
	outline: 0;
	box-shadow: none;
}

a:focus,
a:hover,
.portfolio-cat a:hover,
.footer-menu li a:hover {
	color: #222222;
	text-decoration: none;
	outline: 0 none;
}

*::-moz-selection {
	background: #fc8459;
	color: #fff;
	text-shadow: none;
}

::-moz-selection {
	background: #444;
	color: #fff;
	text-shadow: none;
}

::selection {
	background: #444;
	color: #fff;
	text-shadow: none;
}

*::-moz-placeholder {
	color: #858585;
	font-size: 14px;
	opacity: .6;
}

*::placeholder {
	color: #858585;
	font-size: 14px;
	opacity: .6;
}

.transition {
	transition: .3s;
}

.btn:focus {
	outline: 0 none;
}

.icon-clear {
	color: #999;
}

/* ===== Global Button Style ===== */
.btn {
	display: inline-block;
	padding: 16px 50px;
	color: #fff;
	font-weight: 600;
	font-size: 18px;
	letter-spacing: 1.2px;
	border-radius: 10px;
	background: linear-gradient(135deg, rgba(255, 176, 0, 0.25), rgba(233, 66, 128, 0.25), rgba(81, 45, 168, 0.25));
	border: 1px solid rgba(255, 255, 255, 0.4);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	transition: all 0.3s ease;
	box-shadow: 0 4px 25px rgba(0, 0, 0, 0.4);
	position: relative;
	overflow: hidden;
	cursor: pointer;
	background-size: 300% 300%;
	animation: btnGradientFlow 6s ease infinite;
}

/* ===== Hover Effects ===== */
.btn:hover {
	background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
	border-color: rgba(255, 255, 255, 0.7);
	color: #fff;
	box-shadow:
		0 0 20px rgba(255, 176, 0, 0.6),
		0 0 30px rgba(233, 66, 128, 0.5),
		0 0 40px rgba(81, 45, 168, 0.4);
	transform: translateY(-3px);
}

/* ===== Gradient Shine Animation ===== */
.btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.5), transparent);
	transition: all 0.6s ease;
}

.btn:hover::before {
	left: 125%;
}

/* ===== Smooth Gradient Animation ===== */
@keyframes btnGradientFlow {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}

/* ===== Media Queries ===== */
@media (max-width: 1200px) {
	.btn {
		font-size: 17px;
		padding: 14px 45px;
	}
}

.single-blog .btn,
.footer-widget .btn {
	padding: 16px 52px;
}

.subscriber-area .btn {
	background: transparent;
	color: #fff;
}

.footer-widget .btn:hover {
	background: #fff;
	color: #000000;
}

.btn.btn3 {
	color: #fff;
	background: #222;
	line-height: 55px;
	padding: 15px 75px;
}

.subscribe-form .btn,
.blog-subscribe .btn {
	padding: 20px 90px;
	background: #000;
	color: #fff;
}

.contact-form-right .btn {
	background: #222;
}

.contact-form-right .btn:hover {
	background: #000;
}

.border-right {
	border-right: 1px solid #dee2e6 !important;
}

article,
aside,
dialog,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
	/* display: block; */

}

.breadcrumb {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	padding: .75rem 1rem;
	margin-bottom: 1rem;
	list-style: none;
	background-color: #e9ecef;
	border-radius: .25rem;
}

.breadcrumb-item a,
.breadcrumb-item,
.breadcrumb-item.active {
	color: #fff !important;
}

.breadcrumb-item+.breadcrumb-item::before {
	color: #fff !important;
}

/* slider dots */
.slick-dots {
	position: absolute;
	right: 55px;
	top: 50%;
	transform: translateY(-50%);
}


.slider-area .single-page {
	height: 420px;
	/* desktop height */
	min-height: 500px;
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	position: relative;
}

.slider-area .page-title h2 {
	font-size: 32px;
	font-weight: 700;
	margin-bottom: 10px;
}

.slider-area .breadcrumb .breadcrumb-item a {
	color: #ffc107;
	/* change as per theme */
}

.slider-area .breadcrumb .breadcrumb-item.active {
	color: #fff;
}

/* Mobile Responsive */
@media (max-width: 768px) {
	.slider-area .single-page {
		height: 140px;
	}

	.slider-area .page-title h2 {
		font-size: 24px;
	}
}

@media (max-width: 576px) {
	.slider-area .single-page {
		height: 120px;
	}

	.slider-area .page-title h2 {
		font-size: 20px;
	}
}


















.slider-2 .slick-dots,
.slider-3 .slick-dots,
.slider-6 .slick-dots,
.slider-4 .slick-dots,
.testimonial-active .slick-dots {
	right: auto;
	top: auto;
	left: 50%;
	bottom: 20px;
	transform: translateX(-50%);
}

.slick-dots li {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: #ffffff;
	box-shadow: 0 0 1 #ffffff;
	opacity: 0.3;
	display: block;
	text-indent: -10000px;
	margin: 10px 2px;
	border: 2px solid transparent;
}

.slider-2 .slick-dots li,
.slider-3 .slick-dots li,
.slider-6 .slick-dots li,
.slider-4 .slick-dots li,
.testimonial-active .slick-dots li {
	display: inline-block;
	margin: 0 10px;
}

.slider-6 .slick-dots li {
	background: #000;
	box-shadow: 0 0 1 #000000;
}

.slick-dots li.slick-active {
	position: relative;
	background: transparent;
	opacity: 1;
}

.slick-dots li.slick-active::before {
	position: absolute;
	content: "";
	width: 16px;
	height: 16px;
	top: -5px;
	left: -5px;
	border: 2px solid #fff;
	border-radius: 50%;
	background: transparent;
}

.slider-6 .slick-dots li.slick-active::before {
	border: 2px solid #000000;
}

/* .slider-2 .slick-dots li.slick-active::before,
.slider-3 .slick-dots li.slick-active::before,
.slider-6 .slick-dots li.slick-active::before {
	top: -5px;
} */

.slick-arrow .l-a,
.slick-arrow .r-a,
.blog-post-active .slick-arrow .l-a,
.blog-post-active .slick-arrow .r-a {
	position: absolute;
	left: 10px;
	top: 36%;
	transform: translateY(-50%);
	border: 0;
	background: none;
	color: #fff;
	z-index: 1;
	font-size: 28px;
	visibility: hidden;
	transition: .7s;
}

.slick-arrow .r-a {
	right: 10px;
	left: auto;
}

.blog-post-active .slick-arrow .l-a,
.blog-post-active .slick-arrow .r-a {
	top: 35%;
	left: 10px;
	background: #000;
	padding: 8px 15px;
}

.blog-post-active .slick-arrow .r-a {
	right: 10px;
	left: auto;
}

.blog-slider-active:hover .slick-arrow .r-a,
.blog-slider-active:hover .slick-arrow .l-a,
.blog-post-active:hover .slick-arrow .l-a,
.blog-post-active:hover .slick-arrow .r-a {
	visibility: visible;
}

/* tooltip css*/
.tooltip-inner {
	background-color: #fff;
	color: #222;
	border: 1px solid #222;
	font-size: 12px;
	border-radius: 100%;
	padding: 1px 10px;
}

.tooltip .arrow {
	display: none;
}

/* common section title & content */
.section-title p {
	font-size: 14px;
}

.store-product-position .section-title p,
.subscribe-area .section-title p {
	font-size: 16px;
	color: #666666;
}

.section-title-2 h2 {
	font-weight: 400;
	color: #ffffff;
}

.underline::before {
	position: absolute;
	content: "";
	width: 35px;
	height: 2px;
	background: #000;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}

.section-content span,
.section-content p {
	font-size: 20px;
	line-height: 26px;
	text-transform: capitalize;
}

.section-content a.btn2 {
	font-size: 16px;
}

.section-content a.btn2::before {
	position: absolute;
	width: 24px;
	height: 2px;
	background: #fff;
	content: "";
	bottom: 0;
	left: 0;
	transition: .3s;
}

.section-content a:hover::before {
	width: 100%;
}

.section-content-position {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

/* page css */
.page-title h2 {
	font-size: 50px;
}

.page-height {
	min-height: 590px;
}

/* common css end */

/* 2. header
--------------------------------------------------- */
.header {
	left: 0;
	top: 0;
	width: 100%;
	z-index: 22;
	transition: .3s;
	position: fixed;
}

/* .body-overlay {
	background-color: rgba(0, 0, 0, 0.5);
	height: 100%;
	width: 100%;
	position: fixed;
	top: 0;
	z-index: 999;
	left: 0;
	opacity: 0;
	visibility: hidden;
	transition: all .3s ease-out;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
} */

.body-overlay.opened {
	opacity: 1;
	visibility: visible;
}

.sticky-menu {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 22;
	width: 100%;
}

.sticky-menu .header-6 {
	top: -20px;
}

.sticky-menu .header {
	background: #fff;
	-webkit-box-shadow: 0 8px 4px -7px rgba(115, 115, 115, 0.1);
	-moz-box-shadow: 0 8px 4px -7px rgba(115, 115, 115, 0.1);
	box-shadow: 0 8px 4px -7px rgba(115, 115, 115, 0.1);
}

.header-area.sticky-menu,
.header:hover {
	background: #fff;
}

.logo img {
	max-width: 100px;
	/* Keeps the original logo colors */
}

/* Remove all color-changing effects */
.sticky-menu .header .logo img,
.header-area:hover .logo img,
.header-2 .logo img,
.header-6 .logo img {}

.sticky-menu .header a.active::before,
.header-area:hover a.active::before,
.header.header-2 a.active::before,
.header.header-6 a.active::before {
	background: #222;
}

.main-menu ul li {
	display: inline-block;
	margin: 0 22px;
	position: relative;
}

.main-menu ul li>a {
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	display: inline-block;
	text-transform: capitalize;
	padding: 38px 0;
	position: relative;
	text-decoration: none;
}

.main-menu ul li:hover>a {
	color: #222;
}

.main-menu ul li>a::before {
	content: "";
	position: absolute;
	right: 0;
	width: 0;
	bottom: 30px;
	background: #fff;
	height: 2px;
	transition: 0.3s;
}

.main-menu ul li>a.active::before {
	width: 100%;
}

.main-menu ul li>a:hover::before,
.main-menu ul li>a:hover a.active::before {
	background: #222;
	width: 100%;
	left: 0;
}

/* mega menu */
.main-menu ul li .mega-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 750px;
	height: auto;
	background: #fff;
	padding-left: 20px;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
	z-index: 2;
	background-repeat: no-repeat;
	background-position: center top;
	box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.1);
	-ms-transform-origin: 50% 0;
	transform-origin: 50% 0;
	-webkit-transform-origin: 50% 0;
	transition: .5s;
	-webkit-transition: transform 500ms ease, opacity 500ms ease;
	-moz-transition: transform 500ms ease, opacity 500ms ease;
	-ms-transition: transform 500ms ease, opacity 500ms ease;
	-o-transition: transform 500ms ease, opacity 500ms ease;
	transform: scaleY(0);
	-ms-transform: scaleY(0);
	-webkit-transform: scaleY(0);
}

.header-area.white-bg .mega-menu {
	top: 100%;
}

.main-menu ul li:hover>.mega-menu {
	opacity: 1;
	visibility: visible;
	transform: scaleY(1);
}

.main-menu ul li:hover>.mega-menu.mega-sub-menu {
	top: -25px;
}

.main-menu ul li .mega-menu li {
	display: block;
	height: auto;
	margin: 25px 0;
	margin-right: 0;
}

.main-menu ul li .mega-menu a {
	font-size: 14px;
	font-weight: 400;
	color: #222222;
	padding: 0 10px;
	display: block;
}

.main-menu ul li .mega-menu a::before {
	position: static;
}

.main-menu ul li .mega-menu li a:hover {
	color: #069;
	padding-left: 30px;
}

.main-menu ul li .mega-menu li a.mega-title:hover {
	padding-left: 0;
}

.main-menu ul li .mega-menu li>a:hover {
	padding-left: 10px;
}

.main-menu ul li .mega-menu li .mega-menu {
	left: 100%;
	top: 0;
}

.main-menu ul li .mega-menu .mega-title a,
.main-menu ul li .mega-menu a.mega-title {
	font-size: 18px;
}

.main-menu ul li .mega-menu .mega-title a {
	padding-top: 30px;
}

.main-menu ul li .mega-menu.mega-dropdown-menu,
.main-menu ul li .mega-menu .mega-sub-menu {
	min-width: 250px;
}

.mega-dropdown-menu li a span {
	font-size: 13px;
	font-size: 300;
}

.main-menu ul li.full-mega-menu-position {
	position: static;
}

.mean-container.main-menu ul li.full-mega-menu-position {
	position: inherit;
}

.mean-container .mega-menu {
	background-image: none !important;
}

.main-menu ul li .mega-menu.full-mega-menu {
	top: 100%;
	width: 100%;
	display: flex;
}

.mega-menu.full-mega-menu>li {
	min-width: 210px;
	padding-left: 55px;
	padding-top: 35px;
}

.mean-container .mega-menu.full-mega-menu>li {
	padding-left: 0;
	padding-top: 0;
}

.main-menu .mega-menu ul>li {
	margin-left: 0;
}

.main-menu ul li .mega-menu.full-mega-menu a {
	padding: 0;
}

/* header right */
.header-right ul li {
	padding-left: 6px;
}




.header-right ul li a,
a.mobile-menubar {
	color: #fff;
	font-size: 18px;
}

.header a.mobile-menubar {
	font-size: 20px;
}

.s-count {
	font-size: 12px;
	padding-left: 3px;
}

/* header-2 */
.main-menu ul li.logo>a::before {
	display: none;
}

/* .header-2 .main-menu ul li.logo a::before{display: none;} */
.header-2 .main-menu ul li,
.header-3 .main-menu ul li {
	margin-left: 45px;
	margin-right: 0;
}

.header-2 ul li a,
.header-2 .header-right li a {
	color: #222222;
}

.sticky-menu .header a,
.header-area:hover a,
.header.header-2 a,
.header.header-6 a {
	color: #222222;
}

.header-right .header-login a,
.header-2 .header-right .search a {
	font-size: 14px;
}

/* 3. slider
-------------------------------------------------------------- */
.slider-height {
	min-height: 1000px;
}

.slider-2 .slider-active {
	min-height: 820px;
}

.slider-height-2,
.slider-site {
	min-height: 815px;
}

.slider-height-3 {
	min-height: 800px;
}

.slider-height-4 {
	min-height: 660px;
}

.slider-height-5 {
	min-height: 100vh;
}

.slider-5 {
	min-height: 100vh;
}

.slider-height-6 {
	min-height: 765px;
}

.page-height4 {
	min-height: 285px;
}

.single-slider {
	background-size: cover;
	background-position: center right;

}

.slider-content {
	position: absolute;
	left: 15.5%;

}

.slider-2 .slider-content,
.slider-4 .slider-content {
	left: 5.5%;
}

.slider-4 .slider-content {
	left: 8.6%;
}

.slider-3 .slider-content {
	left: 13.5%;
}

.slider-6 .slider-content {
	left: 12.8%;
}

.slider-5 .slider-content {
	left: 7.5%;
	position: relative;
}

.slider-2 h1 {
	font-size: 116px;
}

.slider-4 h1 {
	font-size: 100px;
}

.slider-5 h1 {
	font-size: 88px;
	line-height: 1;
}

.slider-6 h1 {
	font-size: 120px;
	margin-top: 30px;
}

.slider-content span {
	font-size: 16px;
	letter-spacing: 1px;
	line-height: 60px;
	text-transform: capitalize;
}

.slider-content-5 {
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}

.slider-content>span::before,
.history-title span:before {
	position: absolute;
	content: "";
	width: 30px;
	height: 2px;
	background: #fff000;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.history-title span::before {
	background: #000;
	left: -140px;
	width: 100px;
}

.slider-6 .slider-content>span::before {
	background: #000000;
}

.slider-content p {
	line-height: 24px;
	font-weight: 46px !important;
}

.single-banner img {
	min-height: 265px;
}

/* 4. feature
------------------------------------------------------------- */
.feature-position {
	/* top: -115px; */
	margin-bottom: 1.5px;
}

.feature-position .single-feature>img {
	height: 542px;
	transition: .3s;
	width: 100%;
}

.single-feature:hover .img-zoom,
.single-blog .blog-img img:hover,
.single-banner:hover .img-zoom,
.single-store-product .img-zoom:hover,
.portfolio-img .img-zoom:hover {
	transform: scale(1.1);
}

.sale-off-img {
	max-width: 235px;
}

.feature-position .single-feature.single-feature-3>img {
	height: 360px;
}

.feature-position-3 {
	margin-bottom: 0;
}

/* 5. product-area
-------------------------------------------------------------- */

.single-product {
	transition: all .3s ease-out;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
}

.single-product:hover {
	-moz-box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
	-webkit-box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
	box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
}

.single-product-img img {
	width: 100%;
}

.countdown-time .count-time {
	padding: 6px 0 2px;
}

.single-product-button li a span,
.sale-tag {
	width: 50px;
	height: 50px;
	background-color: #222;
	border-radius: 50%;
	line-height: 50px;
	text-align: center;
	margin: 5px;
	display: inline-block;

}

.timer {
	padding: 8px 1px 3px 1px;
}

.timer span {
	font-size: 10px;
	color: #222;
	min-width: 45px;
	display: inline-block;
	text-align: center;
	line-height: 1;
	font-weight: 500;
}

.timer p {
	text-transform: uppercase;
	font-size: 10px;
	margin-bottom: 0;
	line-height: 2.1;
}

.timer .time-count {
	position: relative;
}

.timer .time-count::after {
	content: '';
	position: absolute;
	bottom: -3px;
	left: 12px;
	right: 12px;
	height: 1px;
	background: -moz-linear-gradient(left, #f5f5f5 0%, #ededed 36%, #ededed 56%, #ededed 57%, #f5f5f5 76%, #f5f5f5 100%);
}

.single-product-img .countdown-time {
	bottom: 0;
	left: 50%;
	transform: translate(-50%);
	opacity: 1;
	transition: .3s;
}

.single-product:hover .countdown-time {
	opacity: 0;
}

.single-product-button {
	bottom: 25px;
	left: 55%;
	transform: translate(-50%);
	opacity: 0;
	transition: .5s
}

.single-product:hover .single-product-button {
	left: 50%;
	opacity: 1;
}

.single-product-button li a span {
	color: #ffffff;
}

.single-product-button li a span:hover {
	background: linear-gradient(135deg, #6a0dad, #ff69b4);
}

.product-price span {
	font-weight: 500;
	font-size: 14px;
}

.product-price span.old-price {
	color: #999999;
}

.sale-tag {
	font-size: 13px;
	top: 10px;
	left: 10px;
	background: #f54949;
	z-index: 1;
}

.single-product-hover-img {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.single-product-hover-img a img {
	opacity: 0;
	transition: .3s;
}

.single-product:hover .single-product-hover-img a img {
	opacity: 1;
}

.product-dot span {
	width: 10px;
	height: 10px;
	display: inline-block;
	border-radius: 50%;
}

/* 6. product offer area
-------------------------------------------------------------- */
.product-offer-height .single-feature>img {
	min-height: 450px;
	transition: .3s;
}

/* 7. blog-area
-------------------------------------------------------------- */
.date {
	color: #006699;
}

.single-blog .blog-img {
	height: 290px;
}

/* 8. instagram area
-------------------------------------------------------------- */
.instagram-img img {
	width: 100%;
	opacity: 1;
	transition: .3s;
}

.instagram-img img:hover {
	opacity: .93;
}


/* 9. modal box
-------------------------------------------------------------- */
.product-modal {
	padding-left: 15px;
	padding-right: 15px;
	max-width: 1080px;
	border-radius: 10px;
	transition: all .3s ease-out;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
}


.product-view-scroll-area .dialog-modal-dialog {
	height: auto;
}

.close {
	font-size: 30px;
}

.modal-content {
	border-radius: 10px;
}

.product-tabs {
	width: 100px;
}

.product-tabs .nav-link {
	width: 80px;
	height: 100px;
	padding: 0;
	opacity: .6;
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link,
.nav-pills .nav-link:hover,
.nav-pills .show>.nav-link {
	background-color: transparent;
	opacity: 1;
}

.product-modal-left h4 {
	font-size: 30px
}

.product-modal-left .price>span {
	font-size: 20px;
	font-weight: 500;
}

.modal-old-price {
	color: #999;
	font-size: 16px !important;
}

.product-modal-left p {
	font-size: 14px;
}

.available p,
.suk p {
	line-height: 1;
}

/* quanti-field */
.quantity-field {
	position: relative !important;
}
.add-cart-btn {
    display: inline-flex;            /* use flex for centering */
    align-items: center;             /* vertical center */
    justify-content: center;         /* horizontal center */
    height: 50px;                    /* fixed height */
    min-width: 230px;                /* minimum width */
    padding: 0 20px;                 /* only horizontal padding */
    border-radius: 10px;
    border: none !important;
    background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
    color: #fff;
    font-family: 'Plus Jakarta Sans', sans-serif; /* consistent site font */
    font-weight: 600;
    font-size: 1rem;
    text-align: center;
    cursor: pointer;
    box-shadow: 0 4px 25px rgba(0, 0, 0, 0.3);
    transition: all 0.3s ease;
    background-size: 300% 300%;
    animation: addCartGradientFlow 6s ease infinite;
    position: relative;
    overflow: hidden;
    line-height: 1;                  /* ensures text is vertically centered */
}




/* Hover Glow Effect */
.add-cart-btn:hover {
    transform: translateY(-3px);
    box-shadow:
        0 0 20px rgba(255, 176, 0, 0.6),
        0 0 30px rgba(233, 66, 128, 0.5),
        0 0 40px rgba(81, 45, 168, 0.4);
    color: #fff;
}

/* Shine Effect */
.add-cart-btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.5), transparent);
    transition: all 0.6s ease;
}

.add-cart-btn:hover::before {
    left: 125%;
}

/* Smooth Gradient Animation */
@keyframes addCartGradientFlow {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}


.quantity-field input {
	width: 110px;
	height: 63px;
	padding: 0 20px;
}

.custom-prev,
.custom-next {
	position: absolute;
	right: 32px;
	top: 60%;
	transform: translateY(-50%);
	font-size: 12px;
	color: #c8c8c8;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}

.custom-next {
	top: 40%;
}

/* social-link */
.social-sharing li {
	font-size: 14px;
	display: inline-block;
}

.social-sharing li a {
	font-size: 14px;
	width: 40px;
	height: 40px;
	display: inline-block;
	background: #fff;
	color: #555555;
	border: 1px solid #e1e1e1;
	border-radius: 50%;
	line-height: 40px;
	text-align: center;
	margin-right: 10px;
	transition: .3s;
}

.social-sharing li a:hover {
	background: #004A80;
	color: #fff;
	border: 0;
}

/* 10. store product-area
-------------------------------------------------------------- */
.store-product-title {
	top: 0;
	left: 0;
}

.store-product-title h4 {
	font-size: 21px;
}

.store-product-title span a {
	font-size: 14px;
	color: #888;
}

.single-store-product img {
	max-height: 370px;
}

.author-signature img {
	width: 180px;
}

/* 11. welcome area
-------------------------------------------------------------- */
.welcome-bg {
	height: 970px;
	background-size: cover;
	background-position: center;
	background-attachment: fixed;
}

/* 12. service feature area
-------------------------------------------------------------- */
.single-service-feature h4 {
	font-size: 18px;
}

.single-service-feature p {
	font-size: 14px;
}

.service-feature-bg {
	background-image: linear-gradient(180deg, #16151a 0%, #16151a 100%);
}

.ser-f-icon::before,
.ser-f-icon span::after {
	font-size: 50px;
}

.single-service-feature {
	padding: 0 20px;
}


/* 13. big img product area
-------------------------------------------------------------- */
/* .product-left-img-info .quantity-field input {height: 62px;} */

.product-left-img-info .social-sharing li a {
	margin-right: 10px;
	margin-left: 0;
}

.product-left-img-info .price span {
	font-size: 24px;
	font-weight: 700;
}

.product-view-tab .nav-link {
	color: #999;
	font-size: 20px;
	border-bottom: 2px solid transparent;
}

.product-view-tab .nav-link:hover {
	color: #222222;
}

.product-view-tab .nav-link.active {
	color: #222222;
	border-bottom: 2px solid #222222;
}

.desc-title {
	font-size: 18px;
	font-weight: 600;
}

.describe-text p {
	font-size: 14px;
	color: #555;
	line-height: 30px;
}

.add-color-area h6,
.add-brand-area h6 {
	font-weight: 600;
}

.add-color li {
	font-style: italic;
}

.add-brand-area,
.group-p-table thead {
	background: rgba(0, 0, 0, .025);
}

.group-p-table .table td,
.table th {
	padding: 22px;
}

.group-p-table a {
	font-size: 15px;
}

.rat {
	display: none;
	top: -2px;
	left: 0;
	right: 0;
	bottom: 0;
	transition: .3s;
}

.ratting a {
	color: #ffae00;
	font-size: 14px;
}

.product-review .ratting:hover .rat {
	display: block;
}

.product-left-img-info p,
.quantity {
	font-size: 14px;
}

.product-left-img img {
	cursor: crosshair;
	margin-bottom: 40px;
}

.product-left-img {
	height: 600px;
	overflow-x: hidden;
}

.tbl-title {
	min-width: 150px;
}

.p-view-position .dialog-modal-dialog {
	max-width: 470px;
	-webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, .5);
	-moz-box-shadow: 0 10px 25px rgba(0, 0, 0, .5);
	box-shadow: 0 10px 25px rgba(0, 0, 0, .5);

}

.product-img a {
	cursor: crosshair;
}

.p-view-position .modal-content {
	border-radius: 10px;
	border: 18px solid #f9f9f9;
	background: #fff;
}

.p-view-position .close span {
	border-radius: 10px;
	width: 32px;
	height: 32px;
	font-size: 24px;
	border: 2px solid #fff;
	line-height: 22px;
}

.p-view-position .modal-close {
	top: 0px;
	right: 0;
}

.product-gallery-btn a {
	box-shadow: 0 0 4px rgba(0, 0, 0, .2);
	border-radius: 100px;
	padding: 10px 15px;
}

.product-gallery-btn {
	left: 0;
	top: 0;
}

.product-gallery-btn.right-site {
	left: auto;
	right: 0;
}

.vertical-left-tab .product-gallery-btn {
	left: auto;
	right: 0;
	top: 0;
}

.product-gallery-btn a:hover {
	box-shadow: 0 0 10px rgba(0, 0, 0, .2);
}

/* 14. cart page
-------------------------------------------------------------- */
.cart-img {
	width: 120px;
	margin: 0 auto;
}

.cart-table .table td,
.cart-table .table th {
	padding: 20px 10px;
	vertical-align: middle;
}

.cart-area .sub-btn {
	padding: 28px 48px;
}

.coupon-code-area input {
	height: 62px;
	border: 1px solid #dee2e6;
}

.total-price-area h2 {
	font-size: 22px;
}

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

/* 16. checkout page
-------------------------------------------------------------- */
.coupon-content,
.checkout-content,
#ship-box-info,
#cbox-account-info {
	display: none;
}

#login,
#couponshow {
	cursor: pointer;
}

.coupon-accordion h6 {
	background: #f9f9f9;
	border-top: 3px solid #000;
	font-size: 16px;
	font-weight: 500;
	position: relative;
}

.coupon-accordion h6::before {
	content: "\f07b";
	left: 20px;
	top: 17px;
	position: absolute;
	color: #000000;
	font-weight: 800;
}

.close {
	float: right;
	font-size: 30px;
	font-weight: 700;
	line-height: 1;
	color: #000;
	text-shadow: 0 1px 0 #fff;
	opacity: .5;
}

.coupon-area span,
.checkout-area span,
.checkout-area label {
	font-size: 16px;
	color: #222;
	line-height: 1.5;
}

.coupon-area span:hover {
	color: #006699;

}

.checkout-area label {
	display: block;
}

.checkbox-form .checkout-area label span,
.lost-password a {
	color: #006699;
}

.coupon-area input,
.checkout-area input,
.country-select select {
	height: 45px;
	margin: 0 0 14px;
	padding: 0 0 0 10px;
	border-radius: 0;
}

.coupon-area .form-control:focus,
.checkout-area .form-control:focus,
.country-select select .form-control:focus {
	border-color: #e7e7e7;
}

.country-select select.form-control:not([size]):not([multiple]) {
	height: 45px;
	font-size: 15px;
}

.save-info input,
.shipping .r-inpt {
	height: auto !important;
}

/* checkout-area */
.checkout-area .nice-select {
	border-radius: 0;
	height: 45px;
	line-height: 42px;
	width: 100%;
}

.checkout-area .different-address .nice-select {
	line-height: 2.3
}

.checkout-area .nice-select::after {
	height: 8px;
	right: 22px;
	width: 8px;
}

.checkout-area h4 {
	font-size: 26px;
}

.save-info p {
	font-size: 16px;
	font-weight: 500;
	color: #222;
	letter-spacing: .1px;
}

.order-notes textarea {
	height: 90px;
}

.order-notes textarea::placeholder {
	opacity: 1;
}

.your-order {
	background: #f9f9f9;
}

.your-order-table table th {
	border-top: medium none;
	vertical-align: middle;
	white-space: nowrap;
	width: 50%;
}

.your-order-table table th,
.your-order-table table td {
	border-bottom: 1px solid #e7e7e7;
	border-right: medium none;
	color: #777;
	font-size: 15px;
	padding: 15px 0;
}

.payment-method h6 .btn-link {
	font-size: 13px;
	color: #292929;
	font-weight: 500;
	cursor: pointer;
}

/* 15. Shop page area
-------------------------------------------------------------- */
.page-height3 {
	min-height: 500px;
}

.nice-select.open .list {
	border-radius: 0;
}

.nice-select .option.selected {
	font-weight: normal;
}

.nice-select {
	height: 22px;
	line-height: 20px;
}

.shop-title h5,
.product-filter a,
.single-product-content p {
	font-size: 14px;
}

.ser-icon {
	min-width: 22px;
	height: 16px;
	display: block;
}

.nav-tabs .nav-item.show .nav-link.ser-icon,
.nav-tabs .nav-link:hover .ser-icon,
.nav-tabs .nav-item.show .nav-link.ser-icon,
.nav-tabs .nav-link.active .ser-icon,
.nav-tabs .nav-item.show .nav-link .ser-icon,
.nav-tabs .nav-link:focus .ser-icon {
	filter: invert(0) sepia(0) hue-rotate(0deg) brightness(0);
}

/* round-checkbox css start*/
.option-input:checked::after {
	background: #000;
	content: "";
	display: block;
	position: relative;
	z-index: 1;
}

.option-input.radio {
	border-radius: 50%;
}

.option-input.radio::after {
	border-radius: 50%;
}

.option-input {
	appearance: none;
	position: relative;
	top: 0;
	right: 0;
	bottom: 0;
	height: 20px;
	width: 20px;
	transition: .15s;
	border: 1px solid #e1e1e1;
	color: #000;
	cursor: pointer;
	display: inline-block;
	outline: none;
	position: relative;
	z-index: 1;
}

.product-choose-colors .option-input {
	height: 25px;
	width: 25px;
}

.option-input:checked::before {
	position: absolute;
	content: "✓";
	display: inline-block;
	font-size: 14px;
	left: 50%;
	top: 45%;
	transform: translate(-50%, -50%);
}

/* round-checkbox css end*/
.f-choose-color .option-input {
	color: #fff;
}

.product-menubar a {
	color: #999;
	font-size: 14px;
}

.product-menubar h4,
.single-product-content h5 {
	font-size: 18px;
}

.product-menubar a:hover {
	color: #222222;
}

.product-menubar {
	height: 210px;
}

.ui-widget.ui-widget-content {
	border: 1px solid #000;
	background: #ebebeb;
	height: 3px;
}

.ui-widget-header {
	background: #000;
}

.ui-slider-horizontal .ui-slider-handle {
	top: -10px;
	border-radius: 10px;
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
	border: 6px solid #000;
	background: #fff;
	font-weight: normal;
	color: #454545;
}

.product-filter-details {
	width: 100%;
	box-shadow: 0 8px 32px -8px rgba(0, 0, 0, .1);
	top: 50px;
	left: 0;
	transition: .5s;
	z-index: 11;
	display: none;
}

.product-filter-details.product-filter-block {
	box-shadow: none;
}

#col5 .container-wrapper .col-xl-2 {
	min-width: 20% !important;
}

.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link:hover,
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link:focus {
	border-color: transparent;
}

.nav-tabs a {
	color: #999;
	padding-left: 8px;
}

.product-search input {
	height: 50px;
}

.product-search p {
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
}

.shop-left-sidebar-area #col-5 .single-product:hover {
	box-shadow: none;
	background: none;
}

.fitler-input input {
	max-width: 90px;
	font-size: 14px;
}

.single-product-list .single-product-img img {
	min-width: 330px;
}

.single-product-img a {
	display: block;
}

.shop-sidebar-left .product-search p {
	right: 50px;
}

.single-product-list-button li.tool a:hover {
	border: 1px solid #000000;
}

.single-product-list-button li {
	padding: 0 !important;
	border: none !important;
}

.single-product-list-button li a span {
	display: inline-block;
	width: 60px;
	height: 60px;
	line-height: 60px;
	text-align: center;
	color: #343a40;
}

#list .single-product-list-button li a span {
	width: 54px;
	height: 54px;
	line-height: 54px;
}

.single-product-list-button span {
	line-height: 54px;
	text-align: center;
	display: block;
}

.wishlist-area a {
	font-size: 14px;
}

.table-content .p-img img {
	width: 90px;
	height: 100px;
}

.table th {
	border-top: none;
	font-weight: 400;
}

.table td,
.table th {
	vertical-align: middle;
	border-bottom: 1px solid #dee2e6;
}

.table thead th {
	border-top: 1px solid #dee2e6;
	border-bottom: 0;
}

.table-content.table-content1 {
	width: 20px;
}

.table-content.table-content2 {
	width: 110px;
}

.wishlist-area .table-content6 a {
	font-size: 16px;
}

/* ===== Global Gradient Button Style for SheeshaTonight ===== */
.btn,
.checkout-btn,
.vendor-btn,
.slider-btn,
.p-add-cart,
.p-add-cart2 {
	display: inline-block;
	height: 50px;
	padding: 12px 40px;
	border-radius: 10px;
	border: none;
	background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
	color: #fff;
	font-weight: 600;
	font-size: 18px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	box-shadow: 0 4px 25px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
	background-size: 300% 300%;
	animation: sliderGradientFlow 6s ease infinite;
	position: relative;
	overflow: hidden;
}

/* ===== Hover Glow Effect ===== */
.btn:hover,
.checkout-btn:hover,
.vendor-btn:hover,
.p-add-cart:hover,
.p-add-cart2:hover,
.slider-btn:hover {
	transform: translateY(-3px);
	box-shadow:
		0 0 20px rgba(255, 176, 0, 0.6),
		0 0 30px rgba(233, 66, 128, 0.5),
		0 0 40px rgba(81, 45, 168, 0.4);
	color: #fff;
}

/* ===== Shine Effect ===== */
.btn::before,
.checkout-btn::before,
.vendor-btn::before,
.p-add-cart::before,
.p-add-cart2::before,
.slider-btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.5), transparent);
	transition: all 0.6s ease;
}

.btn:hover::before,
.checkout-btn:hover::before,
.vendor-btn:hover::before,
.p-add-cart:hover::before,
.p-add-cart2:hover::before,
.slider-btn:hover::before {
	left: 125%;
}

/* ===== Smooth Gradient Animation ===== */
@keyframes sliderGradientFlow {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}

/* ===== Optional Variant for Coupon/Cart Section ===== */
.coupon-and-update-area .btn.p-add-cart2 {
	padding: 18px 50px;
}

.coupon-and-update-area .btn.p-add-cart2:hover {
	color: #000;
	background: #fff;
	border: 1px solid #000;
	box-shadow: none;
	transform: translateY(0);
}

.mobile-wishlist .p-img img {
	max-width: 110px;
}

.p-remove {
	right: 0;
	top: 30px;
}

.pn {
	margin-top: 10px;
}

/* 16. blog sidebar none area
-------------------------------------------------------------- */
.page-title-content h2 {
	font-size: 50px;
}

.page-title-content .blog-tag li a {
	font-size: 16px;
}

.page-height-2 {
	min-height: 900px;
}

.page-height-2::before {
	position: absolute;
	content: "";
	background: rgba(0, 0, 0, .65);
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

.page-nav {
	left: 0;
	right: 0;
	bottom: 30px;
}

.blog-testimonial .testimonials-text {
	font-size: 24px;
	line-height: 44px;
}

.blog-testimonial .client h5 {
	font-size: 18px;
}

.blog-content .post-tag li,
.social-link li {
	display: inline-block;
}

.blog-content .post-tag li a:hover {
	color: #fff;
	background: #000;
}

.author-post span,
.blog-posts a {
	font-size: 18px;
}

.author-post span::before {
	position: absolute;
	content: "";
	width: 30px;
	height: 2px;
	background: #222;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}

.single-author-post li a span {
	font-size: 16px;
}

.author-img {
	max-width: 125px;
}

.reply-form form .save-info input {
	height: 0;
}

.reply-form h3 {
	font-size: 30px;
	font-weight: 600;
}

.blog-testimonial-client-img {
	width: 110px;
}

/* 17. blog box landing area
-------------------------------------------------------------- */
.single-blog-box img {
	height: 275px;
	width: 100%;
}

.blog-large-img {
	width: 100%;
}

.blog-large-img img {
	height: 590px;
	width: 100%;
}

.single-box-content h4 {
	font-size: 24px;
}

.single-box-content {
	top: 40%;
	left: 0;
	right: 0;
	bottom: 0;
	background: linear-gradient(rgba(0, 0, 0, 0) 0%, #000 60%);
}

.single-box-text {
	left: 0;
	right: 0;
	bottom: 0;
}

.single-blog-box-hover {
	margin: 0;
	transition: .3s;
	transition: .3s ease;
	-webkit-transition: .3s ease;
	-o-transition: .3s ease;
	-ms-transition: .3s ease;
}

.single-blog-box {
	transition: .3s;
}

.single-blog-box:hover .single-blog-box-hover {
	transform: translateY(-20px);
}

.single-box-content .blog-post-data {
	-webkit-transition: all .3s ease;
	-moz-transition: all .3s ease;
	-ms-transition: all .3s ease;
	-o-transition: all .3s ease;
	transition: all .3s ease;
	opacity: 0;
}

.single-blog-box:hover .blog-post-data {
	opacity: 1;
	height: 12%;
}

.single-blog-box .blog-post-data li {
	width: 50%;
}

/* 18. blog gird page area
-------------------------------------------------------------- */
.blog-grid-img img {
	transition: .3s;
	opacity: 0;
	visibility: hidden;
}

.blog-gird-content {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 1;
}

.blog-grid-iteams .blog-gird-content:hover {
	background: rgba(0, 0, 0, .8)
}

.blog-grid-iteams:hover .blog-grid-img img {
	visibility: visible;
	opacity: 1;
}

.blog-grid-iteams:hover p,
.blog-grid-iteams:hover li,
.blog-grid-iteams:hover h4,
.blog-grid-iteams :hover a {
	color: #fff;
}

/* 19. blog page area
-------------------------------------------------------------- */
.blog-tag li a {
	background: #069;
	padding: 6px 12px;
	font-size: 14px;
	margin-right: 5px;
}

.blog-right-sidebar-left-content h3 {
	font-size: 30px;
}

.blog-right-sidebar-left-content p {
	line-height: 30px;
	color: #555;
}

.blog-post-data li {
	display: inline-block;
	color: #555;
}

.blog-widget h5 {
	font-size: 20px;
}

.blog-widget h5 {
	position: relative;
}

.blog-widget h5::before {
	position: absolute;
	background: #222;
	width: 40px;
	height: 2px;
	content: "";
	bottom: 0;
	left: 0;
}

.blog-search-form {
	background: #cde5d3;
}

.blog-widget input {
	height: 60px;
	padding: 25px 22px;
	border-radius: 10px;
	border: 1px solid #222;
}

.blog-widget.blog-search-form form span {
	right: 20px;
	top: 50%;
	transform: translateY(-50%);
}

.blog-slider-active span,
.blog-subscribe p,
.blog-widget p {
	font-size: 14px;
}

.blog-subscribe {
	background: #f2e1e0;
}

.search-tag li {
	display: inline-block;
}

.search-tag li a {
	font-size: 12px;
	color: #7d7d7d;
	background: #f5f5f5;
	padding: 7px 16px;
	margin: 0 10px 8px 0;
	display: block;
	border-radius: 10px;
	transition: .3s;
}

.search-tag li a:hover {
	background: #069;
	color: #fff;
}

.blog-instagram-img {
	background: #e0e7f2;
}

.blog-widget .instagram-img {
	height: 100px;
	width: 100px;
}

.agota-page .page-item.active .page-link {
	color: #fff;
	background-color: #006699;
	border-color: #006699;
}

.agota-page .page-link {
	width: 42px;
	height: 40px;
	text-align: center;
	color: #888;
	border: 1px solid #dee2e6;
	margin-right: 10px;
	line-height: 24px;
	display: block;
	font-size: 14px;
}

.agota-page .page-item.active .page-link {
	color: #fff;
	background-color: #006699;
	border-color: #006699;
}

.agota-page .page-link:hover {
	background-color: #006699;
	border-color: #006699;
	color: #fff;
}

.page-item:last-child .page-link,
.page-item:first-child .page-link {
	border-radius: 0;
}

/* 20. about us area
-------------------------------------------------------------- */
.single-page {
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

.single-portfolio .portfolio-img img {
	width: 100%;
}

.our-single-service h5 {
	font-size: 24px;
}

.ship-icon span::before {
	font-size: 130px;
}

.our-icon span::before {
	font-size: 62px;
}

.shipping-content {
	height: 800px;
	background-attachment: fixed;
}

.team-member h5,
.client h5 {
	font-size: 18px;
}

.client.text-center span {
	color: #e7b6bb;
}

.testimonial-bg {
	background-color: transparent;
	background-image: linear-gradient(180deg, #97545b 100%, #f2295b 100%);
	height: 800px;
}

.quit a {
	font-size: 30px;
}

.client img {
	max-width: 300px;
	margin: 0 auto;
}

/* 21. about page area
-------------------------------------------------------------- */
.about-bg {
	background: #161619;
	height: 100vh;
}

.about-me-img {
	left: 0;
	top: 0;
	width: 50%;
	bottom: 0;
	background-position: left center;
	background-size: cover;
	height: 100%;
}

.about-d-height {
	top: 0;
	right: 0;
	width: 50%;
	bottom: 0;
}

.about-details {
	max-width: 75%;
	max-height: 70vh;
	overflow: hidden;
	overflow-y: scroll;
	margin: auto;
}

.about-details p,
.about-details li {
	color: #999999;
	line-height: 24px;
}

.about-details li {
	color: #fff;
	line-height: 24px;
}

.about-details h1 {
	font-size: 80px;
	line-height: 1;
}

.my-social-info li {
	display: inline-block;
}

.my-social-info li a {
	font-size: 16px;
	width: 120px;
	height: 40px;
	line-height: 40px;
}

.about-footer {
	margin-top: -90px;
}

.about-footer ul li a,
.about-footer a,
.about-footer p {
	color: #fff;
	font-size: 14px;
}

.about-footer .copyright-text::before {
	display: none;
}

/* 22. no page area
-------------------------------------------------------------- */
.no-page-height {
	height: 950px;
}

.no-page-height h3 {
	font-size: 48px;
}

.no-page-height h1 {
	font-size: 220px;
}

/* 23. contact page
-------------------------------------------------------------- */
.contact-form-area {
	z-index: 100;
}

.contact-form-left span,
.contact-form-right span {
	font-size: 18px;
}

.contact-form-right input,
.comment textarea {
	height: 55px;
	border-radius: 0;
	padding: 20px;
}

.comment textarea {
	min-height: 150px;
}

.contact-map {
	z-index: -1;
	top: -270px;
	margin-bottom: -275px;
	width: 100%
}

.contact-map iframe {
	width: 100%;
	height: 570px;
	border: 0;
}

/* 24. login area
-------------------------------------------------------------- */
.login-area,
.register-area {
	width: 85%;
}

.login-form {
	background: #f7f7f7;
}

.login-register-area h5 {
	font-size: 20px;
}

.login-form label,
.login-form .login-check p,
.f-get-pass a,
.register-form label,
.register-form input {
	font-size: 14px;
	color: #222222;
}

.login-register-area input {
	height: 55px;
	border-radius: 0
}

.login-register-area input.form-control:focus {
	border-color: #7d7d7d;
	border: 2px solid #7d7d7d;
	box-shadow: none;
}

.f-get-pass a {
	border-bottom: 2px solid #222;
}

.register-form h6 {
	font-size: 16px;
}

.register-form p {
	font-size: 14px;
	line-height: 26px;
	color: #555;
}

/* 25. footer area
-------------------------------------------------------------- */
.footer-widget h4 {
	font-size: 13px;
	font-weight: 900;
}

.widget-area p,
.widget-area li,
.widget-area li a {
	color: #999999;
	font-size: 14px;
	margin-bottom: 15px;
	display: block;
}

.footer-widget p:hover,
.footer-widget li:hover,
.footer-widget li a:hover {
	color: #ffffff;
}

.footer-info form input {
	width: 420px;
	height: 55px;
	padding-left: 20px;
	background: transparent;
	border: 1px solid #999;
	color: #fff;
}

.footer-4 .footer-info form input {
	border: 1px solid #2e2e30;
	width: 95%;
	text-align: center;
	color: #fff
}

.footer-4 .footer-info form input:focus {
	border: 1px solid #ffffff;
}

.footer-4 .footer-widget.subscriber-area {
	border-left: 1px solid #2e2e30;
	border-right: 1px solid #2e2e30;
}

.copyright-text::before {
	position: absolute;
	content: "";
	background: #999999;
	width: 1px;
	height: 25px;
	right: 60px;
	top: 0;
}

.copyright-text-4::before {
	display: none;
}

.footer-area-2 .copyright-text::before {
	display: none;
}

.copyright-area p,
.copyright-area li,
.copyright-area li a {
	margin-bottom: 0;
}

.copyright-text p a:hover {
	color: #069 !important;
}

.copyright-menu {
	margin-left: -26px;
}

.copyright-area .copyright-menu li {
	margin-right: 25px;
}

.footer-area-2 .copyright-menu li a {
	color: #222;
	font-size: 14px;
}

.footer-6 .footer-address li {
	margin-bottom: 12px;
}

.footer-4 .footer-widget li a {
	color: #e1e1e1;
}

.footer-area-5 {
	bottom: 60px;
	width: 100%;
}

.footer-area-5 .copyright-menu li a {
	color: #999;
}

.footer-area-5 .copyright-text p {
	font-size: 14px;
}

/* 26. extra info css
-------------------------------------------------------------- */
/* back top */
.top {
	position: fixed;
	color: #555555;
	right: 30px;
	bottom: 30px;
	cursor: pointer;
	background: #fff;
	border-radius: 5px;
}

.top span {
	font-size: 18px;
	padding: 12px 12px;
	display: block;
}

/* header-search-details */
.header-search-details {
	width: 100%;
	position: fixed;
	top: -250%;
	left: 0;
	z-index: 55;
	height: 100%;
	transition: .5s;
}

.header-search-details.open-search-info {
	top: 0;
}

.header-search-content h4 {
	font-size: 30px;
}

.header-search-details .close-icon {
	font-size: 30px;
}

.header-search-content ul li a {
	font-size: 18px;
	color: #888;
	margin: 30px;
	display: block;
}

.header-search-content ul li a:hover,
.header-search-details ul li a.active {
	color: #222222;
}

/* form css  start*/
.header-search-content form a {
	left: 10px;
	top: 18px;
	font-size: 22px;
	color: #555555;
}

.header-search-content form input,
.subscribe-form input {
	border: 0;
	border-bottom: 2px solid #e1e1e1;
	padding: 0;
	width: 100%;
	padding-left: 45px;
	margin: 0;
	color: #555;
	padding-left: 10px;
	font-size: 14px;
	background: none;
	box-shadow: none;
	height: 45px;
	text-indent: 40px;
}

.subscribe-form form input {
	text-align: center;
	height: 55px;
	padding-left: 0;
}

.header-search-content form input:focus,
.subscribe-form input:focus {
	border-bottom: 2px solid #222;
}

.search-form input::-webkit-input-placeholder {
	/* Chrome/Opera/Safari */
	color: #fff;
}

.search-form input::-moz-placeholder {
	/* Firefox 19+ */
	color: #fff;
}

.search-form input:-ms-input-placeholder {
	/* IE 10+ */
	color: #fff;
}

.search-form input:-moz-placeholder {
	/* Firefox 18- */
	color: #fff;
}

/* form css  end*/

/* header-shopping-cart-details */
.header-shopping-cart-details {
	width: 400px;
	position: fixed;
	right: -205%;
	top: 0;
	z-index: 999;
	height: 100%;
	transition: .7s;
}

.header-shopping-cart-details.open-shopping-info {
	right: 0;
}

.header-shopping-cart-details h5 {
	font-size: 18px;
}

.h-shop-cart-img img {
	max-width: 85px;
}

.h-shop-cart-contetn ul li {
	display: inline-block;
}

/* .side-mobile-menu start*/
.side-mobile-menu {
	width: 340px;
	position: fixed;
	left: -340px;
	top: 0;
	z-index: 9999;
	height: 100%;
	transition: all .3s ease-out;
	overflow: scroll;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-ms-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
}

.side-mobile-menu.open-menubar {
	left: 0;
}

.close-icon {
	font-size: 30px;
}

.side-mobile-menu .header-search-content ul li a {
	font-size: 16px;
	margin: 12px;
	color: #222;
}

.side-mobile-menu .header-search-content ul li a:hover,
.side-mobile-menu .header-search-content ul li a.active {
	color: #006699;
}

.side-mobile-menu .header-search-content form a {
	right: 10px;
	left: auto;
	font-size: 18px;
}

.side-mobile-menu .header-search-content form input {
	text-indent: 0;
}

.side-mobile-menu .menu-login ul li a {
	color: #222;
	font-size: 16px;
}

.side-mobile-menu .menu-login ul li {
	padding: 15px 0;
}

.side-mobile-menu .menu-login {
	clear: both;
}

/* .side-mobile-menu end*/

/* preloader css */
#preloader {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 999;
	width: 100%;
	height: 100%;
	overflow: visible;
	background: #fff url('../images/icon/agota-preloader.gif') no-repeat center center;
}


.cartmini-overlay {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 995;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	backdrop-filter: blur(15px);
	visibility: hidden;
	opacity: 0;
	transition: 0.45s ease-in-out;
}

.cartmini-overlay.openeds {
	opacity: 1;
	visibility: visible;
}

.single-slider.slider-height {
	height: 120vh !important;
	min-height: 120vh !important;
	max-height: 120vh !important;
	background-size: cover !important;
	background-position: center !important;
	background-repeat: no-repeat !important;
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* Tablets (up to 991px) */
@media (max-width: 991px) {
	.single-slider.slider-height {
		height: 90vh !important;
		min-height: 90vh !important;
		max-height: 90vh !important;
		background-position: center top !important;
	}

	.single-slider .slider-content h1 {
		font-size: 42px !important;
	}

	.single-slider .slider-content p {
		font-size: 16px !important;
	}

	.slider-btn {
		padding: 12px 32px;
		font-size: 15px;
	}
}

/* Mobile Devices (up to 768px) */
@media (max-width: 768px) {
	.single-slider.slider-height {
		height: 90vh !important;
		background-size: cover !important;
		background-position: center center !important;
		justify-content: center !important;
		text-align: center !important;
	}

	.single-slider .slider-content {
		max-width: 90%;
		padding: 0 0px;
	}

	.single-slider .slider-content h1 {
		font-size: 36px;
	}

	.single-slider .slider-content span {
		font-size: 16px;
	}

	.single-slider .slider-content p {
		font-size: 14px;
		margin: 50px 0 5px;
	}

	.slider-btn {
		font-size: 14px;
		padding: 10px 28px;
	}
}

/* Small Phones (up to 480px) */
@media (max-width: 480px) {
	.single-slider.slider-height {
		height: 90vh !important;
		background-position: center center !important;
	}

	.single-slider .slider-content h1 {
		font-size: 28px;
	}

	.single-slider .slider-content p {
		font-size: 13px;
	}

	.slider-btn {
		font-size: 13px;
		padding: 8px 22px;
	}
}

/* slider  btn*/






/* header styling extra */
/* Mobile Responsive Header */
@media (max-width: 991px) {
	#header-sticky .header>.container-fluid>.row {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 10px 15px;
		position: relative;
	}

	.d-none.d-xl-block {
		display: none !important;
	}

	.col-xl-3.col-lg-7.col-md-7.col-sm-7.col-8 {
		justify-content: center;
		align-items: center;
		position: relative;
		padding: 0;
	}

	.logo {
		position: absolute;
		left: 50%;
		transform: translateX(-50%);
	}

	.logo img {
		max-height: 40px;
		width: auto;
	}

	.mobile-menubar,
	.header-shopping-cart {
		font-size: 24px;
		color: #fff;
		cursor: pointer;
		z-index: 10;
	}

	.header-shopping-cart sup.s-count {
		top: -5px;
		right: -8px;
		font-size: 10px;
		background: #650218;
		color: #fff;
		border-radius: 50%;
		padding: 2px 5px;
		position: absolute;
	}

	.header {
		background: transparent;
	}
}

/* Smaller screens adjustments */
@media (max-width: 575px) {
	.header {
		padding-left: 5px;
		padding-right: 5px;
	}

	.mobile-menubar,
	.header-shopping-cart {
		font-size: 22px;
	}

	.logo img {
		max-height: 35px;
	}
}



/* Default logo (white before scroll) */
.logo img {
	max-width: 100px;
	filter: brightness(0) invert(1);
	/* Makes logo white */
	transition: all 0.3s ease;
}

/* When scrolled, show original logo colors */
.logo.scrolled img {
	filter: none !important;
}

/* Default logo — white */
.logo img {
	max-width: 100px;
	filter: brightness(0) invert(1);
	/* makes logo white */
	transition: all 0.3s ease;
}

/* When scrolled or hovered */
.header-area.header-active .logo img,
.header-area:hover .logo img {
	filter: none !important;
	/* show real colors */
}

@media (max-width: 991px) {
	#header-sticky .header>.container-fluid>.row {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		padding: 10px 15px;
	}

	/* Hide desktop items */
	.d-none.d-xl-block {
		display: none !important;
	}

	/* Mobile header wrapper */
	.col-xl-3.col-lg-7.col-md-7.col-sm-7.col-8 {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		position: relative;
	}

	/* Logo center */
	.logo {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		z-index: 1;
	}

	.logo img {
		max-height: 40px;
		width: auto;
	}

	/* Left + right icons */
	.mobile-menubar {
		font-size: 24px;
		color: #fff;
		cursor: pointer;
		z-index: 2;
	}

	.header-right {
		display: flex;
		align-items: center;
		position: absolute;
		right: 15px;
		top: 50%;
		transform: translateY(-50%);
	}

	.header-shopping-cart {
		font-size: 24px;
		color: #fff;
		position: relative;
		cursor: pointer;
	}

	.header-shopping-cart sup.s-count {
		top: -6px;
		right: -8px;
		font-size: 10px;
		background: #650218;
		color: #fff;
		border-radius: 50%;
		padding: 2px 5px;
		position: absolute;
	}

	.header {
		background: transparent;
	}
}

@media (max-width: 575px) {
	.logo img {
		max-height: 35px;
	}
}

/* gallery styling rxtra */
.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
	padding: 0px;
}

/* Only gallery section images */
.gallery-section .gallery-img {
	border: 5px solid white;
	/* adjust thickness */
	box-sizing: border-box;
}



/* offer section styling */

.offer-section {
	width: 100%;
	background: linear-gradient(135deg, #0a0a0a, #0e001a, #00212c);
	color: #fff;
	padding: 120px 0px;
	display: flex;
	justify-content: center;
}

.offer-container {
	width: 100%;
	max-width: 1400px;
	text-align: center;
}

.offer-header .tagline {
	color: #d4af37;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 0.9rem;
}

.offer-header h2 {
	font-size: 2.6rem;
	margin: 20px 0;
	color: #f8f8f8;
}

.offer-header p {
	color: #dcdcdc;
	max-width: 850px;
	margin: 0 auto 60px auto;
	line-height: 1.8;
	font-size: 1.1rem;
}

.offer-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
	gap: 50px;
	margin-bottom: 60px;
}

.offer-card {
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.1);
	padding: 40px 35px;
	border-radius: 10px;
	text-align: left;
	transition: all 0.4s ease;
	backdrop-filter: blur(6px);
}

.offer-card:hover {
	background: rgba(255, 255, 255, 0.15);
	transform: translateY(-8px);
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
}

.offer-card h3 {
	color: #ffd98e;
	font-size: 1.6rem;
	margin-bottom: 18px;
}

.offer-card ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.offer-card ul li {
	padding: 10px 0;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	line-height: 1.7;
	font-size: 1rem;
}

.offer-footer {
	margin-top: 30px;
	color: #ddd;
	font-size: 1.1rem;
	max-width: 850px;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.9;
}

/* ====== Offer Button (Same Style as Slider Button) ====== */
.offer-btn {
	display: inline-block;
	height: 50px;
	padding: 10px 50px;
	border-radius: 10px;
	border: none;
	background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
	color: #fff;
	font-weight: 600;
	font-size: 18px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	box-shadow: 0 4px 25px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
	background-size: 300% 300%;
	animation: offerGradientFlow 6s ease infinite;
	position: relative;
	overflow: hidden;
	margin-top: 35px;
}

/* Hover Glow Effect */
.offer-btn:hover {
	transform: translateY(-3px);
	box-shadow:
		0 0 20px rgba(255, 176, 0, 0.6),
		0 0 30px rgba(233, 66, 128, 0.5),
		0 0 40px rgba(81, 45, 168, 0.4);
	color: #fff;
}

/* Shine Animation */
.offer-btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.5), transparent);
	transition: all 0.6s ease;
}

.offer-btn:hover::before {
	left: 125%;
}

/* Gradient Animation */
@keyframes offerGradientFlow {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}


/* Shine Animation */
.offer-btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.5), transparent);
	transition: all 0.6s ease;
}

.offer-btn:hover::before {
	left: 125%;
}

/* Gradient Animation */
@keyframes offerGradientFlow {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}

/* Responsive */
@media (max-width: 992px) {
	.offer-header h2 {
		font-size: 2rem;
	}

	.offer-container {
		padding: 0 20px;

	}

	.offer-card {
		padding: 30px 25px;
	}
}


/* ====== Vendors Section ====== */
.vendors-area {
	background: #f8f3e9;
	padding: 80px 20px;
	text-align: center;
}

.vendors-top {
	margin-bottom: 50px;
}

.vendors-title {
	font-size: 2rem;
	color: #1a1a1a;
	font-weight: 700;
	margin-bottom: 10px;
}

.vendors-subtitle {
	color: #555;
	max-width: 600px;
	margin: 0 auto;
}

/* ====== Vendors Grid ====== */
.vendors-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 25px;
}

.vendor-box {
	background: #fff;
	border-radius: 10px;
	padding: 30px 20px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	transition: 0.3s ease;
}

.vendor-box:hover {
	transform: translateY(-5px);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
}

.vendor-img {
	width: 90px;
	height: 90px;
	border-radius: 50%;
	margin-bottom: 15px;
	object-fit: cover;
}

.vendor-title {
	font-size: 1.2rem;
	color: #222;
	font-weight: 600;
	margin-bottom: 8px;
}

.vendor-stars {
	color: #ffb400;
	font-size: 1rem;
	margin-bottom: 15px;
}

.vendor-stars span {
	color: #333;
	font-weight: 500;
	margin-left: 5px;
}

/* ====== Button (Your Gradient Style) ====== */
.vendor-btn {
	display: inline-block;
	height: 50px;
	width: 100%;
	padding: 12px 15px;
	border-radius: 10px;
	border: none;
	background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
	color: #fff;
	font-weight: 600;
	font-size: 1rem;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	box-shadow: 0 4px 25px rgba(0, 0, 0, 0.3);
	background-size: 300% 300%;
	transition: all 0.3s ease;
	animation: gradientFlow 6s ease infinite;
}

/* Hover Glow Effect */
.vendor-btn:hover {
	transform: translateY(-3px);
	box-shadow:
		0 0 20px rgba(255, 176, 0, 0.6),
		0 0 30px rgba(233, 66, 128, 0.5),
		0 0 40px rgba(81, 45, 168, 0.4);
	color: white;
}

/* Smooth Gradient Animation */
@keyframes gradientFlow {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}


/* ====== Responsive ====== */
@media (max-width: 768px) {
	.vendors-title {
		font-size: 1.6rem;
	}

	.vendor-btn {
		width: 180px;
		font-size: 0.9rem;
		padding: 10px;
	}
}






/* ====== vendor Filter Section ====== */
.vendor-filter-area {
	background: #f8f3e9;
	padding: 60px 20px 30px;
	text-align: center;
}

.vendor-filter-container {
	max-width: 1100px;
	margin: 0 auto;
}

.vendor-filter-title {
	font-size: 1.8rem;
	font-weight: 700;
	color: #1a1a1a;
	margin-bottom: 25px;
}

/* ====== Filter Grid ====== */
.vendor-filter-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 15px;
	justify-content: center;
	align-items: center;
}

.nice-select.vendor-select {
	width: 180px;
	/* adjust to match your search button */
	height: 45px;
	/* same as your search button height */
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.nice-select.vendor-select .current {
	width: 100%;
	text-align: center;
}

.nice-select.vendor-select .list .option {
	text-align: center;
}


/* Unified Input + Select Styles */
.vendor-input,
.vendor-select {
	height: 50px;
	border-radius: 10px;
	border: 1px solid #ddd;
	font-size: 1rem;
	padding: 0 18px;
	outline: none;
	transition: 0.3s;
	background: #fff;
	color: #333;
	width: 100%;
	appearance: none;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

.vendor-input:focus,
.vendor-select:focus {
	border-color: #8000ff;
	box-shadow: 0 0 12px rgba(128, 0, 255, 0.2);
}

/* ====== Gradient Search Button (SheeshaTonight Style) ====== */
.vendor-btn {
	height: 50px;
	border-radius: 10px;
	border: none;
	background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
	color: #fff;
	font-weight: 600;
	font-size: 1rem;
	width: 100%;
	box-shadow: 0 4px 25px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
	cursor: pointer;
	background-size: 300% 300%;
	animation: gradientFlow 6s ease infinite;
}

/* Hover Glow Effect */
.vendor-btn:hover {
	transform: translateY(-3px);
	box-shadow: 0 0 20px rgba(255, 176, 0, 0.6),
		0 0 30px rgba(233, 66, 128, 0.5),
		0 0 40px rgba(81, 45, 168, 0.4);
}

/* Smooth Gradient Animation */
@keyframes gradientFlow {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}


/* ====== Responsive ====== */
@media (max-width: 768px) {
	.vendor-filter-title {
		font-size: 1.4rem;
	}

	.vendor-filter-grid {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.vendor-btn {
		width: 100%;
		font-size: 0.9rem;
	}
}

/* ====== Fully Responsive Vendor Filter ====== */
@media (max-width: 992px) {
	.vendor-filter-grid {
		grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
		gap: 12px;
	}
}

@media (max-width: 768px) {
	.vendor-filter-title {
		font-size: 1.5rem;
		margin-bottom: 20px;
	}

	.vendor-filter-grid {
		display: flex;
		flex-direction: column;
		gap: 12px;
		align-items: stretch;
	}

	.vendor-input,
	.vendor-select,
	.vendor-btn {
		width: 100%;
		font-size: 0.95rem;
		height: 45px;
	}
}

@media (max-width: 480px) {
	.vendor-filter-area {
		padding: 35px 15px 20px;
	}

	.vendor-filter-title {
		font-size: 1.3rem;
	}

	.vendor-input,
	.vendor-select,
	.vendor-btn {
		font-size: 0.9rem;
		height: 42px;
	}
}















/* ===== SECTION WRAPPER ===== */
#sheesha-filter-section {
	background: url('frontend/assets/images/feature/bg.webp') center/cover no-repeat;
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 60px 15px;
}

/* ===== CARD ===== */
.filter-card {
	background: rgba(255, 255, 255, 0.08);
	border-radius: 10px;
	padding: 40px 30px;
	box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
	max-width: 1100px;
	width: 100%;
	backdrop-filter: blur(10px);
}

/* ===== HEADING ===== */
.filter-heading {
	text-align: center;
	color: #fff;
	font-weight: 600;
	font-size: 1.8rem;
	margin-bottom: 30px;
}

/* ===== GRID ===== */
.filter-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 18px;
}

/* ===== INPUTS ===== */
.dropdown-input {
	width: 100%;
	height: 48px;
	border-radius: 10px;
	padding: 10px 15px;
	border: none;
	background: rgba(255, 255, 255, 0.95);
	font-size: 0.95rem;
	color: #222;
	transition: all 0.3s ease;
}

.dropdown-input:focus {
	outline: none;
	box-shadow: 0 0 0 3px rgba(155, 60, 128, 0.3);
}

/* ===== BUTTON ===== */
.filter-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	height: 48px;
	width: 100%;
	padding: 0 20px;
	border-radius: 10px;
	border: none;
	background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
	color: #fff;
	font-weight: 600;
	font-size: 1rem;
	text-align: center;
	cursor: pointer;
	transition: all 0.3s ease;
	box-shadow: 0 4px 25px rgba(0, 0, 0, 0.3);
	background-size: 300% 300%;
	animation: filterGradientFlow 6s ease infinite;
	position: relative;
	overflow: hidden;
}

/* Hover Glow Effect */
.filter-btn:hover {
	transform: translateY(-3px);
	box-shadow:
		0 0 20px rgba(255, 176, 0, 0.6),
		0 0 30px rgba(233, 66, 128, 0.5),
		0 0 40px rgba(81, 45, 168, 0.4);
	color: #fff;
}

/* Shine Effect */
.filter-btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.5), transparent);
	transition: all 0.6s ease;
}

.filter-btn:hover::before {
	left: 125%;
}

/* Smooth Gradient Animation */
@keyframes filterGradientFlow {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}

/* ===== RESPONSIVE DESIGN ===== */
@media (max-width: 992px) {
	.filter-card {
		padding: 35px 25px;
	}

	.filter-heading {
		font-size: 1.6rem;
	}
}

@media (max-width: 768px) {
	.filter-card {
		padding: 30px 20px;
	}

	.filter-heading {
		font-size: 1.5rem;
		margin-bottom: 25px;
	}

	.dropdown-input,
	.filter-btn {
		height: 46px;
	}
}

@media (max-width: 576px) {
	.filter-grid {
		grid-template-columns: 1fr;
	}

	.filter-card {
		padding: 25px 18px;
	}

	.filter-heading {
		font-size: 1.3rem;
	}
}

.sheesha-vendor-categories {
	background: #f8f3e9;
	padding: 80px 20px;
}

.sheesha-cat-title {
	font-size: 2rem;
	font-weight: 700;
	color: #111;
}

.sheesha-cat-subtitle {
	color: #555;
	font-size: 1rem;
	margin-top: 8px;
}

.sheesha-cat-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 25px;
	margin-top: 40px;
}

.sheesha-cat-card {
	background: #fff;
	border-radius: 10px;
	text-align: center;
	padding: 30px 20px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
}

.sheesha-cat-card img {
	width: 65px;
	height: 65px;
	object-fit: contain;
	margin-bottom: 15px;
}

.sheesha-cat-card h4 {
	font-size: 1.1rem;
	font-weight: 600;
	color: #111;
}

.sheesha-cat-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 0 20px rgba(0, 255, 128, 0.4),
		0 0 25px rgba(0, 128, 255, 0.3),
		0 0 30px rgba(128, 0, 255, 0.2);
}

.sheesha-cat-btn {
	display: inline-block;
	height: 50px;
	width: 230px;
	padding: 12px 15px;
	border-radius: 10px;
	border: none;
	background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
	color: #fff;
	font-weight: 600;
	font-size: 1rem;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	box-shadow: 0 4px 25px rgba(0, 0, 0, 0.3);
	background-size: 300% 300%;
	transition: all 0.3s ease;
	animation: sheeshaGradientFlow 6s ease infinite;
}

/* Hover Glow Effect */
.sheesha-cat-btn:hover {
	transform: translateY(-3px);
	box-shadow:
		0 0 20px rgba(255, 176, 0, 0.6),
		0 0 30px rgba(233, 66, 128, 0.5),
		0 0 40px rgba(81, 45, 168, 0.4);
	color: #fff;
}

/* Smooth Gradient Animation */
@keyframes sheeshaGradientFlow {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}


/* Responsive Tweaks */
@media (max-width: 768px) {
	.sheesha-cat-title {
		font-size: 1.7rem;
	}

	.sheesha-cat-grid {
		gap: 20px;
	}

	.sheesha-cat-card {
		padding: 25px 15px;
	}
}

.sheesha-offer-section {
	background: #f8f3e9;
	padding: 80px 0;
	color: #111;
	overflow: hidden;
}

.sheesha-offer-content {
	text-align: left;
	padding: 0 60px;
}

.text-highlight {
	color: #55083e !important;
}

.offer-subtitle {
	font-size: 1.6rem;
	font-weight: 600;
}

.offer-heading h2 {
	font-size: 2.4rem;
	font-weight: 700;
}

.tagline-text {
	color: #55083e;
	font-weight: 700;
	font-size: 20px;
}

.offer-features li {
	font-weight: 500;
	color: #444;
	margin-bottom: 10px;
	font-size: 15px;
	display: flex;
	align-items: center;
}

/* ====== Button Styling ====== */
.btn-explore {
	display: inline-block;
	height: 50px;
	width: 230px;
	padding: 12px 15px;
	border-radius: 10px;
	border: none;
	background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
	color: #fff;
	font-weight: 600;
	font-size: 1rem;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	box-shadow: 0 4px 25px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
	background-size: 300% 300%;
	animation: exploreGradientFlow 6s ease infinite;
	position: relative;
	overflow: hidden;
}

/* Hover Glow Effect */
.btn-explore:hover {
	transform: translateY(-3px);
	box-shadow:
		0 0 20px rgba(255, 176, 0, 0.6),
		0 0 30px rgba(233, 66, 128, 0.5),
		0 0 40px rgba(81, 45, 168, 0.4);
	color: #fff;
}

/* Shine Effect */
.btn-explore::before {
	content: "";
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.5), transparent);
	transition: all 0.6s ease;
}

.btn-explore:hover::before {
	left: 125%;
}

/* Smooth Gradient Animation */
@keyframes exploreGradientFlow {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}


/* ====== Slider Styling ====== */
.sheesha-slider-section {
	margin-top: 40px;
}

.slider-wrapper {
	position: relative;
	border-radius: 15px;
	overflow: hidden;
	min-height: 500px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.slider-bg {
	background: url("{{ asset('frontend/assets/images/product/get-bg.png') }}") no-repeat center center;
	background-size: contain;
	position: absolute;
	inset: 0;
	z-index: 0;
}

.sheesha-slider img {
	width: 80%;
	max-width: 400px;
	height: auto;
	object-fit: contain;
	position: relative;
	z-index: 2;
	transition: transform 0.3s ease;
}

.sheesha-slider img:hover {
	transform: scale(1.05);
}

/* ====== Responsive Design ====== */
@media (max-width: 1199px) {
	.sheesha-offer-content {
		padding: 0 40px;
	}

	.offer-heading h2 {
		font-size: 2rem;
	}
}

@media (max-width: 991px) {
	.sheesha-offer-section {
		padding: 60px 0;
	}

	.sheesha-offer-content {
		text-align: left;
		padding: 0 20px;
	}

	.btn-explore {
		width: 100%;
		max-width: 280px;
	}

	.sheesha-slider-section {
		margin-top: 40px;
	}

	.sheesha-slider img {
		width: 70%;
	}
}

@media (max-width: 576px) {
	.offer-heading h2 {
		font-size: 1.8rem;
	}

	.offer-subtitle {
		font-size: 1.3rem;
	}

	.tagline-text {
		font-size: 17px;
	}

	.sheesha-slider img {
		width: 85%;
	}
}


.feature-area {
	margin-top: 50px !important;
	padding-top: 50px !important;
	padding-bottom: 50px !important;
}

.feature-bg {
	margin-top: 20px !important;
	padding-bottom: 20px !important;

}


/* ====== Feature Card Styling ====== */
.single-feature {
	position: relative;
	overflow: hidden;
	border-radius: 14px;
	height: 500px;
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
}

.feature-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.6s ease;
}

.single-feature:hover .feature-img {
	transform: scale(1.05);
}

/* ====== Overlay with Depth ====== */
.section-content {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 50px 35px;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	color: #fff;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.65), rgba(0, 0, 0, 0.45) 60%, rgba(0, 0, 0, 0.1));
	border-radius: 10px;
	transition: background 0.4s ease;
}

.single-feature:hover .section-content {
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.5) 60%, rgba(0, 0, 0, 0.15));
}

/* ====== Typo ====== */
.section-content h3 {
	font-size: 24px;
	font-weight: 700;
	letter-spacing: 0.3px;
}

.section-content p {
	font-size: 16px;
	line-height: 1.7;
	opacity: 0.95;
}

/* ====== Button ====== */
.btn-universal {
	display: inline-block;
	padding: 14px 42px;
	height: 50px;
	border-radius: 10px;
	border: none;
	background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
	color: #fff;
	font-weight: 600;
	font-size: 16px;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	box-shadow: 0 4px 25px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
	background-size: 300% 300%;
	animation: universalGradientFlow 6s ease infinite;
	position: relative;
	overflow: hidden;
	align-self: flex-start;
}

/* Hover Glow Effect */
.btn-universal:hover {
	transform: translateY(-3px);
	box-shadow:
		0 0 25px rgba(255, 176, 0, 0.6),
		0 0 30px rgba(233, 66, 128, 0.5),
		0 0 40px rgba(81, 45, 168, 0.4);
	color: #fff;
}

/* Shine Effect */
.btn-universal::before {
	content: "";
	position: absolute;
	top: 0;
	left: -75%;
	width: 50%;
	height: 100%;
	background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.5), transparent);
	transition: all 0.6s ease;
}

.btn-universal:hover::before {
	left: 125%;
}

/* Smooth Gradient Animation */
@keyframes universalGradientFlow {
	0% {
		background-position: 0% 50%;
	}

	50% {
		background-position: 100% 50%;
	}

	100% {
		background-position: 0% 50%;
	}
}


/* ====== Responsive ====== */
@media (max-width: 1200px) {
	.single-feature {
		height: 450px;
	}

	.section-content {
		padding: 40px 25px;
	}
}

@media (max-width: 992px) {
	.single-feature {
		height: 420px;
	}

	.section-content h3 {
		font-size: 22px;
	}

	.section-content p {
		font-size: 15px;
	}
}

@media (max-width: 768px) {
	.single-feature {
		height: 400px;
	}

	.section-content {
		padding: 30px 20px;
	}

	.section-content h3 {
		font-size: 20px;
	}

	.btn-universal {
		padding: 12px 35px;
		font-size: 15px;
	}
}

/* ====== Responsive Fix for Tablet View ====== */
@media (max-width: 1024px) {
	.feature-area .row {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		gap: 20px;
	}

	.feature-area .col-xl-4,
	.feature-area .col-lg-4,
	.feature-area .col-md-6 {
		flex: 1 1 47%;
		max-width: 47%;
	}

	.single-feature {
		height: 420px;
		border-radius: 14px;
		overflow: hidden;
		display: flex;
		align-items: flex-end;
		justify-content: flex-start;
		position: relative;
		background-color: #000;
	}

	.feature-img {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
		z-index: 1;
		transition: transform 0.6s ease;
	}

	.single-feature:hover .feature-img {
		transform: scale(1.05);
	}

	.section-content {
		position: relative;
		z-index: 2;
		padding: 35px 25px;
		width: 100%;
		background: linear-gradient(to top, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.35));
		color: #fff;
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
		height: 100%;
	}

	.section-content h3 {
		font-size: 22px;
		margin-bottom: 10px;
	}

	.section-content p {
		font-size: 15px;
		line-height: 1.6;
		margin-bottom: 20px;
	}

	.btn-universal {
		padding: 12px 35px;
		font-size: 15px;
		align-self: flex-start;
	}
}

/* ====== Mobile View (Stack One by One) ====== */
@media (max-width: 767px) {

	.feature-area .col-xl-4,
	.feature-area .col-lg-4,
	.feature-area .col-md-6,
	.feature-area .col-sm-12 {
		flex: 1 1 100%;
		max-width: 100%;
	}

	.single-feature {
		height: 400px;
	}

	.section-content {
		padding: 30px 20px;
	}
}


.Flavors.Products-area {
	background: #f8f3e9;
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 15px;
	overflow: hidden;
	backdrop-filter: blur(6px);
	transition: all 0.3s ease;
}

/* Shop page: always show colored logo */
body.page-shop .logo img {
	filter: none !important;
}


.single-page {
	position: relative;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	z-index: 1;
}

.single-page::before {
	content: "";
	position: absolute;
	inset: 0;
	background: rgba(128, 0, 128, 0.55);
	/* purple with 55% opacity */
	z-index: 0;
}

.single-page>* {
	position: relative;
	z-index: 1;
	/* keeps text/content above overlay */
}







/* Remove border and shadow from all buttons in vendors/products section */
.vendors-area .vendor-btn,
.vendor-products .btn {
	border: none !important;
	box-shadow: none !important;
	outline: none !important;
	border-radius: 6px;
	/* optional: rounded corners */
}

/* Optional: make hover effect nicer */
.vendors-area .vendor-btn:hover,
.vendor-products .btn:hover {
	background-color: #0062cc;
	/* change color as needed */
	color: #fff;
	transform: translateY(-2px);
	transition: 0.3s;
}



.header-right ul li a,
.header-right ul li a span {
	text-decoration: none !important;
	/* Remove underline */
	border: none !important;
	/* Remove any border */
	box-shadow: none !important;
	/* Remove any shadow that looks like a line */
}

.header-right ul li a:hover {
	text-decoration: none !important;
	/* Prevent underline on hover */
	border: none !important;
}

/* TRIGGER BUTTON */
.header-account .account-trigger {
	color: #fff;
	font-weight: 500;
	cursor: pointer;
	font-size: 16px;
	transition: 0.3s ease;
}

.header-account .account-trigger:hover {
	opacity: 0.7;
}

/* DROPDOWN MENU */
.account-menu {
	background: #1b1b1f;
	min-width: 270px;
	border-radius: 14px;
}

/* SECTION TITLE */
.menu-section-title {
	font-size: 14px;
	color: #bbb;
	letter-spacing: 0.5px;
	margin: 5px 0 10px;
}

/* ACCOUNT ITEM (with icons) */
.account-item {
	display: flex;
	gap: 12px;
	padding: 10px 12px;
	border-radius: 10px;
	color: #e5e5e5;
	text-decoration: none;
	transition: 0.3s;
	list-style: none;
}

.account-item:hover {
	background: rgba(255, 255, 255, 0.07);
}

.account-item i {
	font-size: 18px;
	color: #9d5aff;
	/* purple neon */
	margin-top: 3px;
}

.account-item div p {
	margin: 0;
	font-size: 12px;
	color: #909090;
}

/* SIMPLE LINKS (Login options) */
.simple-link {
	padding: 8px 10px;
	font-size: 14px;
}

/* DIVIDER */
.menu-divider {
	border-color: rgba(255, 255, 255, 0.1);
	margin: 8px 0;
}

@media(max-width: 991px) {
	.header-account {
		display: none !important;
		/* desktop account hidden on mobile */
	}
}

/* Desktop Account Dropdown */
.header-account .dropdown-menu.account-menu {
	min-width: 300px;
	/* default se zyada */
	max-width: 400px;
	/* optional max */
	width: auto;
	/* content ke hisaab se adjust ho jaye */
}

/* Remove underline from account dropdown link */
.header-account .account-trigger {
	text-decoration: none !important;
}

/* Optional: remove underline on hover too */
.header-account .account-trigger:hover {
	text-decoration: none !important;
}

.header-right ul li a span {
	font-size: 18px;
	/* default icon size */
}

@media (max-width: 768px) {
	.header-right ul li a span {
		font-size: 16px;
		/* mobile pe thoda chhota karo */
	}
}

.header-right ul li a span {
	font-size: 18px;
	/* default icon size */
}

@media (max-width: 768px) {
	.header-right ul li a span {
		font-size: 16px;
		/* mobile pe thoda chhota karo */
	}
}




.product.active {
    background: linear-gradient(90deg, #6a0dad, #ff69b4, #1a1a40);
    color: #fff;
    font-weight: 600;
    border-radius: 5px; /* optional rounded corners */
    /* padding: 8px 12px;  optional padding */
}
          /* ---------- Toggle Styles ---------- */
          .rent-buy-toggle {
              display: flex;
              flex-direction: column;
              align-items: center;
              margin: 40px 0;
          }

          /* Enhanced label */
          .rent-buy-toggle .label {
              font-weight: 700;
              font-size: 26px;
              margin-bottom: 14px;
              letter-spacing: 0.5px;
          }

          .rent-buy-toggle .label .want {
              background: linear-gradient(90deg, #6a0dad, #ff69b4, #1a1a40);
              -webkit-background-clip: text;
              -webkit-text-fill-color: transparent;
          }

          /* Toggle wrapper */
          .toggle-wrapper {
              position: relative;
              display: flex;
              background: #f3e8ff;
              /* soft lavender */
              border-radius: 10px;
              width: 260px;
              padding: 6px;
              justify-content: space-between;
              box-shadow: 0 4px 10px rgba(26, 26, 64, 0.15);
          }

          .toggle-wrapper input {
              display: none;
          }

          /* Toggle wrapper */
          .toggle-wrapper {
              position: relative;
              display: flex;
              background: #f3e8ff;
              border-radius: 12px;
              width: 260px;
              padding: 6px;
              justify-content: space-between;
              box-shadow: 0 6px 15px rgba(81, 45, 168, 0.15);
          }

          /* Hide inputs */
          .toggle-wrapper input {
              display: none;
          }

          /* Labels as buttons */
          .toggle-btn {
              flex: 1;
              text-align: center;
              z-index: 2;
              cursor: pointer;
              font-weight: 600;
              font-size: 16px;
              padding: 10px 10px;
              transition: all 0.3s ease;
              border-radius: 10px;
              color: #1a1a40;
              background: transparent;
          }

          /* Slider */
          .slider {
              position: absolute;
              width: 50%;
              height: 100%;
              background: linear-gradient(135deg, #FFB100, #FF7A00, #E94280, #7B1FA2, #512DA8, #0E4C92, #007A70);
              border-radius: 10px;
              top: 0;
              left: 0;
              transition: left 0.3s, box-shadow 0.3s;
              z-index: 1;
              box-shadow: 0 4px 20px rgba(81, 45, 168, 0.3);
          }

          /* Move slider */
          #rent:checked~.slider {
              left: 0;
          }

          #buy:checked~.slider {
              left: 50%;
          }

          /* Change text color on selection */
          #rent:checked~label[for="rent"],
          #buy:checked~label[for="buy"] {
              color: #fff;
              font-weight: 700;
          }

          /* Unselected button */
          #rent:checked~label[for="buy"],
          #buy:checked~label[for="rent"] {
              color: #1a1a40;
          }

          /* Hover effect for buttons */
          .toggle-btn:hover {
              color: #fff;
              font-weight: 700;
          }


          .slider {
              position: absolute;
              width: 50%;
              height: 100%;
              background: linear-gradient(135deg, #6a0dad, #ff69b4);
              border-radius: 10px;
              top: 0;
              left: 0;
              transition: left 0.3s;
              z-index: 1;
          }

          /* Move slider */
          #rent:checked~.slider {
              left: 0;
          }

          #buy:checked~.slider {
              left: 50%;
          }

          /* Change text color */
          #rent:checked~label[for="rent"] {
              color: #fff;
          }

          #buy:checked~label[for="buy"] {
              color: #fff;
          }

          #rent:checked~label[for="buy"],
          #buy:checked~label[for="rent"] {
              color: #1a1a40;
          }

          /* ---------- Product Cards ---------- */
          #products {
              display: flex;
              flex-wrap: wrap;
              gap: 20px;
              justify-content: center;
              margin: 30px 0;
          }

          .product {
              padding: 22px;
              border: 1px solid rgba(106, 13, 173, 0.25);
              border-radius: 14px;
              width: 220px;
              text-align: center;
              background: #fff;
              box-shadow: 0 4px 10px rgba(106, 13, 173, 0.08);
              transition: transform 0.3s, box-shadow 0.3s, background 0.3s;
          }

          /* .product:hover {
              transform: translateY(-5px);
              box-shadow: 0 10px 25px rgba(255, 105, 180, 0.25);
              background: linear-gradient(135deg, #faf0ff, #ffe6f6);
          } */

          /* ---------- Responsive ---------- */
          @media (max-width: 600px) {
              .toggle-wrapper {
                  width: 200px;
              }

              .rent-buy-toggle .label {
                  font-size: 22px;
              }

              .product {
                  width: 90%;
              }
          }

          /* Quantity selector buttons */
.quantity-selector {
    display: flex;
    align-items: center;
    gap: 5px;
}

.quantity-selector label {
    font-size: 14px;
    font-weight: 500;
}

.quantity-selector .quantity-input {
    width: 60px;
    text-align: center;
    padding: 4px 6px;
    font-size: 14px;
}

/* Adjust the increment/decrement buttons */
.quantity-selector .increment,
.quantity-selector .decrement {
    width: 30px;
    height: 30px;
    padding: 0;
    font-size: 16px;
    line-height: 1;
    text-align: center;
    border-radius: 4px;
}

#payment-form {
    max-width: 500px;
    /* margin: 20px auto; */
    background: #fff;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.1);
}

#payment-form label {
    font-weight: 600;
    margin-bottom: 8px;
    display: block;
    color: #333;
}

#card-element {
    border: 1px solid #ddd;
    /* padding: 12px 14px; */
	    height: 55px;
    border-radius: 8px;
    background-color: #f9f9f9;
    transition: border 0.3s, box-shadow 0.3s;
}

#card-element:focus {
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0,123,255,0.2);
}

#card-errors {
    color: #ff4d4f;
    margin-top: 8px;
    font-size: 0.9rem;
}

#submit {
    width: 100%;
    padding: 12px;
    font-size: 1rem;
    border-radius: 8px;
    background: #007bff;
    border: none;
    color: #fff;
    cursor: pointer;
    transition: background 0.3s;
}

#submit:hover {
    background: #0056b3;
}


.breadcrumb-item a {
    text-decoration: none !important;
}

.breadcrumb-item.active {
    text-decoration: none !important;
}

.breadcrumb {
    margin-bottom: 0 !important;
}



/* Desktop / Default */
.single-page.page-height {
    min-height: 15vh;
    padding-top: 20px;
    padding-bottom: 20px;
}

/* Mobile */
@media (max-width: 768px) {
    .single-page.page-height {
        min-height: 25vh;   /* mobile pe thori readable height */
        padding-top: 25px;
        padding-bottom: 25px;
    }
}


#submit {
    width: 100%;
    padding: 12px;
    font-size: 1rem;
    border-radius: 8px;
    background: #007bff;
    border: none;
    color: #fff;
    cursor: pointer;
    transition: background 0.3s;
}

#submit:hover {
    background: #0056b3;
}

.breadcrumb-item a {
    text-decoration: none !important;
}

.breadcrumb-item.active {
    text-decoration: none !important;
}

.breadcrumb {
    margin-bottom: 0 !important;
}


     select {
            overflow-y: auto !important;
        }

        select option {
            max-height: 200px;
        }



        #hero-section,
        #hero-section .hero-container,
        #hero-section .hero-content,
        #hero-section .content-wrapper {
            overflow: visible !important;
        }

        select {
            position: relative;
            z-index: 9999;
        }
@media (max-width: 768px) {

    /* Make wrapper behave like input field */
    .filter-card .filter-btn-wrapper {
        width: 100% !important;
        display: block !important;
    }

    /* Force button same as dropdown */
    .filter-card .btn-explore {
        width: 100% !important;
        height: 50px !important;
        min-height: 50px !important;
        border-radius: 12px !important;
        padding: 0 0px !important;
        margin: 0 !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}
@media (max-width: 576px) {
    .page-height {
        min-height: 250px !important; /* previously large, now smaller */
        height: 250px !important;
        padding-top: 40px; /* text ko zara neeche balance ke liye */
    }

    .page-title h2 {
        font-size: 26px;
    }

    .breadcrumb {
        margin-top: 5px;
    }
}





@media (max-width: 992px) {

    /* Bootstrap ko apna kaam karne do */
    .faq-wrapper .row {/* ===== GLOBAL SLIDER HEIGHT FIX (ALL PAGES) ===== */
.single-page.page-height {
    min-height: 40vh;   /* Desktop height */
    padding-top: 40px;
    padding-bottom: 40px;
}

/* ===== Mobile Fix ===== */
@media (max-width: 768px) {
    .single-page.page-height {
        min-height: 25vh;   /* Mobile height */
        padding-top: 25px;
        padding-bottom: 25px;
    }

    .page-title h2 {
        font-size: 26px;
        margin-bottom: 10px;
    }

    .breadcrumb {
        margin-bottom: 0;
    }
}

        margin: 0;
    }

    .faq-wrapper .row > div {
        margin-bottom: 20px; /* ✅ perfect gap */
    }

    /* last column ka extra gap remove */
    .faq-wrapper .row > div:last-child {
        margin-bottom: 0;
    }
}

/* ===============================
   MOBILE RESPONSIVE FIXES
   =============================== */
@media (max-width: 991px) {

    /* Slider height smaller on mobile */
    .single-page.page-height {
        min-height: 260px !important;
        padding: 40px 0;
    }

    .page-title h2 {
        font-size: 22px;
        line-height: 1.3;
        padding-top: 0;
        margin-bottom: 0;
    }

    /* Product image + thumbnails stacked */
    .product-left-img-tab {
        flex-direction: column;
        gap: 12px;
    }

    /* Thumbnails horizontal on mobile */
    .product-left-img-tab .nav {
        flex-direction: row !important;
        justify-content: center;
        gap: 10px;
        margin-bottom: 10px;
    }

    .product-left-img-tab .nav a img {
        width: 55px;
        height: 55px;
    }

    /* Main image container smaller */
    .tab-content {
        height: 300px !important;
    }

    .product-img img {
        max-height: 260px;
    }

    /* Form spacing */
    .product-form-card {
        margin-top: 25px;
        padding: 20px;
    }

    .product-title {
        font-size: 22px;
    }

    .detail-list p {
        font-size: 14px;
    }

    /* Quantity full width */
    .qty-small {
        width: 100% !important;
    }

    /* Extra flavors rows stack */
    .extraFlavorRow > div {
        flex: 0 0 100%;
        max-width: 100%;
    }

    /* Book now button full width */
    .btn-gold {
        width: 100% !important;
        height: 48px;
        font-size: 15px;
    }
}

/* ===============================
   SMALL DEVICES (very small phones)
   =============================== */
@media (max-width: 480px) {

    .page-title h2 {
        font-size: 20px;
    }

    .tab-content {
        height: 260px !important;
    }

    .product-img img {
        max-height: 220px;
    }
}