f

src/assets/styles/auth.css

@@ -2,33 +2,36 @@
 
 /* 输入框样式优化 */
 .auth-input :deep(.el-input__wrapper) {
-  border-radius: 8px !important;
+  border-radius: 10px !important;
   transition: all 0.3s ease !important;
-  border: 1px solid #d1d5db !important;
+  border: 1px solid #d5deef !important;
+  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
+  min-height: 44px !important;
 }
 
 .auth-input :deep(.el-input__wrapper:hover) {
-  border-color: #3b82f6 !important;
+  border-color: #7aa9f8 !important;
 }
 
 .auth-input :deep(.el-input__wrapper.is-focus) {
-  border-color: #3b82f6 !important;
-  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.1) !important;
+  border-color: #2563eb !important;
+  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.13) !important;
 }
 
 /* 按钮样式优化 */
 .auth-button :deep(.el-button--primary) {
-  border-radius: 8px !important;
-  font-weight: 500 !important;
+  border-radius: 10px !important;
+  font-weight: 600 !important;
   transition: all 0.3s ease !important;
-  background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%) !important;
+  background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 55%, #1e40af 100%) !important;
   border: none !important;
+  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.25) !important;
 }
 
 .auth-button :deep(.el-button--primary:hover) {
   transform: translateY(-1px) !important;
-  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3) !important;
-  background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%) !important;
+  box-shadow: 0 12px 24px rgba(37, 99, 235, 0.32) !important;
+  background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%) !important;
 }
 
 .auth-button :deep(.el-button--primary:active) {
@@ -36,19 +39,61 @@
 }
 
 /* Radio button 样式优化 */
+.auth-method-tabs {
+  border-radius: 12px;
+  padding: 4px;
+  background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
+  border: 1px solid #e2e8f0;
+  display: flex !important;
+  width: 100%;
+}
+
+.auth-method-tab {
+  flex: 1;
+}
+
+.auth-method-tabs :deep(.el-radio-button) {
+  flex: 1;
+  display: block;
+}
+
+.auth-method-tabs :deep(.el-radio-button__inner) {
+  width: 100%;
+  border-left: none !important;
+}
+
+.auth-method-tabs :deep(.el-radio-button:first-child .el-radio-button__inner) {
+  border-radius: 10px !important;
+}
+
+.auth-method-tabs :deep(.el-radio-button:last-child .el-radio-button__inner) {
+  border-radius: 10px !important;
+}
+
+.auth-method-tabs :deep(.el-radio-button.is-active .el-radio-button__inner) {
+  border-color: transparent !important;
+}
+
 .auth-radio :deep(.el-radio-button__inner) {
+  width: 100% !important;
   border: none !important;
+  border-radius: 10px !important;
   background: transparent !important;
-  color: #6b7280 !important;
-  font-weight: 500 !important;
+  color: #475569 !important;
+  font-weight: 600 !important;
   transition: all 0.3s ease !important;
-  padding: 12px 16px !important;
+  padding: 10px 14px !important;
+  box-shadow: none !important;
 }
 
 .auth-radio :deep(.el-radio-button__original-radio:checked + .el-radio-button__inner) {
-  background: white !important;
-  color: #3b82f6 !important;
-  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !important;
+  background: #ffffff !important;
+  color: #0f172a !important;
+  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12) !important;
+}
+
+.auth-radio :deep(.el-radio-button__inner:hover) {
+  color: #0f172a !important;
 }
 
 /* 表单标签样式 */
@@ -58,21 +103,21 @@
 
 /* 链接样式 */
 .auth-link {
-  @apply text-gray-600 hover:text-sky-600 transition-colors mx-2;
+  @apply text-slate-500 hover:text-blue-700 transition-colors mx-2;
 }
 
 /* 卡片样式 */
 .auth-card {
-  @apply bg-white/95 backdrop-blur-sm shadow-2xl rounded-2xl border border-white/20;
+  @apply bg-white/96 shadow-2xl rounded-2xl border border-white/40;
 }
 
 /* 标题样式 */
 .auth-title {
-  @apply text-2xl font-bold text-gray-900 mb-2;
+  @apply text-2xl font-bold text-slate-900 mb-2;
 }
 
 .auth-subtitle {
-  @apply text-gray-600 text-sm;
+  @apply text-slate-500 text-sm;
 }
 
 /* 响应式优化 */