/* Red, Black, and White Theme Overrides */
:root, [data-bs-theme="light"] {
    --bs-primary: #e60000;
    --bs-primary-rgb: 230, 0, 0;
    --bs-link-color: #e60000;
    --bs-link-hover-color: #cc0000;
    --primary-color: #e60000;
    --bs-body-bg: #ffffff;
    --bs-body-color: #000000;
}

[data-bs-theme="dark"] {
    --bs-primary: #e60000;
    --bs-primary-rgb: 230, 0, 0;
    --bs-link-color: #ff4d4d;
    --bs-link-hover-color: #ff8080;
    --primary-color: #e60000;
    --bs-body-bg: #000000;
    --bs-body-color: #ffffff;
    --bs-dark: #000000;
    --bs-dark-rgb: 0, 0, 0;
}

/* Force buttons to be red */
.btn-primary {
    --bs-btn-bg: #e60000;
    --bs-btn-border-color: #e60000;
    --bs-btn-hover-bg: #cc0000;
    --bs-btn-hover-border-color: #b30000;
    --bs-btn-active-bg: #b30000;
    --bs-btn-active-border-color: #990000;
}

.btn-outline-primary {
    --bs-btn-color: #e60000;
    --bs-btn-border-color: #e60000;
    --bs-btn-hover-bg: #e60000;
    --bs-btn-hover-border-color: #e60000;
    --bs-btn-active-bg: #e60000;
    --bs-btn-active-border-color: #e60000;
}

