// Header.jsx — Jutarnji List style header

Object.assign(window, { SiteHeader });

function SiteHeader() {
  const navItems = ["Aktualno","Top 1500","Top gradovi","Economist","TikTok Buzz","Platforma"];

  return (
    <header id="t3-header" className="container t3-header">
      <nav id="t3-mainnav" className="navbar-main __jutarnji">
        <button className="navbar-toggler toggler collapsed">
          <span className="navbar-toggler-icon" />
        </button>
        <div className="main-nav">
          <div className="mali_logo_container">
            <img src="./index/JL_logo.svg" alt="Jutarnji List" />
          </div>
          <div id="navbar-head">
            <ul className="navbar-nav">
              {navItems.map((item, i) => (
                <li key={item} className="nav__item">
                  <span className={`nav__link${i === 0 ? " active_link" : ""}`}>{item}</span>
                </li>
              ))}
            </ul>
          </div>
          <div className="ikone_top_container">
            <div className="SearchBar">
              <span><i className="fas fa-search" /></span>
            </div>
            <div className="piano-user-login2">
              <img className="piano-user-icon" src="./index/logged_out.svg" alt="login" />
            </div>
          </div>
        </div>
      </nav>
    </header>
  );
}