/**
 * Olegnax
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Olegnax.com license that is
 * available through the world-wide-web at this URL:
 * https://www.olegnax.com/license
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade this extension to newer
 * version in the future.
 *
 * @category    Olegnax
 * @package     Olegnax_MegaMenu
 * @copyright   Copyright (c) 2010-2021 Olegnax (http://www.olegnax.com/)
 * @license     https://www.olegnax.com/license
 */
@import 'variables/_variables.less';

//
//  Mixins
//  _____________________________________________

//  Magento lib usage:
// .lib-vendor-prefix-display();
// .lib-clearfix();
// .lib-css();
// .lib-list-reset-styles();
// .lib-vendor-prefix-flex-wrap();
// .lib-vendor-prefix-flex-direction();

.ox-row() {
  .lib-vendor-prefix-display(flex);
  margin-right: -@ox-mega-menu__column-padding;
  margin-left: -@ox-mega-menu__column-padding;
}

.ox-column(@col) {
  -ms-flex: 0 0 100%/@col;
  flex: 0 0 100%/@col;
  max-width: 100%/@col;
}



.ox-col-base() {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: @ox-mega-menu__column-padding;
  padding-left: @ox-mega-menu__column-padding;
}


.ox-plus-toggle(
  @_ox-mega-menu-toggle-icon__color: @ox-mega-menu-toggle-icon__color,
  @_ox-mega-menu-toggle-icon__width: @ox-mega-menu-toggle-icon__width,
  @_ox-mega-menu-toggle-icon__height: @ox-mega-menu-toggle-icon__height,
  @_ox-mega-menu-toggle-icon__size: @ox-mega-menu-level0-item__height,
  @_ox-mega-menu-toggle-icon__show: @ox-mega-menu-toggle-icon__show
) when (@_ox-mega-menu-toggle-icon__show = true) {
  position: absolute;
  display: inline-block;
  text-decoration: none;
  width: @_ox-mega-menu-toggle-icon__size;
  height: @_ox-mega-menu-toggle-icon__size;
  right: 0;
  top: 0;
  //top: calc("50%" - @_ox-mega-menu-toggle-icon__size/2);
  &:after,
  &:before {
	content: '';
	position: absolute;
	background: @_ox-mega-menu-toggle-icon__color;
	.lib-css(transition, ~"background  0.3s ease-in-out", @_prefix: 1);
	right: @_ox-mega-menu-toggle-icon__size/2 - @_ox-mega-menu-toggle-icon__width/2;
	top: @_ox-mega-menu-toggle-icon__size/2 - @_ox-mega-menu-toggle-icon__height/2;
	width: @_ox-mega-menu-toggle-icon__width;
	height: @_ox-mega-menu-toggle-icon__height;
  }
  &:after {
	transform: rotate(90deg);
  }
}

.ox-plus-toggle(
  @_ox-mega-menu-toggle-icon__show: @ox-mega-menu-toggle-icon__show
) when (@_ox-mega-menu-toggle-icon__show = hide) {
  display: none;
}

//
//  Common
//  _____________________________________________

