/* ===================================================================
   regist.css — 注册页特有样式（与 login.css 配合）
   适配 login-wrap / login-side / login-main / login-card 结构
   =================================================================== */

/* ===== 注册特有表单样式 ===== */
.custom-form {
  margin-top: 20px;
}

.custom-form .el-form-item__label {
  line-height: 1;
  font-size: 13px !important;
  font-weight: 500 !important;
  color: var(--color-text-primary, #2a3547) !important;
  padding-bottom: 4px !important;
}

.custom-form .el-select {
  width: 100% !important;
}

/* ===== 表单元素 ===== */
.form-item {
  margin-top: 16px;
}

.form-item:first-child {
  margin-top: 0;
}

/* 验证码行 */
.code-item {
  display: flex;
  flex-direction: row;
  gap: 10px;
}

.code-item .el-input {
  flex: 1;
}

.code-btn {
  flex-shrink: 0;
  background: var(--color-primary);
  color: var(--spike-primary-text);
  border-color: var(--color-primary);
}

/* 手机区号选择器 */
.input-with-select .el-input-group__prepend {
  background: var(--color-bg-light, #f5f8fb);
  padding: 0;
}

/* 协议勾选 */
.rember-item {
  margin-top: 16px;
}

.rember-item a {
  color: var(--color-primary);
  cursor: pointer;
}

/* 销售选择 */
.read-item {
  margin-top: 12px;
}

.read-item a {
  color: var(--color-primary);
  cursor: pointer;
}

/* 注册按钮 */
.login-btn {
  width: 100%;
  height: 46px;
  background: var(--color-primary);
  border-color: var(--color-primary);
  font-size: 15px;
  font-weight: 600;
}

/* 邮箱/手机切换标签 */
.login-top {
  display: flex;
  gap: 24px;
  border-bottom: 1px solid var(--color-border, #e5eaef);
  margin-bottom: 20px;
}

.login-email,
.login-phone {
  padding-bottom: 12px;
  font-size: 14px;
  color: var(--color-text-secondary, #707a82);
  cursor: pointer;
  position: relative;
}

.login-email.active,
.login-phone.active {
  color: var(--color-primary);
  font-weight: 600;
}

.login-email.active::after,
.login-phone.active::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: var(--color-primary);
}

/* 注册跳转链接 */
.login-to-regist {
  font-size: 13px;
  color: var(--color-text-secondary, #707a82);
  margin: 10px 0 0;
}

.login-to-regist a {
  color: var(--color-primary);
  cursor: pointer;
}

/* 错误提示 */
.read-item .el-alert {
  padding: 10px 12px;
}

/* ===================================================================
   移动端适配（≤767px）
   =================================================================== */
@media screen and (max-width: 767px) {
  /* 左侧装饰区隐藏 */
  .login-side {
    display: none !important;
  }

  /* 卡片容器全宽 */
  .login-wrap {
    width: calc(100vw - 32px) !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: auto !important;
    margin: 16px !important;
    border-radius: var(--spike-radius) !important;
  }

  /* 主内容区 */
  .login-main {
    flex: 1 !important;
    padding: 0 20px !important;
  }

  /* 卡片内部 */
  .login-card {
    padding: 24px 0 !important;
    align-items: stretch !important;
  }

  .login-card-header {
    max-width: 100% !important;
  }

  .login-form {
    max-width: 100% !important;
  }

  /* 标题调整 */
  .login-title {
    font-size: 20px !important;
  }

  .login-subtitle {
    font-size: 13px !important;
  }

  /* 切换标签 */
  .login-top {
    gap: 16px;
    margin-bottom: 16px;
  }

  .login-email,
  .login-phone {
    font-size: 14px;
    padding-bottom: 10px;
  }

  /* 表单元素 */
  .form-item {
    margin-top: 12px;
  }

  /* 验证码按钮 */
  .code-btn {
    font-size: 13px;
    padding: 0 12px;
    height: 40px;
  }

  /* 注册按钮 */
  .login-btn {
    height: 44px;
    font-size: 15px;
  }

  /* 复选框 */
  .el-checkbox__label {
    font-size: 13px;
  }

  /* 自定义表单 */
  .custom-form {
    margin-top: 16px;
  }

  .custom-form .el-form-item {
    margin-bottom: 12px;
  }

  /* 销售相关 */
  .read-item {
    margin-top: 10px;
  }

  /* 顶部导航按钮 */
  .login-topbar .el-button {
    font-size: 12px;
    padding: 6px 12px;
  }

  /* 协议文字 */
  .rember-item {
    margin-top: 12px;
  }

  /* 国家选择下拉 */
  .country-select-drop .el-select-dropdown__item {
    font-size: 13px;
    padding: 0 12px;
  }
}

/* 超小屏手机适配（≤375px） */
@media screen and (max-width: 375px) {
  .login-wrap {
    width: calc(100vw - 24px) !important;
    margin: 12px !important;
    border-radius: var(--spike-radius) !important;
  }

  .login-main {
    padding: 0 16px !important;
  }

  .login-card {
    padding: 20px 0 !important;
  }

  .login-title {
    font-size: 18px !important;
  }

  .code-btn {
    font-size: 12px;
    padding: 0 8px;
  }
}