/* Flatsome header skin. Header Builder remains the source of truth for structure/content. */
#header {
    --pony-header-height: 78px;
    position: relative;
    z-index: 1000;
    transition: background-color var(--pony-transition), box-shadow var(--pony-transition), backdrop-filter var(--pony-transition);
}
#header .header-wrapper {
    background: rgba(12,12,12,.93);
    transition: background-color var(--pony-transition), box-shadow var(--pony-transition), backdrop-filter var(--pony-transition);
    box-shadow: 0 1px 0 rgba(255,255,255,.07);
}
#header .header-main,
#header .header-bottom,
#header .header-top { background: transparent; }
#header .header-bg-color {
    background: rgba(12,12,12,.93);
    transition: background-color var(--pony-transition);
}
#header .header-main { min-height: var(--pony-header-height); }
#header .header-inner { min-height: var(--pony-header-height); }
#header #logo img,
#header .logo img { filter: brightness(0) invert(1); }
#header #logo a {
    color: #fff !important;
    font-size: clamp(18px, 1.6vw, 24px);
    font-weight: 600;
    letter-spacing: .15em;
    text-transform: uppercase;
}
#header #logo .site-tagline,
#header #logo .site-description {
    color: rgba(255,255,255,.72) !important;
    font-size: 8px;
    letter-spacing: .28em;
    text-transform: uppercase;
}
#header #logo .site-tagline,
#header #logo .site-description,
#header #logo .site-tagline *,
#header #logo .site-description * { color: rgba(255,255,255,.82) !important; }
#header .nav > li > a,
#header .header-search a,
#header .icon-menu,
#header .header-social-icons a { color: #fff; }
#header .nav > li > a {
    padding-right: 9px;
    padding-left: 9px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .035em;
    text-transform: uppercase;
    transition: color var(--pony-transition), opacity var(--pony-transition);
}
#header .nav > li > a:hover { opacity: .72; }
/* Flatsome emits error links for optional commerce header icons when WooCommerce is absent. */
#header .element-error[title="WooCommerce needed"] { display: none !important; }
#header .nav > li:has(> .element-error[title="WooCommerce needed"]) { display: none !important; }
#header .header-button .button {
    min-height: 42px;
    display: inline-flex;
    align-items: center;
    border: 0;
    border-radius: var(--pony-radius-pill);
    padding: 0 21px;
    background: linear-gradient(135deg, var(--pony-gold-light), var(--pony-gold));
    color: #1c160e;
    box-shadow: none;
}

/* Give the front page the transparent-over-hero appearance from the reference. */
body.pony-front-page #header {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    width: 100%;
    background: transparent;
}
body.pony-front-page #header #top-bar,
body.pony-front-page #header .header-top { display: none !important; }
body.pony-front-page #header .header-wrapper,
body.pony-front-page #header .header-main,
body.pony-front-page #header .header-bottom,
body.pony-front-page #header .header-bg-color {
    background: transparent !important;
}
body.pony-front-page #header:not(.pony-is-scrolled) .header-wrapper {
    background: linear-gradient(180deg, rgba(0,0,0,.58), rgba(0,0,0,.18) 72%, transparent) !important;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
body.pony-front-page #header:not(.pony-is-scrolled) .nav > li > a,
body.pony-front-page #header:not(.pony-is-scrolled) .header-button:not(.is-outline) a,
body.pony-front-page #header:not(.pony-is-scrolled) .header-search a,
body.pony-front-page #header:not(.pony-is-scrolled) .icon-menu,
body.pony-front-page #header:not(.pony-is-scrolled) .header-social-icons a {
    color: #fff;
}
body.pony-design-system #header a[href*="menu_locations"] { display: none !important; }
#header.pony-is-scrolled .header-wrapper {
    background: rgba(12,12,12,.93);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: 0 1px 0 rgba(255,255,255,.07), 0 12px 34px rgba(0,0,0,.12);
}
body.pony-front-page #header.pony-is-scrolled .header-wrapper {
    background: rgba(12,12,12,.93) !important;
}
body.pony-front-page #header.pony-is-scrolled .header-bg-color {
    background: rgba(12,12,12,.93) !important;
}
body.pony-front-page #header.pony-is-scrolled {
    position: fixed;
    top: 0;
}
#header.pony-is-scrolled .nav > li > a,
#header.pony-is-scrolled .header-search a,
#header.pony-is-scrolled .icon-menu,
#header.pony-is-scrolled .header-social-icons a { color: #fff; }

@media (max-width: 849px) {
    #header { --pony-header-height: 64px; }
    #header .header-main { min-height: var(--pony-header-height); }
    #header .header-inner { min-height: var(--pony-header-height); padding-right: 14px; padding-left: 14px; }
    #header .logo img { max-height: 42px; }
    #header .header-button .button { min-height: 38px; padding: 0 15px; font-size: 11px; }
}

/* The logo tagline is emitted as a separate Flatsome element on some header layouts. */
#header .logo-tagline,
#header .logo-tagline * { color: rgba(255,255,255,.82) !important; }

body.admin-bar.pony-front-page #header,
body.admin-bar.pony-front-page #header.pony-is-scrolled { top: 32px; }

@media (max-width: 782px) {
    body.admin-bar.pony-front-page #header,
    body.admin-bar.pony-front-page #header.pony-is-scrolled { top: 46px; }
}
