/**
 * Sticky Header Styles
 * Makes the header stick to the top when scrolling
 * Desktop only - Shows logo, menus, and search bar
 */

/* Header Sticky Behavior - Desktop Only */
.header-sticky {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 9999;
	background: #fff;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	transition: all 0.3s ease;
	animation: slideDown 0.3s ease;
}

/* Force Single Row Layout */
.header-sticky .container {
	margin: 0 auto !important;
}

.header-sticky .row {
	display: flex !important;
	align-items: center;
	justify-content: space-between;
	flex-wrap: nowrap !important;
	margin: 0 !important;
}

/* Hide header-bottom (orange menu bar) */
.header-sticky .header-bottom {
	display: none !important;
}

/* Make header-left contain logo and menu */
.header-sticky .header-left {
    display: flex !important;
    align-items: center;
    flex: 1 1 auto;
    order: 1;
    margin: 0 0 !important;
    justify-content: space-between;
}

/* Make header-right contain search */
.header-sticky .header-right {
	display: flex !important;
	align-items: center;
	flex: 0 0 auto;
	order: 3;
}

/* Move search form to header-right */
.header-sticky .header-search-form {
	display: flex !important;
	order: 3;
	flex: 0 0 auto;
}

/* Column 1: Logo */
.header-sticky .wpbingo-logo,
.header-sticky .logo {
	flex: 0 0 auto;
	margin-right: 30px;
	order: 1 !important;
}

/* Column 2: Menu (Center) - Single Row */
.header-sticky .header-left .wpbingo-menu-mobile,
.header-sticky .header-left .sticky-menu {
	flex: initial;
	display: flex !important;
	justify-content: center;
	align-items: center;
	margin: 0 20px;
	flex-wrap: nowrap !important;
	position: static !important;
	background: transparent !important;
	order: 2 !important;
	width: auto !important;
	max-width: none !important;
}

.header-sticky .header-left .wpbingo-menu-mobile .header-menu-bg,
.header-sticky .header-left .wpbingo-menu-mobile .wpbingo-menu-wrapper,
.header-sticky .header-left .wpbingo-menu-mobile .megamenu,
.header-sticky .header-left .wpbingo-menu-mobile .navbar-default,
.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation {
	display: flex !important;
	background: transparent !important;
	width: 100% !important;
	max-width: none !important;
}

.header-sticky .header-left .wpbingo-menu-mobile .float-menu,
.header-sticky .header-left .wpbingo-menu-mobile #main-navigation {
	display: flex !important;
	width: 100% !important;
}

.header-sticky .main-menu ul,
.header-sticky .bwp-navigation ul,
.header-sticky .main-menu > ul,
.header-sticky .bwp-navigation > ul {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: center;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none;
	white-space: nowrap;
}

.header-sticky .main-menu li,
.header-sticky .bwp-navigation li,
.header-sticky .main-menu > ul > li,
.header-sticky .bwp-navigation > ul > li {
	display: inline-flex !important;
	margin: 0 15px !important;
	float: none !important;
	position: relative;
}

/* Full width mega menu dropdowns - aligned to page container */
.header-sticky .main-menu li.menu-item-has-children,
.header-sticky .bwp-navigation li.menu-item-has-children,
.header-sticky #main-navigation ul li.mega-menu.menu-item.mega-menu {
	position: static !important;
}

.header-sticky .main-menu li.menu-item-has-children .sub-menu,
.header-sticky .bwp-navigation li.menu-item-has-children .sub-menu,
.header-sticky .menu-item-has-children > .sub-menu,
.header-sticky #main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu {
	position: absolute !important;
	top: 60px !important;
	left: 65% !important;
	right: auto !important;
	transform: translateX(-50%) !important;
	max-width: 1280px !important;
	min-width: 1280px !important;
	margin: 0 auto !important;
	padding: 20px !important;
	background: #fff !important;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
	z-index: 999999 !important;
	text-align: left !important;
}

/* Ensure mega menu appears above iframes and other content */
.header-sticky .sub-menu {
	isolation: isolate !important;
}

/* Lower z-index for iframes when mega menu is open */
body iframe,
.elementor-widget-html iframe,
.tb_review_carousel iframe {
	position: relative !important;
	z-index: 1 !important;
}

/* Ensure mega menu content is full width */
.header-sticky .sub-menu .container,
.header-sticky .sub-menu .row {
	width: 100% !important;
	max-width: 100% !important;
}

/* Distribute mega menu items equally */
.header-sticky .sub-menu ul,
.header-sticky .sub-menu > ul {
	display: flex !important;
	flex-wrap: wrap !important;
	justify-content: flex-start !important;
	align-items: flex-start !important;
	gap: 20px !important;
}

.header-sticky .sub-menu li {
	flex: 0 0 auto !important;
	text-align: left !important;
}

/* Mega menu content padding */
.header-sticky #main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu .content-megamenu {
	padding: 10px 10px !important;
	width: 100% !important;
}

/* Elementor column padding */
.header-sticky #main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu .elementor-column {
	padding: 0 !important;
}

