@charset "UTF-8";
//公用
@import "./common/_palette";
@import "./common/_background";
@import "./common/_variables";
//组件
@import "./component/_navigation";
@import "./component/_pagination";
@import "./component/_themes";

html {
  height: 100%;
  overflow-y: auto !important;
}
//圆角 br-$i
@for $i from 1 through 24 {
  .br-#{$i} {
    border-radius: (2px * $i) !important;
  }
}

.box-shadow {
  box-shadow: 0 6px 0 0 rgba(0, 0, 0, 0.01), 0 15px 32px 0 rgba(0, 0, 0, 0.06) !important;
}

.link-type,
.link-type:focus {
  color: #337ab7;
  cursor: pointer;
  text-decoration: none;
  &:hover {
    color: rgb(32, 160, 255);
  }
}

.ck-content pre code {
  box-shadow: none !important;
  color: #353535;
  font-weight: 500;
  font-family: Monaco, Menlo, Consolas, "Roboto Mono", "Courier New", "Ubuntu Mono", monospace;
  font-size: 0.866666em;
  white-space: pre-wrap;
  &::before,
  &::after {
    content: none;
  }
}

.v-bottom-black-bar {
  // 适应底部小黑条
  margin-bottom: constant(safe-area-inset-bottom);
  margin-bottom: env(safe-area-inset-bottom);
}

// 去除Google游览器自动填充账号出现的背景
input {
  background-color: transparent !important;
}
input:-webkit-autofill {
  transition: background-color 1s ease-in-out 6000s;
  -webkit-transition: background-color 1s ease-in-out 6000s;
  -webkit-text-fill-color: #fff !important;
}

// 清除vuetify的默认pre下的code伪元素和阴影
.v-application pre > code {
  box-shadow: none;
  &::before,
  &::after {
    content: none;
  }
}
pre[class*="language-"] {
  margin: auto 0 !important;
}
// 分页
.v-pagination .v-pagination__item {
  outline: none;
}

//公共渐变色样式
.grad-blue {
  background: linear-gradient(226deg, #3eddff 0%, #008ef0 100%);
}
.grad-cyan {
  background: linear-gradient(226deg, #31e1c0 0%, #19a090 100%);
}
.grad-green {
  background: linear-gradient(226deg, #79dd43 0%, #00a23d 100%);
}
.grad-orange {
  background: linear-gradient(226deg, #ffc042 0%, #fa7414 100%);
}
.grad-yellow {
  background: linear-gradient(226deg, #ffdd33 0%, #faa700 100%);
}
.grad-red {
  background: linear-gradient(226deg, #ff7d7d 0%, #ca0000 100%);
}
.grad-indigo {
  background: linear-gradient(226deg, #00b0d6 0%, #000bc0 100%);
}

//公共样式（旧版）
.g_height-100 {
  height: 100% !important;
}
.g_width-100 {
  width: 100%;
}
.g_width-65 {
  width: 65%;
}
.g_width-60 {
  width: 60%;
}
.g_width-40 {
  width: 40%;
}
.g_width-30 {
  width: 30%;
}
.g_width-20 {
  width: 20%;
}
.g_100 {
  width: 100%;
  height: 100%;
}

.g_pa-15 {
  padding: 60px !important;
}
.g_pa-20 {
  padding: 80px !important;
}
.g_px-20 {
  padding: 0 80px !important;
}

.g_size-28 {
  font-size: 28px;
}
.g_size-24 {
  font-size: 24px;
}
.g_size-20 {
  font-size: 20px;
}
.size-18{
  font-size: 18px;
}
.g_size-16 {
  font-size: 16px;
}
.g_position-f-top {
  position: fixed !important;
  top: 0;
}
.g_v-align-top {
  vertical-align: top;
}






//公共样式(新版)
.height-100 {
  height: 100%;
}
.width-100 {
  width: 100%;
}
.width-65 {
  width: 65%;
}
.width-60 {
  width: 60%;
}
.width-40 {
  width: 40%;
}
.width-30 {
  width: 30%;
}
.width-20 {
  width: 20%;
}
.wh100 {
  width: 100%;
  height: 100%;
}

.pa-15 {
  padding: 60px !important;
}
.pa-20 {
  padding: 80px !important;
}
.px-20 {
  padding: 0 80px !important;
}
.mt-20{
  margin-top: 80px;
}

.size-28 {
  font-size: 28px;
}
.size-24 {
  font-size: 24px;
}
.size-20 {
  font-size: 20px;
}
.size-18{
  font-size: 18px;
}
.size-16 {
  font-size: 16px;
}
.position-f-top {
  position: fixed !important;
  top: 0;
}


.v-align-top {
  vertical-align: top;
}
.v-align-middle {
  vertical-align: middle;
}


a {
  text-decoration: none;
}

//文本超出隐藏并显示省略号
.text-overflow{
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  word-break: break-all;
}
.text-overflow-1{
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  -webkit-box-orient: vertical;
}
.text-overflow-2{
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
}
.text-overflow-3{
  text-overflow: -o-ellipsis-lastline;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
}