.el-card__header {
  padding: 0;
}

* {
  box-sizing: border-box;
  font-family:
    'PingFang SC', 'Lantinghei SC', 'Helvetica Neue', Helvetica, Arial,
    'Microsoft YaHei', '微软雅黑', STHeitiSC-Light, simsun, '宋体',
    'WenQuanYi Zen Hei', 'WenQuanYi Micro Hei', sans-serif;
}

.font-title {
  background: linear-gradient(to bottom, #c5c5c5, rgba(234, 234, 234, 0.4));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.hidden {
  display: none;
}
/* 通用工具类 */
.w-full {
  width: 100%;
}
.flex {
  display: flex;
}
.items-center {
  align-items: center;
}
.justify-center {
  justify-content: center;
}
.justify-between {
  justify-content: space-between;
}
.justify-around {
  justify-content: space-around;
}
.text-center {
  text-align: center;
}
.font-bold {
  font-weight: 700;
}
.font-medium {
  font-weight: 500;
}
.cursor-pointer {
  cursor: pointer;
}
.overflow-x-auto {
  overflow-x: auto;
}
.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

/* 间距 */
.mb-4 {
  margin-bottom: 1rem;
}
.mt-2 {
  margin-top: 0.5rem;
}
.mt-4 {
  margin-top: 1rem;
}
.my-8 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}
.my-12 {
  margin-top: 3rem;
  margin-bottom: 3rem;
}
.py-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.py-7 {
  padding-top: 1.75rem;
  padding-bottom: 1.75rem;
}
.py-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}
.px-10 {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}
.px-20 {
  padding-left: 5rem;
  padding-right: 5rem;
}

/* 尺寸 */
.w-6px {
  width: 6px;
}
.w-12 {
  width: 3rem;
}
.w-18 {
  width: 4.5rem;
}
.w-90 {
  width: 90%;
}
.w-580px {
  width: 580px;
}
.w-1200px {
  width: 1200px;
}
.h-6 {
  height: 1.5rem;
}
.h-8 {
  height: 2rem;
}
.h-18 {
  height: 4.5rem;
}
.h-21px {
  height: 21px;
}
.h-custom-7 {
  height: 1.75rem;
}

/* 颜色 */
.bg-custom-2e {
  background-color: #2e405c;
}
.bg-custom-red {
  background-color: #c20005;
}
.bg-custom-a0 {
  background-color: #a00005;
}
.bg-custom-4a {
  background-color: #4a5a6b;
}
.bg-custom-3a {
  background-color: #3a4a5b;
}
.bg-white-10 {
  background-color: rgba(255, 255, 255, 0.1);
}
.bg-white-20 {
  background-color: rgba(255, 255, 255, 0.2);
}
.text-white {
  color: #ffffff;
}

/* 文字大小 */
.text-xs {
  font-size: 0.75rem;
  line-height: 1rem;
}
.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}
.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

/* 其他 */
.rounded-lg {
  border-radius: 0.5rem;
}
.rounded-2px {
  border-radius: 2px;
}
.backdrop-blur-sm {
  backdrop-filter: blur(4px);
}
.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.transition-colors {
  transition-property:
    color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}
.duration-300 {
  transition-duration: 300ms;
}
.m-auto {
  margin: auto;
}
.ml-1 {
  margin-left: 0.25rem;
}
.mr-5px {
  margin-right: 5px;
}
.mr-10px {
  margin-right: 10px;
}
.gap-6 {
  gap: 1.5rem;
}

/* Hover 状态 */
.hover\:bg-white-20:hover {
  background-color: rgba(255, 255, 255, 0.2);
}
.hover\:bg-custom-a0:hover {
  background-color: #a00005;
}
.hover\:bg-custom-3a:hover {
  background-color: #3a4a5b;
}

/* 响应式 */
@media (min-width: 640px) {
  .sm\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }
  .sm\:text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
  .sm\:w-18 {
    width: 4.5rem;
  }
  .sm\:h-18 {
    height: 4.5rem;
  }
  .sm\:h-8 {
    height: 2rem;
  }
  .sm\:my-12 {
    margin-top: 3rem;
    margin-bottom: 3rem;
  }
  .sm\:px-0 {
    padding-left: 0;
    padding-right: 0;
  }
}

@media (min-width: 1024px) {
  .lg\:w-full {
    width: 100%;
  }
  .lg\:w-1200px {
    width: 1200px;
  }
  .lg\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }
  .lg\:h-7 {
    height: 1.75rem;
  }
  .lg\:mr-5px {
    margin-right: 5px;
  }
  .lg\:block {
    display: block;
  }
  .lg\:hidden {
    display: none;
  }
  .lg\:px-0 {
    padding-left: 0;
    padding-right: 0;
  }
  .lg\:max-w-5xl {
    max-width: 64rem;
  }
  .lg\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

.max-w-6xl {
  max-width: 72rem;
}
