/* HILLSTATE MENU - HEADER */

@media (min-width: 781px) {
    header {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        max-width: none !important;
        z-index: 9999 !important;
        background: transparent !important;
        transition: transform 0.5s ease, background-color 0.35s ease;		
    }

    header .wp-block-navigation-item__content,
    header .wp-block-navigation-item__content:visited {
        color: #fff !important;
    }

    header .menu-logo-item img {
        filter: brightness(0) invert(1);
        transition: filter 0.35s ease;
    }

    header.header-returned {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        background: #fff !important;
        transform: translateY(0);
        box-shadow: 0 5px 10px rgba(0,0,0,0.08);
    }

    header.header-returned .wp-block-navigation-item__content,
    header.header-returned .wp-block-navigation-item__content:visited {
        color: inherit !important;
    }

    header.header-returned .menu-logo-item img { filter: none; }

    header.header-returned.header-entering { transform: translateY(-100%); }
    header.header-returned.header-entering.header-slide-in { transform: translateY(0); }

    header,
    header > *,
    header .wp-block-group,
    header .wp-block-navigation,
    header .wp-block-navigation__container {
        width: 100% !important;
        max-width: none !important;
    }

    header .wp-block-navigation__container {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        position: relative !important;
		
    }

    header .wp-block-navigation__container > li {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: none !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        margin-left: 0 !important;
        margin-right: 20px !important;
		padding:32px 0;
        position: static !important;
    }

    header .wp-block-navigation__container > li > a {
        width: auto !important;
        max-width: none !important;
        white-space: nowrap !important;
    }

    header .wp-block-navigation__container > .menu-logo-item {
        flex: 1 1 auto !important;
        width: auto !important;
        max-width: none !important;
        margin-left: 20px !important;
        margin-right: 20px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: static !important;
        transform: none !important;
		padding:10px 3rem 10px 0;
    }

    header .menu-logo-link {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    header .menu-logo-item img {
        width: 40px !important;
        max-width: 40px !important;
        height: auto !important;
        display: block !important;
    }

    header .wp-block-navigation__container > li:nth-child(7),
    header .wp-block-navigation__container > li:nth-child(8),
    header .wp-block-navigation__container > li:nth-child(9) {
        flex: 0 0 auto !important;
        width: auto !important;
        margin-left: 0 !important;
        margin-right: 20px !important;
    }

    header .wp-block-navigation__container > li:last-child { margin-right: 0 !important; }
    header .wp-block-site-logo { display:none !important; }
	

	/* Underline Effect */
	header .wp-block-navigation__container > li a{position:relative;}
	header .wp-block-navigation__container > li a::after {
	    content: "";
	    position: absolute;
	    bottom: -10px;
	    left: 50%;
	    width: 0%;
	    height: 2px;
	    background-color: currentColor;
	    transition: all 0.25s ease;
	}
	header .wp-block-navigation__container > li a:hover::after,
	header .wp-block-navigation__container > li.current-menu-item a::after {width:14px; left: calc(50% - 7px)}
	header .wp-block-navigation__container > li li a::after,
	header .wp-block-navigation__container > li.menu-logo-item a::after {display:none;}
	
	
	
	
	/* Submenu drop-down */
    header .wp-block-navigation__submenu-container {
        border: 0 !important;
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 40px !important;
		width: 92vw !important;
		max-width: 92vw !important;
        min-width: 0 !important;
        padding: 24px 0 !important;
        box-sizing: border-box !important;
        background-color: transparent !important;
		box-shadow: none !important;
        position: absolute !important;
        left: 0px !important;
        top: 100% !important;
        right: auto !important;
        isolation: isolate !important;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.22s ease-in-out, visibility 0.22s ease-in-out;
    }

    /* Use four columns on desktop only when a submenu has exactly four items. */
    header .wp-block-navigation__submenu-container:has(> li:nth-child(4):last-child) {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    /* Fade the dropdown in when its parent menu item is hovered or focused */
    header .wp-block-navigation-submenu:hover > .wp-block-navigation__submenu-container,
    header .wp-block-navigation-submenu:focus-within > .wp-block-navigation__submenu-container {
        opacity: 1;
        visibility: visible;
    }

    /* Full-browser-width backdrop behind the existing submenu content */
    header .wp-block-navigation__submenu-container::before {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: -4vw;
        width: 100vw;
        background-color: var(--wp--preset--color--custom-dark-2);
        box-shadow: 0 5px 10px rgba(0,0,0,0.08);
        z-index: -1;
        pointer-events: none;
    }

    /* Invisible hover bridge: covers any gap between the parent item and the dropdown
       so the pointer never leaves the parent li while moving down into the submenu */
    header .wp-block-navigation__submenu-container::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 100%;
        height: 40px;
        background: transparent;
    }

    header .wp-block-navigation__submenu-container > li {
        width: auto !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        display: block !important;
    }

    header .wp-block-navigation__submenu-container > li > a.navigation-link-has-image {
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        width: 100% !important;
        max-width: none !important;
        gap: 18px !important;
        margin: 0 !important;
        padding: 0 !important;
        white-space: normal !important;
    }

    header .wp-block-navigation__submenu-container > li > a.navigation-link-has-image .navigation-link-image-wrap {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 2 / 1 !important;
        flex: none !important;
        margin: 0 !important;
        overflow: hidden !important;
    }

    header .wp-block-navigation__submenu-container > li > a.navigation-link-has-image .navigation-link-image {
        display:block !important;
        width:100% !important;
        height:100% !important;
        max-width:none !important;
        object-fit:cover !important;
		object-position: center center !important;
        margin:0 !important;
        padding:0 !important;		
    }

    header .wp-block-navigation__submenu-container > li > a.navigation-link-has-image {
        font-size: inherit !important;
        line-height: 1.2 !important;
    }

    header .wp-block-navigation__submenu-container > li > a.navigation-link-has-image .wp-block-navigation__submenu-icon {
        display:none !important;
    }
	
	.wp-block-navigation-submenu .wp-block-navigation__submenu-icon svg {
	    stroke: white !important
	}
	header.header-returned .wp-block-navigation-submenu .wp-block-navigation__submenu-icon svg {
	    stroke: var(--wp--preset--color--custom-dark-1) !important
	}
}



/* Returned white header: desktop dropdown uses white background and default/dark text */
@media (min-width: 781px) {
    header.header-returned .wp-block-navigation__submenu-container {
        background-color: transparent !important;
    }

    header.header-returned .wp-block-navigation__submenu-container::before {
        background-color: #fff !important;
    }

    header.header-returned .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
    header.header-returned .wp-block-navigation__submenu-container .wp-block-navigation-item__content:visited {
        color: inherit !important;
    }
}


/* Mobile header positioning: scroll away, then slide back in as a fixed header. */
@media (max-width: 780px) {
    header {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        max-width: none !important;
        z-index: 9999 !important;
        background: transparent !important;
        transition: transform 0.5s ease, background-color 0.35s ease;
    }

    /* Match desktop colours while the mobile header is over the page. */
    header .custom-logo,
    header .site-logo img,
    header .wp-block-site-logo img {
        filter: brightness(0) invert(1);
        transition: filter 0.35s ease;
    }

    header .wp-block-navigation__responsive-container-open,
    header .wp-block-navigation__responsive-container-open svg,
    header .wp-block-navigation__responsive-container-open svg * {
        color: #fff !important;
        fill: #fff !important;
        stroke: #fff !important;
    }

    header.header-returned {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        background: #fff !important;
        transform: translateY(0);
        box-shadow: 0 5px 10px rgba(0,0,0,0.08);
    }

    /* Restore the logo and burger icon to their normal colours on white. */
    header.header-returned .custom-logo,
    header.header-returned .site-logo img,
    header.header-returned .wp-block-site-logo img {
        filter: none;
    }

    header.header-returned .wp-block-navigation__responsive-container-open,
    header.header-returned .wp-block-navigation__responsive-container-open svg,
    header.header-returned .wp-block-navigation__responsive-container-open svg * {
        color: inherit !important;
        fill: currentColor !important;
        stroke: currentColor !important;
    }

    header.header-returned.header-entering {
        transform: translateY(-100%);
    }

    header.header-returned.header-entering.header-slide-in {
        transform: translateY(0);
    }
}


/* Desktop keyboard accessibility: keep the full dropdown panel open and visible
   when its trigger or any item inside it receives keyboard focus. */
@media (min-width: 781px) {
    header .wp-block-navigation__container > .wp-block-navigation-submenu:focus-within > .wp-block-navigation__submenu-container,
    header .wp-block-navigation__container > .wp-block-navigation-submenu:focus > .wp-block-navigation__submenu-container,
    header .wp-block-navigation__container > .wp-block-navigation-submenu.has-child-open > .wp-block-navigation__submenu-container {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        width: 92vw !important;
        max-width: 92vw !important;
        min-width: 0 !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        clip: auto !important;
        clip-path: none !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        transform: none !important;
        z-index: 10000 !important;
    }

    header .wp-block-navigation__container > .wp-block-navigation-submenu:focus-within > .wp-block-navigation__submenu-container:has(> li:nth-child(4):last-child) {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    /* Keep submenu labels readable and make keyboard focus unmistakable. */
    header .wp-block-navigation__submenu-container > li,
    header .wp-block-navigation__submenu-container > li > a {
        min-height: 0 !important;
        height: auto !important;
        visibility: visible !important;
    }

    header .wp-block-navigation__submenu-container a:focus-visible,
    header .wp-block-navigation__container > li > a:focus-visible,
    header .wp-block-navigation__submenu-icon:focus-visible {
        outline: 3px solid currentColor !important;
        outline-offset: 4px !important;
        border-radius: 2px;
    }
}


/* ==========================================================================
   BOOK NOW BUTTON
   Desktop only: sits on the far right of the header.
   Mobile is left to the theme.
   ========================================================================== */

@media (min-width: 781px) {
    header .hillstate-book-now {
        position: absolute !important;
        right: 4vw !important;
        left: auto !important;
        top: 50% !important;
        bottom: auto !important;
        transform: translateY(-50%) !important;
        width: auto !important;
        max-width: none !important;
        margin: 0 !important;
        z-index: 10001 !important;
        display: flex !important;
        align-items: center !important;
    }

    header .hillstate-book-now a {
        white-space: nowrap !important;
    }

    /* Keep the last menu item clear of the button. */
    header .wp-block-navigation__container {
        padding-right: var(--hillstate-book-space, 0px) !important;
        box-sizing: border-box !important;
    }
}
