/* ============================================
   现代化登录页面样式 - 简洁通用设计
   ============================================ */

/* 基础重置 */
.none { display: none; }
a.godl { text-decoration: underline; }
.font12 { font-size: 12px !important; }

/* 主容器 */
.inner {
    width: 100% !important;
    min-height: 100vh !important;
    background: #f5f7fa !important;
    padding: 60px 20px !important;
    box-sizing: border-box !important;
}

/* 主体内容 - 只针对登录页面 */
.inner .body.log-container,
.inner .body:has(.log),
.inner .body .log {
    max-width: 800px !important;
    width: 100% !important;
    margin: 0 auto !important;
    /*display: flex !important;*/
    /*justify-content: center !important;*/
}

/* 注册页面时，body 不受宽度限制 */
.body:has(.registerpart),
.body .registerpart {
    max-width: none !important;
    /*width: 100% !important;*/
    display: block !important;
}

/* 登录卡片 - 只针对登录页面 */
.inner .body .log {
    /* width: 100% !important; */
    background: #ffffff !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
    padding: 50px 40px !important;
    box-sizing: border-box !important;
    position: relative !important;
    overflow: hidden !important;
    width: 800px;
    margin: auto;
}

.inner .body .log::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, #667eea 0%, #764ba2 100%) !important;
}

/* 登录标题 */
.inner .body .log .login-header {
    text-align: center !important;
    margin-bottom: 35px !important;
}

.inner .body .log .login-header h2 {
    font-size: 28px !important;
    font-weight: 700 !important;
    color: #1a202c !important;
    margin: 0 !important;
    font-family: "Microsoft YaHei", sans-serif !important;
}

/* 表单容器 - 只针对登录页面 */
.inner .body .log .formlogin {
    margin: 0 !important;
    width: 100% !important;
    border: none !important;
}

.inner .body .log .form-group {
    margin-bottom: 24px !important;
    display: flex !important;
    flex-direction: column !important;
}

.inner .body .log .form-label {
    display: block !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #2d3748 !important;
    margin-bottom: 10px !important;
    letter-spacing: 0.3px !important;
}

/* 输入框 - 只针对登录页面 */
.inner .body .log .input {
    width: 100% !important;
    box-sizing: border-box !important;
    border: 2px solid #e2e8f0 !important;
    background: #ffffff !important;
    padding: 14px 16px !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    transition: all 0.3s ease !important;
    outline: none !important;
    color: #1a202c !important;
    font-family: "Microsoft YaHei", sans-serif !important;
}

.inner .body .log .input:hover {
    border-color: #cbd5e0 !important;
}

.inner .body .log .input:focus {
    border-color: #667eea !important;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1) !important;
}

.inner .body .log .input::placeholder {
    color: #a0aec0 !important;
}

.inner .body .log .input-large {
    width: 100% !important;
}

.inner .body .log .input-small {
    width: 200px !important;
}

/* 验证码区域 - 只针对登录页面 */
.inner .body .log .captcha-wrapper {
    display: flex !important;
    gap: 12px !important;
    align-items: flex-start !important;
}

.inner .body .log .authcode {
    border: 2px solid #e2e8f0 !important;
    border-radius: 10px !important;
    cursor: pointer !important;
    height: 50px !important;
    transition: all 0.3s ease !important;
    padding: 2px !important;
    background: #ffffff !important;
}

.inner .body .log .authcode:hover {
    border-color: #667eea !important;
    transform: scale(1.02) !important;
}

/* 复选框 - 只针对登录页面 */
.inner .body .log .checkbox-group {
    margin-bottom: 20px !important;
}

.inner .body .log .checkbox-group label {
    display: flex !important;
    align-items: center !important;
    cursor: pointer !important;
    color: #4a5568 !important;
    font-size: 14px !important;
    user-select: none !important;
}

.inner .body .log .checkbox {
    width: 18px !important;
    height: 18px !important;
    margin-right: 10px !important;
    cursor: pointer !important;
    accent-color: #667eea !important;
    border-radius: 4px !important;
}

/* 登录按钮 - 只针对登录页面 */
.inner .body .log .typebtn {
    width: 100% !important;
    height: 50px !important;
    border-radius: 10px !important;
    border: none !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    font-family: "Microsoft YaHei", sans-serif !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 14px rgba(102, 126, 234, 0.3) !important;
    letter-spacing: 0.5px !important;
}

.inner .body .log .typebtn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4) !important;
}

.inner .body .log .typebtn:active {
    transform: translateY(0) !important;
}

