<header class="nav-bar" data-theme="light">
  <p class="nav-bar__product">
    <span class="nav-bar__product__icon material-icons-outlined"> apps </span>
    <span class="nav-bar__product__name">data-theme="light"</span>
  </p>

  <nav aria-label="Main menu" class="nav-bar__main-nav">
    <ul>
      <li>
        <a href="/">Mi Portal</a>
      </li>
      <li aria-current="page">
        <a href="#" aria-haspopup="true">Mi Documentos</a>
        <ul aria-label="submenu">
          <li><a href="#">Pessoas</a></li>
          <li><a href="#">Produtos</a></li>
          <li><a href="#">Natureza de Operacao</a></li>
          <li>
            <a href="#" aria-haspopup="true">Veiculos</a>
            <ul aria-label="submenu">
              <li><a href="#">Pessoas</a></li>
              <li><a href="#">Produtos</a></li>
              <li><a href="#">Natureza de Operacao</a></li>
            </ul>
          </li>
          <li class="sub-nav__title">
            <span>Section's Title</span>
          </li>
          <li><a href="#">Frete CEP</a></li>
          <li><a href="#">Frete CEP</a></li>
          <li><a href="#">Frete CEP</a></li>
        </ul>
      </li>
      <li>
        <a href="/">Crear Documento</a>
      </li>
    </ul>
  </nav>

  <ul class="nav-bar__controls">
    <li>
      <select
        aria-label="Account Switcher"
        class="account-switcher"
        name="account-switcher"
        id="account-switcher"
      >
        <option value="">Account Name</option>
        <option value="">Smart DF-e</option>
        <option value="">DEC 5</option>
      </select>
    </li>
    <li>
      <button type="button" class="btn btn-floating">
        <span class="material-icons-outlined"> notifications </span>
      </button>
    </li>
    <li>
      <button type="button" class="btn btn-floating">
        <span class="material-icons-outlined"> settings </span>
      </button>
    </li>
    <li>
      <button type="button" class="btn btn-floating">
        <span class="material-icons-outlined"> account_circle </span>
      </button>
    </li>
  </ul>
</header>