/* Column 3: Search Bar */
.header-sticky .search-box,
.header-sticky .header-search,
.header-sticky .search-form {
	flex: 0 0 auto;
	margin-left: 30px;
	min-width: auto;
	order: 3 !important;
}

/* Hide category dropdown in search bar */
.header-sticky .select_category,
.header-sticky .pwb-dropdown,
.header-sticky .select_category.pwb-dropdown.dropdown {
	display: none !important;
}

/* Hide everything except logo, menu, and search on sticky */
.header-sticky .header-page-link,
.header-sticky .mini-cart,
.header-sticky .header-cart,
.header-sticky .header-account,
.header-sticky .header-wishlist,
.header-sticky .top-bar,
.header-sticky .header-topbar,
.header-sticky .header-contact,
.header-sticky .header-info {
	display: none !important;
}

/* Hide specific menu items on sticky */
.header-sticky li.menu-item-31605,
.header-sticky li.menu-item-36705,
.header-sticky li.menu-item-41961,
.header-sticky li.menu-item-52669,
.header-sticky .level-0.menu-item-31605,
.header-sticky .level-0.menu-item-36705,
.header-sticky .level-0.menu-item-41961,
.header-sticky .level-0.menu-item-52669 {
	display: none !important;
}

/* Also hide from cloned menu */
.header-sticky .sticky-menu li.menu-item-31605,
.header-sticky .sticky-menu li.menu-item-36705,
.header-sticky .sticky-menu li.menu-item-41961,
.header-sticky .sticky-menu li.menu-item-52669 {
	display: none !important;
}

@keyframes slideDown {
	from {
		transform: translateY(-100%);
		opacity: 0;
	}
	to {
		transform: translateY(0);
		opacity: 1;
	}
}

/* Add padding to body when header becomes sticky to prevent content jump */
body.header-is-sticky {
	padding-top: 0;
}

/* Prevent scrollbar jump by always showing scrollbar */
html {
	overflow-y: scroll;
}

body.header-is-sticky .header-placeholder {
    display: block;
    height: auto !important;
}

/* Placeholder to prevent content jump */
.header-placeholder {
	display: none;
	width: 100%;
}

/* Header wrapper adjustments */
.header-sticky .header-wrapper {
	padding: 10px 0;
	transition: padding 0.3s ease;
}

/* Logo adjustments when sticky */
.header-sticky .wpbingo-logo img {
	max-height: 50px;
	transition: max-height 0.3s ease;
}

/* Menu adjustments when sticky */
.header-sticky .main-menu {
	transition: all 0.3s ease;
}

/* Search bar adjustments when sticky */
.header-sticky .search-box {
	transition: all 0.3s ease;
}

/* Compact mode for sticky header */
.header-sticky.compact {
    padding: 5px 0;
    overflow: visible;
}

.header-sticky.compact .header-wrapper {
	padding: 5px 0;
}

.header-sticky.compact .wpbingo-logo img {
	max-height: 40px;
}

/* Disable sticky header on mobile and tablet */
@media (max-width: 991px) {
	.header-sticky {
		position: relative !important;
		box-shadow: none !important;
		animation: none !important;
	}
	
	body.header-is-sticky {
		padding-top: 0 !important;
	}
	
	.header-placeholder {
		display: none !important;
	}
}

/* Smooth scroll behavior */
html {
	scroll-behavior: smooth;
}

/* Hide elements on sticky if needed */
.header-sticky .hide-on-sticky {
	display: none !important;
}

/* Show elements only on sticky */
.show-on-sticky {
	display: none !important;
}

.header-sticky .show-on-sticky {
	display: block !important;
}

/* Background color variations */
.header-sticky.bg-white {
	background: #fff;
}

.header-sticky.bg-transparent {
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
}

