.gm-tabs {
  .gm-tabs-head-fix {
    width: 100%;
    height: 40px;
  }

  .gm-tabs-head {
    height: 40px;
    padding: 0 20px;
    background: var(--gm-color-bg-back);
    border-bottom: 1px solid var(--gm-color-border-special);

    .gm-tabs-head-item {
      font-size: 14px;
      line-height: 28px;
      padding: 0 10px;
      position: relative;
      cursor: pointer;
      color: var(--gm-color-default);
      border-left: 1px solid transparent;
      border-top: 1px solid transparent;
      border-right: 1px solid transparent;
      border-bottom: none;
      border-top-left-radius: 4px;
      border-top-right-radius: 4px;

      &.active {
        background: white;
        border-left: 1px solid var(--gm-color-border);
        border-top: 1px solid var(--gm-color-border);
        box-sizing: border-box;
        border-right: 1px solid var(--gm-color-border);
      }
    }
  }
}

.gm-tabs-head-disabled {
  color: '#a9a9a9';
  cursor: not-allowed;
  background: #fafafa;
  border: 1px solid #f0f0f0;
  border-radius: 2px 2px 0 0;
  outline: none;
  cursor: pointer;
  line-height: 28px;
  margin-left: 16px;
  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.gm-tabs-text-overflow-ellipsis {
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gm-tabs-max-head-scroll {
  max-width: calc(100% - 100px);
  overflow-x: auto;
  overflow-y: hidden;

  &::-webkit-scrollbar {
    height: 3px !important;
    width: 100px !important;
    border-radius: 2px !important;
  }

  &::-webkit-scrollbar-track {
    background: rgb(239, 239, 239) !important;
    border-radius: 2px !important;
  }

  &::-webkit-scrollbar-thumb {
    background: #bfbfbf !important;
    border-radius: 10px !important;
  }

  &::-webkit-scrollbar-thumb:hover {
    background: #bfbfbf !important;
  }

  &::-webkit-scrollbar-corner {
    background: #179a16 !important;
  }
}

.gm-tabs-nav-add {
  min-width: 40px;
  padding: 0 8px;
}

// 明亮风格的样式覆盖
.gm-tabs-light {
  .gm-tabs-head-fix {
    height: 35px;
  }

  .gm-tabs-head {
    height: 35px;
    background: none;
    border-bottom: none;

    .gm-tabs-head-item {
      border: none;
      padding: 0 2.5px;
      margin: 0 7.5px;
      border-bottom: 2px solid transparent;

      &:first-of-type {
        margin: 0;
        margin-right: 7.5px;
      }

      &.active {
        color: var(--gm-color-primary);
        border: none;
        border-bottom: 2px solid var(--gm-color-primary);

        &::after {
          background: none;
        }
      }
    }
  }
}

// 可编辑风格样式
.gm-tabs-edit {
  .gm-tabs-head {
    background: #fff !important;
    padding: 0;
    z-index: 9;
    position: relative;

    .gm-tabs-head-item {
      transition: all 0.3s;
      border-top-left-radius: 2px;
      border-top-right-radius: 2px;
      line-height: 30px;
      // border-bottom: 1px solid var(--gm-color-border-special);

      &.active {
        color: #1890ff;
        box-sizing: border-box;
      }
    }
  }
}