@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;800&display=swap");

:root {
    --primary-color: #003f5c;
    --secondary-color: #fd9d51;
    --tertiary-color: #9dcbed;
    --text-color: #dadada;
    --inactive-text-color: #68686f;
    --background-color: #121212;
    --hover-text-color: #222222;
    --corner-radius: 0;
    --bs-body-bg: #111117; /* Default 060606
    --bs-body-color: #e0e0e0; /* optional: adjust default text */
    --bs-body-font-family: "Roboto", system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
}

/* Base / inactive navbar link */
.ec-nav-link {
  color: var(--inactive-text-color, #aaa);
  border: 1px solid transparent;         /* optional subtle underline or border */
  border-radius: 0.25rem;                /* optional for focus ring */
  text-decoration: none;                 /* remove underline */
  transition: color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

/* Base (inactive) */
a.ec-nav-link {
  color: var(--inactive-text-color);
  background-color: transparent;
  border-radius: var(--corner-radius);
  text-decoration: none;
  transition: color .15s ease, filter .15s ease, background-color .15s ease;
  font-weight: 400;
}

/* Hover – DIM (to match button feel) */
a.ec-nav-link:hover {
  color: var(--hover-text-color);
  background-color: transparent;
  text-decoration: none;
  font-weight: 400;
}

/* Active (current page) – persistent “selected” state */
a.ec-nav-link.active,
.navbar-nav .nav-link.active {
  color: var(--text-color);
  background-color: transparent;
  font-weight: 600;
  filter: none;                       /* don’t dim when active */
}

/* Keyboard focus (accessibility) */
a.ec-nav-link:focus-visible {
  outline: 2px solid var(--text-color);
  outline-offset: 2px;
}


/* a.ec-nav-link { */
/*     background-color: transparent !important; */
/*     border-radius: var(--corner-radius) !important; */
/*     color: var(--inactive-text-color) !important; */
/* } */
/**/
/* a.ec-nav-link.active { */
/*     background-color: transparent;  */
/*     color: var(--text-color) !important; */
/*     font-weight: 600; */
/* } */

/* a.ec-nav-link:hover { */
/*     background-color: transparent;  */
/*     color: var(--text-color) !important; */
/*     font-weight: 600; */
/* } */
/**/

/* Base (inactive) */
.btn-outline-light {
  --bs-btn-bg: transparent;
  color: var(--inactive-text-color);
  border-color: var(--inactive-text-color);
}

/* Hover */
.btn-outline-light:hover {
  color: var(--text-color);
  border-color: var(--text-color);
  background-color: transparent;
  filter: brightness(1.0); /* increase if you want brightness at instance of hover */
}

/* Active / checked (covers both toggle + manual .active) */
.btn-check:checked + .btn-outline-light,
.btn-check:active + .btn-outline-light,
.btn-outline-light.active,
.btn-outline-light:active {
  color: var(--text-color);
  border-color: var(--text-color);
  background-color: transparent;
}

.form-select.bg-dark.text-light {
  background-color: #111117 !important;
  color: var(--text-color) !important;
  border: 1px solid #555 !important;
  border-color: var(--text-color) !important;
  transition: background-color 0.2s ease, border-color 0.2s ease;
  /* filter: invert(1) brightness(1.2); */
}

/* in assets/custom.css */
.form-select.bg-dark.text-light {
  background-color: #111117 !important;
  color: var(--text-color) !important;
  border: 1px solid #555 !important;
  border-color: var(--text-color) !important;
  transition: background-color 0.2s ease, border-color 0.2s ease;

  /* Replace the default chevron */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3E%3Cpath d='M3.204 5.793a1 1 0 0 1 1.414 0L8 9.172l3.382-3.379a1 1 0 0 1 1.415 1.414l-4.09 4.086a1 1 0 0 1-1.414 0L3.204 7.207a1 1 0 0 1 0-1.414z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.8em center;
  background-size: 0.9em auto;
  padding-right: 2em; /* leave room for the icon */
  appearance: none;   /* hide default arrow */
}

/* SEE ALSO
 *
 * zstyles.css
 *
 * used to resolve load-order issued
 *
 */