/* Minimal safety overrides (small). Keep short. */

:root {
    --nav-text: #0C3B26;
    --nav-accent: #2F9E44;
    --gold-start: #FFF8E1;
    --gold-end: #FFF3CD;
}

/* Ensure sidebar visible on desktop */
@media (min-width:768px) {
    body .page > .sidebar,
    aside.sidebar,
    body .sidebar {
        display: block !important;
        width: var(--sidebar-width, 200px) !important;
        flex: 0 0 var(--sidebar-width, 200px) !important;
        position: relative !important;
    }
}

/* Force gold top-row (global, safe & small) */
.top-row {
    background: linear-gradient(180deg, var(--gold-start), var(--gold-end)) !important;
}

/* Ensure nav links in the left sidebar override Bootstrap defaults */
body .sidebar .nav-link,
body .sidebar .nav-link:link,
body .sidebar .nav-link:visited {
    color: var(--nav-text) !important;
    background: transparent !important;
    padding: 0.45rem 0.6rem !important;
    display: block !important;
    border-radius: 6px !important;
}

    body .sidebar .nav-link:hover,
    body .sidebar .nav-link:focus {
        background: rgba(47,158,68,0.06) !important;
        color: var(--nav-accent) !important;
        transform: translateX(3px);
    }

    body .sidebar .nav-link.active {
        background: rgba(47,158,68,0.12) !important;
        color: var(--nav-accent) !important;
        font-weight: 600 !important;
        box-shadow: inset 3px 0 0 var(--nav-accent) !important;
    }

/* Banner: make the image span the full width of the main area (from nav edge to page edge) */

/* remove padding so image aligns with main column edge */
.header-images {
    height: 14rem !important;
    min-height: 8rem !important;
    max-height: 18rem !important;
    padding: 0 !important; /* <-- important: no left/right padding */
    margin: 0 !important;
    box-sizing: border-box !important;
    align-items: stretch !important;
    gap: 0 !important; /* remove gap so image reaches edge */
}

    /* Make the left column fill the entire banner area (right column hidden) */
    .header-images .slogan-left {
        flex: 1 1 auto !important; /* grow to fill remaining main width */
        width: auto !important;
        max-width: none !important;
        min-width: 120px !important;
        display: flex !important;
        align-items: stretch !important;
    }

    /* hide the right column so the image fills the whole main area */
    .header-images .slogan-right {
        display: none !important;
    }

    /* Ensure image covers the full banner area without gaps */
    .slogan-image,
    .header-images .slogan-left img {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        margin: 0 !important;
        padding: 0 !important;
        line-height: 0 !important;
        border: 0 !important;
    }