/* 主题色按钮 */
.blue .typebtn { background: linear-gradient(135deg, #4299e1 0%, #3182ce 100%) !important; }
.green .typebtn { background: linear-gradient(135deg, #48bb78 0%, #38a169 100%) !important; }
.orange .typebtn { background: linear-gradient(135deg, #ed8936 0%, #dd6b20 100%) !important; }
.red .typebtn { background: linear-gradient(135deg, #f56565 0%, #e53e3e 100%) !important; }

/* 链接区域 - 只针对登录页面 */
.inner .body .log .forreg {
    margin-top: 24px !important;
    padding-top: 20px !important;
    border-top: 1px solid #e2e8f0 !important;
    display: flex !important;
    justify-content: space-between !important;
}

.inner .body .log .forreg a {
    font-size: 14px !important;
    color: #667eea !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    font-weight: 500 !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
}

.inner .body .log .forreg a:hover {
    color: #764ba2 !important;
    background: rgba(102, 126, 234, 0.08) !important;
}

/* 第三方登录 - 只针对登录页面 */
.inner .body .log .qqlogin {
    margin-top: 30px !important;
    padding-top: 30px !important;
    border-top: 1px solid #e2e8f0 !important;
    text-align: center !important;
}

.inner .body .log .qqlogin-title {
    color: #a0aec0 !important;
    font-size: 13px !important;
    margin-bottom: 20px !important;
}

.inner .body .log .qqlogin-buttons {
    display: flex !important;
    justify-content: center !important;
    gap: 15px !important;
    flex-wrap: wrap !important;
}

.inner .body .log .qqlogin img {
    border-radius: 8px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

.inner .body .log .qqlogin img:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12) !important;
}

/* 响应式 - 只针对登录页面 */
@media (max-width: 768px) {
    .inner { padding: 40px 15px !important; }
    .inner .body .log { padding: 40px 30px !important; }
    .inner .body .log .login-header h2 { font-size: 24px !important; }
    .inner .body .log .captcha-wrapper { flex-direction: column !important; }
    .inner .body .log .input-small { width: 100% !important; }
}

/* 保留原有样式（兼容其他页面） */
.partinput { margin-top: 20px; }
.pw_check { width: 150px; background: url(../images/login/pw_check.gif) no-repeat; height: 22px; font-size: 12px; }
.pw_check span { width: 49px; height: 14px; line-height: 16px; margin-bottom: 6px; text-align: center; display: block; float: left; }
#pw_check_1 { background-position: 0 bottom; }
#pw_check_2 { background-position: -150px bottom; }
#pw_check_3 { background-position: -300px bottom; }
#pw_check_4 { background-position: -450px bottom; }
#pw_check_5 { background-position: -600px bottom; }

/* ============================================
   注册页面样式 - 不影响登录页面
   ============================================ */

/* 注册页面容器 */
.inner .body .registerpart {
    /* width: 100% !important; */
    max-width: 1600px !important;
    height: auto !important;
    margin: 0 auto !important;
    text-align: center !important;
    padding: 40px 20px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    min-width: 0 !important;
    width: 800px;
    margin: auto;
}

.form-section {
    margin-bottom: 40px !important;
}

.form-section:last-child {
    margin-bottom: 0 !important;
}

.section-title {
    font-size: 22px !important;
    font-weight: 600 !important;
    color: #2d3748 !important;
    margin-bottom: 30px !important;
    padding-bottom: 15px !important;
    border-bottom: 2px solid #e2e8f0 !important;
    position: relative !important;
}

.section-title::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    bottom: -2px !important;
    width: 80px !important;
    height: 3px !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 2px !important;
}

.form-container {
    display: grid !important;
    grid-template-columns: repeat(1, 1fr) !important;
    gap: 24px 40px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
}

/* 注册页面的 form-group 样式 - 不影响登录页面 */
.regdetail .form-group,
.registerpart .form-group {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 20px !important;
    min-width: 0 !important;
    width: 100% !important;
}

.form-group.full-width {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    min-width: 0 !important;
}

/* 注册页面的 form-label 样式 - 不影响登录页面 */
.regdetail .form-label,
.registerpart .form-label {
    font-size: 15px !important;
    font-weight: 500 !important;
    color: #4a5568 !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    min-width: 120px !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    padding-top: 12px !important;
}

.form-label .required {
    color: #e53e3e !important;
    font-weight: 600 !important;
}

/* 注册页面输入框样式 - 确保不影响验证功能，也不影响登录页面 */
.regdetail .form-group .input,
.registerpart .form-group .input {
    flex: 1 !important;
    padding: 14px 18px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    color: #2d3748 !important;
    background: #ffffff !important;
    transition: all 0.3s ease !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 1 !important;
}

/* 注册页面的输入框样式 - 不影响登录页面 */
.regdetail .form-group .input:focus,
.registerpart .form-group .input:focus {
    outline: none !important;
    border-color: #667eea !important;
    box-shadow: 0 0 0 4px rgba(102, 126, 234, 0.12) !important;
}

.regdetail .form-group .input.input-large,
.registerpart .form-group .input.input-large {
    width: 100% !important;
}

.regdetail .form-group .input.input-small,
.registerpart .form-group .input.input-small {
    min-width: 200px !important;
    flex: 0 0 auto !important;
}

/* 密码强度指示器 */
.pw-check-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex: 1 !important;
    min-width: 0 !important;
}

.pw-check-wrapper .pw_check {
    flex: 1 !important;
    min-width: 0 !important;
}

/* 注册页面的验证码区域 - 不影响登录页面 */
.regdetail .captcha-wrapper,
.registerpart .captcha-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    flex: 1 !important;
    min-width: 0 !important;
    width: 100% !important;
}

.regdetail .captcha-wrapper .input,
.registerpart .captcha-wrapper .input {
    flex: 1 !important;
    min-width: 0 !important;
    max-width: none !important;
    width: auto !important;
}

.regdetail .captcha-wrapper .authcode,
.registerpart .captcha-wrapper .authcode {
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    height: 46px !important;
    padding: 4px !important;
    background: #f7fafc !important;
    transition: all 0.3s ease !important;
    flex-shrink: 0 !important;
    max-width: 120px !important;
}

.regdetail .captcha-wrapper .authcode:hover,
.registerpart .captcha-wrapper .authcode:hover {
    border-color: #667eea !important;
    box-shadow: 0 0 0 4px rgba(102, 126, 234, 0.12) !important;
    transform: scale(1.02) !important;
}

/* 短信验证码区域 */
.sms-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    flex: 1 !important;
    min-width: 0 !important;
    width: 100% !important;
    flex-wrap: wrap !important;
}

.sms-wrapper .input {
    flex: 1 !important;
    min-width: 200px !important;
    max-width: none !important;
    width: auto !important;
}

.sms-btn {
    padding: 14px 24px !important;
    border: 1px solid #667eea !important;
    border-radius: 8px !important;
    background: #667eea !important;
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

.sms-btn:hover {
    background: #5568d3 !important;
    border-color: #5568d3 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3) !important;
}

.sms-btn:active {
    transform: translateY(0) !important;
}

.sms-btn:disabled {
    background: #cbd5e0 !important;
    border-color: #cbd5e0 !important;
    color: #a0aec0 !important;
    cursor: not-allowed !important;
}

/* 注册页面的选择框区域 - 不影响登录页面 */
.regdetail .select-wrapper,
.registerpart .select-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    flex: 1 !important;
    flex-wrap: wrap !important;
    position: relative !important;
    z-index: 1 !important;
}

.regdetail .select-wrapper select,
.registerpart .select-wrapper select,
.regdetail .catid select,
.registerpart .catid select,
.regdetail .form-group select,
.registerpart .form-group select {
    padding: 14px 18px !important;
    padding-right: 40px !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    color: #2d3748 !important;
    background: #ffffff !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%234a5568' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 12px !important;
    transition: all 0.3s ease !important;
    flex: 1 !important;
    min-width: 200px !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    position: relative !important;
    z-index: 10 !important;
    overflow: visible !important;
}

/* 注册页面的选择框样式 - 不影响登录页面 */
.regdetail .select-wrapper select:focus,
.registerpart .select-wrapper select:focus,
.regdetail .catid select:focus,
.registerpart .catid select:focus,
.regdetail .form-group select:focus,
.registerpart .form-group select:focus {
    outline: none !important;
    border-color: #667eea !important;
    box-shadow: 0 0 0 4px rgba(102, 126, 234, 0.12) !important;
    z-index: 100 !important;
}

.regdetail .select-wrapper select option,
.registerpart .select-wrapper select option,
.regdetail .catid select option,
.registerpart .catid select option,
.regdetail .form-group select option,
.registerpart .form-group select option {
    padding: 10px 14px !important;
    background: #ffffff !important;
    color: #2d3748 !important;
    cursor: pointer !important;
}

.regdetail .select-wrapper select option:hover,
.registerpart .select-wrapper select option:hover,
.regdetail .catid select option:hover,
.registerpart .catid select option:hover,
.regdetail .form-group select option:hover,
.registerpart .form-group select option:hover {
    background: #f7fafc !important;
}

/* 确保子级select也能正常显示 - 只影响注册页面 */
.regdetail .select-wrapper select.sub-area,
.registerpart .select-wrapper select.sub-area,
.regdetail .catid select.sub-area,
.registerpart .catid select.sub-area {
    display: inline-block !important;
    margin-left: 10px !important;
}

.regdetail .select-wrapper select.sub-area.active,
.registerpart .select-wrapper select.sub-area.active,
.regdetail .catid select.sub-area.active,
.registerpart .catid select.sub-area.active {
    display: inline-block !important;
}

/* 注册步骤指示器 */
.register-steps {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin-bottom: 50px !important;
    gap: 20px !important;
    flex-wrap: wrap !important;
}

.step-item {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
}

.step-number {
    width: 40px !important;
    height: 40px !important;
    border-radius: 50% !important;
    background: #e2e8f0 !important;
    color: #a0aec0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

.step-item.active .step-number {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3) !important;
}

.step-content {
    margin-left: 12px !important;
}

.step-title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #2d3748 !important;
    margin-bottom: 4px !important;
}

.step-item.active .step-title {
    color: #667eea !important;
}

.step-connector {
    width: 60px !important;
    height: 2px !important;
    background: #e2e8f0 !important;
    margin: 0 10px !important;
}

.step-item.active ~ .step-item .step-connector {
    background: #e2e8f0 !important;
}

/* 注册类型选择卡片 */
.register-cards {
    display: flex !important;
    justify-content: center !important;
    gap: 30px !important;
    margin-bottom: 50px !important;
    flex-wrap: wrap !important;
}

.register-card {
    width: 300px !important;
    padding: 40px 30px !important;
    background: #ffffff !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 16px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    text-align: center !important;
    position: relative !important;
    overflow: hidden !important;
}

.register-card:hover {
    border-color: #667eea !important;
    box-shadow: 0 8px 24px rgba(102, 126, 234, 0.15) !important;
    transform: translateY(-4px) !important;
}

.register-card.active {
    border-color: #667eea !important;
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.05) 0%, rgba(118, 75, 162, 0.05) 100%) !important;
    box-shadow: 0 8px 24px rgba(102, 126, 234, 0.2) !important;
}

