/* -------------------------------
   RESET & BASE STYLES
--------------------------------*/
* { margin:0; padding:0; box-sizing:border-box }
body {
  font-family: 'Segoe UI', sans-serif;
  background: #D3D3D3;
  color: #111;
  line-height: 1.6;
}

/* -------------------------------
   NORMALE CONTENT LINKS
--------------------------------*/
a {
  color: #5a8ac4;
  transition: color 0.2s;
  text-decoration: none;
}
a:hover, a:focus {
  color: #a7cdfa;
  text-decoration: underline;
}

/* --- DARK MODE: Alle links lichtblauw, bij hover wit --- */
body.dark a {
  color: #aad2ff !important;
}
body.dark a:hover,
body.dark a:focus {
  color: #fff !important;
  text-decoration: underline;
}

/* -------------------------------
   CONTAINER
--------------------------------*/
.container { width:90%; max-width:1200px; margin-inline:auto; padding-inline:1rem }

/* -------------------------------
   BOOTSTRAP OVERRIDES / UTILITIES
--------------------------------*/
.bg-primary { background-color:#002f5e !important; }   /* brand blue */
.navbar { box-shadow:0 2px 4px rgba(0,0,0,.08); }

/* -------------------------------
   NAVBAR LINKS
--------------------------------*/
.navbar-nav .nav-link,
.navbar-nav a {
  color: #5a8ac4 !important;
  text-decoration: none;
  transition: color 0.2s;
}
.navbar-nav .nav-link:hover,
.navbar-nav a:hover,
.navbar-nav .nav-link:focus,
.navbar-nav a:focus {
  color: #a7cdfa !important;
  text-decoration: underline;
}
body.dark .navbar-nav .nav-link,
body.dark .navbar-nav a {
  color: #aad2ff !important;
}
body.dark .navbar-nav .nav-link:hover,
body.dark .navbar-nav a:hover,
body.dark .navbar-nav .nav-link:focus,
body.dark .navbar-nav a:focus {
  color: #fff !important;
  text-decoration: underline;
}

/* -------------------------------
   DARK-MODE (BODY CLASS)
--------------------------------*/
body.dark {
  background: #002f5e;
  color: #f1f1f1;
}
body.dark .bg-primary,
body.dark header { background: #1f1f1f !important; }
body.dark .navbar-brand span,
body.dark .nav-link { color: #f1f1f1 !important; }

/* -------------------------------
   HEADER (optional hero / banner)
--------------------------------*/
header {
  background: #002f5e;
  color: #fff;
  padding: 1rem 0;
}
header img { max-height:50px }
header h1 { font-size:1.8rem; margin-left:1rem }

/* -------------------------------
   FOOTER
--------------------------------*/
footer {
  background: #002f5e;
  color: #fff;
  padding: 2rem 1rem;
  text-align: center;
  font-size: .95rem;
  font-weight: 500;
  letter-spacing: .2px;
  border-top: 4px solid #0055a5;
}
footer a {
  color: #5a8ac4 !important;
  text-decoration: none;
  transition: color 0.2s;
}
footer a:hover,
footer a:focus {
  color: #a7cdfa !important;
  text-decoration: underline;
}
body.dark footer {
  background: #1f1f1f;
  color: #f1f1f1;
  border-top-color: #333;
}
body.dark footer a {
  color: #aad2ff !important;
}
body.dark footer a:hover,
body.dark footer a:focus {
  color: #fff !important;
  text-decoration: underline;
}

/* -------------------------------
   RESPONSIVE TWEAKS
--------------------------------*/
@media(max-width:768px){
  header h1 { font-size:1.4rem }
  .navbar-nav .nav-link { padding:.8rem 0; width:100% }
}