.hover:hover {
  cursor: pointer;
}

// 全局样式变量

// =========================
// 通用间距工具类（1px 步进）
// 说明：
// ml-4  -> margin-left: 4px
// mlr-4 -> margin-left/right: 4px
// mtb-4 -> margin-top/bottom: 4px
// 同时兼容更常见的 mx / my 命名
// =========================

$spacing-px-max: 100 !default;
$spacing-percent-max: 100 !default;
$radius-px-max: 50 !default;
$radius-percent-max: 100 !default;
$flex-max: 24 !default;
$spacing-em-max: 20 !default;
$spacing-rem-max: 15 !default;
$spacing-unit: 1px !default;

@mixin spacing-single($class, $property, $value) {
  .#{$class}-#{$value} {
    #{$property}: $value * $spacing-unit !important;
  }
}

@mixin spacing-double($class, $property1, $property2, $value) {
  .#{$class}-#{$value} {
    #{$property1}: $value * $spacing-unit !important;
    #{$property2}: $value * $spacing-unit !important;
  }
}

@mixin spacing-single-with-suffix($class, $property, $suffix, $value, $unit) {
  .#{$class}-#{$suffix}-#{$value} {
    #{$property}: #{$value}#{$unit} !important;
  }
}
@mixin generate-flex-utilities($max: $flex-max) {
  @for $i from 0 through $max {
    .flex-#{$i} {
      flex: #{$i} !important;
    }
  }
}

@mixin spacing-double-with-suffix(
  $class,
  $property1,
  $property2,
  $suffix,
  $value,
  $unit
) {
  .#{$class}-#{$suffix}-#{$value} {
    #{$property1}: #{$value}#{$unit} !important;
    #{$property2}: #{$value}#{$unit} !important;
  }
}

@mixin border-radius-single($class, $value) {
  .#{$class}-#{$value} {
    border-radius: #{$value}px !important;
  }
}

@mixin border-radius-single-with-suffix($class, $suffix, $value, $unit) {
  .#{$class}-#{$suffix}-#{$value} {
    border-radius: #{$value}#{$unit} !important;
  }
}

@mixin line-height-single($value) {
  .lh-#{$value} {
    line-height: #{$value}px !important;
  }
}

@mixin line-height-single-with-suffix($suffix, $value, $unit) {
  .lh-#{$suffix}-#{$value} {
    line-height: #{$value}#{$unit} !important;
  }
}

@mixin generate-spacing-utilities($prefix, $property, $max: $spacing-px-max) {
  @for $i from 0 through $max {
    @include spacing-single($prefix, $property, $i);
  }
}

@mixin generate-spacing-axis-utilities(
  $prefix,
  $property1,
  $property2,
  $max: $spacing-px-max
) {
  @for $i from 0 through $max {
    @include spacing-double($prefix, $property1, $property2, $i);
  }
}

@mixin generate-spacing-utilities-with-suffix(
  $prefix,
  $property,
  $suffix,
  $unit,
  $max: $spacing-px-max
) {
  @for $i from 0 through $max {
    @include spacing-single-with-suffix($prefix, $property, $suffix, $i, $unit);
  }
}

@mixin generate-spacing-axis-utilities-with-suffix(
  $prefix,
  $property1,
  $property2,
  $suffix,
  $unit,
  $max: $spacing-px-max
) {
  @for $i from 0 through $max {
    @include spacing-double-with-suffix(
      $prefix,
      $property1,
      $property2,
      $suffix,
      $i,
      $unit
    );
  }
}

@include generate-flex-utilities($flex-max);
// line-height
@for $i from 0 through $spacing-px-max {
  @include line-height-single($i);
}
@for $i from 0 through $spacing-px-max {
  @include line-height-single-with-suffix("ra", $i, "");
}
// border-radius
@for $i from 0 through $radius-px-max {
  @include border-radius-single("radius", $i);
}
@for $i from 0 through $radius-percent-max {
  @include border-radius-single-with-suffix("radius", "ra", $i, "%");
}
// margin
@include generate-spacing-utilities("m", margin);
@include generate-spacing-utilities("mt", margin-top);
@include generate-spacing-utilities("mr", margin-right);
@include generate-spacing-utilities("mb", margin-bottom);
@include generate-spacing-utilities("ml", margin-left);
@include generate-spacing-axis-utilities("mx", margin-left, margin-right);
@include generate-spacing-axis-utilities("my", margin-top, margin-bottom);

