/* ============================================
   TABS DEVIS (filtres statut)
   ============================================ */

.devis-tabs,
.factures-tabs,
.tabs-bar {
    display: flex;
    gap: .3rem;
    padding: .5rem 1rem;
    background: var(--panel, #fff);
    overflow-x: auto;
    scrollbar-width: none;
    max-width: 1800px;
    margin: 0 auto;
    padding: 8px 20px 0px 40px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
 
    justify-content: flex-start;

}

.devis-tabs::-webkit-scrollbar,
.factures-tabs::-webkit-scrollbar,
.tabs-group::-webkit-scrollbar {
  display: none;
}

.devis-tabs .tab,
.factures-tabs .tab,
.tabs-group .tab  {
  padding: .45rem .9rem;
  font-size: .85rem;
  font-weight: 500;
  color: var(--muted);
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  cursor: pointer;
  white-space: nowrap;
  border-radius: .35rem .35rem 0 0;
  transition: all .15s ease;
}



.factures-types,
.factures-tabs {
  display: flex;
  gap: .5rem;
  padding: .5rem 1rem;
}

.factures-types {
  border-bottom: 1px solid var(--border);
  margin-top: .5rem;
}

.factures-tabs {
  margin-top: .5rem;
}
.factures-types {
  border-bottom: 1px solid var(--hover);
}



/* ============================================
   ZONE DE TABS (types + statuts)
   Affichage sur une seule ligne, séparateur fin
   ============================================ */

.tabs-bar {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 6px 20px;
    background: var(--panel);
    border-bottom: 1px solid var(--hover);
    overflow-x: auto;
    scrollbar-width: none;


    gap: .3rem;
    padding: .5rem 1rem;
    background: var(--panel, #fff);
    overflow-x: auto;
    scrollbar-width: none;
    max-width: 1800px;
    margin: 0 auto;
    padding: 8px 20px 0px 40px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: flex-start;

}

/* cache scroll */
.tabs-bar::-webkit-scrollbar {
    display: none;
}

/* Colonnes internes : TYPE + STATUT */
.tabs-group {
    display: flex;
    align-items: center;
    gap: .4rem;
}

/* Séparateur visuel léger */
.tabs-separator {
    width: 1px;
    height: 20px;
    background: var(--border);
    opacity: .8;
    margin: 0 .5rem;
}




.devis-tabs .tab:hover,
.factures-tabs .tab:hover,
.tabs-group .tab:hover {
  background: var(--hover);
  color: var(--text);
  border-radius: 8px 8px 0 0;
}


.devis-tabs .tab.active,
.factures-tabs .tab.active,
.tabs-group .tab.active {
  color: var(--accent, #2563eb);
  border-bottom-color: var(--accent, #2563eb);
  font-weight: 600;
  background: var(--hover);
}