// Nav + promo banner + sticky book bar
const PromoBanner = ({ text }) => (
  <div className="promo">
    <div className="marquee">
      {Array.from({length: 2}).map((_, g) => (
        <React.Fragment key={g}>
          <span>{text}</span><span className="dot">✦</span>
          <span>Estetinė osteopatija · Kaunas &amp; Vilnius</span><span className="dot">✦</span>
          <span>Oksana Budraitė</span><span className="dot">✦</span>
          <span>Grožio salonas ETRE · Kaunas</span><span className="dot">✦</span>
        </React.Fragment>
      ))}
    </div>
  </div>
);

const Nav = ({ onBook, activeSection, ctaLabel }) => {
  const links = [
    { id: 'about', label: 'Apie mane' },
    { id: 'method', label: 'Seansas' },
    { id: 'process', label: 'Poveikis' },
    { id: 'results', label: 'Atsiliepimai' },
    { id: 'pricing', label: 'Kainos' },
    { id: 'faq', label: 'DUK' }
  ];
  return (
    <nav className="nav">
      <div className="nav-inner">
        <a href="#top" onClick={(e)=>{e.preventDefault(); window.scrollTo({top:0, behavior:'smooth'});}}>
          <Logo />
        </a>
        <div className="nav-links">
          {links.map(l => (
            <a key={l.id} href={`#${l.id}`}
               className={activeSection === l.id ? 'active' : ''}
               onClick={(e)=>{
                 e.preventDefault();
                 const el = document.getElementById(l.id);
                 if (el) window.scrollTo({top: el.offsetTop - 80, behavior: 'smooth'});
               }}>{l.label}</a>
          ))}
        </div>
        <button className="nav-cta" onClick={onBook}>
          {ctaLabel} <Icon name="arrow" size={14} />
        </button>
      </div>
    </nav>
  );
};

const StickyBar = ({ show, onBook }) => (
  <div className={`sticky-bar ${show ? 'show' : ''}`}>
    <div className="left">
      <div className="pulse"></div>
      <div className="msg">
        Norite pajusti skirtumą? <strong>Registruokitės į seansą.</strong>
      </div>
    </div>
    <button className="btn btn-sage" onClick={onBook} style={{padding: '14px 24px'}}>
      Registruotis <Icon name="arrow" size={14} />
    </button>
  </div>
);

Object.assign(window, { PromoBanner, Nav, StickyBar });