include ../mixin/icon
include ../mixin/page-heading
include ../mixin/button-link
include ../data/main

header(id="main-header" class="main-header")
  section.main-header__row.main-header__row--top
    .main-header__hamburger
      button.hamburger
        span
        span
        span
    .main-header__hamburger-dropdown
      button.main-header__hamburger-close
        +icon('icon-close', false, [16, 16])
      +page-heading('Меню', 'align-left')
      .location.main-header__location
        button.location__current(type="button")
          +icon('icon-address')
          span Ваш город:
          span.js-current Санкт-Петербург
        +button-link('изменить', ['inverse'])
      nav.main-nav.main-header__nav
        ul.main-nav__list
          each item in navItems
            - const hasChild = item.sublist
            li&attributes({
              class: `main-nav__item${hasChild ? ' has-child' : ''}`
            })
              a(href="#") !{item.sublist ? item.title : item}
              if item.sublist
                +icon('icon-arrow-down-sign-to-navigate')
                ul.main-nav__sublist
                  each subItem in item.sublist
                    li.main-nav__subitem
                      a(href="#")= subItem
        .main-nav__compare
          a(href="#")
            h3 Сравнение
            button.user-nav__button.user-nav__button--compare
              +icon('icon-search')
              span.user-nav__amount 3
      .callback.main-header__callback
        a(href="tel:+78123177793")
          span +7 (812) 317-77-93
          +icon('icon-phone-call')
        button.js-order Перезвоните мне
      .language.main-header__language
        a.language__link(lang="en" hreflang="en" href="#") EN
        a.language__link.language__link--current(lang="ru" hreflang="ru" href="#") RU

  section.main-header__row.main-header__row--bottom
    .main-header__logo-wrp
      a.logo(href="#")
        img(src="../../assets/img/logo_ru.svg" alt="INNODRIVE")
    .main-header__dropdown-wrp
      nav.menu(id="menu")
        div.menu__current
          a(href="#") Каталог
            +icon('icon-arrow-down-sign-to-navigate')
        .main-header__dropdown.menu__dropdown
          .menu__filter
            input(id="menu-filter-brands" type="radio" name="menu-filter" value="brands" data-value="brands" checked)
            label(for="menu-filter-brands") По брендам
            input(id="menu-filter-category" type="radio" name="menu-filter" value="category" data-value="category")
            label(for="menu-filter-category") По Категориям
          .menu__dropdown-lists
            ul.menu__list.menu__list--brands.visible(data-value="brands")
              li.menu__item
                a(href="#") Brands
              li.menu__item
                a(href="#") Brands
              li.menu__item
                a(href="#") Brands
            ul.menu__list.menu__list--categories(data-value="category")
              li.menu__item
                a(href="#") Categories
              li.menu__item
                a(href="#") Categories
              li.menu__item
                a(href="#") Categories
      .search
        input.search__field(type="text" placeholder="Поиск по каталогу")
        button.search__button
          +icon('icon-magnifier')
        .main-header__dropdown.search__dropdown
          .search__results-group
            h3 Товары
            ul
              li
                a(href="#") Mock
              li
                a(href="#") Mock
              li
                a(href="#") Mock
    nav.user-nav
      .callback.main-header__callback
        a(href="tel:+78123177793") +7 (812) 317-77-93 #[+icon('icon-phone-call')]
      button.user-nav__button.user-nav__button--compare
        +icon('icon-search')
        span.user-nav__amount 3
      button.user-nav__button.user-nav__button--cart
        +icon('icon-shopping-cart')
        span.user-nav__amount 15