/* ========================================
   BISHOP BROTHERS CONSTRUCTION
   Custom Header & Footer Overrides
   ======================================== */

/* ---- HIDE SEARCH ---- */
.search-box {
    display: none !important;
}

/* ---- FIX HEADER HEIGHT ---- */
/* Prevent double vertical scrollbars: only html should scroll */
body {
    overflow: visible !important;
}

/* The theme sets #header to 12rem but only uses top half. Fix to single row. */
#header {
    height: 5rem !important;
    min-height: 5rem !important;
}

#header > .grid,
#header .logo,
#header #navbar,
#header .social-navigation {
    height: 100% !important;
}

/* ---- REMOVE THEME'S FIXED STYLES ---- */
#header .fixed {
    background: none !important;
    padding: 0 !important;
    position: static !important;
    opacity: 1 !important;
    box-shadow: none !important;
}

/* ---- FIXED HEADER: PURE CSS ---- */
/* Theme uses position:absolute which scrolls away and body/html overflow:hidden
   breaks sticky. Use fixed so the header always stays at the viewport top. */
#header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 10000 !important;
}

/* Ensure body padding accounts for fixed header height on subpages */
body:not(.header-image) #body {
    padding-top: 6rem !important;
}

/* Remove the old sticky rule on navbar — header itself is now fixed */
#header #navbar {
    position: static !important;
}

/* ---- HOMEPAGE: TRANSPARENT OVER HERO ---- */
body.header-image #header {
    border-bottom: 2px solid rgba(255, 255, 255, 0.6) !important;
    background-color: rgba(0, 0, 0, 0.6) !important;
    box-shadow: none !important;
}

body.header-image #header #navbar {
    background: transparent !important;
}

body.header-image #header #navbar ul.navigation li a {
    color: #fff !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

body.header-image #header #navbar ul.navigation li.active > a,
body.header-image #header #navbar ul.navigation li a:hover,
body.header-image #header #navbar ul.navigation li a.active {
    color: #fff !important;
}

body.header-image #header #navbar ul.navigation li a::before {
    background-color: #fff !important;
}

body.header-image #header .panel-activation {
    color: #fff !important;
}

/* ---- NON-HOMEPAGE: DARK HEADER ---- */
body:not(.header-image) #header {
    background-color: #333 !important;
    border-bottom: 2px solid rgba(255, 255, 255, 0.4) !important;
    box-shadow: none !important;
}

body:not(.header-image) #header #navbar {
    background: #333 !important;
}

body:not(.header-image) #header #navbar ul.navigation li a {
    color: #fff !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

body:not(.header-image) #header #navbar ul.navigation li a:hover,
body:not(.header-image) #header #navbar ul.navigation li a.active {
    color: #fff !important;
}

body:not(.header-image) #header #navbar ul.navigation li a::before {
    background-color: #fff !important;
}

body:not(.header-image) #header .panel-activation {
    color: #fff !important;
}

/* ---- FULLWIDTH / HERO OVERLAP ---- */
.fullwidth #body {
    padding-top: 0;
}

/* Pull hero up under the transparent header */
body.header-image .modular-row.showcase.flush-top,
body.header-image #content-slide,
body.header-image #content-slide .slideme {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* ========================================
   FULL-WIDTH OVERRIDE — HEADER / FOOTER / BODY
   ======================================== */

/* Remove side padding from the outer wrapper elements */
#header,
.footer,
#body,
.fullwidth #header,
.fullwidth .blog-header,
.fullwidth .blog-content-item,
.fullwidth .content-wrapper,
.fullwidth ul.pagination,
.fullwidth #body > .modular-row {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* Center the navbar items */
#navbar {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}

/* Override theme's float-left nav */
#header #navbar ul.navigation {
    float: none !important;
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    margin: 0 auto !important;
    padding: 0 !important;
    width: auto !important;
}

/* Center footer content */
.footer .footer-items,
.footer .footer-modules {
    max-width: none;
    padding-left: 4rem;
    padding-right: 4rem;
}

@media only all and (min-width: 60em) {
    .footer .footer-items,
    .footer .footer-modules {
        padding-left: 6rem;
        padding-right: 6rem;
    }
}

/* Distribute footer modules evenly */
.footer .footer-items {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 2rem;
}

.footer .footer-module,
.footer .footer-module.large {
    float: none !important;
    width: auto !important;
    flex: 1 1 250px;
    padding-right: 0 !important;
}

/* Copyright row spacing */
.footer .footer-modules {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}

.footer .footer-copyright,
.footer .footer-menu {
    float: none !important;
    width: auto !important;
}

/* Footer links: default is #333 on #333, make them visible */
.footer a {
    color: #fff !important;
}

.footer a:hover {
    color: #f0c040 !important;
}

/* ========================================
   SHOWCASE / HERO HEIGHT
   ======================================== */
.modular .showcase,
#content-slide,
#content-slide .slideme {
    height: 600px !important;
    max-height: 600px !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
}

/* Show the top of portrait/phone photos instead of cropping from center */
.modular .showcase {
    background-position: center top !important;
    position: relative !important;
}

/* Dark overlay between photo and text */
.modular .showcase::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 1;
}

/* Ensure text sits above the overlay */
.showcase-content,
.showcase-content-fullscreen {
    position: relative;
    z-index: 2;
}

/* ========================================
   HERO TEXT — CLEAR HEADER
   ======================================== */
.showcase-content,
.showcase-content-fullscreen {
    padding-top: calc(6rem + 175px) !important;
    position: relative;
    z-index: 1;
}
