/* Cookie and storage consent banner (rebuild rule R-CONSENT). Fixed to the bottom edge, so it overlays
   the page and never pushes content down (no layout shift). Colours follow the site's theme tokens. */

.ci-consent {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 1000;
  box-sizing: border-box; padding: 16px;
  background: var(--bg-1, #0d1f3a); color: var(--ink, #eaf1fb);
  border-top: 1px solid var(--line, rgba(160, 190, 230, .32));
  box-shadow: 0 -6px 24px rgba(0, 0, 0, .35);
  font: 400 15px/1.5 var(--sans, Figtree, system-ui, -apple-system, 'Segoe UI', sans-serif);
}
.ci-consent[hidden] { display: none; }
.ci-consent-inner {
  max-width: 1120px; margin: 0 auto;
  display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px;
}
.ci-consent-text { flex: 1 1 360px; margin: 0; max-width: 72ch; }
.ci-consent-text a { color: var(--cyan, #00aeef); text-decoration: underline; text-underline-offset: .16em; }
.ci-consent-actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* WCAG 2.5.8: every control is at least 24px tall; these are 44px for comfortable touch */
.ci-consent-btn {
  min-height: 44px; min-width: 44px; padding: 0 18px;
  border-radius: 8px; border: 1px solid transparent; cursor: pointer;
  font: 600 15px/1 var(--sans, Figtree, system-ui, sans-serif);
}
.ci-consent-btn-primary { background: #00aeef; border-color: #00aeef; color: #06101d; }
.ci-consent-btn-secondary { background: transparent; border-color: rgba(234, 241, 251, .7); color: #eaf1fb; }
.ci-consent-btn:hover { filter: brightness(1.08); }
.ci-consent-btn:focus-visible { outline: 3px solid #5cd0ff; outline-offset: 2px; }

/* Light theme (site sets data-theme on <html>) */
:root[data-theme="light"] .ci-consent {
  background: #ffffff; color: #0b1a2e; border-top-color: #d3deeb;
  box-shadow: 0 -6px 24px rgba(11, 26, 46, .14);
}
:root[data-theme="light"] .ci-consent-text a { color: #0077b6; }
:root[data-theme="light"] .ci-consent-btn-primary { background: #0077b6; border-color: #0077b6; color: #ffffff; }
:root[data-theme="light"] .ci-consent-btn-secondary { border-color: #3c4c63; color: #0b1a2e; }
:root[data-theme="light"] .ci-consent-btn:focus-visible { outline-color: #0077b6; }

@media (max-width: 600px) {
  .ci-consent { padding: 16px; }
  .ci-consent-actions { width: 100%; }
  .ci-consent-btn { flex: 1 1 0; }
}
