:root {
	--display-font-family: Lalezar;
	--body-font-family: Hind;

	--font-size: 16px

	--logo-padding: 10px;
	--logo-height: 98px;

	--header-width: 1366px;
	--header-border-position: bottom;
	--header-border-size: 0;
	--header-bg-color: 253 221 74;
	--header-border-color: 0 0 0;

	--brand-color: 61 61 61;
	--brand-color-inverted: 255 15 ;

	--background-color: 255 15 ;
	--text-color: 61 61 61;
	--link-color: 61 61 61;

	--action-color: 201 0 0;
	--action-color-inverted: 255 15 ;

	--announcement-bar-bg-color: 0 0 0;
	--announcement-bar-text-color: 255 255 255;
	--announcement-bar-link-color: 61 61 61;

	--main-navigation-bg-color: 253 221 74;
	--main-navigation-link-color: 0 0 0;
	--main-navigation-link-color-hover: 0 0 255;
	--main-navigation-link-bg-color: 44 81 112;
	--main-navigation-link-font-size: 20px;
	--main-navigation-link-alignment: center;

	--auxiliary-bg-color: transparent;
	--auxiliary-border-color: transparent;
	--auxiliary-link-color: 61 61 61;

	--order-status-bg-color: 245 245 245;
	--order-status-color: 162 162 162;

	--store-menu-bg_color: 248 248 248;
	--store-menu-color: 119 7 ;

	--footer-bg-color: 32 32 32;
	--footer-color: 255 15 ;
	--footer-link-color: 255 15 ;
}

/*Custom Styles*/
/* MOBILE NAV: hide on desktop */
.mobileNav {
    display: none; /* hide by default */
}

/* Only show on mobile */
@media (max-width: 768px) {
    .mobileNav {
        display: flex;             /* show mobile menu */
        justify-content: center;   /* center items horizontally */
        align-items: center;       /* vertical alignment */
        gap: 10px;                 /* spacing between items */
        padding: 0;
        margin: 0 auto;
        list-style: none;
        width: 100%;
    }

    .mobileNav li:nth-child(1),
    .mobileNav li:nth-child(2) {
        display: none !important; /* hide first two items */
    }

    .mobileNav li {
        flex: 0 0 auto;           /* prevent shrinking */
    }

    /* Center the main logo above the mobile menu */
    .logo__container--style2 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        margin-bottom: 10px;
    }
}

/* DESKTOP NAV: show only on desktop */
@media (min-width: 769px) {
    .mainNavigation {
        display: flex; /* ensure desktop menu is visible */
    }
    .mobileNav {
        display: none; /* hide mobile menu */
    }
}