/*******************************
        Theme Overrides
*******************************/

@menuColor: #564535;
@hoverColor: #ca4300;
@stickyMenuColor: #f1f0ee;

.ui.menu {
  font-family: @headerFont;
  transition: none;
}

.navigation .menu .item {
  font-size: 1rem;
  text-transform: none !important;
}

.navigation .menu .firstLevel {
  padding: 1.7em 0 1.375em;
  color: @menuColor;
  font-weight: 700;
  line-height: 21px;
}

.ui.secondary.pointing.menu {
  border-bottom: none !important;
}

.navigation .ui.secondary.pointing.menu > .item.dropdown {
  position: relative;

  .firstLevel:not(.item) {
    padding: 0;
  }

  // &:not(a) {
  //     padding: 0;
  // }
}

.navigation {
  .ui.secondary.pointing.menu .item {
    border-bottom: none;
    transition: none !important;
  }

  .menu {
    transition: none !important;

    .firstLevel {
      border: 1px solid transparent;
      font-size: 18px !important;
      line-height: 1;
      // .firstLevel-title {
      //     @media(max-width:1200px) {
      //         padding-bottom: 1rem;
      //     }
      // }

      @media (max-width: 800px) {
        border-color: transparent !important;
        border-radius: 0 !important;

        .firstLevel-title {
          width: calc(100% + 2rem);
          padding: 1rem;
          margin-top: -1rem;
          margin-right: -1rem;
          margin-bottom: -1rem;
          margin-left: -1rem;
        }

        &.dropdown {
          overflow: hidden;
          border: none !important;
          box-shadow: none !important;

          > .menu {
            width: calc(100% + 3rem) !important;
            border: none !important;
            border-top: 1px solid #eee !important;
            border-bottom: 1px solid #eee !important;
            margin-top: 1rem !important;
          }
        }
      }
    }

    // @media(min-width: 1200px) {

    .item.firstLevel {
      &:hover {
        color: @hoverColor !important;

        a.firstLevel {
          color: #cc4400 !important;
        }
      }
    }

    // }

    div.item.firstLevel {
      border: 1px solid transparent !important;
      border-bottom: 1px solid transparent !important;

      &:hover {
        @media (min-width: 800px) {
          border-color: #eee !important;
          background: white !important;

          // box-shadow          : 1px -2px 9px 0px rgba(0,0,0,0.3);
          border-top-left-radius: 4px;
          border-top-right-radius: 4px;
        }

        // &:after {
        //     content      : '';
        //     position     : absolute;
        //     bottom       : -2px;
        //     left         : 0;
        //     right        : 0;
        //     border-bottom: 2px solid white;
        //     display      : block;
        // }
      }
    }

    .Countries--section {
      display: block;

      @media (min-width: 600px) {
        min-width: 450px !important;
      }

      @media (max-width: 800px) {
        overflow: auto !important;
        max-height: 50vh;
      }

      .item.Countries--section-item {
        display: inline-block !important;
        width: 33%;

        @media (max-width: 768px) {
          width: 50% !important;
        }

        &:not(#Regions) {
          a {
            padding: 0rem 0.5rem !important;
            color: #564535;
            font-size: 0.9rem;
            font-weight: 400 !important;
            text-align: center;

            // &:hover {
            //     color: #cc4400 !important;
            // }
          }
        }

        &#Regions {
          width: 100%;
          padding-bottom: 0.5rem;
          margin-bottom: 0.5rem;
          cursor: initial !important;
          text-align: center;

          @media (max-width: 768px) {
            width: 100% !important;
          }

          > div.secondLevel {
            border-top: 1px solid #eee;
            border-bottom: 1px solid #eee !important;
            pointer-events: none;
          }

          a {
            padding: 0rem 0.5rem !important;
            line-height: 2.5;
          }

          a:hover {
            background: @hoverColor !important;
            color: white !important;
            text-decoration: none;
          }
        }
      }
    }
  }
}