/* Shadow variations */
.header-sticky.shadow-sm {
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.header-sticky.shadow-md {
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.header-sticky.shadow-lg {
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

/* Prevent layout shift */
.header-container {
	position: relative;
}

/* Ensure header content is visible */
.header-sticky * {
	position: relative;
	z-index: 1;
}

/* Fix for dropdown menus */
.header-sticky .dropdown-menu,
.header-sticky .sub-menu {
	z-index: 10000;
}

/* Cart and account icons */
.header-sticky .header-page-link {
	transition: all 0.3s ease;
}

/* Search box in sticky header */
.header-sticky .search-box input {
	transition: all 0.3s ease;
}

/* RTL Support */
[dir="rtl"] .header-sticky {
	left: 0;
	right: 0;
}
.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation .menu-item a {
    color: #000000 !important;
}
.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation .menu-item.current-menu-item a {
    color: #ffffff !important;
}
.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation .menu-item:hover a {
    color: #ffffff !important;
}
.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation .menu-item ul.sub-menu {
    white-space: initial;
    padding-top: 20px !important;
    display: flex !important;
    flex-wrap: wrap !important;
    flex-direction: column !important;
    align-items: flex-start;
}
.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation .menu-item ul.sub-menu a {
    color: #000000 !important;
    padding: 0 0 !important;
}
.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation .menu-item ul.sub-menu a:hover {
    color: #841BA0 !important;
}
.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation .menu-item ul.sub-menu {
    display: initial !important;
    white-space: initial;
    padding-top: 20px !important;
}
.header-sticky .header-search-form form.search-from {
    display: flex;
    flex-direction: row-reverse;
}
.header-sticky .header-search-form form.search-from .search-box {
    margin: 0 0;
}
.header-sticky .wpbingoLogo img {
    max-width: 150px;
    max-height: max-content;
}
.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation #main-navigation ul {
    padding-bottom: 0 !important;
}
.header-sticky  .header-search-form {
    margin: 0 0 !important;
}

@media screen and (max-width: 1440px) {
.header-sticky .search-box, .header-sticky .header-search, .header-sticky .search-form {
    min-width: auto;
}
.header-sticky .main-menu li, .header-sticky .bwp-navigation li, .header-sticky .main-menu > ul > li, .header-sticky .bwp-navigation > ul > li {
    margin: 0 0px !important;
}
.header-sticky .header-left .wpbingo-menu-mobile, .header-sticky .header-left .sticky-menu {
    margin: 0 0;
}
.header-sticky .header-search-form {
    max-width: 25%;
}
#main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu {
    max-width: 1280px !important;
    min-width: 1280px !important;
   
}
}
@media screen and (max-width: 1280px) {
	.header-sticky .wpbingoLogo img {
    max-width: 120px;
}
.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation .menu-item a {
    /* font-size: 12px !important; */
    padding-left: 7px !important;
    padding-right: 7px !important;
}
body .bwp-header .header-search-form .search-from #searchsubmit, body .bwp-header.header-sticky .header-search-form .search-from #searchsubmit2 {
    margin: 0 0 !important;
    padding: 0 15px;
}
#main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu {
    max-width: 1200px !important;
    min-width: 1200px !important;
    left: 49.6% !important;
}
}
@media screen and (max-width: 1200px) {
	/* Prevent horizontal scroll */
	body {
		overflow-x: hidden;
	}
	
	/* Ensure sticky header doesn't overflow */
	.header-sticky {
		max-width: 100vw;
	}
	
	.header-sticky .container {
		max-width: 100% !important;
		padding-left: 15px !important;
		padding-right: 15px !important;
	}
	
	/* Reduce menu spacing */
	.header-sticky .header-left .wpbingo-menu-mobile .bwp-navigation .menu-item a {
    font-size: 11px !important;
    padding: 5px 12px !important;
}
	
	/* Make search form smaller */
	.header-sticky .header-search-form {
		max-width: 200px !important;
		min-width: auto !important;
	}
	
	/* Reduce logo size */
	.header-sticky .wpbingoLogo img {
		max-width: 100px !important;
	}
	
	/* Ensure menu doesn't overflow */
	.header-sticky .header-left .wpbingo-menu-mobile,
	.header-sticky .header-left .sticky-menu {
		flex: 0 1 auto;
	}
	
	.header-sticky .bwp-navigation > ul {
		flex-wrap: nowrap !important;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}
	.header-sticky .main-menu li.menu-item-has-children .sub-menu, .header-sticky .bwp-navigation li.menu-item-has-children .sub-menu, .header-sticky .menu-item-has-children > .sub-menu, .header-sticky #main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu {
    top: 50px !important;
    left: 60% !important;
    right: auto !important;
    max-width: 1150px !important;
    min-width: 1150px !important;
}
#main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu {
    max-width: 1140px !important;
    min-width: 1140px !important;
    left: 49.6% !important;
}
}

@media screen and (max-width: 1150px) {
    .header-sticky .main-menu li.menu-item-has-children .sub-menu, .header-sticky .bwp-navigation li.menu-item-has-children .sub-menu, .header-sticky .menu-item-has-children > .sub-menu, .header-sticky #main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu {
        top: 50px !important;
        left: 58% !important;
        max-width: 1024px !important;
        min-width: 1024px !important;
    }
	#main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu {
    max-width: 992px !important;
    min-width: 992px !important;
    left: 49.6% !important;
}
#main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu .elementor-column {
    padding: 5px !important;
}
}

@media screen and (max-width: 1024px) {
    .header-sticky .main-menu li.menu-item-has-children .sub-menu, .header-sticky .bwp-navigation li.menu-item-has-children .sub-menu, .header-sticky .menu-item-has-children > .sub-menu, .header-sticky #main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu {
        top: 50px !important;
        left: 58% !important;
        max-width: 992px !important;
        min-width: 992px !important;
    }
	.header-sticky #main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu .elementor-column {
    padding: 5px !important;
}
}

@media screen and (max-width: 992px) {
    .header-sticky .main-menu li.menu-item-has-children .sub-menu, .header-sticky .bwp-navigation li.menu-item-has-children .sub-menu, .header-sticky .menu-item-has-children > .sub-menu, .header-sticky #main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu {
        top: 50px !important;
        left: 58% !important;
        max-width: 900px !important;
        min-width: 900px !important;
    }
	#main-navigation ul li.mega-menu.menu-item.mega-menu .sub-menu {
    max-width: 900px !important;
    min-width: 900px !important;
    left: 49.6% !important;
}
}