/* Cookie banner (MAR-1295, assets/shared/consent.js): a small card in the bottom-left corner that never covers
   the whole page. Accept and Reject are the same size, so rejecting is as easy as accepting (ICO guidance). */
.ck {
  /* The shell's colours (shell.css) are scoped to .nav, .drawer and .foot, so the banner sets its own. */
  --sh-raise: #121418; --sh-fg: #f7f7f5; --sh-soft: rgb(247 247 245 / .74);
  --sh-line-2: rgb(255 255 255 / .16); --sh-acc: #8fb4ff; --sh-ease: cubic-bezier(.22, .61, .36, 1);
  position: fixed; z-index: 120; left: 1rem; bottom: 1rem; width: min(26rem, calc(100vw - 2rem));
  padding: 1rem 1.125rem 1.125rem; border: 1px solid var(--sh-line-2); border-radius: 1rem;
  background: var(--sh-raise); color: var(--sh-soft); box-shadow: 0 12px 40px rgb(0 0 0 / .45);
  font-size: .875rem; line-height: 1.5; letter-spacing: -.006em;
}
.ck[hidden] { display: none; }
.ck__t { margin: 0 0 .875rem; }
.ck__t a { color: var(--sh-fg); text-decoration: underline; text-underline-offset: 2px; }
.ck__acts { display: flex; gap: .5rem; }
.ck__b {
  flex: 1; min-height: 2.75rem; padding: .5rem 1rem; border: 1px solid var(--sh-line-2); border-radius: 999px;
  background: transparent; color: var(--sh-fg); font: inherit; font-weight: 500; cursor: pointer;
  transition: background .18s var(--sh-ease), border-color .18s var(--sh-ease);
}
.ck__b:hover { background: rgb(255 255 255 / .06); }
.ck__b--yes { border-color: transparent; background: var(--blue); color: #fff; }
.ck__b--yes:hover { background: var(--blue-deep); }
.ck a:focus-visible, .ck__b:focus-visible { outline: 2px solid var(--sh-acc); outline-offset: 3px; }

/* "Cookie settings" in the footer's legal row: a button that looks like the links beside it. */
body > footer.foot .foot__ck {
  display: inline-flex; align-items: center; min-height: 2rem; padding: 0; border: 0; background: none;
  color: var(--sh-soft); font: inherit; font-size: .8125rem; letter-spacing: -.011em; cursor: pointer;
  transition: color .18s var(--sh-ease);
}
body > footer.foot .foot__ck:hover { color: var(--sh-fg); }
body > footer.foot .foot__ck:focus-visible { outline: 2px solid var(--sh-acc); outline-offset: 3px; }
@media (width <= 999px) {
  body > footer.foot .foot__ck { min-height: 2.75rem; }
}