// margin percent
@include generate-spacing-utilities-with-suffix(
  "m",
  margin,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-utilities-with-suffix(
  "mt",
  margin-top,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-utilities-with-suffix(
  "mr",
  margin-right,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-utilities-with-suffix(
  "mb",
  margin-bottom,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-utilities-with-suffix(
  "ml",
  margin-left,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "mx",
  margin-left,
  margin-right,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "my",
  margin-top,
  margin-bottom,
  "ra",
  "%",
  $spacing-percent-max
);

// margin em
@include generate-spacing-utilities-with-suffix(
  "m",
  margin,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-utilities-with-suffix(
  "mt",
  margin-top,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-utilities-with-suffix(
  "mr",
  margin-right,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-utilities-with-suffix(
  "mb",
  margin-bottom,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-utilities-with-suffix(
  "ml",
  margin-left,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "mx",
  margin-left,
  margin-right,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "my",
  margin-top,
  margin-bottom,
  "em",
  "em",
  $spacing-em-max
);

// margin rem
@include generate-spacing-utilities-with-suffix(
  "m",
  margin,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "mt",
  margin-top,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "mr",
  margin-right,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "mb",
  margin-bottom,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "ml",
  margin-left,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "mx",
  margin-left,
  margin-right,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "my",
  margin-top,
  margin-bottom,
  "rem",
  "rem",
  $spacing-rem-max
);

// padding
@include generate-spacing-utilities("p", padding);
@include generate-spacing-utilities("pt", padding-top);
@include generate-spacing-utilities("pr", padding-right);
@include generate-spacing-utilities("pb", padding-bottom);
@include generate-spacing-utilities("pl", padding-left);
@include generate-spacing-axis-utilities("px", padding-left, padding-right);
@include generate-spacing-axis-utilities("py", padding-top, padding-bottom);

// padding percent
@include generate-spacing-utilities-with-suffix(
  "p",
  padding,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-utilities-with-suffix(
  "pt",
  padding-top,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-utilities-with-suffix(
  "pr",
  padding-right,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-utilities-with-suffix(
  "pb",
  padding-bottom,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-utilities-with-suffix(
  "pl",
  padding-left,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "px",
  padding-left,
  padding-right,
  "ra",
  "%",
  $spacing-percent-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "py",
  padding-top,
  padding-bottom,
  "ra",
  "%",
  $spacing-percent-max
);

// padding em
@include generate-spacing-utilities-with-suffix(
  "p",
  padding,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-utilities-with-suffix(
  "pt",
  padding-top,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-utilities-with-suffix(
  "pr",
  padding-right,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-utilities-with-suffix(
  "pb",
  padding-bottom,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-utilities-with-suffix(
  "pl",
  padding-left,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "px",
  padding-left,
  padding-right,
  "em",
  "em",
  $spacing-em-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "py",
  padding-top,
  padding-bottom,
  "em",
  "em",
  $spacing-em-max
);

// padding rem
@include generate-spacing-utilities-with-suffix(
  "p",
  padding,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "pt",
  padding-top,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "pr",
  padding-right,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "pb",
  padding-bottom,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "pl",
  padding-left,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "px",
  padding-left,
  padding-right,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "py",
  padding-top,
  padding-bottom,
  "rem",
  "rem",
  $spacing-rem-max
);

// gap
@include generate-spacing-utilities("gap", gap);
@include generate-spacing-utilities("row-gap", row-gap);
@include generate-spacing-utilities("col-gap", column-gap);

// width / height
@include generate-spacing-utilities("w", width);
@include generate-spacing-utilities("h", height);

// width / height percent
@include generate-spacing-utilities-with-suffix("w", width, "ra", "%");
@include generate-spacing-utilities-with-suffix("h", height, "ra", "%");

// width / height em
@include generate-spacing-utilities-with-suffix("w", width, "em", "em");
@include generate-spacing-utilities-with-suffix("h", height, "em", "em");

// width / height rem
@include generate-spacing-utilities-with-suffix(
  "w",
  width,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "h",
  height,
  "rem",
  "rem",
  $spacing-rem-max
);

// font-size
@include generate-spacing-utilities("fs", font-size);

// font-size percent
@include generate-spacing-utilities-with-suffix("fs", font-size, "ra", "%");

// font-size em
@include generate-spacing-utilities-with-suffix("fs", font-size, "em", "em");

// font-size rem
@include generate-spacing-utilities-with-suffix(
  "fs",
  font-size,
  "rem",
  "rem",
  $spacing-rem-max
);

// position
@include generate-spacing-utilities("l", left);
@include generate-spacing-utilities("r", right);
@include generate-spacing-utilities("t", top);
@include generate-spacing-utilities("b", bottom);
@include generate-spacing-utilities-with-suffix("l", left, "ra", "%");
@include generate-spacing-utilities-with-suffix("r", right, "ra", "%");
@include generate-spacing-utilities-with-suffix("t", top, "ra", "%");
@include generate-spacing-utilities-with-suffix("b", bottom, "ra", "%");
@include generate-spacing-utilities-with-suffix("l", left, "em", "em");
@include generate-spacing-utilities-with-suffix("r", right, "em", "em");
@include generate-spacing-utilities-with-suffix("t", top, "em", "em");
@include generate-spacing-utilities-with-suffix("b", bottom, "em", "em");
@include generate-spacing-utilities-with-suffix(
  "l",
  left,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "r",
  right,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "t",
  top,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "b",
  bottom,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-axis-utilities("inset-x", left, right);
@include generate-spacing-axis-utilities("inset-y", top, bottom);
@include generate-spacing-utilities("inset", inset);
@include generate-spacing-axis-utilities-with-suffix(
  "inset-x",
  left,
  right,
  "ra",
  "%"
);
@include generate-spacing-axis-utilities-with-suffix(
  "inset-y",
  top,
  bottom,
  "ra",
  "%"
);
@include generate-spacing-utilities-with-suffix("inset", inset, "ra", "%");
@include generate-spacing-axis-utilities-with-suffix(
  "inset-x",
  left,
  right,
  "em",
  "em"
);
@include generate-spacing-axis-utilities-with-suffix(
  "inset-y",
  top,
  bottom,
  "em",
  "em"
);
@include generate-spacing-utilities-with-suffix("inset", inset, "em", "em");
@include generate-spacing-axis-utilities-with-suffix(
  "inset-x",
  left,
  right,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-axis-utilities-with-suffix(
  "inset-y",
  top,
  bottom,
  "rem",
  "rem",
  $spacing-rem-max
);
@include generate-spacing-utilities-with-suffix(
  "inset",
  inset,
  "rem",
  "rem",
  $spacing-rem-max
);

// 常用布局辅助类
.inline-block {
  display: inline-block !important;
}

.block {
  display: block !important;
}

.inline {
  display: inline !important;
}

.hidden {
  display: none !important;
}

.text-center {
  text-align: center !important;
}

.text-left {
  text-align: left !important;
}

.text-right {
  text-align: right !important;
}

.flex {
  display: flex;
  justify-content: space-between;
  align-items: center;

  &.column {
    flex-direction: column;
  }

  &.center {
    justify-content: center;
  }

  &.start {
    justify-content: flex-start;
  }

  &.end {
    justify-content: flex-end;
  }

  &.core {
    justify-content: center;
    align-items: center;
  }
}

img {
  object-fit: contain;
  object-position: center;
}

.pointer {
  cursor: pointer;
}

.absolute {
  position: absolute;

  &.core {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  &.full {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  &.top-left {
    top: 0;
    left: 0;
  }

  &.top-right {
    top: 0;
    right: 0;
  }

  &.bottom-left {
    bottom: 0;
    left: 0;
  }

  &.bottom-right {
    bottom: 0;
    right: 0;
  }
}

.fw-100,
.font-thin {
  font-weight: 100;
} /* 细体 */
.fw-200,
.font-extralight {
  font-weight: 200;
} /* 特细 */
.fw-300,
.font-light {
  font-weight: 300;
} /* 轻细 */
.fw-400,
.font-normal {
  font-weight: 400;
} /* 常规（默认）*/
.fw-500,
.font-medium {
  font-weight: 500;
} /* 中等 */
.fw-600,
.font-semibold {
  font-weight: 600;
} /* 半粗（你提到的 600）*/
.fw-700,
.font-bold {
  font-weight: 700;
} /* 粗体 */
.fw-800,
.font-extrabold {
  font-weight: 800;
} /* 特粗 */
.fw-900,
.font-black {
  font-weight: 900;
} /* 极粗 */

.bg-brand {
  background-color: var(--brand-color) !important;
}

.color-brand {
  color: var(--brand-color) !important;
}

.corlor-place {
  color: var(--text-color-placeholder) !important;
}

.bg-brand-hover {
  background-color: var(--brand-color-hover) !important;
}

.mx-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}

.el-dropdown,
.el-dropdown {
  &:focus,
  &:focus-visible {
    outline: none !important;
  }

  *:focus,
  *:focus-visible {
    outline: none !important;
  }
}

// =========================
// 全局 el-dialog 通用样式
// 统一隐藏默认 header / 去掉 body 内边距，
// 由各业务组件自行在 body 内绘制标题与内容。
// =========================
.el-dialog {
  padding: 0;
  border-radius: 24px;
  overflow: hidden;
  width: max-content;

  .el-dialog__header {
    display: none;
  }

  .el-dialog__body {
    padding: 0;
  }

  .body-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 18px;

    .body-title {
      font-weight: 600;
      font-size: 20px;
      color: #1d2129;
    }

    .close-btn {
      width: 30px;
      height: 30px;
      cursor: pointer;
    }
  }

  .body-wrap {
    padding: 24px;
  }

  .body-footer {
    display: flex;
    justify-content: flex-end;
    padding: 16px 24px;
    background: #f9faff;
    border-top: 1px solid #e0e0e0;
  }
}

.border-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 600;
  font-size: 16px;
  color: #1d2129;

  &::before {
    content: "";
    display: block;
    width: 4px;
    height: 16px;
    background: #3289fb;
    border-radius: 2px 2px 2px 2px;
  }
}
