/* ==========================================================
   Mega menu custom
   ========================================================== */

/* Reset du composant */
.lll-site-navigation,
.lll-mega-menu,
.lll-mega-menu nav,
.lll-mega-menu ul,
.lll-mega-menu li {
  margin: 0;
  padding: 0;
}

.lll-mega-menu ul,
.lll-mega-menu li {
  list-style: none !important;
}

.lll-mega-menu a,
.lll-mega-menu button {
  box-sizing: border-box;
  font: inherit;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.lll-mega-menu button {
  appearance: none;
  -webkit-appearance: none;
  background-image: none !important;
}

.lll-mega-menu a:visited {
  color: inherit;
}

.lll-site-navigation {
  clear: both;
  width: 100%;
}

.lll-mega-menu {
  position: relative;
  width: 100%;
  background: #239cd3;
  z-index: 9999;
}

.lll-mega-menu nav {
  position: relative;
  width: 100%;
}

.lll-mega-panel[hidden] {
  display: none !important;
}

/* =========================
   Desktop
   ========================= */
@media screen and (min-width: 981px) {

  .lll-mega-toggle {
    display: none !important;
  }

  .lll-mega-top-level {
    display: flex !important;
    flex-direction: row !important;
    justify-content: center;
    align-items: stretch;
    width: 100%;
  }

  .lll-mega-top-level > .lll-mega-item {
    position: static;
    flex: 0 0 auto;
  }

 .lll-mega-trigger,
.lll-mega-link {
  display: flex !important;
  align-items: center;
  justify-content: center;
  min-height: 84px;
  padding: 0 22px;
  background: #239cd3;
  color: #fff !important;
  border: 0;
  margin: 0;
  text-decoration: none !important;
  font-weight: 700 !important;
  font-size: 1rem;
  line-height: 1;
  white-space: nowrap;
  cursor: pointer;
}

  .lll-mega-trigger:hover,
  .lll-mega-trigger:focus,
  .lll-mega-link:hover,
  .lll-mega-link:focus,
  .lll-mega-item.is-current > .lll-mega-trigger,
  .lll-mega-item.is-current > .lll-mega-link {
    color: #fff !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    background: #239cd3;
  }

  .lll-mega-panel {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    width: 100%;
    background: #2091c4;
    color: #fff;
    z-index: 10000;
  }

  .lll-mega-panel-inner {
    position: relative;
    padding: 24px 26px 26px;
  }

  .lll-mega-close {
    display: none;
  }

  /* Colonnes avec sous-liens */
  .lll-mega-columns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 20px 30px;
    align-items: start;
  }

  .lll-mega-column {
    min-width: 0;
  }

  .lll-mega-column-title {
    display: block;
    margin: 0 0 12px;
    color: #fff !important;
    font-weight: 700;
    font-size: 0.98rem;
    line-height: 1.08;
    text-transform: uppercase;
    text-decoration: none !important;
    letter-spacing: 0;
  }

  .lll-mega-submenu {
    margin: 0;
    padding: 0;
  }

  .lll-mega-submenu li {
    margin: 0 0 11px;
    padding: 0;
  }

  .lll-mega-submenu a {
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 400;
    font-size: 0.9rem;
    line-height: 1.22;
  }

  .lll-mega-submenu a:hover,
  .lll-mega-submenu a:focus {
    text-decoration: underline !important;
    text-underline-offset: 2px;
  }

/* Colonne dédiée aux items niveau 2 sans enfants */
.lll-mega-column--single-links {
  align-self: start;
}

.lll-mega-submenu--single-links {
  margin: 0;
  padding: 0;
}

.lll-mega-submenu--single-links li {
  margin: 0 0 16px;
}

.lll-mega-submenu--single-links a {
  color: #fff !important;
  text-decoration: none !important;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 0.98rem;
  line-height: 1.12;
  display: block;
}

.lll-mega-submenu--single-links a:hover,
.lll-mega-submenu--single-links a:focus {
  text-decoration: underline !important;
  text-underline-offset: 3px;
}
}

/* =========================
   Mobile / tablette
   ========================= */
@media screen and (max-width: 980px) {

  .lll-mega-toggle {
    display: block;
    width: 100%;
    padding: 16px 20px;
    background: #239cd3;
    color: #fff;
    border: 0;
    text-align: center;
    font-weight: 700;
    cursor: pointer;
  }

  .lll-mega-top-level {
    display: none !important;
    flex-direction: column;
    width: 100%;
  }

  .lll-mega-menu.is-mobile-open .lll-mega-top-level {
    display: flex !important;
  }

  .lll-mega-trigger,
  .lll-mega-link {
    display: block;
    width: 100%;
    text-align: center;
    padding: 16px 20px;
    background: #239cd3;
    color: #fff !important;
    border: 0;
    text-decoration: none !important;
    font-weight: 700;
    font-size: 1.1em;
  }

  .lll-mega-panel {
    position: static;
    width: 100%;
    background: #2091c4;
    color: #fff;
  }

  .lll-mega-panel-inner {
    position: relative;
    padding: 20px;
  }

  .lll-mega-close {
    position: absolute;
    top: 14px;
    right: 16px;
    width: 44px;
    height: 44px;
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 38px;
    line-height: 44px;
    text-align: center;
    cursor: pointer;
    opacity: 1;
  }

  .lll-mega-column-title {
    display: block;
    margin: 0 0 14px;
    color: #fff !important;
    font-weight: 700;
    font-size: 1.02rem;
    line-height: 1.1;
    text-transform: uppercase;
    text-decoration: none !important;
  }

  .lll-mega-submenu {
    margin: 0 0 22px;
    padding: 0;
  }

  .lll-mega-submenu li {
    margin: 0 0 12px;
  }

  .lll-mega-submenu a {
    color: #fff !important;
    text-decoration: none !important;
  }

.lll-mega-column--single-links {
  margin-top: 8px;
}

.lll-mega-submenu--single-links {
  margin: 0 0 22px;
  padding: 0;
}

.lll-mega-submenu--single-links li {
  margin: 0 0 16px;
}

.lll-mega-submenu--single-links a {
  color: #fff !important;
  text-decoration: none !important;
  text-transform: uppercase;
  font-weight: 700;
  display: block;
}

  .lll-mega-toggle:hover,
  .lll-mega-toggle:focus,
  .lll-mega-toggle:active,
  .lll-mega-trigger:hover,
  .lll-mega-trigger:focus,
  .lll-mega-trigger:active,
  .lll-mega-link:hover,
  .lll-mega-link:focus,
  .lll-mega-link:active {
    background: #1b6f96 !important;
    color: #fff !important;
    text-decoration: none;
  }

}