export default function Navbar() {
  return (
    <>
      <header className="flex items-center justify-between mb-[20px] w-full px-[6px] py-[20px] bg-[#f5f8fa] shadow-[0_2px_8px_rgba(0,0,0,0.5)]">
        <a href="#">
          <img src="/Logo.png" alt="logo" className="w-[135px] h-[54px] relative" />
        </a>
        <nav className="relative flex">
          <select
            name="Linguas"
            id=""
            className="border-none ml-[20px] text-[16px] text-[#00bf63] focus:outline-none"
          >
            <option value="Portugues">PT-BR</option>
            <option value="Ingles">EN</option>
          </select>
          <ul className="relative flex items-center">
            <li className="relative inline-block list-none">
              <a
                href="#"
                className="inline-block decoration-[none] text-[16px] ml-[20px] text-[#00bf63] hover:text-[#07a65a]"
              >
                Quem somos
              </a>
            </li>
            <li className="relative inline-block list-none">
              <a
                href="#"
                className="inline-block decoration-[none] text-[16px] ml-[20px] text-[#00bf63] hover:text-[#07a65a]"
              >
                Supporte
              </a>
            </li>
            <li className="relative inline-block list-none">
              <hr className="border-none h-[20px] ml-[20px] border-l-[1px_solid_black]" />
            </li>
            <li className="relative inline-block list-none">
              <a
                href="#"
                className="inline-block decoration-[none] text-[16px] ml-[20px] font-bold text-[#00bf63] hover:text-[#07a65a]"
              >
                Login
              </a>
            </li>
          </ul>
          <button
            id="ambuigue_header_button"
            className="decoration-[none] font-bold border-none text-[35px] p-[0_20px] ml-[20px] border-[28px] cursor-pointer bg[#00bf63] transition-[bg_0.3s_ease]"
          >
            <i className="fa-solid fa-bars"></i>
          </button>
          <a href="#" className="Signup_button header_Button">
            Inscreva-se
          </a>
        </nav>

        <div>
          <div className="menu_ambuigue">
            <div className="register_ambuigue">
              <img src="./img/Logo.png" alt="logo" className="header_logo_icon" />
              <nav>
                <ul>
                  <li>
                    <a href="./php/login.php" className="ambuigue_Login_link Login_link">
                      Login
                    </a>
                  </li>
                  <li>
                    <a href="./php/cadastro.php" className="ambuigue_Signup_button ambuigue_Button">
                      Inscreva-se
                    </a>
                  </li>
                </ul>
              </nav>
            </div>

            <nav className="other_options_ambuigue">
              <ul>
                <li>
                  <a className="ambuigue_Button" href="#">
                    Quem somos
                  </a>
                </li>
                <li>
                  <a className="ambuigue_Button" href="#">
                    Supporte
                  </a>
                </li>
              </ul>
            </nav>
          </div>
        </div>
      </header>
    </>
  )
}
