/*--------------------- Menu Desktop ---------------------*/
	.ula-cart-icon {
		display: block;
		flex: 0 0 auto;
		vertical-align: middle;
	}
	#cart-target > a.cart {
		color: #e5dfd9 !important;
	}
	#cart-target > a.cart .ula-cart-icon {
		width: 20px;
		height: 20px;
	}
	.mainMenu {position:relative;z-index: 9999;}
  .mainMenu.search-actived {z-index: 99;}
	#nav .main-nav * {
		-webkit-backface-visibility: hidden;
		-moz-backface-visibility: hidden;
		-o-backface-visibility: hidden;
		backface-visibility: hidden
	}
	#nav nav.main-nav ul li a {color:#fff;}
	#nav nav.main-nav ul li a:hover {color:#fff;}
	#nav .main-nav>ul>li {position: relative; float: none;display: inline-block;z-index: 10}
	#nav .main-nav > ul>li>a {
		display: block;	font-size: 15px;
		font-weight: 400;	padding: 10px 0 15px;
		margin:0 12px;	position: relative;
		text-decoration: none;
	}
	#nav .main-nav > ul>li>a:before {
		position: absolute;
		content: '';
		bottom: 0;
		left: 0;
		width: 100%;
		opacity: 0;
		-webkit-transform: scale(0, 1);
		transform: scale(0, 1);
		-webkit-transform-origin: left center;
		transform-origin: left center;
		border-bottom: 2px solid #fff;
		-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
		transition: opacity 0.3s, -webkit-transform 0.3s;
		transition: transform 0.3s, opacity 0.3s;
		transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s;
	}
	#nav .main-nav > ul>li>a:hover:before, 
	#nav .main-nav > ul>li.active>a:before {	opacity:1;-webkit-transform: scale(1, 1);	transform: scale(1, 1);}
	#nav .main-nav ul {	padding-left: 0;margin:0;}
	@media (min-width: 1025px) {
		#nav .main-nav > ul.header-nav-sections {
			display: flex;
			align-items: center;
			justify-content: center;
			flex-wrap: wrap;
		}
		#nav .main-nav > ul.header-nav-sections > li.main-nav-item--desktop-hidden {
			display: none !important;
		}
		#nav .main-nav > ul.header-nav-sections > li.main-nav-item--desktop-last {
			order: 999;
		}
	}
	#nav .main-nav ul>li a i {
		display: inline-block;
		vertical-align: middle;
		font-size: 9px;
		margin-left: 4px;
		margin-bottom: 2px;
	}
	#nav .main-nav .sub_menu {

		background: #fff;
		position: absolute;
		z-index:999;min-width:120px;
		-webkit-box-shadow:  2px 4px 12px rgba(0,0,0,.1);
		-moz-box-shadow: 2px 4px 12px rgba(0,0,0,.1);
		-o-box-shadow: 2px 4px 12px rgba(0,0,0,.1);
		-ms-box-shadow: 2px 4px 12px rgba(0,0,0,.1);
		box-shadow:2px 4px 12px rgba(0,0,0,.1);
		-webkit-transform: rotate3d(1,0,0,-90deg);
		-moz-transform: rotate3d(1,0,0,-90deg);
		-o-transform: rotate3d(1,0,0,-90deg);
		-ms-transform: rotate3d(1,0,0,-90deg);
		transform: rotate3d(1,0,0,-90deg);
		-webkit-transform-origin: 0 0 0;
		-moz-transform-origin: 0 0 0;
		-o-transform-origin: 0 0 0;
		-ms-transform-origin: 0 0 0;
		transform-origin: 0 0 0;
		-webkit-transition: all .5s ease;
		-moz-transition: all .5s ease;
		-o-transition: all .5s ease;
		transition: all .5s ease;
	}
	#nav .main-nav ul>li>ul {top: 100%;margin-top:-2px;border-top:2px solid #5c5c5c;}
	#nav .main-nav li:hover>.sub_menu,
	#nav .main-nav li.is-open>.sub_menu {
		-webkit-transform: rotate3d(0,0,0,0deg);
		-moz-transform: rotate3d(0,0,0,0deg);
		-o-transform: rotate3d(0,0,0,0deg);
		-ms-transform: rotate3d(0,0,0,0deg);
		transform: rotate3d(0,0,0,0deg);
	}
	#nav .main-nav .sub_menu a {padding: 9px 18px;white-space: nowrap;	text-align: left;	display: block;	font-size: 14px;color: #000;text-decoration: none;}
	#nav .main-nav .sub_menu a:hover{
		color:#000!important;
		text-decoration: underline;
	}
	#nav .main-nav .sub_menu.menu-lv-2 li a:hover{ 
		background-color:#ddd;
	}
	#nav .main-nav .sub_menu.menu-lv-2 li ul.menu-lv-3 {
	
	}
	#nav .main-nav .sub_menu.menu-lv-2 li ul.menu-lv-3::-webkit-scrollbar {
		width: 5px;
	}

	#nav .main-nav .sub_menu.menu-lv-2 li ul.menu-lv-3::-webkit-scrollbar-thumb {
		background: #ccc;
		border-radius: 10px;
	}
		#nav .main-nav .sub_menu .sub_menu {
			left: 100%;top: -2px;margin-left: 0px;margin-top: 0;
			-webkit-transform: rotate3d(0,1,0,90deg);-moz-transform: rotate3d(0,1,0,90deg);
			-o-transform: rotate3d(0,1,0,90deg);-ms-transform: rotate3d(0,1,0,90deg);transform: rotate3d(0,1,0,90deg)
		}
		#nav .main-nav .sub_menu li:not(:first-child) {	border-top: 1px solid #ecf0f1}
		#nav .main-nav .sub_menu.menu-lv-2--brands {
			top: calc(100% + 6px);
			margin-top: 0;
			left: 50%;
			right: auto;
			width: min(840px, calc(100vw - 40px));
			min-width: 620px;
			max-height: min(560px, calc(100vh - 140px));
			padding: 10px 0;
			display: grid;
			grid-template-columns: repeat(3, minmax(0, 1fr));
			overflow-y: auto;
			overflow-x: hidden;
			overscroll-behavior: contain;
			scrollbar-gutter: stable;
			-webkit-transform: translateX(-50%) rotate3d(1,0,0,-90deg);
			-moz-transform: translateX(-50%) rotate3d(1,0,0,-90deg);
			-o-transform: translateX(-50%) rotate3d(1,0,0,-90deg);
			-ms-transform: translateX(-50%) rotate3d(1,0,0,-90deg);
			transform: translateX(-50%) rotate3d(1,0,0,-90deg);
			-webkit-transform-origin: 50% 0 0;
			-moz-transform-origin: 50% 0 0;
			-o-transform-origin: 50% 0 0;
			-ms-transform-origin: 50% 0 0;
			transform-origin: 50% 0 0;
		}
		#nav .main-nav li:hover>.sub_menu.menu-lv-2--brands,
		#nav .main-nav li.is-open>.sub_menu.menu-lv-2--brands {
			-webkit-transform: translateX(-50%) rotate3d(0,0,0,0deg);
			-moz-transform: translateX(-50%) rotate3d(0,0,0,0deg);
			-o-transform: translateX(-50%) rotate3d(0,0,0,0deg);
			-ms-transform: translateX(-50%) rotate3d(0,0,0,0deg);
			transform: translateX(-50%) rotate3d(0,0,0,0deg);
		}
		#nav .main-nav .sub_menu.menu-lv-2--brands li {
			min-width: 0;
			border-top: 1px solid #ecf0f1;
			break-inside: avoid;
		}
		#nav .main-nav .sub_menu.menu-lv-2--brands li:nth-child(-n+3) {
			border-top: 0;
		}
		#nav .main-nav .sub_menu.menu-lv-2--brands li:not(:nth-child(3n+1)) {
			border-left: 1px solid #ecf0f1;
		}
		#nav .main-nav .sub_menu.menu-lv-2--brands a {
			padding: 16px 20px;
			font-size: 15px;
			font-weight: 500;
			line-height: 1.35;
			white-space: normal;
		}
		#nav .main-nav .sub_menu.menu-lv-2--brands .menu-lv-2--brands-cta {
			grid-column: 1 / -1;
			border-left: 0 !important;
			border-top: 1px solid #d8d8d8;
			background: #fff;
		}
		#nav .main-nav .sub_menu.menu-lv-2--brands .menu-lv-2--brands-cta a {
			padding: 18px 24px;
			text-align: center;
			font-size: 14px;
			font-weight: 700;
			letter-spacing: 0.04em;
			text-transform: uppercase;
			background: #111;
			color: #fff;
		}
		#nav .main-nav .sub_menu.menu-lv-2--brands .menu-lv-2--brands-cta a:hover {
			background: #2c2c2c;
			color: #fff !important;
			text-decoration: none;
		}
		#nav .main-nav .sub_menu.menu-lv-2--brands::-webkit-scrollbar {
			width: 8px;
		}
		#nav .main-nav .sub_menu.menu-lv-2--brands::-webkit-scrollbar-thumb {
			background: #cfcfcf;
			border-radius: 999px;
		}
		@media (max-width: 1366px) {
			#nav .main-nav .sub_menu.menu-lv-2--brands {
				width: min(680px, calc(100vw - 32px));
				min-width: 520px;
				grid-template-columns: repeat(2, minmax(0, 1fr));
			}
			#nav .main-nav .sub_menu.menu-lv-2--brands li:nth-child(-n+3) {
				border-top: 1px solid #ecf0f1;
			}
			#nav .main-nav .sub_menu.menu-lv-2--brands li:nth-child(-n+2) {
				border-top: 0;
			}
			#nav .main-nav .sub_menu.menu-lv-2--brands li:not(:nth-child(3n+1)) {
				border-left: 0;
			}
			#nav .main-nav .sub_menu.menu-lv-2--brands li:not(:nth-child(2n+1)) {
				border-left: 1px solid #ecf0f1;
			}
		}
		@media (min-width: 1025px) and (max-height: 760px) {
			#nav .main-nav .sub_menu.menu-lv-2--brands {
				max-height: calc(100vh - 120px);
			}
			#nav .main-nav .sub_menu.menu-lv-2--brands a {
				padding-top: 14px;
				padding-bottom: 14px;
			}
		}
		nav .main-nav ul>li:hover>a i,
		nav .main-nav ul>li.is-open>a i {
			margin-bottom:0;
			-webkit-transform: rotate(180deg);-moz-transform: rotate(180deg);
		-ms-transform: rotate(180deg);-o-transform: rotate(180deg);transform: rotate(180deg);	
	}
	#nav .main-nav ul li .sub_menu li{position: relative}


    #header-main .logo-new .tab-logo {
        background-image: var(--ula-logo-light);
    }

    #header-main.header-logo--full .logo-new .tab-logo {
        background-image: var(--ula-logo-full);
    }

    #header-main .header-co-brand {
        display: none;
    }

    @media (min-width: 992px) {
        #header-main .logo-new {
            pointer-events: none;
        }

        #header-main .logo-new .tab-logo,
        #header-main .header-co-brand,
        #header-main .header-co-brand__brand,
        #header-main .header-co-brand__brand img {
            pointer-events: auto;
        }
    }

    /* --- Smart Mobile Header Styles --- */
    @media (max-width: 991px) {
        #header-main {
            position: fixed !important;
            top: 0;
            left: 0;
            width: 100%;
            z-index: 9999;
            transition: transform 0.3s ease-in-out, background 0.3s, box-shadow 0.3s;
            /* Initial State: Transparent with Dark Gradient for White Logo */
            background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 100%);
            box-shadow: none;
            border-bottom: none;
        }

        #header-main .logo-new {
            top: calc(env(safe-area-inset-top, 0px) + 10px);
            left: 50%;
            transform: translateX(-50%);
            width: auto;
            max-width: calc(100% - 24px);
            justify-content: center;
            align-items: center;
        }

        #header-main .logo-new .tab-logo {
            top: 0;
            width: 50px;
            height: 26px;
            background-size: 50px 26px;
            flex: 0 0 auto;
        }

        #header-main .header-co-brand {
            display: inline-flex;
            align-items: center;
            min-width: 0;
            flex: 0 1 auto;
        }

        #header-main .header-co-brand__divider {
            display: block;
            width: 1px;
            height: 18px;
            margin: 0 9px 0 10px;
            background: rgba(255, 255, 255, 0.86);
            flex: 0 0 auto;
        }

        #header-main .header-co-brand__brand {
            display: inline-flex;
            align-items: center;
            justify-content: flex-start;
            min-width: 0;
            line-height: 0;
            flex: 0 1 auto;
            width: auto;
            height: auto;
            position: static;
            top: auto;
            background: none;
            background-image: none;
            font-size: 0;
            z-index: 1;
        }

        #header-main .header-co-brand__brand img {
            display: block;
            width: auto;
            height: 24px;
            max-height: 24px;
            max-width: min(160px, calc(100vw - 126px));
            object-fit: contain;
        }

        /* 1. Scroll Down -> Hide */
        #header-main.header-hidden {
            transform: translateY(-100%);
        }

        /* 2. Scroll Up -> Show (Solid/Blur Background) */
        #header-main.header-visible {
            transform: translateY(0);
            background: rgba(20, 20, 20, 0.95); /* Solid Dark */
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }
        
        /* Force Logo Color on Dark Background (White) */
        #header-main.header-visible .tab-logo {
            color: #fff !important; /* White Logo */
        }
        
        /* Adjust page top padding if needed, but since it's overlay, maybe not */
    }