/* Lettertypen: zelf gehost (geen verzoeken naar Google). Beide onder SIL Open Font License 1.1. */
@font-face {
  font-family: 'Archivo';
  font-style: normal;
  font-weight: 400 800;
  font-stretch: 100% 112%;
  font-display: swap;
  src: url('/assets/fonts/archivo-latin-variable.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/ibm-plex-mono-latin-400.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/ibm-plex-mono-latin-500.woff2') format('woff2');
}

/* IP-balk bovenaan elke pagina; de IP-regels komen uit ip_display.php */
.ipbar { background: #333333; border-bottom: 2px solid #E0E1E1; }
.ipbar-in { max-width: 960px; margin: 0 auto; padding: 6px 19px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: #E0E1E1; }
.ipbar .ipbar-name { align-self: center; }
.ipbar .hl { color: #8FB4E3; }
.ipbar .ips { margin-left: auto; text-align: right; line-height: 1.6; color: #D5D7DA; }
.ipbar .ips > br:first-child { display: none; }
.ipbar .ips b { font-weight: 500; color: #FFFFFF; }

/* Algemeen */
body { margin: 0; background: #FFFFFF; }
a { color: #1F61AA; } a:hover { color: #0B3F78; }
html { scroll-behavior: smooth; }
section[id], main[id] { scroll-margin-top: 90px; }
.nav a { color: #333333; text-decoration: none; }
.nav a:hover { color: #1F61AA; }
.nav a[aria-current] { color: #1F61AA; box-shadow: inset 0 -2px 0 #1F61AA; padding-bottom: 3px; }
.btn-primary:hover { filter: brightness(0.9); }
.btn-ghost:hover { background: #F1F4F9; }
.card:hover { border-color: #1F61AA; }
.foot a { color: #FFFFFF; } .foot a:hover { color: #E0E1E1; }
.side a { color: #333333; text-decoration: none; }
.side a:hover { background: #EEF2F8; }

/* Veelgestelde vragen */
.faq summary { list-style: none; cursor: pointer; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary:hover { color: #1F61AA; }
.faq summary:focus-visible { outline: 2px solid #1F61AA; outline-offset: 2px; }
.faq details[open] .chev { transform: rotate(180deg); }
.faq .chev { transition: transform .15s ease; }

/* E-mail instellingen */
.settings th, .settings td { text-align: left; padding: 11px 13px; border-bottom: 1px solid #E0E1E1; vertical-align: top; }
.settings th { font-family: 'IBM Plex Mono', monospace; font-size: 12px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: #666666; background: #F6F7F8; }
.settings td { font-size: 13px; color: #1A1A1A; }
.settings .mono { font-family: 'IBM Plex Mono', monospace; font-size: 12px; }