@import "../common/variables.less";

.@{stbui}panel {
  position: relative;
  background-color: @white;
  border: 1px solid transparent;
  *border: 1px solid @white;

  &-head {
    border-bottom: 2px solid @brand-default;
    padding: 6px 0 6px 12px;
  }

  &-body {
    padding: 0 5px;

  }

  &-title {
    .font-variant(@black, @font-size-large, @font-family-yahei);

    a {
      .font-variant(@black, @font-size-large, @font-family-yahei);
      &:hover {
        .font-variant(@black, @font-size-large, @font-family-yahei);
        cursor: pointer;
      }
    }

  }

  &-footer {
    padding: 10px;
    background-color: #f5f5f5;
    //border-top: 1px solid #BBD4E8
  }

  .@{stbui}table {
    margin-top: 0;
  }

  &-more {
    float: right;
    position: absolute;
    right: 5px;
    top: 12px;
  }
}

.panel-variant(default; @brand-default);
.panel-variant(primary; @brand-primary);

.panel-variant(@theme,@background) {
  .@{stbui}panel-@{theme} {
    border: 1px solid @background;

    .@{stbui}panel-head {
      background-color: @background;
    }
    .@{stbui}panel-title {
      font-family: @font-family-yahei;
      font-weight: 900;
      color: @white;

    }

    .@{stbui}panel-body {

    }

    .@{stbui}panel-footer {

    }
  }
}

.@{stbui}panel-striped {

  .@{stbui}panel-head {
    border-bottom: 3px solid @brand-default;
  }

  .@{stbui}panel-title {
    .font-variant(@brand-primary; @font-size-large; @font-family-yahei);
    font-weight: 900;
    padding: 10px;
    display: inline-block;
    position: relative;
    bottom: -3px;
    border-bottom: 3px solid @brand-primary;

  }

  .@{stbui}panel-body {
  }

  .@{stbui}panel-footer {
  }
}