/*
 * Cookie banner (static/js/nav-consent.js), shared by the public pages.
 *
 * The markup is built in JS, so every class here is written there and nowhere
 * else. Tokens are read with fallbacks: the banner is dropped into whichever
 * public page links it, and one of them may not define the landing page's
 * palette.
 *
 * Anchored to the bottom, never covering the page: it is a question, not a
 * wall. Nothing here dims, blurs or blocks the document behind it, and the
 * page stays fully readable and scrollable while it is up - a reader has to be
 * able to see what they are being asked to agree to.
 *
 * "Never covering the page" has to be paid for, though, and this is where.
 * `position:fixed` takes the banner out of the flow, so the end of the
 * document - the footer, whose PRIVACY link is exactly where a reader goes to
 * decide - ends up underneath it and unclickable. `body.has-consent` gives
 * that height back as padding while the question is open; the module sets
 * `--nav-consent-h` from the banner's measured height and removes both once it
 * is answered.
 */

body.has-consent{padding-bottom:var(--nav-consent-h,0px)}

/* The padding makes the bottom of the document reachable; this makes anything
 * scrolled TO reachable as well. A browser scrolling an element into view aims
 * for the viewport edge, which while the banner is up is behind the banner -
 * so an in-page jump, a focused control or a keyboard user tabbing to the
 * footer lands underneath it even though the space exists. `scroll-margin`
 * keeps that whole band clear, and applies only while the class is set. */
body.has-consent *{scroll-margin-bottom:var(--nav-consent-h,0px)}

.consent{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  background:var(--paper,#fff);
  border-top:1px solid var(--line,#e5e2ee);
  box-shadow:0 -12px 32px -24px rgba(11,27,61,.5);
  animation:consent-in .28s cubic-bezier(.22,.61,.36,1) both;
}

@keyframes consent-in{from{transform:translateY(12px);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){.consent{animation:none}}

.consent-inner{
  width:100%;max-width:1200px;margin:0 auto;padding:18px 24px;
  display:flex;flex-wrap:wrap;align-items:center;gap:16px 32px;
  justify-content:space-between;
}

.consent-copy{flex:1 1 420px;min-width:0}

.consent-title{
  font:700 15px/1.3 var(--sans,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif);
  color:var(--ink,#1b2333);margin:0 0 4px;
}

.consent-text{
  font-size:14px;line-height:1.5;color:var(--ink-60,#586479);margin:0;max-width:78ch;
}

.consent-more{
  display:inline-block;margin-top:6px;font-size:14px;
  color:var(--brand,#0b47b4);text-decoration:underline;text-underline-offset:3px;
}

.consent-actions{display:flex;flex-wrap:wrap;gap:10px;flex:0 0 auto}

.consent-btn{
  font:600 14px/1 var(--sans,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif);
  padding:12px 22px;border-radius:999px;border:1px solid transparent;
  cursor:pointer;white-space:nowrap;
}

/* Decline is a real, equally reachable choice - same size, same position in
 * the row, no colour trick that makes it read as the mistake. A banner where
 * the only comfortable target is "accept" is not asking anything. */
.consent-btn-ghost{
  background:transparent;border-color:var(--line,#e5e2ee);color:var(--ink,#1b2333);
}
.consent-btn-ghost:hover{border-color:var(--ink-40,#8892a6)}

.consent-btn-primary{background:var(--brand,#0b47b4);color:#fff}
.consent-btn-primary:hover{background:var(--brand-2,#0a3a94)}

.consent-btn:focus-visible{outline:2px solid var(--brand,#0b47b4);outline-offset:3px}

@media (max-width:640px){
  .consent-inner{padding:16px;gap:14px}
  .consent-actions{width:100%}
  .consent-btn{flex:1 1 auto}
}
