:root {
    --background: #F8F8F8;
    --headlinefont: #7C7C7C;
    --standardfont: #6A6A6A;
    --chartbg: #FFFFFF;
    --chartblue: #2E6CC6;
    --chartpurple: #B06DCC;
    --chartgreen: #24853F;
    --chartorange: #F25930;
    --chartyellow: #F6B914;
    --chartgray: #BCBCBC;
    --chartgrid: #F3F3F3;
    --text: #7FDBFF;
}



/* Adjust the base font size for the entire application */
body {
    font-size: 14px;
    color: var(--standardfont);
}


/* NavItems Inert (default) state */
.navbar-dark .navbar-nav .nav-link {
  color: #CCCCCC;            /* your default nav-link color */
}

/* NavItems Hover & focus */
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
  color: #00824B;            /* your hover color */
}

/* NavItems Active page (when `active=True`) */
.navbar-dark .navbar-nav .nav-link.active {
  color: #00824B;            /* your “selected” color */
}



/* Dash Bootstrap Components (dbc) Dropdown */
.dropdown-menu,
.dropdown-item,
.dropdown-toggle,
.nav-link {
    font-size: 16px;
}

/* Show dropdown menu on hover */
.nav-item.dropdown:hover .dropdown-menu {
    display: block;
    margin-top: 0; /* optional: adjust the distance between the menu and the button */
}

/* Ensure the dropdown stays open on hover */
.navbar-nav .dropdown-menu {
    display: none;
    position: absolute;
}

.navbar-nav .dropdown:hover .dropdown-menu {
    display: block;
}



/* Dash Core Components (dcc) Dropdown */
.Select-control,
.Select-value-label,
.Select-value-label > span,
.Select-value-label > span > span,
.Select-placeholder,
.Select-input > input
.Select-menu-outer {
    font-size: 14px;
    color: var(--standardfont);
}


/* Adjust font size for radio items */
.radio-inline, .form-check-inline {
    font-size: 14px;
    color: var(--standardfont);
}

/* Adjust font size for card body */
.card-body {
    font-size: 14px;
    color: var(--standardfont);
}

/* Adjust font size for checklist items */
.form-check-label {
    font-size: 14px;
    color: var(--standardfont);
}


/* Custom styles for the dbc.Table */
.table-custom {
    border: none;
    border-collapse: collapse;
    color: var(--chartbg); /* sets color of top grid line to white to blend with background*/
}

.table-custom th, .table-custom td {
    border: none;
    border-bottom: 1px solid #dee2e6;
}

.table-custom th {
    border-bottom: 2px solid #dee2e6;
}


.no-border {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
}

.card iframe {
    border: none !important;
    box-shadow: none !important;
}


/* Radio button group with no gaps between buttons */
.radio-group .form-check {
  padding-left: 0;
}

.radio-group .btn-group > .form-check:not(:last-child) > .btn {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.radio-group .btn-group > .form-check:not(:first-child) > .btn {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: -1px;
}

/* Modal buttons for more info*/
.modal-button {
    font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 12px;
    color: #473A83;
}

.modal-button:hover {
    color: #5E5E5E;
}

/* Remove borders between table rows in scattermap legend table*/
#color_legend table {
    border-collapse: collapse;
    margin-bottom: 0 !important;  /* Remove any bottom margin */
}

#color_legend tr {
    border-bottom: none !important;
}

#color_legend td {
    border: none !important;
    padding: 0px 0px;
}


/* Sub-navbar link styles */
.sub-navbar .sub-nav-link {
    font-size: 16px; /* Adjust font size as needed */
    color: #7C7C7C; /* Default text color */
    text-decoration: none;
    padding: 0;
    margin: 0;
    line-height: 50px; /* Vertically center text */
    font-weight: normal;
    display: block;
    white-space: nowrap; /* Prevent text from wrapping */
}

/* Hover effect */
.sub-navbar .sub-nav-link:hover {
    color: #00824B; /* colors['chartcontrast'] value */
}

/* Active link styling */
.sub-navbar .sub-nav-link.active {
    font-weight: bold;
}

/* Remove gutters (spacing between columns) */
.sub-navbar .row > .col,
.sub-navbar .row > [class*='col-'] {
    padding-left: 0;
    padding-right: 0;
}

/* Allow wrapping in the row */
.sub-navbar .flex-wrap {
    flex-wrap: wrap;
}

/* Default padding for content */
.page-content {
    padding-top: 40px; /* 60px main navbar + 50px sub-navbar */
}

/* Adjust padding for medium and small screens */
@media (max-width: 992px) {
    .page-content {
        padding-top: 90px; /* Increase padding to account for additional sub-navbar height */
    }
}



/* Default: Show full brand text */
.brand-full {
    display: inline;
}

.brand-short {
    display: none;
}

/* On screens medium (md) and smaller, show short brand text */
@media (max-width: 991px) {
    .brand-full {
        display: none;
    }
    .brand-short {
        display: inline;
    }
}