/*
 * Radon Pro Network's overrides for the shared consent banner.
 *
 * Kept out of consent.css so that file stays a byte-for-byte copy of
 * ~/Websites/site-consent/src/consent.css. The package gets updated across
 * thirteen sites; a local edit inside the vendored copy is invisible at the
 * next sync and comes back as "why does this one site look different".
 * Everything this site changes is in here, and loads after it.
 *
 * Two changes, both Ben's, 29 Oct 2026: the bar is smaller, and it is dark so
 * it separates from a white page instead of floating on it.
 */

/* Brand accent, used by the preferences dialog and the focus ring. */
:root {
  --sc-accent: #075985;   /* sky-800, same blue as the site's buttons */
  --sc-accent-ink: #ffffff;
}

/*
 * The bar only. The preferences dialog stays light on purpose: it is a
 * reading surface with switches and body copy, and inverting it costs
 * legibility for no gain. The bar is the thing that has to be noticed.
 */
.sc-banner {
  /*
   * Near-black rather than a dark navy. The first try used #0a1620, which
   * reads well over white but disappears into the homepage hero, and the hero
   * is sky-950 so a dark-navy bar sitting on it is camouflage. True black
   * separates from both. The hairline is light for the same reason: on a dark
   * page the shadow alone does not give the bar an edge.
   */
  --sc-bg: #070d13;
  --sc-ink: #ffffff;
  --sc-muted: #b8c6d2;
  --sc-border: rgba(255, 255, 255, .18);

  left: 12px;
  right: 12px;
  bottom: 12px;
  max-width: 960px;
  gap: 10px 20px;
  padding: 12px 16px;
  font-size: 14px;
  box-shadow: 0 12px 36px rgba(0, 0, 0, .45);
}

.sc-banner__body { flex: 1 1 360px; }
.sc-banner__title { font-size: 15px; margin-bottom: 2px; }
.sc-banner__gpc { font-size: 12px; margin-top: 4px; }

/* Navy on near-black is unreadable; sky-300 clears AA on this background. */
.sc-banner a { color: #7dd3fc; }

/*
 * Accept All and Reject All stay identical to each other, which is the one
 * rule not to break here: regulators look for refusing being as easy as
 * agreeing, and the package ships them with the same class for that reason.
 * White on near-black reads as the primary action for both.
 */
.sc-banner .sc-btn {
  font-size: 14px;
  padding: 8px 16px;
}
.sc-banner .sc-btn--primary {
  background: #ffffff;
  color: #070d13;
  border-color: #ffffff;
}
.sc-banner .sc-btn--primary:hover { background: #e2e8f0; border-color: #e2e8f0; }

/* Manage Preferences stays the quieter third option, now light-on-dark. */
.sc-banner .sc-btn--link {
  background: transparent;
  color: #ffffff;
  border-color: #3b4c5a;
}
.sc-banner .sc-btn--link:hover { border-color: #7dd3fc; color: #7dd3fc; }

/* The focus ring is drawn from the accent, which disappears on the dark bar. */
.sc-banner .sc-btn:focus-visible { outline-color: #7dd3fc; }

/* On a phone the three buttons should fill the width rather than wrap ragged. */
@media (max-width: 560px) {
  .sc-banner { padding: 12px; gap: 8px 12px; }
  .sc-banner__actions { width: 100%; }
  .sc-banner .sc-btn { flex: 1 1 auto; text-align: center; }
}