/* Container principal */

@media (min-width: 992px) {
  .home #primary-menu li:first-child > ul.sub-menu {
    display: block;
    width: auto;
    height: auto;
  }

  .home .is-stuck #primary-menu li:first-child > ul.sub-menu {
    display: none;
  }

  .home #primary-menu li:first-child > ul.sub-menu:hover {
    width: 100%;
    height: 60vh;
  }

  .home #primary-menu li:first-child > ul {
    display: block;
  }

  .home #primary-menu li:first-child > ul .mega-menu-container {
    background: transparent;
  }

  .home #primary-menu li:first-child > ul .mega-menu-container .mega-menu-tabs {
    border: none;
    background: #fff;
  }

  .home
    #primary-menu
    li:first-child
    > ul
    .mega-menu-container
    .mega-menu-contents {
    display: none;
  }

  .home
    #primary-menu
    li:first-child
    > ul
    .mega-menu-container:hover
    .mega-menu-contents {
    display: block;
    animation: fadeIn 0.2s ease-in-out;
  }

  .home
    #primary-menu
    li:first-child
    > ul
    .mega-menu-container
    .mega-menu-contents {
    display: none;
  }

  .menu-menu-principal-container {
    width: 100%;
  }

  .menu-menu-principal-container #primary-menu {
    justify-content: space-between;
    position: relative;
    align-items: center;
  }

  .mega-menu-wrapper {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #fff;
    border-top: 2px solid #0073aa;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.1);
    z-index: 1000;
  }

  #primary-menu > li > a {
    color: var(--text-bs-text, #485e70);
    font-family: var(--font-family-body, Poppins);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-transform: uppercase;
    text-decoration: none;
    height: 41px;
    display: flex;
    align-items: center;
  }

  .menu-item:hover > .mega-menu-wrapper {
    display: block;
  }

  .mega-menu-container {
    display: flex;
    background: #fff;
  }

  /* Onglets à gauche (niv 2) */
  .mega-menu-tabs {
    flex: 0 0 350px;
    border-right: 1px solid #ddd;
    display: flex;
    flex-direction: column;
    padding: 15px;
  }

  .mega-menu-tab {
    cursor: pointer;
    transition: background 0.2s ease;
    font-weight: 600;
  }

  .mega-menu-tab a {
    color: var(--text-bs-text, #485e70);
    font-family: var(--font-family-body, Poppins);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-decoration: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 7px;
    letter-spacing: 0.5px;
  }

  .mega-menu-tab a:hover,
  .mega-menu-tab a:active {
    color: #f76f85;
  }

  .mega-menu-tab a:hover svg path,
  .mega-menu-tab a:active svg path {
    stroke: #f76f85;
  }

  /* Contenu à droite */
  .mega-menu-contents {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 38px;
  }

  .mega-menu-content {
    display: none;
    animation: fadeIn 0.2s ease-in-out;
  }

  .mega-menu-content.active {
    display: block;
  }

  .mega-menu-content > ul {
    column-count: 3 !important; /* ou 3 ou 5 selon largeur */
    column-gap: 40px;
    padding: 0;
    margin: 0;
    list-style: none;
    display: inherit;
  }

  /* Responsive */
  @media (max-width: 768px) {
    .mega-menu-container {
      flex-direction: column;
      padding: 1rem;
    }

    .mega-menu-tabs {
      flex-direction: row;
      overflow-x: auto;
      border-right: none;
      border-bottom: 1px solid #ddd;
    }

    .mega-menu-tab {
      flex: 0 0 auto;
      white-space: nowrap;
      padding: 0.75rem 1rem;
    }
  }

  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translateY(10px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  /* Masquer tous les sous-menus */
  .menu-item-has-children > .sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 999;
    background: #fff;
    min-width: 200px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    width: 100%;
    padding: 0;
    list-style: none;
    height: 60vh;
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: thin;
    scrollbar-color: #f76f85 #ffffff;
  }

  /* Afficher au hover du menu parent */
  .menu-item-has-children:hover > .sub-menu {
    display: block;
  }

  .item-title-menu > a,
  .mega-simple-menu.mega-has-level3 .item-title-menu > a,
  #menu-item-134899 #tab-4374 .item-title-menu > a {
    color: var(--text-bs-primary, #f76f85);
    font-size: var(--font-size-text-md, 16px);
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-transform: uppercase;
    text-decoration: none;
    display: block;
    width: 100%;
    white-space: normal;
    word-break: break-word;
    box-sizing: border-box;
  }

  .item-title-menu > a:hover,
  .mega-simple-menu.mega-has-level3 .item-title-menu > a:hover,
  #menu-item-134899 #tab-4374 .item-title-menu > a:hover {
    color: var(--text-bs-text, #485e70);
  }

  .sub-links {
    padding: 0;
    gap: 5px;
    padding-top: 16px;
    overflow: hidden;
  }

  .sub-links a,
  .mega-simple-menu .item-title-menu > a,
  #menu-item-134899 .item-title-menu > a {
    color: var(--text-bs-text, #485e70);
    font-size: var(--font-size-text-sm, 14px);
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-decoration: none;
    display: block;
    width: 100%;
    white-space: normal;
    word-break: break-word;
    box-sizing: border-box;
    text-transform: capitalize;
  }

  .sub-links a:hover,
  .mega-simple-menu .item-title-menu > a:hover,
  #menu-item-134899 .item-title-menu > a:hover {
    color: var(--text-bs-primary, #f76f85);
  }

  .mega-menu-content > ul {
    padding-left: 0;
  }

  .item-title-menu {
    padding-bottom: 25px;
    overflow: hidden;
  }

  .mega-simple-menu .item-title-menu {
    padding-bottom: 15px;
  }

  /* Pour les mega-menus simples */
  .mega-simple-menu .mega-menu-content > ul {
    column-count: 4 !important; /* ou 3 ou 5 selon largeur */
    column-gap: 40px;
    padding: 0;
    margin: 0;
    list-style: none;
    display: inherit;
  }

  /* Empêcher les sauts entre blocs */
  .mega-simple-menu .item-title-menu {
    break-inside: avoid;
  }

  /* Style du lien */
  .mega-simple-menu .item-title-menu a {
    display: block;
    text-decoration: none;
  }

  /* Hover */
  .mega-simple-menu .item-title-menu a:hover {
    color: #f76f85;
  }

  .mega-simple-menu .mega-menu-content {
    display: block !important;
    animation: none !important;
  }

  .menu-item > a:hover,
  .current-menu-item.menu-item > a {
    color: #f76f85 !important;
  }
}
