/**
 * Header Footer CSS - Essential layout fixes for header/footer positioning + mobile menu fix
 */

/* Fix missing CSS custom properties from MonoWP theme.json */
:root {
    --wp--style--root--padding-top: 1rem;
    --wp--style--root--padding-right: 1rem;
    --wp--style--root--padding-bottom: 1rem;
    --wp--style--root--padding-left: 1rem;
}

/* Header layout - ensure flex container and space between elements */
.weernormaal-weather-page #header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
}

/* Navigation positioning - align to right */
.weernormaal-weather-page #header .wp-block-group:last-child {
    flex-wrap: nowrap !important;
    gap: var(--wp--preset--spacing--40) !important;
    margin-left: auto !important;
}

/* Navigation color inheritance */
.weernormaal-weather-page .wp-block-navigation {
    color: var(--wp--preset--color--extra) !important;
}

/* Copy exact CSS from working homepage */
.weernormaal-weather-page .wp-block-navigation__responsive-container {
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
}

.weernormaal-weather-page .wp-block-navigation__responsive-close {
    width: 100%;
}

.weernormaal-weather-page .wp-block-navigation__responsive-dialog {
    position: relative;
}

.weernormaal-weather-page .wp-block-navigation__responsive-container-close {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}

/* Mobile navigation menu spacing fix - uses CSS custom properties with fallbacks */
.weernormaal-weather-page .wp-block-navigation__responsive-container.is-menu-open {
    padding: clamp(1rem, var(--wp--style--root--padding-top, 1rem), 20rem) 
             clamp(1rem, var(--wp--style--root--padding-right, 1rem), 20rem) 
             clamp(1rem, var(--wp--style--root--padding-bottom, 1rem), 20rem) 
             clamp(1rem, var(--wp--style--root--padding-left, 1rem), 20rem) !important;
}

/* Footer fixes - right-align the site title and tagline */
.weernormaal-weather-page .wp-block-site-title {
    margin-bottom: 0.5rem !important;
    text-align: right !important;
}

.weernormaal-weather-page .wp-block-site-tagline {
    margin-top: 0 !important;
    text-align: right !important;
}

/* Right-align and style the copyright section */
.weernormaal-weather-page .is-content-justification-right {
    justify-content: flex-end !important;
    text-align: right !important;
    margin-top: var(--wp--preset--spacing--60) !important;
    margin-bottom: var(--wp--preset--spacing--40) !important;
}

.weernormaal-weather-page .is-content-justification-right p {
    text-align: right !important;
    margin: 0 !important;
}

/* Fix spacing between copyright text parts */
.weernormaal-weather-page .is-content-justification-right p:last-child {
    margin-left: 3px !important;
}