.ui.secondary.menu .dropdown.item > .menu,
.ui.text.menu .dropdown.item > .menu {
  border-radius: 0;
}

// @media(max-width: 1200px) {

//     a.item.secondLevel {

//         &:before {
//                 content     : "►";
//                 color       : rgb(34, 85, 17);
//                 font-size   : 0.8rem;
//                 margin-right: 7px;
//                 margin-left : -1rem;
//                 position    : absolute;
//         }
//     }
// }

.ui.secondary.pointing.menu a.item:active {
  border-bottom: 2px solid transparent;
  color: inherit;
}

.navigation .menu .dropdown > .menu > .dropdown .menu {
  overflow: hidden;
}

.navigation .menu .dropdown > .menu > .item {
  .item.thirdLevel {
    @media (max-width: 800px) {
      padding-left: 2.5rem;
      font-weight: 400;
    }
  }

  > .item.secondLevel {
    padding: 0 1.5rem;
    border-bottom-style: none;
    margin: 0;
    color: #005555;
    font-weight: 500;
    line-height: 2.5;

    @media (max-width: 800px) {
      font-weight: 400;
    }

    &:active {
      border: none;
    }

    @media (min-width: 800px) {
      &:hover {
        background: #cc4400;
        color: #fff !important;
      }
    }
  }

  &:hover {
    background: unset !important;
    color: initial !important;
  }

  &:not(a) {
    padding: 0 !important;
    border-bottom: 1px solid #eee;
  }
}

.navigation .menu > .dropdown.item > .menu .item {
  border-bottom: none !important;
  margin: 0;

  &:not(a) {
    padding: 0 !important;
    border-bottom: 1px solid #eee;
  }
}

.navigation .dropdown .submenu-wrapper {
  max-height: 300px;
  margin-bottom: 1rem;
  overflow-y: auto;
}

.navigation .dropdown .submenu {
  padding-top: 1rem;
  column-count: 2;
  column-gap: 1rem;

  > a {
    display: block;
    padding: 0.3rem 1.5rem !important;
    color: @menuColor;
    column-span: all; // ignore two column layout by default
    font-size: 0.9rem !important;
    font-weight: 400;

    @media (min-width: 800px) {
      &:hover {
        color: @darkOrange !important;
        text-decoration: underline;
      }
    }
  }

  // if more than 3 items are present
  // wrap the list into two column
  > a:nth-last-child(n + 3),
  > a:nth-last-child(n + 3) ~ * {
    column-span: none;
  }
}

.ui.secondary.menu .dropdown.item > .menu,
.ui.text.menu .dropdown.item > .menu {
  margin-top: 0;
}

.navigation .menu > .dropdown.item > .menu {
  left: 50%;
  // box-shadow          : 0px 0px 25px 0px rgba(0, 0, 0, 0.2);
  left: 50%;
  border: 1px solid #eee;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;
  box-shadow: none;
  transform: translateX(-50%);
  transform: translateX(-50%);

  @media (min-width: 800px) {
    margin-top: -3px !important;
  }
}

.ui.menu .ui.dropdown .menu > .item:hover {
  background-color: transparent !important;
}

.carretTop {
  position: absolute;
  top: -15px;
  // left         : 25px;
  // left         : unset;
  right: calc(100% - 2rem);
  width: 0;
  height: 0;
  border-right: 15px solid transparent;
  border-bottom: 15px solid white;
  border-left: 15px solid transparent;
  content: '';
  // -3rem pe sticky/
}

.sticky-outer-wrapper.active {
  .carretTop {
    top: -8px;
  }
}

.navigation {
  .ui.dropdown .menu > .header {
    position: absolute;
    right: 70px;
    width: 0;
    height: 0;
    padding: 0 !important;
    margin: 0 !important;
  }
}

.sticky-inner-wrapper {
  z-index: 10;
}