/* Utility class overrides */
.text-primary { color: #e60000 !important; }
.bg-primary { background-color: #e60000 !important; }
.bg-dark { background-color: #000000 !important; }
.text-white { color: #ffffff !important; }
.navbar { background-color: #000000 !important; }

/* Base styles */
body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
.hero { background-size: cover; background-position: center; }


/* Transparent title text for Define Graphics */
.visually-hidden {
    color: transparent !important;
    -webkit-background-clip: text;
    background-clip: text;
}

/* Logo size adjustments added 2026-04-04 */


.navbar-brand img {
    max-height: none !important; /* Override any max-height from Bootstrap */
    height: 240px; /* Match HTML height */
    width: auto;
}

/* On mobile, scale down logo */
@media (max-width: 768px) {
    .navbar-brand img {
        height: 120px; /* Half size on mobile */
    }
    
}

/* Fix navbar alignment - logo width constraint */
.navbar-brand {
    display: flex;
    align-items: center;
    max-width: 300px; /* Limit brand width to prevent pushing navbar */
}
.navbar-brand img {
    max-width: 100%; /* Ensure logo scales within brand */
    height: auto; /* Keep aspect ratio */
}
/* Ensure navbar-collapse stays properly spaced */

/* On mobile, allow logo to be smaller */
@media (max-width: 768px) {
    .navbar-brand {
        max-width: 200px;
    }
    .navbar-brand img {
        height: 120px; /* Keep mobile height */
        width: auto;
    }
}

/* Adjust navbar alignment */
.navbar .container {
    justify-content: space-between;
    align-items: center;
}


/* If we want the menu items to be centered, but keep the logo on left and toggle on right */
/* Alternatively, we can keep the default Bootstrap behavior (space-between) and adjust the logo width */

/* Navbar alignment fix - balanced layout */
.navbar .container {
    justify-content: space-around; /* Evenly distribute brand and menu */
    align-items: center;
}
/* Constrain logo width more aggressively */
.navbar-brand {
    max-width: 250px !important;
    flex: 0 1 auto;
    display: flex;
    align-items: center;
}
.navbar-brand img {
    max-width: 100%;
    height: auto;
    max-height: 240px; /* Keep height constraint */
}
/* Let navbar-collapse take available space but not push to edge */
.navbar-collapse {
    flex-grow: 1;
    max-width: 600px; /* Prevent from becoming too wide */
}
/* Center the nav items within the collapse */
.navbar-nav {
    justify-content: center;
    width: 100%;
}
/* Mobile adjustments */
@media (max-width: 768px) {
    .navbar-brand {
        max-width: 180px;
    }
    .navbar-brand img {
        max-height: 120px;
    }
    .navbar-collapse {
        max-width: 100%;
    }
}

/* Navbar left shift fix */
.navbar .container {
    margin-left: 0;
    padding-left: 15px;
    padding-right: 15px;
    justify-content: space-between;
}
/* Ensure navbar-collapse doesn't push too far right */
.navbar-collapse {
    margin-left: auto;
    margin-right: 0;
}
/* Adjust navbar-nav to be left-aligned within collapse */
.navbar-nav {
    justify-content: flex-end;
    width: auto;
}
/* On mobile, revert */
@media (max-width: 768px) {
    .navbar .container {
        padding-left: 10px;
        padding-right: 10px;
    }
    .navbar-nav {
        justify-content: center;
    }
}

/* Shift navbar left - override previous alignment */
.navbar .container {
    justify-content: flex-start !important;
    padding-left: 10px;
    padding-right: 10px;
}
.navbar-brand {
    margin-right: 30px; /* Add space between logo and menu */
}
.navbar-collapse {
    margin-left: 0 !important;
    justify-content: flex-start !important;
    flex-grow: 0; /* Don't take all space */
}
.navbar-nav {
    justify-content: flex-start !important;
    margin-left: 0;
}
/* On larger screens, allow some spacing */
@media (min-width: 992px) {
    .navbar .container {
        justify-content: space-between;
    }
    .navbar-collapse {
        flex-grow: 1;
        justify-content: flex-end;
    }
}

/* Navbar left shift - override all previous */
.navbar .container {
    justify-content: flex-start !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
}
.navbar-brand {
    max-width: 200px !important;
    flex: 0 0 auto !important;
    margin-right: 20px !important;
}
.navbar-brand img {
    max-width: 100% !important;
    height: 240px !important;
    width: auto !important;
}
.navbar-collapse {
    flex-grow: 1 !important;
    justify-content: flex-end !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.navbar-nav {
    justify-content: flex-end !important;
    width: auto !important;
}
/* Mobile adjustments */
@media (max-width: 768px) {
    .navbar-brand {
        max-width: 150px !important;
    }
    .navbar-brand img {
        height: 120px !important;
    }
    .navbar-collapse {
        justify-content: center !important;
    }
}

/* === NAVBAR FIX v2 === */
/* Reset all previous navbar alignment */
.navbar .container {
    justify-content: space-between !important;
    align-items: center !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.navbar-brand {
    max-width: 300px !important;
    flex: 0 0 auto !important;
    margin-right: 20px !important;
    display: flex !important;
    align-items: center !important;
}
.navbar-brand img {
    max-height: 240px !important;
    height: auto !important;
    width: auto !important;
    max-width: 100% !important;
}
.navbar-collapse {
    flex-grow: 1 !important;
    justify-content: flex-end !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
}
.navbar-nav {
    justify-content: flex-end !important;
    width: auto !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
/* Mobile adjustments */
@media (max-width: 768px) {
    .navbar-brand {
        max-width: 200px !important;
    }
    .navbar-brand img {
        max-height: 120px !important;
    }
    .navbar-collapse {
        justify-content: center !important;
    }
    .navbar-nav {
        justify-content: center !important;
    }
}

/* NAVBAR ALIGNMENT OVERRIDE - remove right push */
.navbar-collapse {
    margin-left: 0 !important;
    margin-right: 0 !important;
    justify-content: center !important;
    flex-grow: 1 !important;
}
.navbar-nav {
    justify-content: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: auto !important;
}
.navbar .container {
    justify-content: space-between !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
}
.navbar-brand {
    max-width: 300px !important;
    flex: 0 0 auto !important;
}
/* Mobile */
@media (max-width: 768px) {
    .navbar-collapse {
        justify-content: center !important;
    }
    .navbar-nav {
        justify-content: center !important;
    }
    .navbar-brand {
        max-width: 200px !important;
    }
}

/* Shift navbar right to center over three pictures */
@media (min-width: 992px) {
    .navbar-nav {
        margin-left: 240px !important;
    }
}