/* Begin consent manager v1.0 stylesheet
 * Change the four variables at the top to match the client brand. Nothing
 * below that needs editing. Contrast pairs in here pass WCAG 2.2 AA at the
 * default values, so if you change them, re-check them.
 *
 * BMS Building, 24 September 2026: the four variables below are this site's
 * tokens from app/globals.css, and nothing else in this file is changed.
 * ink #1C1D1F on white is 16.87:1. accent is the focus ring and link hover,
 * #4E5558 at 7.60:1 on white; the brand yellow would be 1.59:1 and fail
 * WCAG 1.4.11. line is --border-control, 3.45:1. radius matches --radius.
 */
:root {
  --bc-ink:       #1C1D1F;   /* text and primary button background */
  --bc-accent:    #4E5558;   /* focus ring and links */
  --bc-surface:   #FFFFFF;   /* banner and panel background */
  --bc-line:      #8A8A8C;   /* borders */
  --bc-radius:    4px;
  --bc-max:       64rem;
}

/* ---------------------------------------------------------------- banner -- */

.bc-banner {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 2147483000;                 /* above sticky headers and chat widgets */
  background: var(--bc-surface);
  color: var(--bc-ink);
  border-top: 3px solid var(--bc-ink);
  box-shadow: 0 -4px 24px rgba(0, 0, 0, .18);
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.55;
}
.bc-banner[hidden] { display: none; }

.bc-inner {
  max-width: var(--bc-max);
  margin: 0 auto;
  padding: 1.25rem 1.25rem 1.5rem;
}

.bc-title {
  margin: 0 0 .5rem;
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--bc-ink);
}

.bc-text  { margin: 0 0 1rem; max-width: 62ch; }
.bc-text a { color: var(--bc-ink); text-decoration: underline; }
.bc-text a:hover { color: var(--bc-accent); }

/* ---------------------------------------------------------------- buttons -- */
/* Accept all and Reject all are both bc-btn-primary on purpose. Rule 2 of
 * document 7.3: refusing must be exactly as easy as agreeing. Do not restyle
 * one of them to look weaker, and do not reorder them so reject is hidden. */

.bc-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .625rem;
}

.bc-btn {
  font: inherit;
  font-weight: 600;
  min-height: 2.75rem;                  /* target size, WCAG 2.2 */
  min-width: 8.5rem;
  padding: .625rem 1.25rem;
  border-radius: var(--bc-radius);
  border: 2px solid var(--bc-ink);
  cursor: pointer;
}
.bc-btn-primary   { background: var(--bc-ink); color: #FFFFFF; }
.bc-btn-secondary { background: transparent;  color: var(--bc-ink); }
.bc-btn:hover     { opacity: .9; }

.bc-btn:focus-visible,
.bc-switch input:focus-visible + .bc-row-name {
  outline: 3px solid var(--bc-accent);
  outline-offset: 2px;
}

/* ----------------------------------------------------------------- panel -- */

.bc-panel {
  position: fixed;
  inset: 0;
  z-index: 2147483001;
  background: rgba(26, 29, 46, .55);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  overflow: auto;
}
.bc-panel[hidden] { display: none; }

.bc-panel-inner {
  background: var(--bc-surface);
  color: var(--bc-ink);
  border-radius: var(--bc-radius);
  max-width: 40rem;
  width: 100%;
  max-height: 90vh;
  overflow: auto;
  padding: 1.5rem;
  font-size: 1rem;
  line-height: 1.55;
}

.bc-rows { margin: 1.25rem 0; }

.bc-row {
  border-top: 1px solid var(--bc-line);
  padding: .875rem 0;
}
.bc-row:last-child { border-bottom: 1px solid var(--bc-line); }

.bc-row-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.bc-row-name { font-weight: 700; }
.bc-row-desc { margin: .375rem 0 0; max-width: 58ch; }

.bc-locked {
  font-size: .875rem;
  font-weight: 600;
  border: 1px solid var(--bc-line);
  border-radius: 999px;
  padding: .125rem .625rem;
}

/* The checkbox stays a real checkbox. It is styled larger rather than hidden
 * and replaced, so it keeps its native keyboard behaviour and announces its
 * checked state to a screen reader without any ARIA. */
.bc-switch {
  display: flex;
  align-items: center;
  gap: .625rem;
  cursor: pointer;
  min-height: 2.75rem;
}
.bc-switch input {
  width: 1.375rem;
  height: 1.375rem;
  accent-color: var(--bc-ink);
  cursor: pointer;
  margin: 0;
}

/* --------------------------------------------------------- blocked embeds -- */

.bc-embed-block {
  border: 1px dashed var(--bc-line);
  border-radius: var(--bc-radius);
  padding: 1.25rem;
  text-align: center;
  background: #F7F7F5;
  color: var(--bc-ink);
}
.bc-embed-block p { margin: 0 0 .875rem; }

[data-consent-embed] iframe {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  display: block;
}

/* --------------------------------------------------------------- helpers -- */

.bc-locked-scroll { overflow: hidden; }

/* Rule from document 7.4: the banner must never cover the element that has
 * keyboard focus. Reserve space at the foot of the page while it is open. */
.bc-open ~ * { }
body:has(.bc-banner:not([hidden])) { padding-bottom: 12rem; }

@media (min-width: 40rem) {
  body:has(.bc-banner:not([hidden])) { padding-bottom: 9rem; }
}

@media (prefers-reduced-motion: no-preference) {
  .bc-banner { animation: bc-rise .18s ease-out; }
  @keyframes bc-rise { from { transform: translateY(100%); } to { transform: none; } }
}

@media (prefers-contrast: more) {
  .bc-btn { border-width: 3px; }
}
