/* =========================================================
   WEATHERDUCK — DARK CHROME (Global)
   Dark green header + footer applied site-wide.
   Loaded after sitemenu-desktop.css & sitemenu-mobile.css
   to override the default light-green styles.
   ========================================================= */


html {
    min-height: 100%;
}

body {
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    flex-direction: column;
}

/* ============================================================
   DESKTOP HEADER
   ============================================================ */

.wdh.wdh--desktop {
    background: #1e2b22 !important;
    border-bottom: 1px solid rgba(255,255,255,0.06);
    padding-top: 0;
    padding-bottom: 0;
}

/* Match content area width: 1120 + 48 = 1168px */
.wdh__wrap {
    width: 1168px !important;
    max-width: 100% !important;
    padding: 14px 24px !important;
}

/* Brand */
.wdh__brand-text,
.wdh__wordmark {
    color: #fff !important;
}

/* Search input — narrower + dark theme */
.wdh__search-wrap {
    flex: 0 1 240px !important;
    width: 240px !important;
}

.wdh__input {
    flex: 0 1 240px !important;
    width: 240px !important;
    background: rgba(255,255,255,0.08) !important;
    border-color: rgba(255,255,255,0.22) !important;
    color: #fff !important;
}

.wdh__input::placeholder {
    color: rgba(255,255,255,0.35) !important;
}

/* CTA button — green on dark */
.wdh__cta,
.wdh__btn--primary,
.wdh__btn--primary:hover,
.wdh__btn--primary:focus,
.wdh__btn--primary:active {
    background: #6bc97f !important;
    color: #1e2b22 !important;
    filter: none !important;
}

.wdh__cta:hover,
.wdh__btn--primary:hover {
    background: #5db96f !important;
}

/* Ghost button (MENU) — dark-aware */
.wdh__btn--ghost {
    background: transparent !important;
    border-color: rgba(255,255,255,0.22) !important;
    color: rgba(255,255,255,0.8) !important;
}

.wdh__btn--ghost:hover {
    background: rgba(255,255,255,0.08) !important;
    color: #fff !important;
}

/* Nav links */
.wdh__link,
.wdh__menu-link {
    color: rgba(255,255,255,0.7) !important;
}

.wdh__link:hover,
.wdh__menu-link:hover {
    color: #fff !important;
}

/* Caret */
.wdh__caret {
    color: rgba(255,255,255,0.6);
}


/* ============================================================
   MOBILE HEADER
   ============================================================ */

.wdm-header--mobile {
    background: #1e2b22 !important;
    border-bottom-color: rgba(255,255,255,0.06) !important;
}

.wdm-wordmark {
    color: #fff !important;
}

.wdm-topbar .wdm-logo img {
    filter: brightness(1.2);
}

/* Burger icon — SVG uses currentColor via stroke */
.wdm-burger-btn {
    color: #fff !important;
}

/* Mobile search */
.wdm-search-input {
    background: rgba(255,255,255,0.08) !important;
    border-color: rgba(255,255,255,0.22) !important;
    color: #fff !important;
}

.wdm-search-input::placeholder {
    color: rgba(255,255,255,0.35) !important;
}

.wdm-search-btn {
    background: #6bc97f !important;
    color: #1e2b22 !important;
}


/* ============================================================
   SITE FOOTER — dark green to match header
   ============================================================ */

.elementor-location-footer,
.elementor-location-footer > footer.e-con,
.elementor-location-footer > .elementor-element,
.site-footer,
.site-footer.dynamic-footer,
footer.elementor-section,
footer#colophon,
.footer-widget-area {
    background: #1e2b22 !important;
    color: rgba(255,255,255,0.6) !important;
    border-top: 1px solid rgba(255,255,255,0.14) !important;
}

.elementor-location-footer,
.site-footer,
footer.elementor-section,
footer#colophon {
    margin-top: auto !important;
    flex-shrink: 0;
}

.elementor-location-footer {
    overflow-x: clip;
}

.elementor-location-footer .e-con,
.elementor-location-footer .e-con-inner,
.elementor-location-footer .elementor-widget-wrap {
    background: transparent !important;
    border-top: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

/* Constrain footer inner content to match header/content width */
.elementor-location-footer > .elementor-element,
.elementor-location-footer > .e-con,
.elementor-location-footer > .elementor-section > .elementor-container,
.elementor-location-footer .elementor-container,
.site-footer .footer-inner {
    max-width: 1168px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
}

.site-footer:not(.dynamic-footer) {
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding-left: max(24px, calc((100vw - 1168px) / 2 + 24px)) !important;
    padding-right: max(24px, calc((100vw - 1168px) / 2 + 24px)) !important;
}

/* Links */
.elementor-location-footer a,
.site-footer a,
.site-footer .site-title,
.site-footer .site-title a,
.site-footer .site-description,
.site-footer .copyright,
.site-footer .copyright p,
footer.elementor-section a,
footer#colophon a {
    color: rgba(255,255,255,0.7) !important;
}

