@import "./color";
@import "./size";
@import "./fonts";


.give-artifact-page {
  .artifact-forms {
    flex: 1 1 auto;
    overflow: auto;
    padding: $width-4;
    .ant-divider-horizontal.no-top-margin {
      margin: 0 0 $width-6 0 !important;
    }
    .sub-attr-free-selector {
      margin-top: $width-4;
      height: $width-17;
      overflow: hidden;
      border: 1px solid $grey-8;
      .ant-col {
        overflow: auto;
        height: 100%;
        &:nth-child(2) {
          border-left: 1px solid $grey-8;
        }
      }
    }
  }
}

.give-weapon-page {
  .fav-layout {
    overflow: hidden !important;
    border: 0 !important;
    .list-layout {
      overflow: auto;
    }
    .ant-typography.title {
      border-bottom: 1px solid $grey-8;
    }
  }
  .weapon-forms {
    flex: 1 1 auto;
    overflow: auto;
    padding: $width-4;
  }
}

.give-all-page {
  .goods-forms {
    flex: 1 1 auto;
    overflow: auto;
    padding: $width-4;
  }
  &.common-page-layout > .right-layout {
    flex: 0 0 $width-19;
  }
  .fav-layout {
    overflow: hidden !important;
    border: 0 !important;
    .fav-list-container {
      flex: 1 1 auto;
      overflow: hidden;
    }
    .title-bar {
      flex: 0 0 auto;
      display: flex;
      flex-direction: row;
      border-bottom: 1px solid $grey-8;
      .left-area {
        flex: 1 1 auto;
        line-height: $width-10;
        font-size: $font-size-3;
        padding-left: $padding-normal;
        font-weight: $font-weight-border;
      }
      .right-area {
        text-align: right;
        padding-right: $padding-normal;
        flex: 0 0 $width-12;
        line-height: $width-10;
      }
    }
  }
}

.icon-selector {
  .icon-selector-item {
    display: flex;
    flex-direction: row;
    .ant-avatar {
      flex: 0 0 $width-7;
      width: $width-7;
      height: $width-7;
      margin-top: $width-1;
    }
    &-meta {
      flex: 1 1 auto;
      padding-left: $padding-normal;
      overflow: hidden;
      text-overflow: ellipsis;
      word-break: break-all;
      white-space: nowrap;
      .icon-selector-item-desc {
        display: none;
      }
    }
  }
}

.icon-selector-dropdown {
  .icon-selector-item {
    display: flex;
    flex-direction: row;
    .ant-avatar {
      flex: 0 0 $width-8;
      width: $width-8;
      height: $width-8;
      &.ant-avatar-icon {
        font-size: $font-size-huge;
        padding-top: $width-1;
      }
    }
    &-meta {
      flex: 1 1 auto;
      padding-left: $padding-normal;
      overflow: hidden;
      text-overflow: ellipsis;
      word-break: break-all;
      white-space: nowrap;
    }
    &-desc {
      color: $grey-6;
      font-size: $font-size-small;
    }
    &-title {
      color: $white;
      font-weight: bolder;
    }
  }
}
