/*
 * V58 — Navigation compacte à trois produits.
 * La frise reste centrée sur ordinateur et chaque onglet reçoit exactement
 * un tiers de l'espace disponible. Sur mobile elle conserve toute la largeur.
 */

#configurateur-tresse-root .mainTabs {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

#configurateur-tresse-root .mainTabs .tabBtn,
#configurateur-tresse-root .mainTabs .chip {
  width: 100% !important;
}

@media (min-width: 1101px) {
  #configurateur-tresse-root #mainConfiguratorCard > .mainTabsHd {
    width: min(640px, calc(100% - 48px)) !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 4px !important;
  }

  #configurateur-tresse-root .mainTabs .tabBtn,
  #configurateur-tresse-root .mainTabs .chip {
    min-height: 42px !important;
    height: 42px !important;
    padding-inline: 12px !important;
    font-size: 14px !important;
  }
}

@media (min-width: 981px) and (max-width: 1100px) {
  #configurateur-tresse-root #mainConfiguratorCard > .mainTabsHd {
    width: min(560px, calc(100% - 430px)) !important;
    height: 52px !important;
    min-height: 52px !important;
    padding: 4px !important;
  }

  #configurateur-tresse-root .mainTabs .tabBtn,
  #configurateur-tresse-root .mainTabs .chip {
    min-height: 42px !important;
    height: 42px !important;
    font-size: 12px !important;
  }
}

@media (max-width: 980px) {
  #configurateur-tresse-root .mainTabs {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}