.elementor-location-footer a:hover,
.site-footer a:hover,
footer.elementor-section a:hover,
footer#colophon a:hover {
    color: #fff !important;
}

/* Text widgets */
.elementor-location-footer .elementor-heading-title,
.elementor-location-footer .elementor-widget-text-editor,
.elementor-location-footer p,
.elementor-location-footer span,
.elementor-location-footer .elementor-icon-list-text {
    color: rgba(255,255,255,0.6) !important;
}

/* Icon list icons */
.elementor-location-footer .elementor-icon-list-icon i,
.elementor-location-footer .elementor-icon-list-icon svg {
    color: rgba(255,255,255,0.4) !important;
    fill: rgba(255,255,255,0.4) !important;
}

/* Social icons — circular, properly sized */
.elementor-location-footer .elementor-social-icon {
    background: rgba(255,255,255,0.1) !important;
    border: 1px solid rgba(255,255,255,0.22) !important;
    border-radius: 50% !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    line-height: 1 !important;
}

.elementor-location-footer .elementor-social-icon i {
    color: rgba(255,255,255,0.7) !important;
    font-size: 16px !important;
}

.elementor-location-footer .elementor-social-icon svg {
    width: 16px !important;
    height: 16px !important;
    fill: rgba(255,255,255,0.7) !important;
}

.elementor-location-footer .elementor-social-icon:hover {
    background: rgba(255,255,255,0.2) !important;
}


/* ============================================================
   FOOTER — match header chrome (mobile)
   Footer is rendered by Elementor (template post 47), so we can't
   add our own BEM classes like the header. Target Elementor's
   generic classes + structural selectors only — never hashed IDs.
   ============================================================ */

/* Kill Elementor's green-box burger toggle, mirror .wdm-burger-btn */
.elementor-location-footer .elementor-menu-toggle,
.elementor-location-footer .elementor-menu-toggle.elementor-active {
    background: transparent !important;
    color: #fff !important;
    border: 1px solid rgba(255,255,255,0.22) !important;
    width: 40px !important;
    height: 40px !important;
    padding: 8px !important;
    border-radius: 6px !important;
}

.elementor-location-footer .elementor-menu-toggle svg,
.elementor-location-footer .elementor-menu-toggle i {
    width: 24px !important;
    height: 24px !important;
    fill: #fff !important;
    color: #fff !important;
    font-size: 20px !important;
}

.elementor-location-footer .elementor-menu-toggle:hover,
.elementor-location-footer .elementor-menu-toggle:focus {
    background: rgba(255,255,255,0.08) !important;
}

/* Wordmark — stronger presence, twin the header's WEATHERDUCK weight */
.elementor-location-footer p.elementor-heading-title {
    color: rgba(255,255,255,0.8) !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em !important;
}

/* Replace dotted/faint divider with the same 1px hairline used on header */
.elementor-location-footer .elementor-widget-divider .elementor-divider-separator,
.elementor-location-footer hr {
    border-top: 1px solid rgba(255,255,255,0.06) !important;
    border-bottom: 0 !important;
    background: transparent !important;
}

/* Top row containing burger + wordmark — first child container of the
   footer's inner. Structural selector (not hashed ID) so it survives
   Elementor template re-saves. */
.elementor-location-footer .e-con-inner > .e-con:first-child {
    align-items: center !important;
    padding: 14px 24px !important;
    border-bottom: 1px dotted rgba(255,255,255,0.25) !important;
}

.elementor-location-footer .e-con-inner > .e-con {
    border-top: 0 !important;
}

/* Burger dropdown panel — continue the dark-green chrome */
.elementor-location-footer .elementor-nav-menu--dropdown {
    background: #1e2b22 !important;
    border: 0 !important;
}

/* Menu items inside the dropdown */
.elementor-location-footer .elementor-nav-menu--dropdown a.elementor-item {
    color: rgba(255,255,255,0.85) !important;
    background: transparent !important;
    padding: 14px 24px !important;
    border-top: 1px solid rgba(255,255,255,0.06) !important;
    border-left: 3px solid transparent !important;
}

.elementor-location-footer .elementor-nav-menu--dropdown li:first-child > a.elementor-item {
    border-top: 0 !important;
}

.elementor-location-footer .elementor-nav-menu--dropdown a.elementor-item:hover,
.elementor-location-footer .elementor-nav-menu--dropdown a.elementor-item:focus {
    background: rgba(255,255,255,0.06) !important;
    color: #fff !important;
}

/* Active page (e.g. Forecast when on /forecast/) — green accent */
.elementor-location-footer .elementor-nav-menu--dropdown a.elementor-item.elementor-item-active {
    background: transparent !important;
    color: #fff !important;
    border-left-color: #6bc97f !important;
}