// @import '../_utils.scss';

$base-cardHead-height: if($--size-height-base <= 26, 28, if($--size-height-base > 30, 52, 40));
$base-cardBody-padding: if($--size-height-base <= 26, 16px, if($--size-height-base > 30, 24px, 20px));

.#{$card-prefix-cls} {
  background: $card-background;

  @include theme-background-color($__card_background-color);
  border-radius: $border-radius-small;
  font-size: $font-size-base;
  position: relative;
  //overflow: hidden;
  transition: all $transition-time $ease-in-out;
  @if $--size-switch == yes {
    font-size: $--size-font-size-base;
  }

  @include structure-font-size($__card-default_font-size, 0);

  &-bordered {
    border: 1px solid $border-color-base;
    border-color: $border-color-split;

    @include theme-border-color($__card-bordered_border-color);
  }

  &-shadow {
    box-shadow: $shadow-card;

    @include theme-box-shadow($__card-shadow_box-shadow);
  }

  &:hover {
    box-shadow: $shadow-base;
    border-color: $card-hover-border-color;

    @include theme-border-color($__card_hover_border-color);
    @include theme-box-shadow($__card_hover_box-shadow);
  }

  &-dis-hover:hover {
    box-shadow: none;
    /* border-color: transparent; */
    @include theme-box-shadow($__card-dis-hover_box-shadow);
  }

  &-dis-hover &-bordered:hover {
    border-color: $border-color-split;

    @include theme-border-color($__card-bordered_hover_border-color);
  }

  &-shadow:hover {
    box-shadow: $shadow-card;

    @include theme-box-shadow($__card-shadow_hover_box-shadow);
  }

  &-head {
    // @include content-header;
    border-bottom: 1px solid $border-color-split;

    @include theme-border-bottom-color($__common-content-header_border-bottom-color);
    @if $--size-switch == yes {
      @include computed-font-size(26);
      @include computed-height($base-cardHead-height, 1px);
    }@else {
      padding: $mixin-content-header-padding;
      line-height: 1;
    }
  
    p,
    &-inner {
      display: inline-block;
      width: 100%;
      color: $mixin-content-header-color;
  
      @include theme-font-color($__common-content-header-inner_font-color);
      font-weight: bold;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
  
      @if $--size-switch == yes {
        @include computed-font-size(26);
        line-height: 1;
        & i.iconfont {
          @include computed-font-size(26);
        }
      }@else {
        height: 20px;
        line-height: 20px;
        font-size: $font-size-base;
      }
  
      @include structure-font-size($__card-default_font-size, 0);
    }
  }

  &-extra {
    position: absolute;
    right: $card-extra-right;
    top: $card-extra-top;
    @if $--size-switch == yes {
      @include computed-font-size(26);
      top: ($base-cardHead-height - $--size-line-height-base) / 2;
      right: $--size-offset-base;
      & a,i.iconfont {
        @include computed-font-size(26);
      }
    }
  }

  &-extra a {
    @include theme-color($__card-a-extra_font-color);

    &:hover {
      @include theme-color($__card-a-extra_hover_font-color);
    }

    &:active {
      @include theme-color($__card-a-extra_active_font-color);
    }
  }

  &-body {
    padding: $card-body-padding;
    // 单独增加字体颜色
    @include theme-font-color($__card-body_font-color);
    @if $--size-switch == yes {
      padding: $base-cardBody-padding;
    }

    *{
      word-wrap: break-word;
    }
  }

  ul li span {
    float: right;
    color: $card-ul-li-span-color;

    @include theme-font-color($__card-span_font-color);
  }

  ul li {
    margin-bottom: $card-ul-li-margin-bottom;
    clear: both;

    a {
      @include theme-color($__common-a_font-color);
    }

    a:hover {
      @include theme-color($__common-a_hover_font-color);
    }

    a:active {
      @include theme-color($__common-a_active_font-color);
    }
  }

  ul li a[target="_blank"]::after {
    content: "\e69c";
    font-family: iconfont, "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "\5FAE\8F6F\96C5\9ED1", Arial, sans-serif;
    color: $card-ul-li-a-color;

    @include theme-font-color($__card-a-after_font-color);
    margin-left: $card-ul-li-a-margin-left;
  }
}

.#{$card-prefix-cls}-dis-hover.#{$card-prefix-cls}-bordered:hover {
  @include theme-border-color($__card-bordered_hover_border-color);
}