.card-icon {
    width: 80px !important;
    height: 80px !important;
    margin: 0 auto 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    border-radius: 16px !important;
    transition: all 0.3s ease !important;
}

.register-card:hover .card-icon {
    transform: scale(1.1) !important;
}

.card-content h3 {
    font-size: 20px !important;
    font-weight: 600 !important;
    color: #2d3748 !important;
    margin-bottom: 12px !important;
}

.card-content p {
    font-size: 14px !important;
    color: #718096 !important;
    line-height: 1.6 !important;
    margin-bottom: 20px !important;
}

.card-arrow {
    position: absolute !important;
    bottom: 20px !important;
    right: 20px !important;
    width: 32px !important;
    height: 32px !important;
    background: #667eea !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    font-size: 18px !important;
    transition: all 0.3s ease !important;
}

.register-card:hover .card-arrow {
    transform: translate(4px, -4px) !important;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4) !important;
}

/* 协议区域 */
.agreement-group {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    margin-bottom: 30px !important;
    padding: 20px !important;
    background: #f7fafc !important;
    border-radius: 8px !important;
}

.agreement-label {
    display: flex !important;
    align-items: flex-start !important;
    cursor: pointer !important;
    font-size: 14px !important;
    color: #4a5568 !important;
    line-height: 1.6 !important;
    flex: 1 !important;
}

