.member_menu {
background-color:#083d81;
width:100%;
margin:0;
padding:0;
}
.login-wrap {
width:100%;
display:flex;
justify-content:center;
align-items:center;
background-image: url("/img/bg/about2.jpg"); /*/img/member/autharea.jpg*/
background-size: cover;
background-position: center;
}
.signup-card {
background: #ffffff;
border-radius: 16px;
box-shadow: 0 10px 25px rgba(0,0,0,0.06);
width: 100%;
max-width: 780px;
padding: 36px;
margin:50px auto;
}
.card-header {
text-align: center;
margin-bottom: 28px;
}
.card-header h1 {
font-size: 32px;
color: #083d81;
font-weight: 600;
margin-bottom: 8px;
}
.card-header p {
color: #718096;
font-size: 15px;
}
.divider-wrap {
text-align:center;
position:relative;
margin:24px 0;
color:#a0aec0;
font-size:14px;
}
.divider-wrap:before, .divider-wrap:after{
content:"";
position:absolute;
top:50%;
width:calc(50% - 65px);
height:1px;
background:#e2e8f0;
}
.divider-wrap:before { left:0; }
.divider-wrap:after { right:0; }
.form-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap:18px;
margin-bottom:20px;
}
.form-item {
display:flex;
flex-direction:column;
gap:6px;
}
.form-item label {
font-size:14px;
color:#2d3748;
font-weight:500;
}
/* ===== 输入框图标样式 ===== */
.input-icon {
position: relative;
display: flex;
align-items: center;
}
.input-icon .icon {
position: absolute;
left: 14px;
top: 50%;
transform: translateY(-50%);
color: #a0aec0;
pointer-events: none;
z-index: 1;
}
.iti__country-list {
z-index: 9999 !important;
}
.iti__dropdown-container {
z-index: 9999 !important;
}
.input-icon input,
.input-icon select {
width: 100%;
padding:12px 14px 12px 44px;
border:1px solid #e2e8f0;
border-radius:8px;
font-size:15px;
color:#999;
outline:none;
transition: border 0.2s, box-shadow 0.2s;
background-color: #fff;
/* 输入框默认阴影 */
box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.input-icon input:focus,
.input-icon select:focus {
border-color:#3182ce;
/* focus发光阴影 */
box-shadow: 0 0 0 3px rgba(49,130,206,0.15), 0 2px 8px rgba(0,0,0,0.08);
}
input.iti__search-input {
width: 90% !important;
background: #ffffff !important;
border: 2px solid #3182ce !important;
border-radius: 10px !important;
padding: 8px 16px 8px 10px !important;
font-size: 15px !important;
color: #1a2b48 !important;
outline: none !important;
box-shadow: 0 1px 3px rgba(0,0,0,0.05) !important;
margin: 10px;
}
/* ===== 国籍下拉样式 ===== */
.country-dropdown {
position: absolute;
top: calc(100% + 4px);
left: 0;
width: 100%;
background: #fff;
border: 1px solid #e2e8f0;
border-radius: 8px;
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
z-index: 99;
display: none;
}
.country-search {
width: calc(100% - 24px)  !important;
margin:12px;
padding:8px 10px;
border:1px solid #e2e8f0;
border-radius:6px;
font-size:14px;
box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.country-list {
max-height: 240px;
overflow-y: auto;
}
.country-item {
padding:10px 16px;
cursor:pointer;
font-size:14px;
}
.country-item:hover {
background-color:#edf2f7;
}
.country-item.active {
background-color:#ebf8ff;
}
.country-dropdown.show {
display:block;
}
.full-width {
grid-column: span 2;
}
/* intl-tel-input 覆盖样式，和页面圆角统一 */
.iti {
width:100%;
}
.iti__tel-input {
padding:12px 14px !important;
border:1px solid #e2e8f0 !important;
border-radius:8px !important;
font-size:15px;
box-shadow:0 1px 3px rgba(0,0,0,0.05) !important;
transition: border 0.2s, box-shadow 0.2s !important;
}
.iti__tel-input:focus {
border-color:#3182ce !important;
box-shadow: 0 0 0 3px rgba(49,130,206,0.15),0 2px 8px rgba(0,0,0,0.08) !important;
}
.iti__country-list {
border-radius:8px;
}
.submit-btn {
width:100%;
background-color:#3182ce;
color:white;
border:none;
border-radius:8px;
padding:14px;
font-size:16px;
font-weight:500;
cursor:pointer;
transition: background 0.2s, box-shadow 0.2s;
/* 按钮默认阴影 */
box-shadow: 0 4px 10px rgba(49,130,206,0.25);
}
.submit-btn:hover {
background-color:#2b6cb0;
/* hover悬浮加深阴影 */
box-shadow: 0 6px 16px rgba(49,130,206,0.35);
}
/* 点击按下效果 */
.submit-btn:active {
box-shadow: 0 2px 4px rgba(49,130,206,0.2);
}
.footer-link {
text-align:center;
margin-top:24px;
font-size:14px;
color:#4a5568;
}
.footer-link a {
color:#3182ce;
text-decoration:none;
font-weight:500;
}
@media (max-width:768px) {

.form-grid {
grid-template-columns: 1fr;
}
.full-width {
grid-column: span 1;
}
.signup-card {
padding:24px;
width:94%;
margin:15px auto;
}
.card-header h1 {
font-size:26px;
}
}