/* Маркар landing — sticky header.
   NOTE: this file is also swept into _ds_bundle.js by the DS compiler, so it
   must be side-effect-safe: it only assigns window.* and never reads
   possibly-undefined deps (MkIcons / DS namespace) at IIFE-eval time. */
(function () {
  const WA = 'https://cdn.simpleicons.org/whatsapp/ffffff';
  const TG = 'https://cdn.simpleicons.org/telegram/ffffff';

  const NAV = [
    ['#quiz', 'Подбор авто'],
    ['#models', 'Модели'],
    ['#lead', 'Заявка'],
  ];

  function Logo() {
    const React = window.React;
    return (
      <a href="#top" className="mk-logo" aria-label="MARCAR — на главную">
        <img src="assets/marcar-logo-black.png" alt="MARCAR" className="mk-logo__img mk-logo__img--dark" />
        <img src="assets/marcar-logo-white.png" alt="MARCAR" className="mk-logo__img mk-logo__img--light" />
      </a>
    );
  }
  window.Logo = Logo;

  function Header() {
    const React = window.React;
    const { Button } = window.DesignSystem_019df8;
    const { Phone, MessageCircle, Send } = window.MkIcons;
    return (
      <header className="mk-header">
        <div className="mk-container mk-header__inner">
          <Logo />

          <nav className="mk-nav" aria-label="Разделы">
            {NAV.map(([href, label]) => (
              <a key={href} className="mk-nav__link" href={href}>{label}</a>
            ))}
          </nav>

          <div className="mk-header__actions">
            <a className="mk-tel mk-header__phone" href="tel:+78142554505">+7 (8142) 55-45-05
              <small>Пн–Вс · 9:00–21:00</small>
            </a>
            <a className="mk-msgr mk-msgr--max" href="https://max.ru/+79114094429" target="_blank" rel="noopener" aria-label="Написать в MAX"><MessageCircle size={20} /></a>
            <a className="mk-msgr mk-msgr--tg" href="https://t.me/+79114094429" target="_blank" rel="noopener" aria-label="Написать в Telegram"><Send size={20} /></a>
            <a href="tel:+78142554505" className="mk-msgr mk-msgr--call" aria-label="Позвонить"><Phone size={20} /></a>
            <Button as="a" href="#quiz" variant="primary" size="sm" className="mk-header__cta">
              Подобрать авто
            </Button>
          </div>
        </div>
      </header>
    );
  }
  window.Header = Header;
})();