/* 基础样式 */
* { box-sizing: border-box; margin: 0; padding: 0; }

body { font-family: 'Helvetica Neue', Arial, sans-serif; background-color: #f9fafb; color: #1f2937; min-height: 100vh; display: flex; flex-direction: column; }

/* 动画效果 */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.7; }
}

.animate-fadeIn { animation: fadeIn 0.5s ease-out forwards; }

.animate-pulse-slow { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }

/* 登录页面样式 */
.login-container { flex-grow: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 20px; position: relative; }

/* 背景装饰 */
.bg-decoration { position: absolute; width: 100%; height: 300px; top: 0; left: 0; background: linear-gradient(135deg, #3B82F6 0%, #1E40AF 100%); z-index: 0; clip-path: polygon(0 0, 100% 0, 100% 40%, 0 80%); }

.login-card { background-color: white; border-radius: 16px; box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.05); padding: 30px; width: 100%; max-width: 400px; margin: 20px auto; z-index: 1; animation: fadeIn 0.5s ease-out; }

.logo { text-align: center; margin-bottom: 30px; }

.logo img { width: 80px; height: 80px; border-radius: 50%; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); }

.form-group { margin-bottom: 20px; }

.form-label { display: block; font-size: 14px; font-weight: 500; margin-bottom: 8px; color: #4b5563; }

.input-group { position: relative; }

.form-input { width: 100%; padding: 12px 12px 12px 40px; border: 1px solid #e5e7eb; border-radius: 8px; font-size: 14px; transition: border-color 0.2s, box-shadow 0.2s; }

.form-input:focus { outline: none; border-color: #3B82F6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.3); }

.input-icon { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: #9ca3af; }

.password-toggle { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); color: #9ca3af; cursor: pointer; }

.btn { display: block; width: 100%; padding: 12px; border: none; border-radius: 8px; font-size: 16px; font-weight: 500; cursor: pointer; transition: all 0.2s; }

.btn-primary { background-color: #3B82F6; color: white; box-shadow: 0 4px 12px rgba(59, 130, 246, 0.25); }

.btn-primary:hover { background-color: #2563EB; transform: translateY(-1px); }

.btn-primary:active { transform: translateY(1px); }

.form-error { color: #EF4444; font-size: 13px; margin-top: 6px; display: none; }

/* 页脚 */
.footer { text-align: center; padding: 20px; color: #6b7280; font-size: 12px; }