/* =====================================================================
   StefMag — cookie consent banner. Warm, premium, accessible.
   Uses the site's design tokens (falls back if loaded standalone).
   ===================================================================== */
.consent {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 200;
  display: none;
  padding: clamp(14px, 2vw, 22px);
}
.consent.is-open { display: block; }

.consent__inner {
  max-width: 1180px;
  margin-inline: auto;
  background: var(--bg-elev, #fdfbf5);
  color: var(--ink-body, #524a3b);
  border: 1px solid var(--line, rgba(42,36,26,0.13));
  border-radius: var(--radius, 16px);
  box-shadow: 0 8px 40px rgba(40, 28, 8, 0.18);
  padding: clamp(16px, 2.4vw, 24px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 28px;
  justify-content: space-between;
}
.consent__body { flex: 1 1 320px; min-width: 260px; }
.consent__title {
  font-family: var(--font-display, sans-serif);
  color: var(--ink, #2a241a);
  font-weight: 600; font-size: 1.1rem; margin: 0 0 0.3rem;
}
.consent__text { margin: 0; font-size: 0.9rem; line-height: 1.55; max-width: 62ch; }
.consent__text a { color: var(--gold-ink, #7f5d10); text-decoration: underline; text-underline-offset: 2px; }

.consent__actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

.consent__btn {
  font-family: var(--font-body, sans-serif);
  font-weight: 600; font-size: 0.9rem;
  padding: 0.72em 1.25em;
  border-radius: 999px;
  border: 1px solid transparent;
  cursor: pointer;
  transition: transform .2s, background-color .2s, border-color .2s, color .2s;
  white-space: nowrap;
}
.consent__btn:active { transform: translateY(1px); }
/* Reject and Accept share the same visual weight on the first layer (GDPR).
   This used to be a comment the CSS did not honour: "Reject all" and
   "Preferences" carried a --line border (about 1.2:1 on the panel, effectively
   invisible) while "Accept all" had a gold fill AND a drop shadow. EDPB guidance
   treats that asymmetry as a dark pattern, and the faint border also missed
   WCAG SC 1.4.11's 3:1 for a control boundary. Now the ghost buttons have a
   full-strength --gold-ink border (about 5.8:1) and the solid button has lost
   its shadow, so all three read as one set of equally weighted pills.
   Keep them equal: making rejection quieter than acceptance is the exact thing
   this banner is supposed to avoid. */
.consent__btn--ghost { background: transparent; color: var(--ink, #2a241a); border-color: var(--gold-ink, #7f5d10); }
.consent__btn--ghost:hover { background: var(--gold-soft, rgba(198,161,91,0.16)); }
.consent__btn--solid { background: var(--gold, #c6a15b); color: #1c1608; }
.consent__btn--solid:hover { background: var(--gold-bright, #d8b876); }
.consent__btn:focus-visible { outline: 2px solid var(--gold-ink, #7f5d10); outline-offset: 2px; }

/* Preferences panel */
.consent__prefs {
  max-width: 1180px; margin: 10px auto 0;
  background: var(--bg-elev, #fdfbf5);
  border: 1px solid var(--line, rgba(42,36,26,0.13));
  border-radius: var(--radius, 16px);
  box-shadow: 0 8px 40px rgba(40, 28, 8, 0.18);
  padding: clamp(14px, 2vw, 22px);
}
.consent__row {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 20px;
  padding: 12px 4px;
  border-bottom: 1px solid var(--line-soft, rgba(42,36,26,0.07));
}
.consent__row:last-of-type { border-bottom: 0; }
.consent__row-label { display: block; font-weight: 600; color: var(--ink, #2a241a); font-size: 0.95rem; }
.consent__row-desc { display: block; font-size: 0.82rem; color: var(--ink-dim, #6e6555); margin-top: 2px; max-width: 60ch; }
.consent__row input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--gold-ink, #7f5d10); margin-top: 3px; flex: 0 0 auto; }
.consent__row--locked input { opacity: 0.6; }
.consent__prefs-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 14px; flex-wrap: wrap; }

@media (max-width: 560px) {
  .consent__actions { width: 100%; }
  .consent__btn { flex: 1 1 auto; text-align: center; }
}

@media (prefers-reduced-motion: reduce) {
  .consent__btn { transition: none; }
}

/* footer legal links */
/* .footer__legal is NOT styled here. It exists only on index.html, which loads
   styles.css; consent.css loads AFTER it, so a copy of these rules here silently
   won the cascade and overrode the intended gap. Removed 2026-07-19. */

/* The "Cookie preferences" control only does anything with JS (it reopens the
   banner, which is itself JS-built). Without JS it was an <a href="#"> that just
   jumped to the top of the page, so hide it in that case. consent.js already
   preventDefault()s the click when JS is on. */
html:not(.js) [data-cookie-prefs] { display: none; }