/* The consent banner (capabilities/analytics). A brand sets its colours with --consent-bg,
   --consent-ink, --consent-line, --consent-button and --consent-button-ink. Reject and Accept
   share one style and size (AEPD: rejecting must be as easy as accepting); the card sits in
   the lower left, where notices get answered most (Utz et al., CCS 2019; docs/research.md). */
.analytics-consent { position: fixed; inset: auto auto 1rem 1rem; z-index: 100; width: min(25rem, calc(100vw - 2rem)); padding: 1.1rem 1.2rem; background: var(--consent-bg, #fffaf2); color: var(--consent-ink, #202c28); border: 1px solid var(--consent-line, #bebbb0); border-radius: 12px; box-shadow: 0 6px 30px #0002; max-height: 80vh; overflow: auto; animation: analytics-consent-in .35s ease-out; }
.analytics-consent[hidden], #analytics-options[hidden], .analytics-preferences[hidden] { display: none; }
/* The open banner holds every choice; the Cookies button would only peek out from under it. */
.analytics-consent:not([hidden]) ~ .analytics-preferences { display: none; }
.analytics-consent h2 { margin: 0 0 .5rem; font-size: 1.15rem; }
.analytics-consent p { font-size: .92rem; line-height: 1.45; margin: 0 0 .9rem; }
.analytics-consent-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; }
.analytics-consent button { padding: .7rem .9rem; background: var(--consent-button, #202f2b); color: var(--consent-button-ink, white); border: 1px solid var(--consent-button, #202f2b); border-radius: 6px; font: inherit; font-weight: 600; cursor: pointer; }
#analytics-customize { grid-column: 1 / -1; justify-self: start; min-height: 0; padding: .3rem 0 0; background: none; border: 0; box-shadow: none; transform: none; color: var(--consent-ink, #202c28); font-size: .85rem; font-weight: 400; text-decoration: underline; }
#analytics-save { background: transparent; color: var(--consent-button, #202f2b); }
#analytics-options { margin-top: .8rem; }
#analytics-options label { display: block; margin: .7rem 0; }
#analytics-options input { width: auto; display: inline; }
.analytics-preferences { position: fixed; bottom: .5rem; left: .5rem; z-index: 90; padding: .35rem .6rem; border: 1px solid var(--consent-line, #bebbb0); border-radius: 5px; background: var(--consent-bg, #fffaf2); color: var(--consent-button, #202f2b); cursor: pointer; font-size: .8rem; }
@keyframes analytics-consent-in { from { opacity: 0; transform: translateY(1rem); } }
@media (prefers-reduced-motion: reduce) { .analytics-consent { animation: none; } }
@media (max-width: 640px) {
  /* Compact bar on phones so the page's main button stays visible. */
  .analytics-consent { inset: auto .5rem .5rem; width: auto; padding: .8rem .9rem; border-radius: 10px; max-height: 60vh; }
  .analytics-consent h2 { font-size: 1rem; margin-bottom: .3rem; }
  .analytics-consent p { font-size: .82rem; line-height: 1.4; margin-bottom: .6rem; }
  .analytics-consent-actions { gap: .4rem; }
  .analytics-consent button { padding: .6rem .3rem; font-size: .9rem; }
  #analytics-customize { padding-top: .2rem; font-size: .8rem; }
}
