/*
 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;
  }

  /* Change the dropdown links hover effect */
  .dl-menu.et_pb_module.et_pb_menu .nav li li a {
    transition: all 0.3s ease-in-out;
  }
  .dl-menu.et_pb_module.et_pb_menu .nav li li a:hover {
    background: #66acd2;
    color: #f3f9fc !important;
    opacity: 1;
    padding-left: 28px;
  }

  /* 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;
  }
}