/* ==========================================================================
   kdo-tabs — Onglets
   ========================================================================== */

.kdo-tabs {
  display: flex;
  flex-direction: column;
  font-family: var(--kdo-font-family);
  font-size: var(--kdo-text-base);
  color: var(--kdo-text);
}
.kdo-tabs--vertical {
  flex-direction: row;
  gap: var(--kdo-space-md);
}

/* Barre d'onglets horizontal */
.kdo-tabs-bar {
  display: flex;
  border-bottom: var(--kdo-border-width) solid var(--kdo-border);
  overflow-x: auto;
  scrollbar-width: thin;
}
.kdo-tabs--vertical .kdo-tabs-bar {
  flex-direction: column;
  border-bottom: none;
  border-right: var(--kdo-border-width) solid var(--kdo-border);
  width: 200px;
  flex-shrink: 0;
}

.kdo-tab {
  background: none;
  border: none;
  padding: var(--kdo-space-sm) var(--kdo-space-md);
  cursor: pointer;
  font-size: var(--kdo-text-base);
  font-family: var(--kdo-font-family);
  color: var(--kdo-text-mute);
  border-bottom: 2px solid transparent;
  transition: all var(--kdo-transition-fast);
  display: inline-flex;
  align-items: center;
  gap: var(--kdo-space-xs);
  white-space: nowrap;
}
.kdo-tab:hover { color: var(--kdo-text); background: var(--kdo-gray-50); }
.kdo-tab--active {
  color: var(--kdo-primary);
  border-bottom-color: var(--kdo-primary);
  font-weight: var(--kdo-weight-semi);
}

.kdo-tabs--vertical .kdo-tab {
  border-bottom: none;
  border-right: 2px solid transparent;
  text-align: left;
  justify-content: flex-start;
}
.kdo-tabs--vertical .kdo-tab--active {
  border-right-color: var(--kdo-primary);
  background: var(--kdo-primary-light);
}

.kdo-tab-badge {
  display: inline-block;
  padding: 1px 7px;
  border-radius: var(--kdo-radius-full);
  font-size: var(--kdo-text-xs);
  font-weight: var(--kdo-weight-medium);
  background: var(--kdo-gray-200);
  color: var(--kdo-text);
  margin-left: 4px;
}
.kdo-tab-badge--success { background: var(--kdo-success-light); color: #166534; }
.kdo-tab-badge--danger  { background: var(--kdo-danger-light);  color: #991b1b; }
.kdo-tab-badge--warning { background: var(--kdo-warning-light); color: #9a3412; }
.kdo-tab-badge--info    { background: var(--kdo-info-light);    color: #155e75; }

/* Zone contenu */
.kdo-tabs-content {
  flex: 1;
  padding: var(--kdo-space-md) 0;
  min-width: 0;
}

.kdo-tab-panel { display: none; }
.kdo-tab-panel--active { display: block; }

.kdo-tab-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--kdo-space-2xl);
}