/* GLOBAL STYLES
-------------------------------------------------- */
body {
    margin-bottom: 70px;
    background-color: #1E293B; /* Primary Dark Background */
    color: #E2E8F0; /* Primary Text Color */
    font-family: 'Open Sans', sans-serif; /* Body Font */
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Roboto Slab', serif; /* Heading Font */
    color: #E2E8F0; /* Ensure headings also use primary text color */
}

a {
    color: #64CCC5; /* Primary Calm Accent for links */
    text-decoration: none; /* Consider removing underlines for a cleaner look */
}

a:hover {
    color: #4CA09A; /* A slightly darker shade of #64CCC5 */
    text-decoration: underline; /* Or a subtle underline on hover */
}

/* NAVBAR
-------------------------------------------------- */
.navbar {
    background-color: #334155; /* Secondary Dark Accent */
    border-bottom: 1px solid #475569; /* Subtle border for separation */
}

.navbar-brand {
    color: #E2E8F0;
}

.navbar-toggler {
    background-color: rgba(255, 255, 255, 0.1); /* Light background for toggler icon */
    border-color: rgba(255, 255, 255, 0.1);
}

.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3e%3cpath stroke='rgba(255, 255, 255, 0.8)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); /* White toggler icon */
}

.navbar-nav .nav-link {
    color: #CBD5E1; /* Lighter text for nav links */
    margin-left: 0.75rem;
    margin-right: 0.75rem;
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
    color: #64CCC5; /* Highlight on hover/focus */
}

.navbar-nav .nav-link.active {
    color: #FACC15; /* Vibrant accent for active link */
}

.dropdown-menu {
    background-color: #334155;
    border: 1px solid #475569;
}

.dropdown-item {
    color: #CBD5E1;
}

.dropdown-item:hover,
.dropdown-item:focus {
    background-color: #475569;
    color: #64CCC5;
}

.dropdown-divider {
    border-top: 1px solid #475569;
}

/* ALERTS
-------------------------------------------------- */
.alert {
    border: 1px solid transparent;
}

.alert-warning {
    background-color: rgba(250, 204, 21, 0.1); /* Subtle background */
    border-color: rgba(250, 204, 21, 0.3);
    color: #FACC15;
}

.alert-info {
    background-color: rgba(100, 204, 197, 0.1); /* Subtle background */
    border-color: rgba(100, 204, 197, 0.3);
    color: #64CCC5;
}

.alert-danger {
    background-color: rgba(239, 68, 68, 0.1); /* Subtle background */
    border-color: rgba(239, 68, 68, 0.3);
    color: #EF4444; /* If you want to use the red accent for errors */
}

.alert strong {
    color: inherit; /* Ensure strong text uses the alert color */
}

/* FOOTER STYLES
-------------------------------------------------- */
footer .navbar {
    background-color: #1E293B; /* Primary Dark Background */
    border-top: 1px solid #334155; /* Secondary Dark Accent for a subtle top border */
}

footer .navbar-brand {
    color: #CBD5E1; /* Light gray for the text */
    font-size: 0.9rem; /* Slightly smaller font size */
}

footer .navbar-brand a {
    color: #64CCC5; /* Primary Calm Accent for the link */
    text-decoration: none;
}

footer .navbar-brand a:hover {
    text-decoration: underline;
}

/* MISCELLANEOUS
-------------------------------------------------- */
label.required:before {
    content: "*";
}
