#cookie-consent[hidden] { display: none; }

#cookie-consent {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 80;
  width: min(42rem, calc(100vw - 2rem));
  border: 1px solid var(--border);
  border-radius: 1rem;
  background: rgba(255, 255, 255, .98);
  box-shadow: 0 1rem 3rem rgba(15, 23, 42, .2);
  color: var(--text);
  opacity: 0;
  transform: translateY(1rem);
  transition: opacity .2s ease, transform .2s ease;
}

#cookie-consent.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.cookie-consent-inner { padding: 1.25rem; }
.cookie-consent-title { font-family: Sora, Manrope, sans-serif; font-weight: 700; font-size: 1rem; }
.cookie-consent-copy { margin-top: .5rem; color: var(--text-muted); font-size: .875rem; line-height: 1.6; }
.cookie-consent-copy a { color: var(--brand-strong); text-decoration: underline; text-underline-offset: 3px; }
.cookie-consent-actions { display: flex; flex-wrap: wrap; gap: .625rem; margin-top: 1rem; }
.cookie-consent-button { min-height: 2.5rem; border-radius: .75rem; padding: .625rem 1rem; font-size: .875rem; font-weight: 700; cursor: pointer; }
.cookie-consent-button-primary { border: 1px solid var(--brand); background: var(--grad-brand); color: #fff; }
.cookie-consent-button-secondary { border: 1px solid var(--border-strong); background: #fff; color: var(--text); }
.cookie-consent-button-link { border: 0; background: transparent; color: var(--brand-strong); text-decoration: underline; text-underline-offset: 3px; }
.cookie-consent-details { margin-top: 1rem; border-top: 1px solid var(--border); padding-top: 1rem; }
.cookie-consent-details[hidden] { display: none; }
.cookie-consent-option { display: flex; gap: .75rem; align-items: flex-start; padding: .75rem 0; }
.cookie-consent-option + .cookie-consent-option { border-top: 1px solid var(--border); }
.cookie-consent-option input { margin-top: .25rem; accent-color: var(--brand); }
.cookie-consent-option strong { display: block; font-size: .875rem; }
.cookie-consent-option span { display: block; margin-top: .2rem; color: var(--text-muted); font-size: .8125rem; line-height: 1.5; }

@media (max-width: 640px) {
  #cookie-consent { right: .75rem; bottom: .75rem; width: calc(100vw - 1.5rem); }
  .cookie-consent-actions > * { flex: 1 1 100%; }
}