.logoImageSm {
  display: none !important;
}

@media (max-width: 600px) {
  .logoImage {
    height: 65px !important;
  }
}

@media (max-width: @computerBreakpoint - 1px) {
  .logoImageWithText {
    display: none !important;
  }
}

@media (max-width: 450px) {
  .logoImage {
    height: 55px !important;
  }
}

.sticky-outer-wrapper.active {
  .logoImage {
    display: none !important;
  }

  .logoImageSm {
    display: block !important;
  }

  @media (max-width: @computerBreakpoint - 1px) {
    .logoImageWithText {
      display: none !important;
    }
  }

  .searchInput {
    background: white;
  }

  .sticky-inner-wrapper {
    z-index: 10;
    background: @stickyMenuColor;
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);

    @media (max-width: 800px) {
      background: white;
    }

    .menu {
      margin-top: 1rem;
      margin-bottom: 1rem;
    }

    .showInput {
      background: white;
    }

    .header {
      display: flex;
      align-items: center;
      justify-content: space-between;

      .nav-actions {
        position: relative;
        top: unset;
        right: unset;
        // margin-top: 1rem;
        padding-right: 1rem;
      }
    }

    .logo-nav-wrapper {
      flex-grow: 1;
      align-items: center;
      padding-right: 0;
      margin-top: 0;
    }

    .navigation .ui.secondary.pointing.menu > .item {
      > a {
        padding: 0;
      }
    }

    @media (max-width: 800px) {
      .ui.pointing.secondary.stackable.open.menu {
        margin-top: 0 !important;
      }
    }

    .navigation .ui.secondary.pointing.menu .item {
      font-size: 1rem;
    }

    .logo {
      margin: 0.5rem 0;

      img {
        height: 40px !important;
      }

      .logoImageSm {
        height: 63px !important;
      }
      @media (max-width: 600px) {
        .logoImageSm {
          height: 51px !important;
        }
      }
      @media (max-width: 450px) {
        .logoImageSm {
          height: 45px !important;
        }
      }
    }
  }
}

.ui.form .searchbox.field {
  display: flex;
  align-items: center;
}

.ui.menu .item > i.dropdown.icon {
  display: none;
}

// hamburger
.hamburger-inner,
.hamburger-inner::before,
.hamburger-inner::after,
.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner::before,
.hamburger.is-active .hamburger-inner::after {
  background-color: #015610 !important;
}

.sticky-outer-wrapper.active {
  @media (min-width: 1200px) and (max-width: 1300px) {
    .sticky-inner-wrapper
      .navigation
      .ui.secondary.pointing.menu
      > .item.firstLevel {
      margin: 0;
    }
  }
}

.nav-actions-mobile {
  display: none !important;
}

.nav-actions {
  display: none !important;
}

@media (min-width: 800px) {
  .firstLevel:active {
    a.firstLevel {
      pointer-events: none;
    }
  }
}

.zero-margin {
  margin: 0 !important;
}

body {
  @media (max-width: 800px) {
    .ui.pointing.secondary.stackable.open.firstLevel.menu {
      z-index: 100;
    }

    .ui.simple.active.dropdown > .menu,
    .ui.simple.dropdown:hover > .menu {
      position: relative;
      top: initial !important;
      overflow: visible;
      width: auto;
      height: auto;
      opacity: 1;
    }

    .ui.simple.active.dropdown > .menu,
    .ui.simple.dropdown > .menu.hovered {
      position: relative;
      top: initial !important;
      overflow: visible;
      width: auto;
      height: auto;
      opacity: 1;
    }
  }
}

.navigation,
.tools {
  .ui.secondary.pointing.menu {
    .item {
      padding-top: @relativeBig;
      margin: 0;
      text-transform: uppercase;

      @media only screen and (min-width: @largestTabletScreen) {
        padding: 0.875em 0.8125em;
        margin: 0;
      }
    }
  }
}
