/**
 * menu_header_double
 * @version	1.0
 * @release	01-04-2021
 * @author	msolowski Marcin Sołowski
 * @website	http://msolowski.pl
 */


@media screen and (min-width: 1620px)  and (max-width: 9999px){
  .menu_header ul.menu.double > li > ul.sub-menu > li > a{
    max-width: 230px;
    width: 230px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

@media  screen and (min-width: 1405px)  and (max-width: 1620px){
  body .menu_header ul.menu.double > li > ul.sub-menu > li > a{
    max-width: 200px!important;
    width: 200px !important;
    padding-left: 15px!important;
    padding-right: 15px!important;
    min-width: unset!important;
  }
}

@media screen and (min-width: 1270px) and (max-width: 1405px){
  body .menu_header ul.menu.double > li > ul.sub-menu > li > a{
    max-width: 180px!important;
    width: 180px !important;
    padding-left: 15px!important;
    padding-right: 15px!important;
    min-width: unset!important;
  }
}

@media screen and (min-width: 1130px)  and (max-width: 1270px){
  body .menu_header ul.menu.double > li > ul.sub-menu > li > a{
    max-width: 160px!important;
    width: 160px !important;
    padding-left: 10px!important;
    padding-right: 10px!important;
    min-width: unset!important;
  }
}

@media screen and (min-width: 1000px) and (max-width: 1130px){
  body .menu_header ul.menu.double > li > ul.sub-menu > li > a{
    max-width: 146px!important;
    width: 146px !important;
    padding-left: 5px!important;
    padding-right: 5px!important;
    min-width: unset!important;
  }
}

.menu_header ul.menu.double > li.button_1 > a:hover{
  outline-color: #bca8ff!important;
}




.menu_header ul.menu.double > li.button_2 > a:hover{
  outline: unset!important;
  border-color: #C9B8FF !important;
}
.menu_header ul.menu.double > li.button_2 > a::before {
  background: #C9B8FF !important;
}
.menu_header ul.menu.double > li.button_2 > a::before {
  content: '';
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 100%;
  background-color: #E2D9FF;
  border-radius: 50%;
  aspect-ratio: 1 / 1;
  transform: translateY(100%);
  transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.menu_header ul.menu.double > li.button_2 > a:hover::before {
  transform: translateY(0px);
}


@media screen and (max-width: 1200px) and (min-width: 1100px){
  .menu_header ul.menu.double > li > ul.sub-menu > li > a{
    min-width: 180px!important;
    width: 180px!important;
  }
}
@media (max-width: 1100px){
  .menu_header ul.menu.double > li > ul.sub-menu > li > a{
    min-width: 160px!important;
    width: 160px!important;
  }
}

.menu_header {
  --menu_header_font_family: var(--root_font_family);
  --menu_header_font_size: var(--global_font_size_p_small);
  --menu_header_font_weight: 400;
  --menu_header_color: var(--root_color_white);
  --menu_header_background_color: var(--root_color_lead);
  --menu_header_border_color: var(--root_color_lead);
  --menu_header_border_width: 0;
  --menu_header_border_radius: 0;
  --menu_header_transition: var(--global_transition);
  --menu_header_line_height: 1;

  /**********************************************************************************/

  /*	text-transform: uppercase; */
  font-family: var(--menu_header_font_family);
  font-size: var(--menu_header_font_size);
  font-weight: var(--menu_header_font_weight);
  line-height: var(--menu_header_line_height);
  letter-spacing: normal;
}

/**********************************************************************************/

.menu_header a {
  color: var(
    --root_color_white
  ); /* dziedzicza po tym wszystkie a nizszych poziomow */
  display: inline-flex;
  align-items: center;
  font-weight: var(--menu_header_font_weight);
}

.menu_header ul.menu.double {
  display: flex;
  align-items: center;
  list-style: none;
}

.menu_header ul.menu.double > li {
  --min_menu_header_double_li_padding_tb: 12;
  --max_menu_header_double_li_padding_tb: 14;
  --menu_header_double_li_padding_tb: clamp(
    calc(var(--min_menu_header_double_li_padding_tb) * 1px),
    calc(
      (
          (
              (-1 * var(--global_scm_var)) *
                (
                  (
                      var(--max_menu_header_double_li_padding_tb) -
                        var(--min_menu_header_double_li_padding_tb)
                    ) / (var(--global_sc_var) - var(--global_scm_var))
                ) + var(--min_menu_header_double_li_padding_tb)
            ) * 1px
        ) +
        (
          (
              var(--max_menu_header_double_li_padding_tb) -
                var(--min_menu_header_double_li_padding_tb)
            ) / (var(--global_sc_var) - var(--global_scm_var)) * 100vw
        )
    ),
    calc(var(--max_menu_header_double_li_padding_tb) * 1px)
  );
  --min_menu_header_double_li_padding_lr: 16;
  --max_menu_header_double_li_padding_lr: 22;
  --menu_header_double_li_padding_lr: clamp(
    calc(var(--min_menu_header_double_li_padding_lr) * 1px),
    calc(
      (
          (
              (-1 * var(--global_scm_var)) *
                (
                  (
                      var(--max_menu_header_double_li_padding_lr) -
                        var(--min_menu_header_double_li_padding_lr)
                    ) / (var(--global_sc_var) - var(--global_scm_var))
                ) + var(--min_menu_header_double_li_padding_lr)
            ) * 1px
        ) +
        (
          (
              var(--max_menu_header_double_li_padding_lr) -
                var(--min_menu_header_double_li_padding_lr)
            ) / (var(--global_sc_var) - var(--global_scm_var)) * 100vw
        )
    ),
    calc(var(--max_menu_header_double_li_padding_lr) * 1px)
  );
  /*	position: relative;
	border-right: transparent; */
  transition: var(--global_transition);
}

.menu_header ul.menu.double > li + li {
  margin-left: var(--global_size_30);
}

/**********************************************************************************/

/* body:not(.home ) .menu_header ul.menu.double > li.current-menu-ancestor > a
{
	color: var(--root_color_lead_3);
}

body:not(.home ) .menu_header ul.menu.double > li.current-menu-item > a
{
	color: var(--root_color_lead_3);
} */

/**********************************************************************************/

.menu_header ul.menu.double > li > a {
  padding-top: var(--menu_header_double_li_padding_tb);
  padding-right: var(--menu_header_double_li_padding_lr);
  padding-bottom: var(--menu_header_double_li_padding_tb);
  padding-left: var(--menu_header_double_li_padding_lr);
  position: relative;
  z-index: 3;
}

.menu_header ul.menu.double > li.menu-item-has-children > a::after {
  font-family: "msolowski";
  content: "\e908";
  transition: var(--global_transition);
  font-size: 10px;
  margin-left: var(--global_size_15);
}

/*.menu_header ul.menu.double > li.menu-item-has-children:hover > a::after, */
.menu_header
  ul.menu.double
  > li.menu-item-has-children.is_menu_header
  > a::after {
  transform: rotate(180deg);
}

.menu_header ul.menu.double > li:hover > a,
.menu_header ul.menu.double > li.is_menu_header > a {
  color: var(--root_color_lead);
}

/**********************************************************************************/ /* 2 poziom */

.menu_header ul.menu.double > li > ul.sub-menu {
  position: absolute;
  display: flex;
  align-items: stretch;
  top: 100%;
  right: 0;
  list-style: none;
  /*	opacity: 0; */
  visibility: hidden;
  padding: 0 0 0 0;
  background-color: var(--root_color_lead);
  border-radius: 0 0 28px 28px;
  overflow: hidden;
  z-index: 1;
  will-change: transform;
  transform: translateY(-100%);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.025s;
}

.menu_header ul.menu.double > li.is_special > ul.sub-menu {
  right: unset;
}

/* .menu_header ul.menu.double > li:hover > ul.sub-menu */
.menu_header ul.menu.double > li.is_menu_header > ul.sub-menu {
  /*	opacity: 1; */
  visibility: visible;
  transform: translateY(0);
  transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.menu_header ul.menu.double > li > ul.sub-menu > li {
  transition: var(--global_transition);
  background-color: var(--root_color_white);
}

.menu_header ul.menu.double > li > ul.sub-menu > li:hover {
  background-color: var(--root_color_lead);
}

.menu_header ul.menu.double > li > ul.sub-menu > li:not(:last-child) {
  border-right: 1px solid #bcaffa;
}

/**********************************************************************************/

/* .menu_header ul.menu.double > li > ul.sub-menu > li.current-menu-item > a
{
	background-color: #836cf7;
} */

/**********************************************************************************/

.menu_header ul.menu.double > li > ul.sub-menu > li > a {
  --min_image: 14;
  --max_image: 14;
  --image: clamp(
    calc(var(--min_image) * 1px),
    calc(
      (
          (
              (-1 * var(--global_scm_var)) *
                (
                  (var(--max_image) - var(--min_image)) /
                    (var(--global_sc_var) - var(--global_scm_var))
                ) + var(--min_image)
            ) * 1px
        ) +
        (
          (var(--max_image) - var(--min_image)) /
            (var(--global_sc_var) - var(--global_scm_var)) * 100vw
        )
    ),
    calc(var(--max_image) * 1px)
  );
  padding-top: var(--global_size_30);
  padding-bottom: var(--global_size_20);
  padding-left: calc(var(--global_size_75) - var(--global_size_5));
  padding-right: calc(var(--global_size_75) - var(--global_size_5));
  text-align: center;
  display: block;
  font-weight: 700;
  height: 100%;
  display: grid;
  grid-template-rows: auto 1fr;
}

.menu_header ul.menu.double > li > ul.sub-menu > li > a .image {
  min-width: 80px;
  width: 100%;
  max-width: 80px;
  margin-left: auto;
  margin-right: auto;
  transform: translateY(-100%);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.menu_header ul.menu.double > li.is_menu_header > ul.sub-menu > li > a .image {
  transform: translateY(0);
  transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.05s;
}

.menu_header ul.menu.double > li > ul.sub-menu > li > a:hover {
  background-color: var(--root_color_lead);
}

.menu_header ul.menu.double > li > ul.sub-menu > li > a:active .image {
  transform: scale(0.95, 0.95);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.menu_header ul.menu.double > li > ul.sub-menu > li > a span {
  display: block;
  min-width: calc(var(--image) * 11);
  width: calc(var(--image) * 11) !important;
  font-size: var(--global_font_size_p_small);
  line-height: 1.2;
  margin-top: 32px;
  transform: translateY(-50%);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) 0.025s;
}

.menu_header ul.menu.double > li.is_menu_header > ul.sub-menu > li > a span {
  transform: translateY(0);
  transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.025s;
  color: var(--root_color_black);
  width: 100% !important;
}

.menu_header ul.menu.double > li.is_menu_header > ul.sub-menu > li:hover > a span {
  color: var(--root_color_white);
}

/**********************************************************************************/ /* 3 poziom i kolejne */

.menu_header ul.menu.double > li > ul.sub-menu li > ul.sub-menu /* zablokowane wyswietlanie nizszych poziomow, aby niepotrzebnie nie generowac kolejnego menu */ {
  display: none;
}

/**********************************************************************************/

.menu_header ul.menu.double > li.button_1 > a {
  border: 2px solid var(--root_color_lead_3);
  color: var(--root_color_white);
  border-radius: 70px;
  outline-color: transparent;
  outline-width: 4px;
  outline-style: solid;
  outline-offset: -2px;
}

.menu_header ul.menu.double > li.button_1 > a::after {
  font-family: "msolowski";
  content: "\e904";
  transition: var(--global_transition);
  font-size: 12px;
  margin-left: var(--global_size_15);
}

.menu_header ul.menu.double > li.button_1 > a:hover {
  outline-color: #492fc8;
}

.menu_header ul.menu.double > li.button_1 > a:active {
  transform: scale(0.95, 0.95);
}

.menu_header ul.menu.double > li.button_2 > a {
  background-color: var(--root_color_lead);
  color: var(--root_color_black);
  border-radius: 70px;
  position: relative;
  overflow: hidden;
  padding-top: calc(2px + var(--menu_header_double_li_padding_tb));
  padding-right: calc(2px + var(--menu_header_double_li_padding_lr));
  padding-bottom: calc(2px + var(--menu_header_double_li_padding_tb));
  padding-left: calc(2px + var(--menu_header_double_li_padding_lr));
}

.menu_header ul.menu.double > li.button_2 > a::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 100%;
  background-color: #492fc8;
  border-radius: 50%;
  aspect-ratio: 1/1;
  transform: translateY(100%);
  transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: -1;
}

.menu_header ul.menu.double > li.button_2 > a::after {
  font-family: "msolowski";
  content: "\e913";
  transition: var(--global_transition);
  font-size: 12px;
  margin-left: var(--global_size_15);
}

.menu_header ul.menu.double > li.button_2 > a:hover::before {
  transform: translateY(0px);
}

.menu_header ul.menu.double > li.button_2 > a:active {
  transform: scale(0.95, 0.95);
}

/**********************************************************************************/

@media screen and (max-width: 1680px) {
  .menu_header ul.menu.double > li.is_special > ul.sub-menu {
    right: unset;
  }

  .menu_header ul.menu.double > li > ul.sub-menu > li > a {
    --min_image: 10;
    padding-left: var(--global_size_50);
    padding-right: var(--global_size_50);
  }
}

@media screen and (max-width: 1600px) {
}

@media screen and (max-width: 1440px) {
  .menu_header ul.menu.double > li.is_special > ul.sub-menu {
    right: unset;
  }

  .menu_header ul.menu.double > li > ul.sub-menu > li > a {
    --min_image: 12.5;
    padding-bottom: var(--global_size_20);
    padding-left: 5px;
    padding-right: 5px;
    max-width: 220px;
    width: 100%;
    min-width: 220px;
  }
}

@media screen and (max-width: 1366px) {
  .menu_header ul.menu.double > li.is_special > ul.sub-menu {
    right: unset;
  }

  .menu_header ul.menu.double > li > ul.sub-menu > li > a {
    --min_image: 8;
  }

  .menu_header ul.menu.double > li.is_menu_header > ul.sub-menu > li > a span {
    font-size: var(--global_font_size_p_small);
  }
}

@media screen and (max-width: 1300px) {
  .menu_header ul.menu.double > li + li {
    margin-left: var(--global_size_15);
  }

  .menu_header ul.menu.double > li > ul.sub-menu > li > a {
    --min_image: 7;
  }
}

@media screen and (max-width: 1200px) {
  .menu_header ul.menu.double > li + li {
    margin-left: var(--global_size_10);
  }

  .menu_header ul.menu.double > li > ul.sub-menu > li > a {
    --min_image: 6;
  }
}

@media screen and (max-width: 1024px) {
  .menu_header {
    display: none;
  }
}

@media screen and (max-width: 800px) {
}

@media screen and (max-width: 640px) {
}

@media screen and (max-width: 480px) {
}

@media screen and (max-width: 360px) {
}
