
@import '../../src/style/tools.css';

.bx-cell-group {
  & .bx-cell-group-title-line {
    height: 40px;
    line-height: 40px;
    background-color: var(--cell-group-bg-color);
    font-size: 14px;
    color: var(--cell-group-title-color);
    padding: 0 9px 0 15px;
    display: flex;
    justify-content: space-between;

    & .bx-cell-group-title {
      @apply --ellipsis;

      flex: 1;
    }

    &::after {
      border-color: var(--cell-border-color);
    }

    & .bx-cell-group-link {
      display: inline-flex;
      position: relative;
      margin-left: var(--cell-ellipsis-margin);

      & .bx-cell-group-link-btn {
        position: absolute;
        top: 0;
        left: var(--cell-ellipsis-margin-negative);
        right: -9px;
        bottom: 0;
      }
    }

    & .bx-cell-group-link-text {
      color: var(--cell-group-link-color);
      font-size: 12px;
      margin-right: 6px;
    }

    & .bx-cell-group-link-icon {
      color: var(--cell-group-link-icon-color);
      font-size: 14px;
    }
  }

  & .bx-cell-group-more-line {
    height: 40px;
    line-height: 40px;
    background-color: white;
    font-size: 12px;
    color: var(--cell-group-more-color);
    text-align: center;

    & .bx-cell-group-more-text {
      margin-right: 6px;
    }

    & .bx-cell-group-more-icon {
      color: var(--cell-group-more-icon-color);
      font-size: 14px;
    }
  }
}
