---
// Lille cookie-popup: vises 1. gang man besøger siden, huskes derefter i localStorage.
// Implicit samtykke — ved at bruge siden accepterer man cookies (samme tekst på /cookies).
---
<div
  id="cookie-banner"
  hidden
  class="fixed inset-x-0 bottom-0 z-[60] px-4 pb-4"
  role="dialog"
  aria-live="polite"
  aria-label="Cookie-besked"
>
  <div class="mx-auto flex max-w-3xl flex-col gap-3 rounded-2xl border border-border bg-surface/95 p-4 shadow-xl backdrop-blur sm:flex-row sm:items-center sm:justify-between">
    <p class="text-sm text-muted">
      Denne side bruger cookies til at forbedre din oplevelse og lave anonym statistik over besøg.
      Ved at bruge siden accepterer du det. <a href="/cookies" class="text-accent underline">Læs mere</a>.
    </p>
    <button
      id="cookie-ok"
      class="shrink-0 self-start rounded-xl bg-accent px-5 py-2 text-sm font-medium text-bg transition-transform hover:-translate-y-0.5 sm:self-auto"
    >OK</button>
  </div>
</div>

<script is:inline>
  (function () {
    var KEY = 'wec_cookie_ack';
    function wire() {
      var b = document.getElementById('cookie-banner');
      if (!b) return;
      try { if (localStorage.getItem(KEY)) { b.hidden = true; return; } } catch (_) {}
      b.hidden = false;
      var ok = document.getElementById('cookie-ok');
      if (ok && !ok.__wired) {
        ok.__wired = true;
        ok.addEventListener('click', function () {
          try { localStorage.setItem(KEY, '1'); } catch (_) {}
          b.hidden = true;
        });
      }
    }
    wire();
    document.addEventListener('astro:page-load', wire);
  })();
</script>