.agreement-radio {
    width: 18px !important;
    height: 18px !important;
    margin-right: 10px !important;
    margin-top: 2px !important;
    cursor: pointer !important;
    accent-color: #667eea !important;
    flex-shrink: 0 !important;
}

.agreement-label a {
    color: #667eea !important;
    text-decoration: underline !important;
}

.agreement-label a:hover {
    color: #764ba2 !important;
}

/* 提交按钮组 */
.submit-group {
    display: flex !important;
    justify-content: center !important;
    gap: 20px !important;
    margin-top: 40px !important;
    padding-top: 30px !important;
    border-top: 1px solid #e2e8f0 !important;
}

.submit-group .typebtn {
    min-width: 200px !important;
    height: 50px !important;
    border-radius: 10px !important;
    border: none !important;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%) !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    font-family: "Microsoft YaHei", sans-serif !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 14px rgba(102, 126, 234, 0.3) !important;
    letter-spacing: 0.5px !important;
}

.submit-group .typebtn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4) !important;
}

.submit-group .typebtn:active {
    transform: translateY(0) !important;
}

.go_reg {
    display: inline-block !important;
    padding: 14px 28px !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #4a5568 !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

.go_reg:hover {
    border-color: #667eea !important;
    color: #667eea !important;
    background: rgba(102, 126, 234, 0.05) !important;
}

.qfont {
    font-size: 14px !important;
    color: #718096 !important;
}

.step-link {
    color: #667eea !important;
    text-decoration: none !important;
    font-weight: 500 !important;
}

.step-link:hover {
    color: #764ba2 !important;
    text-decoration: underline !important;
}