@layer theme-v15 {
  /*----- Onglet basique -----*/
  ul.onglet, ul.sous-onglet  {
    display: flex;
    margin: 0;
    padding: 0;
    border-bottom: 1px solid var(--couleur-principale-5);
    border-top: 15px solid var(--couleur-blanc);
  }

  ul.onglet {
    background-color: var(--couleur-secondaire-3);
    padding: 26px 8px 0 8px;
  }

  ul.sous-onglet {
    background-color: var(--couleur-blanc);
  }

  .onglet .onglet-item,
  .sous-onglet .onglet-item {
    display: inline-flex;
    background-color: var(--couleur-secondaire-4);
    color: #5e5e5e;
    border: 1px solid var(--couleur-secondaire-4);
    margin: 0 3px;
    border-bottom: none;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
  }

  .onglet .onglet-item:first-of-type,
  .sous-onglet .onglet-item:first-of-type {
    margin-left: 0;
  }

  a.onglet:link,
  .active.onglet-item span.onglet-link,
  .disabled.onglet-item span.onglet-link {
    text-decoration: none;
    display: inline-flex;
    padding: 8px 6px;
  }

  /* ----- Onglet actif ----- */
  .onglet .active.onglet-item,
  .sous-onglet .active.onglet-item {
    background-color: var(--couleur-blanc);
    color: var(--couleur-secondaire-9);
    border: 1px solid var(--couleur-principale-5);
    border-bottom: none;
    margin-bottom: -1px;
  }

  /* ----- Onglets désactivé ----- */
  .onglet .onglet-item.disabled {
    color: var(--couleur-blanc);
    cursor: default;
  }

  .onglet-item.inactif > span > a {
    color: #5e5e5e;
  }

  /* ----- Onglet détail ----- */
  .onglet-item.detail > span.onglet-link > a.onglet::after {
    content: "";
    display: inline-block;
    margin-left: 10px;
    width: 16px;
    background-image: url(../images/onglet/ongletDetail.gif);
    background-repeat: no-repeat;
  }

  /* ----- Onglets dans menu général ----- */
  .menuGeneral .onglet {
    border: 0;
    margin: 0;
    background-color: var(--couleur-haut-principal);
  }

  .menuGeneral .onglet .onglet-item{
    background-color: var(--couleur-haut-principal);
    border-color: transparent;
  }

  .menuGeneral .onglet .onglet-item.active{
    background-color: var(--couleur-blanc);
    color: var(--couleur-haut-principal);
  }

  .menuGeneral a.onglet:link,
  .menuGeneral a.onglet {
    color: var(--couleur-blanc);
  }

  /* ----- Sous-onglets dans le menu général ----- */
  .menuGeneral ul.sous-onglet {
    background-color: var(--couleur-blanc);
    padding: 15px 8px 0 8px;
    border-bottom: 2px solid var(--couleur-haut-principal);
    margin-left: 20px;
  }

  .menuGeneral ul.sous-onglet .onglet-item,
  .menuGeneral ul.sous-onglet .onglet-item .onglet {
    background-color: var(--couleur-blanc);
    margin: 0 0 0 1px;
    border-color: transparent;
    color: var(--couleur-haut-principal);
  }

  .menuGeneral ul.sous-onglet .onglet-item.active {
    background-color: var(--couleur-haut-principal);
    border-bottom: none;
    margin-bottom: -1px;
  }

  .menuGeneral .sous-onglet .onglet-item.active .onglet-link {
    color: var(--couleur-blanc);
  }
}