/* add-person.wxss
 * 视觉方向：纸感编辑风（A 方案，与全局一致）
 * 原版含 2 个 impeccable 绝对禁项：gradient text (background-clip: text) 和 dashed border 大色块
 */

.container {
  min-height: 100vh;
  background: #FAF6ED;
  padding-bottom: 120rpx;
}

.form {
  padding: 24rpx;
}

.form-item {
  background: #FFFFFF;
  border: 1rpx solid #E8E2D5;
  border-radius: 14rpx;
  padding: 28rpx;
  margin-bottom: 20rpx;
}

.label {
  font-size: 26rpx;
  font-weight: 500;
  color: #1F1D2B;
  margin-bottom: 18rpx;
  display: block;
}

.label.required::after {
  content: ' *';
  color: #C8412F;
}

/* ───── 头像上传 ───── */
.avatar-upload {
  text-align: center;
}

.avatar {
  width: 176rpx;
  height: 176rpx;
  border-radius: 50%;
  background: #EFE9DC;
  border: 1rpx solid #E8E2D5;
}

.avatar-placeholder {
  width: 176rpx;
  height: 176rpx;
  margin: 0 auto;
  border-radius: 50%;
  background: #FAF6ED;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1rpx dashed #C8C2B4;
  transition: background 0.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.avatar-placeholder:active {
  background: #F2EEE5;
}

.avatar-placeholder .icon {
  font-size: 52rpx;
  display: block;
  margin-bottom: 12rpx;
  opacity: 0.6;
}

.avatar-placeholder .text {
  font-size: 24rpx;
  color: #8A8278;
  font-weight: 500;
}

/* ───── 输入 ───── */
.input {
  background-color: #FAF6ED;
  border: 1rpx solid #E8E2D5;
  border-radius: 10rpx;
  padding: 22rpx 24rpx;
  font-size: 28rpx;
  color: #1F1D2B;
  transition: border-color 0.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.input:focus {
  background-color: #FFFFFF;
  border-color: #1F1D2B;
}

.textarea {
  background-color: #FAF6ED;
  border: 1rpx solid #E8E2D5;
  border-radius: 10rpx;
  padding: 22rpx 24rpx;
  font-size: 28rpx;
  color: #1F1D2B;
  min-height: 140rpx;
  transition: border-color 0.2s cubic-bezier(0.22, 1, 0.36, 1);
  box-sizing: border-box;
  width: 100%;
}

.textarea:focus {
  background-color: #FFFFFF;
  border-color: #1F1D2B;
}

/* ───── 按钮 ───── */
.buttons {
  display: flex;
  gap: 20rpx;
  margin-top: 32rpx;
  padding: 0 24rpx 32rpx;
}

.btn {
  flex: 1;
  height: 88rpx;
  line-height: 88rpx;
  border-radius: 12rpx;
  font-size: 30rpx;
  font-weight: 500;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.btn-cancel {
  background: #FFFFFF;
  color: #1F1D2B;
  border: 1rpx solid #E8E2D5;
}

.btn-cancel:active {
  background: #F2EEE5;
}

.btn-submit {
  background: #1F1D2B;
  color: #FAF6ED;
}

.btn-submit:active {
  opacity: 0.85;
}

.btn-cancel::after,
.btn-submit::after {
  border: none;
}