@import "./src/common/var.less";
@import "./src/common/mixins.less";

@layer-css-prefix:~"@{css-prefix}layer";

/*列表详情*/
.@{layer-css-prefix}-frame{
  position:fixed;
  top:auto;
  bottom:auto;
  left:auto;
  right:auto;
  width:auto;
  height:auto;
  z-index:1000;
  display:none;
  transition:all 0.45s ease;
  -moz-transition:all 0.45s ease;
  -webkit-transition:all 0.45s ease;
  -o-transition:all 0.45s ease;
  background-color:#FFFFFF;
  box-shadow:0 6px 18px 2px rgba(0,0,0,.2);

  &-mask{
    display:none;
    position:fixed;
    top:0px;
    bottom:0px;
    left:0px;
    right:0px;
    z-index:9999;
    background-color:transparent;
    &-bg{
      background-color:tint(@layer-mask-bg,@layer-mask-shade-percent);
    }
  }

  &-header{
    height:46px;
    background-color:@layer-title-bg;
    border-bottom:1px solid @layer-border-color;
    overflow:hidden;
    padding:0px 10px;

    &-title{
      padding:0;
      margin:0;
      font-weight:normal;
      float:left;
      font-size:15px;
      line-height:44px;
      width:90%;
    }

    &-close{
      display:block;
      width:18px;
      height:46px;
      line-height:46px;
      float:right;
      font-size:18px;
      text-align:center;
      cursor:pointer;

      &:active{
        opacity:0.7;
        filter:alpha(opacity=70);
      }
    }
  }

  &-content{
    .mixin-scrollbar;
    position:absolute;
    top:47px;
    bottom:67px;
    left:0px;
    right:0px;
  }

  &-footer{
    position:absolute;
    bottom:0px;
    left:0px;
    right:0px;
    padding:15px;
    text-align:right;
    background-color: @layer-bottom-bg;
    border-top:1px solid @layer-border-color;

    &.tac{
      text-align: center;
    }
    &.tal{
      text-align: left;
    }
  }
}