/* BASE STRUCTURE
-------------------------------------------------- */
body {
    min-height: 100%;
}

.cover-container {
    max-width: 69em;
}

/* Override Bootstrap's default dark theme for navbar */
.text-bg-dark {
    background-color: #303030 !important; /* Or #424242, experiment to see which you prefer */
}

/* NAVBAR
-------------------------------------------------- */
.nav-masthead .nav-link {
    color: #E0E0E0; /* Our primary light gray for inactive links */
    border-bottom: .25rem solid transparent;
}

.nav-masthead .nav-link:hover, .nav-masthead .nav-link:focus {
    color: #2196F3; /* Our Material Design blue on hover/focus */
    border-bottom-color: #2196F3; /* Optional: Keep the border and change its color */
}

.nav-masthead .nav-link + .nav-link {
    margin-left: 1rem;
}

.nav-masthead .active {
    color: #2196F3 !important; /* Our Material Design blue for the active link */
    border-bottom-color: #2196F3 !important; /* Style the active link's bottom border */
}

.nav-masthead h3.mb-0 {
    color: #F5F5F5; /* Light gray for the title */
}

/* FLASH MESSAGE STYLES
-------------------------------------------------- */
section.container.text-center {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

div.alert {
    color: #F5F5F5 !important; /* Default light gray text for alerts */
    border-radius: 0.25rem;
    margin-bottom: 1rem;
    padding: 1rem;
}

div.alert strong {
    font-weight: bold;
}

/* Success Flash Message */
div.alert.alert-success {
    background-color: #2E7D32 !important; /* Darker green */
    border-color: #1B5E20 !important;
}

/* Info Flash Message */
div.alert.alert-info {
    background-color: #1976D2 !important; /* Darker blue */
    border-color: #0D47A1 !important;
}

/* Danger Flash Message */
div.alert.alert-danger {
    background-color: #D32F2F !important; /* Darker red */
    border-color: #B71C1C !important;
}

/* Warning Flash Message (if you use it) */
div.alert.alert-warning {
    background-color: #ED6C02 !important; /* Darker orange */
    border-color: #E65100 !important;
}

/* Close Button */
button.btn-close {
    background-color: transparent !important;
    border: none !important;
    color: #F5F5F5 !important;
    opacity: 0.7;
    float: right;
    font-size: 1.5rem;
    font-weight: bold;
    line-height: 1;
    text-shadow: 0 1px 0 #000000;
    cursor: pointer;
}

button.btn-close:hover {
    opacity: 1;
}

/* FOOTER
-------------------------------------------------- */
footer.mt-auto.text-white-50 {
    color: #9E9E9E; /* Using our secondary gray for a softer look */
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-size: 0.9rem; /* Slightly smaller font size */
    /* border-top: 1px solid #424242; /* Optional: A subtle top border */
}

/* If you want to highlight the copyright symbol in blue */
footer.mt-auto.text-white-50 p::before {
    content: "\00A9"; /* Unicode for copyright symbol */
    color: #2196F3;
    margin-right: 0.2em;
}