& when (@media-common = true) {

  // Content
  //---------------------------------------------
  .ox-megamenu {
	img {
	  vertical-align: middle;
	}

	.ox-border-bottom {
	  padding: 0 0 33px;
	  border-bottom: 1px solid rgba(107, 107, 107, 0.18);
	}

	.ox-border-top {
	  padding: 33px 0 0;
	  border-top: 1px solid rgba(107, 107, 107, 0.18);
	}

	.ox-vertical-separator {
	  position: absolute;
	  left: 0;
	  top: 0;
	  width: 1px;
	  height: 90%;
	  margin-top: 5%;
	  margin-bottom: 5%;
	  background: rgba(107, 107, 107, 0.18);
	}

	.ox-space-between {
	  .lib-vendor-prefix-display(flex);
	  justify-content: space-between;
	}

	.a-center {
	  text-align: center;
	}

	.a-left {
	  text-align: left;
	}

	.a-right {
	  text-align: right;
	}

	.no-padding {
	  padding: 0 !important;
	}

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

	.relative {
	  position: relative;
	}

	.widget.block-products-list .block-title {
	  margin-bottom: 12px;
	}
  }


  // Basic Grid
  //---------------------------------------------
  .ox-megamenu .row,
  .ox-megamenu .ox-megamenu__dropdown .row {
	.ox-row();
  }

  .ox-menu-col {
	-ms-flex-preferred-size: 0;
	flex-basis: 0;
	-ms-flex-positive: 1;
	flex-grow: 1;
	.ox-col-base();
  }

  .ox-megamenu-trns {
	display: none;
	min-width: 100%;
	left: 0;
	top: 100%;
	position: absolute;
	z-index: 1;
	cursor: default;
  }

  .ox-megamenu--scroll {
	overflow: auto;
  }

  .ox-megamenu {
	font-family: @ox-mega-menu__font-name;

	ul {
	  .lib-list-reset-styles();
	}

	a {
	  text-decoration: none !important;
	}

	.ox-menu__category-image {
	  width: 100%;
	  height: auto;

	  img {
		display: block;
		margin-bottom: 15px;
	  }
	}
  }

  /* Main Navigation Links */

  .ox-megamenu-navigation {
	> li,
	.category-item {
	  margin: @ox-mega-menu-submenu-item__margin;
	  position: relative;

	  > a {
		.lib-vendor-prefix-display(flex);
		.lib-vendor-prefix-flex-wrap(wrap);
		-webkit-align-items: center;
		-ms-flex-align: center;
		align-items: center;
		word-break: break-word;
		position: relative;
		width: 100%;
		line-height: 1;
		text-transform: @ox-mega-menu-submenu-item__text-transform;
		letter-spacing: @ox-mega-menu-submenu-item__letter-spacing;
		background-color: @ox-mega-menu-submenu-item__background;
		color: @ox-mega-menu-submenu-item__color;
		padding: @ox-mega-menu-submenu-item__padding;
		font-size: @ox-mega-menu-submenu-item__font-size;
		font-weight: @ox-mega-menu-submenu-item__font-weight;
	  }

	  &.has-active,
	  &.active {
		> .level-top,
		> a {
		  background-color: @ox-mega-menu-submenu-item__active__background;
		  color: @ox-mega-menu-submenu-item__active__color;

		  .ox-menu-arrow {
			&:before,
			&:after {
			  background-color: @ox-mega-menu-toggle-icon__color;
			}
		  }
		}
	  }
	}

	> .level0 {
	  margin: @ox-mega-menu-level0-item__margin;

	  > .level-top {
		line-height: 1;
		box-sizing: border-box;
		position: relative;
		letter-spacing: @ox-mega-menu-level0-item__letter-spacing;
		padding: @ox-mega-menu-level0-item__padding;
		min-height: @ox-mega-menu-level0-item__height;
		font-size: @ox-mega-menu-level0-item__font-size;
		font-weight: @ox-mega-menu-level0-item__font-weight;
		text-decoration: none;
		text-transform: @ox-mega-menu-level0-item__text-transform;
		background-color: @ox-mega-menu-level0-item__background;
		color: @ox-mega-menu-level0-item__color;

		&:after {
		  /* IE FIX */
		  content: '';
		  min-height: inherit;
		  font-size: 0;
		  display: block;
		}
	  }
	}

	.ox-megamenu__dropdown {
	  background-position: bottom right;
	  background-repeat: no-repeat;

	  .category-item {
		> a {
		  border-top: @ox-mega-menu-submenu-item__border;
		}

		&.active {
		  > a {
			border-color: @ox-mega-menu-submenu-item__active__background;
		  }
		}
	  }
	}
  }
  /* padding for parent submenu items (with plus) */
    .ox-mm-sub-icons{
        .ox-megamenu__dropdown li.parent > a{
            padding-right:16px;
        }
    }
  /* Labels */

  .ox-megamenu-navigation {
	.ox-megamenu-label {
	  z-index: 1;
	  font-family: @ox-mega-menu__font-name;
	  font-size: 11px;
	  font-weight: @font-weight__semibold;
	  color: @ox-mega-menu-label__color;
	  border-radius: @ox-mega-menu-label__border-radius;
	  background-color: @ox-mega-menu-label_background;
	  line-height: 1;
	  padding: @ox-mega-menu-label__padding;
	  position: relative;
	  display: block;
	  right: -10px;
	  letter-spacing: 0;
	  top: 0;
	  text-transform: initial;
	}
  }

  .ox-dropdown--megamenu {
      > .ox-megamenu__dropdown {
          .ox-megamenu-list {
              &.row {
                  > li {
                      .ox-col-base();
                  }
              }
          }
          .ox-megamenu-list > .category-item > .submenu > .category-item {
              > a {
                  text-transform: @ox-mega-menu-desktop-submenu-mega-level1-submenu__text-transform;
              }
          }
      }
  }

  // Other
  //---------------------------------------------
  .ox-menu-item__custom-element {
	margin-right: 6px;
	line-height: 1;

	> i {
	  line-height: 0;
	  display: inherit;

	  &:before {
		display: block;
	  }
	}
  }

  .ox-megamenu__dropdown {
        .widget.block,
	.widget.block-products-list {
	  margin-bottom: 0;
	}
  }

  .ox-megamenu-navigation {
	.category-item {
	  > a {
		min-height: @ox-mega-menu-submenu-item__height;
	  }
	}
  }
  .ox-megamenu-navigation {
	> .level0:not(:first-child) > .level-top {
	  border-top: @ox-mega-menu-submenu-item__border;
	}

	.category-item {
	  width: 100%;
	}

	.ox-megamenu-list ul,
	.ox-megamenu__dropdown,
	.ox-submenu {
	  display: none;
	  padding: @ox-mega-menu-submenu__padding;
	}
  }
  .ox-dropdown--megamenu {
	> .ox-megamenu__dropdown {
	  .ox-megamenu-list {
		&.row {
		  > li {
			max-width: 100%;
		  }
		}
	  }
	}
  }
  /* hide all dropdowns on mobile by default */
  .ox-megamenu--action > *:not(a) {
	display: block;
  }
  /* Mobile menu toggle cross */
  .ox-megamenu-navigation {
	li,
	li.parent {
	  > a {
		position: relative;

		.ox-menu-arrow {
		  .ox-plus-toggle();
		}
	  }

	  &.ox-megamenu--opened {
		> a .ox-menu-arrow {
		  &:after {
			content: none;
		  }
		}
	  }
	}
  }
  /* Basic Grid Columns */
  [class*="ox-menu-col-"] {
	.ox-column(1);
  }
  .ox-menu-col {
	max-width: 100%;
	flex: 0 0 100%;
  }
  .ox-space-between {
	flex-flow: column;

	> * {
	  padding-bottom: 10px;
	}
  }
}