/*
 * Thinklude high-contrast style sheet.
 *
 * Loaded three ways (see src/app/layout.tsx):
 *  - automatically when the device asks for more contrast (macOS and iOS
 *    "Increase contrast", Windows contrast settings): prefers-contrast: more;
 *  - from the "High contrast" switch in the site footer;
 *  - as the "High contrast" alternate style in browsers with a page-style
 *    menu (Firefox: View > Page Style).
 *
 * It keeps the layout and brand violet, but removes translucent text, text
 * on gradients and photos, and decorative blur, and makes focus and edges
 * unmistakable. Windows forced-colors mode is handled by the browser itself.
 *
 * Hook classes set in the markup:
 *  .hc-surface-dark  a gradient or photo surface that carries white text
 *  .hc-hide          a decorative image to drop
 */

:root {
  --hc-ink: #000000;
  --hc-paper: #ffffff;
  --hc-violet: #2e2c8a;
  --hc-dark: #1c1a52;
}

/* Text: no translucency, no gradient fill. Each selector matches the plain
   utility only (at the start of the class list or after a space), not its
   hover: or has-[…]: variants. */
[class^="text-brand-graphite"],
[class*=" text-brand-graphite"],
[class^="text-[#373737]"],
[class*=" text-[#373737]"],
[class^="text-[#565656]"],
[class*=" text-[#565656]"],
.policy-article {
  color: var(--hc-ink) !important;
}

[class^="text-white/"],
[class*=" text-white/"] {
  color: var(--hc-paper) !important;
}

.bg-clip-text {
  background: none !important;
  color: var(--hc-violet) !important;
  -webkit-text-fill-color: currentColor;
}

::placeholder {
  color: #4a4a4a !important;
  opacity: 1;
}

/* Surfaces that carry white text become one solid, dark colour. */
.hc-surface-dark,
.bg-brand-fill {
  background: var(--hc-dark) !important;
  color: var(--hc-paper);
}

.hc-hide,
.brand-dot-grid,
[class*="blur-3xl"] {
  display: none !important;
}

/* Brand violet text goes one step darker. */
.text-brand-violet {
  color: var(--hc-violet) !important;
}

/* Edges you can see. */
input,
select,
textarea {
  border: 2px solid var(--hc-ink) !important;
}

.news-card,
.bg-brand-fill,
[class*="rounded-full"][class*="border"] {
  border: 2px solid currentColor !important;
}

/* Links in running text are always underlined. */
p a,
li > a:not([class*="rounded"]),
address > a {
  text-decoration: underline !important;
  text-underline-offset: 0.2em;
}

/* Focus: thick, with a halo so it shows on light and dark alike. */
:focus-visible {
  outline: 3px solid var(--hc-ink) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 6px var(--hc-paper) !important;
}

.hc-surface-dark :focus-visible,
footer :focus-visible,
[class*="bg-brand-graphite"] :focus-visible,
[class*="bg-[#373737]"] :focus-visible,
[class*="bg-black"] :focus-visible {
  outline-color: var(--hc-paper) !important;
  box-shadow: 0 0 0 6px var(--hc-ink) !important;
}

/* Scrims over photos get dark enough for white text. */
[class*="rgba(20,20,28,0.85)"] {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.92), rgba(0, 0, 0, 0.55)) !important;
}
