/* Register person page - rich modern UI (no backend field changes) */

.register-person{
	padding:10px 0 28px;
}

/* Hero */
.register-person-hero{
	display:flex;
	align-items:center;
	gap:14px;
	padding:4px 8px 18px;
	margin-bottom:12px;
	border-bottom:1px solid rgba(255,255,255,0.22);
}
.register-person-hero__icon{
	width:56px;
	height:56px;
	border-radius:18px;
	display:flex;
	align-items:center;
	justify-content:center;
	background:linear-gradient(135deg,#53b4db 0%,#1c5fb5 100%);
	color:#fff;
	box-shadow:0 18px 55px rgba(83,180,219,0.35);
}
.register-person-hero__icon i{font-size:20px}
.register-person-hero__title{
	font-size:22px;
	font-weight:1000;
	letter-spacing:-0.02em;
	color:#0f172a;
}
.register-person-hero__subtitle{
	margin-top:4px;
	font-size:13px;
	font-weight:900;
	color:rgba(15,23,42,0.65);
}

/* Steps (existing .step2 spans) */
.register-person .step2{
	display:flex;
	justify-content:center;
	gap:10px;
	margin:6px 0 18px;
	flex-wrap:wrap;
}
.register-person .step2 span{
	flex:1;
	min-width:200px;
	max-width:260px;
	padding:12px 14px;
	border-radius:999px;
	text-align:center;
	background:rgba(255,255,255,0.08);
	border:1px solid rgba(255,255,255,0.18);
	color:rgba(15,23,42,0.72);
	font-weight:1000;
	font-size:13px;
	line-height:1;
}
.register-person .step2 span.cur{
	background:linear-gradient(135deg, #53b4db 0%, #1c5fb5 100%);
	border-color:rgba(83,180,219,0.45);
	color:#fff;
	box-shadow:0 18px 50px rgba(83,180,219,0.25);
}
.register-person .step2 span a{
	color:inherit !important;
	text-decoration:underline !important;
	font-weight:1000 !important;
}

/* Main card layout */
.register-person .regdetail{
	display:grid;
	grid-template-columns: minmax(420px, 1fr) minmax(340px, 1fr);
	gap:16px;
	align-items:start;
	padding:18px;
	border-radius:20px;
	background:rgba(255,255,255,0.06);
	border:1px solid rgba(255,255,255,0.20);
	box-shadow:0 20px 60px rgba(15,82,187,0.08);
}
.register-person .partname{
	grid-column:1 / -1;
	margin-bottom:6px;
}
.register-person .partname .current{
	display:inline-flex;
	align-items:center;
	padding:10px 14px;
	border-radius:999px;
	background:rgba(255,255,255,0.10);
	border:1px solid rgba(255,255,255,0.18);
	color:rgba(15,23,42,0.78);
	font-weight:1000;
	text-decoration:none;
}

/* Form and protocol positioning */
.register-person #registerform{
	grid-column:1;
	min-width:0;
}
.register-person .xiyi{
	grid-column:2;
	min-width:0;
}

/* Convert old table rows to stacked fields */
.register-person table.formlogin{
	width:100%;
	border-collapse:separate;
	border-spacing:0;
}
.register-person table.formlogin tr{
	display:block;
	margin-bottom:14px;
}
.register-person table.formlogin td{
	display:block;
	padding:0;
}
.register-person table.formlogin td.tdright{
	padding:0 0 8px;
	text-align:left;
	font-weight:1100;
	color:rgba(15,23,42,0.82);
	font-size:14px;
	line-height:1.2;
}

/* Inputs: base */
.register-person .formlogin input.input,
.register-person .formlogin input.input-large,
.register-person .formlogin input.input-small{
	float:none !important;
	display:block !important;
	width:100% !important;
	margin:0 !important;
	height:48px !important;
	border-radius:16px !important;
	border:1px solid rgba(15,23,42,0.12) !important;
	background:rgba(255,255,255,0.95) !important;
	box-shadow:0 12px 40px rgba(15,82,187,0.06) !important;
	transition:border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
	padding:0 16px !important;
}
.register-person .formlogin input.input:focus{
	border-color:rgba(83,180,219,0.95) !important;
	box-shadow:0 0 0 4px rgba(83,180,219,0.14), 0 18px 55px rgba(15,82,187,0.10) !important;
	outline:none !important;
}
.register-person .formlogin input.input::placeholder{
	color:rgba(148,163,184,1) !important;
	font-weight:900 !important;
}

/* Input icons (SVG data URIs, no HTML changes needed) */
.register-person .formlogin input[name="mobile"],
.register-person .formlogin input[name="userid"],
.register-person .formlogin input[name="email"]{
	background-repeat:no-repeat !important;
	background-position:18px center !important;
	background-size:18px 18px !important;
	padding-left:56px !important;
}
.register-person .formlogin input[name="mobile"],
.register-person .formlogin input[name="userid"]{
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='none' stroke='%2353b4db' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M20 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2'/><circle cx='12' cy='7' r='4'/></svg>") !important;
}
.register-person .formlogin input[name="email"]{
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='none' stroke='%2353b4db' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='2' y='4' width='18' height='14' rx='2'/><path d='M2 6l10 7 10-7'/></svg>") !important;
}

.register-person .formlogin input[name="userpwd"],
.register-person .formlogin input[name="reuserpwd"]{
	background-repeat:no-repeat !important;
	background-position:18px center !important;
	background-size:18px 18px !important;
	padding-left:56px !important;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='none' stroke='%2353b4db' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='11' width='18' height='8' rx='2'/><path d='M7 11V7a5 5 0 0 1 10 0v4'/></svg>") !important;
}

.register-person .formlogin input[name="checkcode"]{
	background-repeat:no-repeat !important;
	background-position:18px center !important;
	background-size:18px 18px !important;
	padding-left:56px !important;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='none' stroke='%2353b4db' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M12 2l8 4v6c0 5-3.5 9-8 10C7.5 21 4 17 4 12V6l8-4z'/></svg>") !important;
}

.register-person .formlogin input[name="smscheckcode"]{
	background-repeat:no-repeat !important;
	background-position:18px center !important;
	background-size:18px 18px !important;
	padding-left:56px !important;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='none' stroke='%2353b4db' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M21 15a4 4 0 0 1-4 4H7l-4 4V7a4 4 0 0 1 4-4h10a4 4 0 0 1 4 4z'/></svg>") !important;
}

/* Captcha image */
.register-person img.authcode{
	float:none !important;
	width:auto !important;
	max-width:100% !important;
	display:block !important;
	height:50px !important;
	margin:0 !important;
	padding:6px 10px !important;
	border-radius:16px !important;
	border:1px solid rgba(15,23,42,0.12) !important;
	background:rgba(255,255,255,0.95) !important;
	cursor:pointer;
}

/* Captcha inline row helper span */
.register-person #code{
	display:inline-block;
	margin-top:8px;
	font-size:12px;
	color:#e11d48;
	font-weight:1000;
}

