/*
 Theme Name: Inventaire Basic Theme
 Theme URI: https://www.elegantthemes.com/gallery/divi/
 Description: Inventaire Basic Theme base on Divi Theme from Elegant Themes
 Author: Inventaire
 Author URI: https://www.inventaire.ch
 Template: Divi
 Version: 1.0.0
*/

/* =Theme customization starts here
------------------------------------------------------- */

@media screen and (min-width: 981px) {
  /* Change the width of the dropdown container */
  .dl-menu ul.sub-menu {
    width: 300px;
  }

  /* Change the width of the links inside the dropdown */
  .dl-menu ul.sub-menu li,
  .dl-menu ul.sub-menu li a {
    width: 100%;
  }

  /* Position the second level dropdown correctly */
  .dl-menu .nav li li ul {
    left: 300px;
  }
  .dl-menu .nav li.et-reverse-direction-nav li ul {
    left: auto;
    right: 300px;
  }

  /* Extend dropdown links full-width */
  .dl-menu .nav li li {
    padding: 0;
    min-width: 100%;
  }
  .dl-menu .nav li li a {
    min-width: 100%;
  }

  /* Change the dropdown links font */
  .dl-menu .nav li li a {
    text-transform: none;
    font-weight: 400;
    font-size: 16px;
    transition: all 0.3s ease-in-out;
  }

  /* Change the dropdown links hover effect */
  /* .dl-menu.et_pb_module.et_pb_menu .nav li li a,
  .dl-menu.et_pb_module.et_pb_menu .nav li li a::before {
    transition: all 0.3s ease-in-out;
  } */

  .dl-menu.et_pb_module.et_pb_menu .nav li li a:hover {
    /* background: #e02b20; */
    /* color: #ffffff !important; */
    /* padding-left: 28px; */
    position: relative;
    background: linear-gradient(
      90deg,
      #c83e27 0%,
      #9e438d 35%,
      #634993 65%,
      #40387e 100%
    );
    color: #ffffff;
  }

  /* .dl-menu.et_pb_module.et_pb_menu .nav li li a:hover::before {
    content: "";
    position: absolute;
    inset: -3px;
    border-radius: 14px;
    background: linear-gradient(
      90deg,
      #c83e27 0%,
      #9e438d 35%,
      #634993 65%,
      #40387e 100%
    );
    z-index: -1;
  } */

  /* Remove the dropdown border and inner spacing */
  .dl-menu.et_pb_menu .et-menu-nav ul.sub-menu {
    padding: 0;
    border-top: 0;
  }

  /* Move the first-level dropdown to the left */
  .dl-menu ul.nav > li > ul.sub-menu {
    transform: translateX(-9px);
  }

  /* Add rounded corners to the dropdown container */
  .dl-menu.et_pb_menu .et-menu-nav ul.sub-menu {
    border-radius: 10px;
  }

  /* Add rounded corners to the first dropdown item */
  .dl-menu ul.sub-menu li:first-child a {
    border-radius: 10px 10px 0 0;
  }

  /* Add rounded corners to the last dropdown item */
  .dl-menu ul.sub-menu li:last-child a {
    border-radius: 0 0 10px 10px;
  }

  /* Remove the dropdown shadow */
  .dl-menu.et_pb_menu .et-menu-nav ul.sub-menu {
    box-shadow: none;
  }

  /* Modify the dropdown shadow */
  .dl-menu.et_pb_menu .et-menu-nav ul.sub-menu {
    box-shadow: 0 0 30px -5px rgba(0, 0, 0, 0.2);
  }

  /* Add triangle arrow to the dropdown */
  .dl-menu ul.nav > li > ul.sub-menu:before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    top: -8px;
    left: 30px;
  }

  /* Move the arrow to the center */
  .dl-menu ul.nav > li > ul.sub-menu:before {
    left: 50%;
    transform: translateX(-50%);
  }

  /* Center-align the dropdown */
  .dl-menu ul.nav > li > ul.sub-menu {
    transform: translateX(-50%);
    left: 50%;
    transition: all 0.3s ease-in-out;
  }

  /* Center-align the dropdown text */
  .dl-menu .sub-menu a {
    text-align: center;
  }

  /* Change the default dropdown animation */
  .dl-menu ul.nav > li > ul.sub-menu {
    transform: translateY(10px);
    transition: all 0.3s ease-in-out;
  }
  .dl-menu ul.nav > li:hover > ul.sub-menu {
    transform: translateY(0);
  }

  /* Change the default animation for the center-aligned dropdown*/
  .dl-menu ul.nav > li > ul.sub-menu {
    transform: translate(-50%, 10px);
    pointer-events: none;
  }
  .dl-menu ul.nav > li:hover > ul.sub-menu {
    transform: translate(-50%, 0);
    pointer-events: inherit;
  }

  /* Change the vertical dropdown offset */
  .dl-menu.et_pb_menu--without-logo .et_pb_menu__menu > nav > ul > li > a {
    padding-bottom: 15px;
  }
}