/* Secondary pages: shared contrast, mobile, and dark-mode fixes */

html[lang="nb"] [data-site-locale="en"],
html[lang="en"] [data-site-locale="no"] {
  display: none !important;
}

@media (max-width: 720px) {
  body {
    overflow-x: clip;
  }

  .topbar-inner,
  .wrap {
    width: 100%;
    padding-left: max(4vw, 0.75rem);
    padding-right: max(4vw, 0.75rem);
  }
}

footer p {
  margin: 0;
  color: inherit;
}

.logo-mark picture {
  display: block;
  line-height: 0;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0f172a;
    --text: #f1f5f9;
    --muted: #94a3b8;
    --border: rgba(59, 130, 246, 0.28);
    --glass: rgba(30, 41, 59, 0.92);
  }

  body {
    background: var(--bg);
    color: var(--text);
  }

  .topbar {
    background: rgba(15, 23, 42, 0.94);
    border-bottom-color: var(--border);
  }

  .topbar-back {
    background: rgba(30, 41, 59, 0.9);
    color: #f1f5f9 !important;
    border-color: var(--border);
  }

  .topbar-back:hover {
    background: rgba(30, 41, 59, 1);
    color: #93c5fd !important;
    border-color: rgba(59, 130, 246, 0.45);
  }

  /* Logo swap: <picture> in HTML (logo_header / logo_header_dark) */

  .doc {
    background: var(--glass);
    border-color: var(--border);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.28);
  }

  .doc a,
  .iconline a {
    color: #93c5fd;
  }

  .doc a:hover,
  .iconline a:hover {
    color: #bfdbfe;
  }

  .lang-switch {
    background: rgba(30, 41, 59, 0.75);
    border-color: var(--border);
  }

  .lang-btn {
    color: var(--muted);
  }

  .lang-btn:hover {
    color: #f1f5f9;
  }

  .lang-btn.active {
    color: #93c5fd;
    background: rgba(59, 130, 246, 0.18);
    border-color: rgba(59, 130, 246, 0.45);
  }

  footer {
    background: linear-gradient(180deg, #0b1220 0%, #070b12 100%);
    color: rgba(255, 255, 255, 0.9);
  }

  footer a {
    color: #93c5fd;
  }

  footer a:hover {
    color: #bfdbfe;
  }
}