/* Password strength (pw_check) */
.register-person .pw_check{
	width:100%;
	background:rgba(255,255,255,0.08) !important;
	border:1px solid rgba(255,255,255,0.18) !important;
	border-radius:16px !important;
	padding:10px 12px !important;
	display:flex !important;
	gap:10px !important;
	margin:0 !important;
}
.register-person .pw_check span{
	float:none !important;
	width:auto !important;
	height:auto !important;
	line-height:1.2 !important;
	display:inline-flex !important;
	align-items:center;
	justify-content:center;
	padding:6px 12px;
	border-radius:999px;
	background:rgba(15,23,42,0.06) !important;
	color:rgba(15,23,42,0.65) !important;
	font-size:12px !important;
	font-weight:1000 !important;
}
.register-person .pw_check strong.c_orange{
	color:#f97316 !important;
}

/* SMS send button */
.register-person .disabled{
	float:none !important;
	width:100% !important;
	height:48px !important;
	border-radius:16px !important;
	background:rgba(15,23,42,0.06) !important;
	border:1px solid rgba(15,23,42,0.10) !important;
	color:rgba(15,23,42,0.55) !important;
	margin-top:10px;
	font-weight:1000;
}

/* Agreement row */
.register-person input[type="radio"]{
	width:18px !important;
	height:18px !important;
	accent-color:#53b4db;
}
.register-person a#protocolInfo{
	font-weight:1000 !important;
	text-decoration:underline !important;
	color:#0d4299 !important;
}

/* Submit button */
.register-person .go_reg{
	width:100% !important;
	height:54px !important;
	border-radius:16px !important;
	border:none !important;
	font-size:18px !important;
	font-weight:1000 !important;
	background:linear-gradient(135deg,#53b4db 0%,#1c5fb5 100%) !important;
	box-shadow:0 18px 55px rgba(83,180,219,0.35) !important;
	transition:transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease !important;
}
.register-person .go_reg:hover{
	transform:translateY(-2px) !important;
	box-shadow:0 24px 80px rgba(15,82,187,0.25) !important;
	filter:saturate(1.05);
}

/* Protocol panel */
.register-person .xiyi{
	background:rgba(255,255,255,0.06);
	border:1px solid rgba(255,255,255,0.18);
	border-radius:20px;
	padding:14px;
	width:auto !important;
	max-width:none !important;
	margin:0 !important;
	float:none !important;
}
.register-person #xieyi{
	width:100% !important;
	height:920px !important;
	overflow:auto !important;
	background:transparent;
	border-radius:16px;
	padding:10px;
	border:1px solid rgba(255,255,255,0.12);
}
.register-person #xieyi p{
	color:rgba(15,23,42,0.70) !important;
	line-height:1.9;
	font-weight:800;
}

/* Responsive */
@media (max-width: 1000px){
	.register-person .regdetail{
		grid-template-columns:1fr;
	}
	.register-person #registerform{
		grid-column:1;
	}
	.register-person .xiyi{
		grid-column:1;
	}
}

