.quote-btn {position: fixed; top: 64%; right: -44px; transform: rotate(270deg); z-index: 50;}
.quote-btn a {padding: 10px 22px; border-radius: 5px; font-weight:bold;}
/* ___ HEADER ___ */
.topbar, .menu-bar, .menu-links {--_c-gray-100: #f5f5f5; --_c-gray-400: #757575; --_c-border-200: #cbcbcb; --_c-dark-900: #242424; --_c-light-100: #f8f9fa; --_c-light-800: #424242
; --_c-light-900:#0e65d9;  }
.topbar {padding-block: 8px; background-color: var(--_c-gray-100);}
.topbar .wrapper {display: flex; align-items: center; justify-content: space-between;}
.topbar li {display: inline-flex; align-items: center; margin-right: 10px;}
.topbar li a {color: var(--_c-light-800 );}
.topbar li:hover a {color: var(--c-secondary);}
.topbar li:hover svg {fill: var(--c-secondary);}
.topbar ul:nth-child(2) li:hover svg {transform: scale(1.1);}
.topbar ul:nth-child(1) li svg {margin-right: 5px;}
.topbar ul:nth-child(1) li:nth-child(1) {border-right: 1px solid var(--_c-gray-400); padding-right: 10px;}
.menu-bar {position: sticky; top: 0; background-color: #fff; z-index: 50;}
.menu-bar .wrapper {display: flex; align-items: center; justify-content: space-between; gap: 48px; padding-block: 20px;}
.menu-bar ul {display: flex; align-items: center; gap: 20px; margin-left: auto;}
.menu-bar li a {display: flex; align-items: center; cursor: pointer;}
.menu-bar li a:hover svg {fill: var(--c-secondary);}
.menu-bar li svg {fill: var(--_c-light-900);}
.menu-bar li div {margin-left: 10px;}
.menu-bar li div * {display: block; color: var(--c-tertiary);}
.menu-bar li div :first-child {font-size: var(--fs-sm, 18px); font-weight: 600;}
.menu-bar li div :nth-child(2) {font-size: var(--fs-xs, 14px);}
.tel-btn {display: flex; align-items: center; font-size: calc(var(--fs-md) - 2px); font-weight: 600; border-radius: 5px; padding: 6px 12px;}
.menu-links .wrapper {display: flex; align-items: center; justify-content: space-between;}
.menu-links #nav-toggle[data-hidden="true"] {display: none;}
.menu-links #nav-toggle svg {fill: var(--c-secondary);}
.menu-links .nav-links {display: flex; align-items: center; gap: 15px;}
.menu-links .nav-links li {position: relative;}
.menu-links .nav-links > li > a {width: 100%; height: 54px; color: var(--c-tertiary); font-weight: 700; padding: 14px 20px; border-top: 1px solid transparent; font-size:14px; }
.menu-links .nav-links > li:first-child > a {padding-left: 50px; background: no-repeat 20px 50%/24px url(https://www.emenacpackaging.com.au/wp-content/themes/emenac-au/assets/images/icons/nav-list.svg); font-size:16px; }
.menu-links .nav-links > li:first-child:hover > a {background-image: url(https://www.emenacpackaging.com.au/wp-content/themes/emenac-au/assets/images/icons/nav-list-light.svg);}
.menu-links .nav-links > li:not(:first-child) > a:hover {border-top-color: var(--c-secondary); color: var(--c-secondary);}
.menu-links .nav-links > li:not(:first-child) > a:hover:after {filter: var(--fl-secondary);}
.menu-links .nav-links > li svg {margin-right: 5px;}
.menu-links .nav-links > li:first-child {width: 240px; background-color: #f5f5f5;}
.menu-links .nav-links > li:first-child:hover > a {background-color: var(--_c-dark-900); color: #fff;}
.menu-links .nav-links > li:first-child > ul {width: fit-content; grid-template-columns: repeat(4, 1fr);}
.menu-links .nav-links > li:first-child > ul li a { width:290px; color: var(--c-tertiary); padding: 15px 15px 15px 59px;}
.menu-links .nav-links > li:first-child > ul li:nth-child(1) a {background: no-repeat 15px 50%/34px url(https://www.emenacpackaging.com.au/wp-content/themes/emenac-au/assets/images/icons/apparal-icon.webp);}
.menu-links .nav-links > li:first-child > ul li:nth-child(2) a {background: no-repeat 15px 50%/34px url(https://www.emenacpackaging.com.au/wp-content/themes/emenac-au/assets/images/icons/bakery-icon.webp);}
.menu-links .nav-links > li:first-child > ul li:nth-child(3) a {background: no-repeat 15px 50%/34px url(https://www.emenacpackaging.com.au/wp-content/themes/emenac-au/assets/images/icons/cosmetics-icon.webp);}
.menu-links .nav-links > li:first-child > ul li:nth-child(4) a {background: no-repeat 15px 50%/34px url(https://www.emenacpackaging.com.au/wp-content/themes/emenac-au/assets/images/icons/retail-icon.webp);}
.menu-links .nav-links > li:first-child > ul li:nth-child(5) a {background: no-repeat 15px 50%/34px url(https://www.emenacpackaging.com.au/wp-content/uploads/2025/07/5.webp);}
.menu-links .nav-links li ul {position: absolute; top: 54px; left: 0; background-color: #fff; border: 1px solid #00000026; border-radius: 0 0 5px 5px; display: none; z-index: 10;}
.menu-links .nav-links li ul a {width: 100%; text-wrap: nowrap;}
.menu-links .nav-links li > ul li:nth-child(n+1) a:hover {background-color: var(--_c-light-100);}
.menu-links .nav-links > li:not(:first-child):has(> ul) > a::after {position: absolute; top: 24px; right: 6px; width: 14px; height: 4px; background: no-repeat center/cover url(https://www.emenacpackaging.com.au/wp-content/themes/emenac-au/assets/images/icons/caret-down-fill.svg); content: '';}
.menu-links .nav-links > li:not(:first-child) > ul li a {width: 218px; color: var(--c-tertiary); padding: 10px;}
.menu-links .nav-links > li:not(:first-child):hover > ul {display: block;}
.menu-links form {position: relative; width: 100%; max-width: 242px;}
.menu-links form input {width: 100%; height: 51px; border: 1px solid var(--_c-border-200); margin-bottom: 5px; border-radius: 30px; padding-inline: 10px;}
.menu-links form input::-webkit-search-cancel-button {margin-right: 45px;}
.menu-links form button {position: absolute; top: 14px; right: 18px; line-height:1;}
.menu-links form button:hover img {filter: var(--fl-secondary);}
.tel-btn svg {vertical-align: middle; padding-right: 8px; margin: 2px 8px 0 0; border-right: 1px solid #fff;}
:where(.topbar , .topbar *, .menu-bar, .menu-bar *, .menu-links, .menu-links *) {transition: var(--transition);}




@media only screen and (max-width: 1200px) {
:root {
--fs-xl: 32px;
--fs-lg: 28px;
--fs-md: 22px;
}
.menu-links .nav-links {gap: 10px;}
.menu-links .nav-links > li:first-child {width: 220px;}
.menu-links .nav-links > li > a {padding-inline: 12px;}
.menu-links .nav-links > li:not(:first-child) > a::after {right: 0;}
.menu-links .nav-links > li:not(:first-child):has(> ul) > a::after {right: 0;}
.menu-links .nav-links > li:first-child > ul li a { width:240px;}
}

@media only screen and (min-width: 992px) {
	.menu-links .nav-links > li:first-child:hover > ul {display: grid;}
    .menu-links .nav-links li ul {display: none;}
}

@media only screen and (max-width: 991px) {
:root {
--fs-xl: 30px;
--fs-lg: 26px;
--fs-md: 20px;
}
.menu-bar .wrapper {gap: 20px;}
.menu-bar .logo img {width: 130px; height: auto;}
.menu-links #nav-toggle[data-hidden="true"] {display: block;}
.menu-links {position: relative; background-color: var(--_c-gray-100);}
.menu-links .wrapper {align-items: center; padding-block: 7px;}
.menu-links .nav-links {width: 100%; height: fit-content; display: block; background-color: var(--_c-gray-100); padding-top: 15px;}
.menu-links .nav-links {display: none;} 
.menu-links .nav-links > li:first-child {width: auto;}
.menu-links .nav-links li [data-toggle="collapse"] {position: unset; width: auto;}
.menu-links .nav-links li ul {position: unset;}
.menu-links .nav-links > li:first-child > ul {width: 100%;}
.menu-links .nav-links > li:not(:first-child) > ul li a {width: 100%;}
.menu-links .nav-links > li:not(:first-child) > ul {grid-template-columns: repeat(3, 1fr);}
.menu-links .nav-links > li:not(:first-child) > a::after {right: unset;}
.menu-links:has(#nav-toggle[data-hidden="false"]) form {max-width: 100%;}
.menu-bar .logo video{width:180px;}
}

@media only screen and (max-width: 767px) {
:root {
--fs-xl: 28px;
--fs-lg: 24px;
--fs-md: 20px;
}
.menu-bar .wrapper {gap: 20px;}
.menu-bar ul {gap: 10px;}
.menu-bar li div {display: none;}
.menu-bar li svg {margin-top: 3px;}
.menu-links form {max-width: 210px;}
.menu-links form input {height: 46px;}
.menu-links form button {top: 11px;}
.menu-links form button img {width: 18px; height: 18px;}
}

@media only screen and (max-width: 575px) {
:root {
--fs-xl: 26px;
--fs-lg: 22px;
--fs-sm: 16px;
}
.menu-bar .wrapper {gap: 10px;}
.menu-bar .logo video{width:120px;}
.menu-bar .logo img {width: 120px;}
.menu-bar li svg {width: 32px; height: 32px;}
.menu-bar .logo > a {margin-inline: auto;}
.tel-btn {font-size: var(--fs-base); padding-inline: 8px;}
.tel-btn svg {width: 20px; height: 20px; padding-right: 6px; margin-right: 6px;}
.menu-links form {max-width: 190px;}
.menu-links form input {height: 42px;}
.menu-links form button {top: 12px;}
.menu-links form button svg {width: 16px; height: 16px;}
}

@media only screen and (min-width: 476px) and (max-width: 991px) {
	.menu-links .nav-links > li:first-child > ul {grid-template-columns: repeat(2, 1fr);}
}

@media only screen and (max-width: 475px) {
	:root {
	--fs-xl: 22px;
	--fs-md: 18px;
	--fs-xs: 13px;
	}
.quote-btn {right: -34px;}
.quote-btn a {font-size: var(--fs-xs, 14px); padding: 6px 12px;}
.topbar .wrapper {justify-content: center;}
.topbar ul:nth-child(2) {display: none;}
.menu-bar ul {display: none;}
.menu-links .nav-links > li:first-child > ul {grid-template-columns: 1fr;}
}