:root {
  --c3-tab-deep: #0F1D3A;                
  --c3-tab-deep-soft: rgba(15, 29, 58, 0.08);  
  --c3-tab-track: rgb(245, 247, 250);    
  --c3-tab-inactive-border: rgb(220, 228, 239); 
  --c3-tab-inactive-fg: rgb(87, 101, 125);      
}




.el-tabs--top > .el-tabs__header .el-tabs__nav {
  background: var(--c3-tab-track);
}


.el-tabs--top > .el-tabs__header .el-tabs__item {
  background: #fff !important;
  color: var(--c3-tab-inactive-fg);
  border: 1px solid var(--c3-tab-inactive-border) !important;
  border-radius: 8px;
}


.el-tabs--top > .el-tabs__header .el-tabs__item.is-active {
  background: var(--c3-tab-deep) !important;
  color: #fff !important;
  border-color: var(--c3-tab-deep) !important;
  font-weight: 600;
}


.el-tabs--top > .el-tabs__header .el-tabs__active-bar {
  display: none !important;
}


.el-tabs--top > .el-tabs__header .el-tabs__item:hover:not(.is-active):not(.is-disabled) {
  color: var(--c3-ink-2);
  border-color: var(--c3-brand-hover) !important;
}


.el-tabs--top > .el-tabs__header .el-tabs__item:focus-visible {
  outline: 2px solid var(--c3-brand-hover);
  outline-offset: 2px;
  z-index: 2;
}


.el-tabs--top > .el-tabs__header .el-tabs__item.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}




.c3ai-tab {
  background: rgb(247, 249, 252);
  color: rgb(65, 80, 107);
  border: 1px solid rgb(220, 228, 239);
  border-radius: 8px;
  transition: background 180ms cubic-bezier(0.4, 0, 0.2, 1),
    border-color 180ms cubic-bezier(0.4, 0, 0.2, 1),
    color 180ms cubic-bezier(0.4, 0, 0.2, 1);
}


.c3ai-tab.on {
  background: var(--c3-tab-deep);
  color: #fff;
  border-color: var(--c3-tab-deep);
  font-weight: 600;
}


.c3ai-tab:hover:not(.on) {
  border-color: var(--c3-brand-hover);
  color: var(--c3-ink-2);
}


.c3ai-tab:focus-visible {
  outline: 2px solid var(--c3-brand-hover);
  outline-offset: 2px;
}


.c3ai-tab.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}




.chip {
  background: rgb(243, 246, 251);
  color: rgb(87, 101, 125);
  border-radius: 7px;
  transition: background 180ms cubic-bezier(0.4, 0, 0.2, 1),
    color 180ms cubic-bezier(0.4, 0, 0.2, 1);
}


.chip.on {
  background: var(--c3-tab-deep-soft);
  color: var(--c3-tab-deep);
  font-weight: 600;
}


.chip:hover:not(.on) {
  background: rgb(235, 240, 248);
  color: var(--c3-ink-2);
}


.chip:focus-visible {
  outline: 2px solid var(--c3-brand-hover);
  outline-offset: 2px;
}


.chip.is-disabled {
  opacity: 0.5;
  cursor: not-allowed;
}