
.unit-toggle{
  button:not(.spinner-btn) {
    cursor: pointer;
  
    border: 1px solid var(--color-interface-400);
    color: var(--color-interface-400);
    background-color: var(--color-panel-bg);
    border-radius: var(--border-radius);
    padding: 0.1rem 0.3rem;
    height: calc(var(--input-h)*0.75);
  

    &:not(.active):hover{
      background-color: var(--color-interface-100);
    }
  
    &.active {
      // border: 1px solid var(--color-interface-700);
      color: var(--color-interface-050);
      background-color: var(--color-interface-500);
      cursor: auto;
    }


  }
}


#editor-panel .tabs{
  .tab{
    color: var(--color-interface-600);
    font-size: 1rem;
    font-family: var(--sans-serif);
    height: var(--input-h);
    padding: 0 1ch;
    border: 1px solid currentColor;
    border-radius: calc(var(--input-h));
    font-weight: 500;
    background-color: var(--color-panel-bg);

    &.active{
      background-color: var(--color-interface-400);
      border-color: var(--color-interface-400);
      color: var(--color-panel-bg);
    }

    &:not(.active):hover{
      cursor: pointer;
      background-color: var(--color-interface-100);
    }
  }
  // .tab {
  //   &.active {
  //     background-color: var(--color-txt);
  //     color: #fff;
  //     border: none;
  //   }
  // }
}
