---
// 152-ФЗ cookie consent baner. Хранит выбор в localStorage + cookie ph-consent.
// Активирует скрипты Analytics при согласии (см. Analytics.astro).
---

<div id="cookie-consent" hidden role="dialog" aria-labelledby="cc-title" aria-describedby="cc-desc">
  <div class="cc-inner">
    <div class="cc-text">
      <strong id="cc-title">Мы используем cookies</strong>
      <p id="cc-desc">
        Сайт использует cookies и системы аналитики (Яндекс.Метрика, Google Analytics) для
        анонимной статистики посещений. Подробнее — в <a href="/privacy/">политике конфиденциальности</a>.
      </p>
    </div>
    <div class="cc-buttons">
      <button type="button" id="cc-deny" class="cc-btn cc-btn-secondary">Отклонить</button>
      <button type="button" id="cc-accept" class="cc-btn cc-btn-primary">Принять</button>
    </div>
  </div>
</div>

<style>
  #cookie-consent {
    position: fixed;
    left: 1rem;
    right: 1rem;
    bottom: 1rem;
    z-index: 1000;
    background: var(--paper);
    border: 1px solid var(--rule-strong);
    box-shadow: 0 4px 16px rgba(0,0,0,0.15);
    padding: 1rem 1.25rem;
    max-width: 720px;
    margin: 0 auto;
    font-family: var(--font-sans);
  }
  .cc-inner { display: flex; flex-direction: column; gap: 0.75rem; }
  @media (min-width: 640px) {
    .cc-inner { flex-direction: row; align-items: center; }
  }
  .cc-text strong { font-family: var(--font-serif); font-size: 1.05rem; }
  .cc-text p { margin: 0.3rem 0 0; font-size: 0.88rem; color: var(--ink-soft); line-height: 1.5; }
  .cc-buttons { display: flex; gap: 0.5rem; flex-shrink: 0; }
  .cc-btn {
    font-family: var(--font-sans);
    font-size: 0.88rem;
    font-weight: 500;
    padding: 0.5rem 1rem;
    border: 1px solid var(--rule-strong);
    background: var(--paper);
    color: var(--ink);
    cursor: pointer;
  }
  .cc-btn-primary {
    background: var(--accent);
    color: #fff;
    border-color: var(--accent);
  }
  .cc-btn-primary:hover { background: var(--accent-soft); }
  .cc-btn-secondary:hover { color: var(--accent); border-color: var(--accent); }
</style>

<script is:inline>
  (function () {
    const KEY = 'ph-consent';
    const el = document.getElementById('cookie-consent');
    if (!el) return;

    function setCookie(value) {
      const exp = new Date(Date.now() + 365 * 24 * 3600 * 1000).toUTCString();
      document.cookie = `${KEY}=${value}; expires=${exp}; path=/; SameSite=Lax`;
    }

    function activateAnalytics() {
      document.querySelectorAll('script[type="text/plain"][data-cookieconsent="statistics"]').forEach((s) => {
        const n = document.createElement('script');
        if (s.src) n.src = s.src;
        else n.textContent = s.textContent || '';
        if (s.async) n.async = true;
        document.head.appendChild(n);
      });
    }

    function decide(value) {
      try { localStorage.setItem(KEY, value); } catch {}
      setCookie(value);
      el.hidden = true;
      if (value === 'accept') activateAnalytics();
    }

    const saved = (() => {
      try { return localStorage.getItem(KEY); } catch { return null; }
    })();
    if (saved === 'accept') { activateAnalytics(); return; }
    if (saved === 'deny') return;
    el.hidden = false;

    document.getElementById('cc-accept')?.addEventListener('click', () => decide('accept'));
    document.getElementById('cc-deny')?.addEventListener('click', () => decide('deny'));
  })();
</script>
