/* 商家入驻步骤页 — 独立样式，#06387A 主色（仅 .shop-join-step-page） */

.shop-join-step-page{
	--sj-primary:#06387A;
	--sj-primary-mid:#0856a8;
	--sj-primary-light:#0d6ebe;
	--sj-primary-soft:rgba(6,56,122,.12);
	--sj-primary-glow:rgba(45,143,217,.35);
	--sj-ink:#0f172a;
	--sj-muted:#64748b;
	--sj-line:#e2e8f0;
	--sj-surface:#eef3fa;
	--sj-card:#fff;
	font-family:"Microsoft YaHei","PingFang SC",system-ui,-apple-system,sans-serif;
	color:var(--sj-ink);
	background:
		linear-gradient(165deg,#dfe8f4 0%,#eef3fa 22%,#f8fafc 55%,#f1f5f9 100%);
	padding-bottom:56px;
	min-height:48vh;
	position:relative;
}
.shop-join-step-page::before{
	content:"";
	display:block;
	height:5px;
	background:linear-gradient(90deg,#031e3d,var(--sj-primary),#2d8fd9,var(--sj-primary),#042a52);
}
.shop-join-step-page .shop-join-step-inner{
	max-width:1200px;
	padding-top:20px;
	padding-left:12px;
	padding-right:12px;
}

/* ========== 步骤条 ========== */
.shop-join-step-page .shop-join-step-flow.flow-container{
	width:100%;
	max-width:100%;
	display:block;
	margin:0;
	padding:0;
}
.shop-join-step-page .shop-join-stepflex.stepflex{
	float:none;
	width:97%;
	margin:8px 0 20px;
	border:none;
	display:flex;
	flex-wrap:nowrap;
	justify-content:space-between;
	align-items:flex-start;
	gap:6px;
	background:var(--sj-card);
	border-radius:20px;
	padding:26px 16px 22px;
	box-shadow:
		0 4px 6px rgba(6,56,122,.04),
		0 18px 48px rgba(6,56,122,.1),
		inset 0 1px 0 rgba(255,255,255,.95);
	border:1px solid rgba(6,56,122,.1);
	position:relative;
	overflow:hidden;
}
.shop-join-step-page .shop-join-stepflex::before{
	content:"";
	position:absolute;
	inset:auto -20% 0 -20%;
	height:120px;
	background:radial-gradient(ellipse 70% 80% at 50% 100%,var(--sj-primary-glow),transparent 72%);
	opacity:.45;
	pointer-events:none;
}
.shop-join-step-page .shop-join-stepflex dl{
	float:none;
	flex:1 1 0;
	min-width:0;
	width:auto;
	border:none;
	top:0;
	position:relative;
	padding:0 2px;
	text-align:center;
	margin:0;
}
.shop-join-step-page .shop-join-stepflex dl:not(:last-child)::after{
	content:"";
	position:absolute;
	top:21px;
	left:calc(50% + 22px);
	width:calc(50% - 22px + 4px);
	height:4px;
	background:var(--sj-line);
	border-radius:4px;
	z-index:0;
}
.shop-join-step-page .shop-join-stepflex dl.doing:has(+ dl.doing)::after{
	background:linear-gradient(90deg,#2d8fd9,var(--sj-primary));
	box-shadow:0 0 12px rgba(45,143,217,.35);
}
.shop-join-step-page .doing .s-num{
	background-position:0 0;
}
.shop-join-step-page .s-num,
.shop-join-step-page .s-num1{
	width:44px;
	height:44px;
	line-height:44px;
	margin:-6px auto 10px;
	border-radius:12px;
	font-size:16px;
	font-weight:800;
	position:relative;
	z-index:1;
	box-shadow:0 4px 14px rgba(15,23,42,.08);
	border:2px solid transparent;
	transition:transform .2s,box-shadow .2s;
}
.shop-join-step-page .s-num{
	background:linear-gradient(145deg,var(--sj-primary-mid),var(--sj-primary));
	color:#fff;
	border-color:rgba(255,255,255,.25);
	box-shadow:0 6px 20px rgba(6,56,122,.35);
}
.shop-join-step-page .s-num1{
	background:linear-gradient(180deg,#f1f5f9,#e2e8f0);
	color:var(--sj-muted);
	border-color:#cbd5e1;
	box-shadow:none;
}
.shop-join-step-page .s-text{
	line-height:1.35;
	color:var(--sj-primary);
	font-weight:700;
	font-size:13px;
	margin:0;
}
.shop-join-step-page .s-text1{
	line-height:1.35;
	color:var(--sj-muted);
	font-size:12px;
	font-weight:500;
	margin:0;
}
.shop-join-step-page dl.doing .s-text1{
	color:var(--sj-primary);
	font-weight:600;
}
.shop-join-step-page .shop-join-stepflex dl dd:empty{
	display:none;
}

/* ========== 当前步骤标题 ========== */
.shop-join-step-page .main-head{
	float:none;
	font-size:clamp(18px,2.2vw,22px);
	font-weight:800;
	letter-spacing:-.02em;
	color:var(--sj-ink);
	margin:0 0 16px;
	padding:16px 20px 16px 24px;
	background:var(--sj-card);
	border-radius:14px;
	border:1px solid var(--sj-primary-soft);
	box-shadow:0 8px 28px rgba(6,56,122,.06);
	position:relative;
	overflow:hidden;
}
.shop-join-step-page .main-head::before{
	content:"";
	position:absolute;
	left:0;
	top:0;
	bottom:0;
	width:5px;
	background:linear-gradient(180deg,#2d8fd9,var(--sj-primary));
	border-radius:14px 0 0 14px;
}

/* ========== 内容区卡片 ========== */
.shop-join-step-page .apply-box,
.shop-join-step-page .apply-box2{
	position:relative;
	border:none;
	border-radius:16px;
	background:var(--sj-card);
	border:1px solid rgba(6,56,122,.1);
	box-shadow:0 10px 36px rgba(6,56,122,.07);
	padding:12px 16px 18px;
	margin-bottom:12px;
	overflow:hidden;
}
/* 审核中火箭绕轨，不能用 overflow:hidden 裁切动画 */
.shop-join-step-page .apply-box:has(.sj-examine-pending),
.shop-join-step-page .apply-box:has(.sj-examine-pending) .examine-tips{
	overflow:visible;
}
.shop-join-step-page .apply-box::before,
.shop-join-step-page .apply-box2::before{
	content:"";
	position:absolute;
	top:0;
	left:0;
	right:0;
	height:3px;
	background:linear-gradient(90deg,var(--sj-primary),#2d8fd9,#06387A);
	border-radius:16px 16px 0 0;
}
.shop-join-step-page .apply-agreement-box{
	height:min(420px,55vh);
	border-radius:14px;
	border:1px solid var(--sj-line);
	background:linear-gradient(180deg,#fafbfd,#fff);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
	padding:16px 18px;
	margin:0 0 12px;
}
.shop-join-step-page .agreement_box{
	margin-top:12px;
	padding:14px;
	background:rgba(6,56,122,.04);
	border-radius:12px;
	border:1px dashed rgba(6,56,122,.2);
}
.shop-join-step-page .agreement_box label{
	font-size:14px;
	color:var(--sj-ink);
	cursor:pointer;
}
.shop-join-step-page .agreement-table th{
	color:var(--sj-muted);
	font-weight:600;
}
.shop-join-step-page .agreement-table .head-ititle{
	color:var(--sj-primary);
	background:none;
	padding-left:14px;
	border-left:3px solid var(--sj-primary);
}
.shop-join-step-page .agreement-table input[type=text],
.shop-join-step-page .agreement-table textarea,
.shop-join-step-page .agreement-table select,
.shop-join-step-page .a-ipt{
	border-radius:8px;
	border:1px solid #cbd5e1;
	transition:border-color .15s,box-shadow .15s;
}
.shop-join-step-page .agreement-table input[type=text]:focus,
.shop-join-step-page .agreement-table textarea:focus,
.shop-join-step-page .agreement-table select:focus,
.shop-join-step-page .a-ipt:focus{
	outline:none;
	border-color:var(--sj-primary-light);
	box-shadow:0 0 0 3px var(--sj-primary-soft);
}
.shop-join-step-page .c-tip{
	color:var(--sj-muted);
	font-size:12px;
}

/* ========== 审核提示 ========== */
.shop-join-step-page .examine-tips{
	padding:48px 24px;
	color:var(--sj-muted);
	font-size:15px;
	background:var(--sj-card);
	border-radius:16px;
	border:1px solid var(--sj-line);
	box-shadow:0 8px 30px rgba(6,56,122,.05);
}
.shop-join-step-page .examine-tips:has(.sj-examine-pending){
	padding:20px 16px 24px;
	background:transparent;
	border:none;
	box-shadow:none;
}

/* 审核中：深色轨道区 + 双环 SVG 自转 + 火箭在最上层绕轨 */
.shop-join-step-page .sj-examine-pending{
	display:grid;
	grid-template-columns:minmax(280px,340px) minmax(0,1fr);
	align-items:stretch;
	max-width:920px;
	margin:0 auto;
	border-radius:20px;
	overflow:visible;
	border:1px solid rgba(6,56,122,.18);
	box-shadow:0 16px 48px rgba(6,56,122,.12);
	background:var(--sj-card);
}
.shop-join-step-page .sj-orbit-panel{
	background:
		radial-gradient(ellipse 85% 70% at 50% 45%,#0a2544 0%,#031525 52%,#010910 100%);
	padding:28px 20px 22px;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	gap:16px;
	border-right:1px solid rgba(255,255,255,.08);
	overflow:visible;
}
.shop-join-step-page .sj-orbit-stage{
	position:relative;
	width:min(260px,88vw);
	height:min(260px,88vw);
	max-width:260px;
	max-height:260px;
	flex-shrink:0;
	isolation:isolate;
	overflow:visible;
	/* 轨道半径与 viewBox 中 r≈102 外环对齐（火箭中心走 95/260 边长比例） */
	--sj-orbit-r:calc(min(260px,88vw) * 95 / 260);
	--sj-rocket-h:54px;
	--sj-rocket-w:44px;
}
.shop-join-step-page .sj-orbit-vignette{
	position:absolute;
	inset:0;
	border-radius:50%;
	background:radial-gradient(circle at 50% 50%,transparent 42%,rgba(0,0,0,.35) 100%);
	pointer-events:none;
	z-index:1;
}
.shop-join-step-page .sj-orbit-stars{
	position:absolute;
	inset:0;
	border-radius:50%;
	z-index:2;
	background:
		radial-gradient(1.6px 1.6px at 18% 32%,rgba(255,255,255,.95),transparent),
		radial-gradient(1.2px 1.2px at 82% 24%,rgba(255,255,255,.8),transparent),
		radial-gradient(1.4px 1.4px at 72% 76%,rgba(255,255,255,.9),transparent),
		radial-gradient(1px 1px at 38% 70%,rgba(255,255,255,.65),transparent),
		radial-gradient(1.8px 1.8px at 52% 14%,rgba(255,255,255,.75),transparent),
		radial-gradient(1px 1px at 88% 55%,rgba(255,255,255,.55),transparent),
		radial-gradient(1.3px 1.3px at 12% 58%,rgba(255,255,255,.5),transparent);
	animation:sjStarsDrift 18s linear infinite;
	pointer-events:none;
}
.shop-join-step-page .sj-orbit-ring-svg{
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	pointer-events:none;
	z-index:3;
}
.shop-join-step-page .sj-orbit-ring-svg--a{
	animation:sjRingSpinA 14s linear infinite;
	filter:drop-shadow(0 0 10px rgba(94,200,255,.55)) drop-shadow(0 0 22px rgba(45,143,217,.35));
}
.shop-join-step-page .sj-orbit-ring-svg--b{
	animation:sjRingSpinB 9s linear infinite reverse;
	opacity:.92;
}
.shop-join-step-page .sj-orbit-arm{
	position:absolute;
	left:50%;
	top:50%;
	width:0;
	height:0;
	margin:0;
	padding:0;
	z-index:10;
	transform-origin:0 0;
	animation:sjRocketOrbit 11s linear infinite;
	will-change:transform;
}
.shop-join-step-page .sj-orbit-rocket{
	position:absolute;
	left:0;
	top:0;
	width:var(--sj-rocket-w);
	height:var(--sj-rocket-h);
	/* 枢轴在舞台中心：火箭几何中心落在「正上方」圆周上 */
	transform:translate(
		calc(var(--sj-rocket-w) / -2),
		calc(-1 * var(--sj-orbit-r) - var(--sj-rocket-h) / 2)
	);
	filter:drop-shadow(0 3px 6px rgba(0,0,0,.5)) drop-shadow(0 0 12px rgba(94,200,255,.35));
}
.shop-join-step-page .sj-rocket-svg{
	display:block;
	width:100%;
	height:100%;
	transform:rotate(90deg);
}
.shop-join-step-page .sj-rocket-flame{
	transform-box:fill-box;
	transform-origin:50% 100%;
	animation:sjFlamePulse 0.48s ease-in-out infinite alternate;
}
.shop-join-step-page .sj-orbit-caption{
	margin:0;
	font-size:11px;
	letter-spacing:.2em;
	text-transform:uppercase;
	color:rgba(148,200,255,.55);
	text-align:center;
}
.shop-join-step-page .sj-examine-copy{
	padding:32px 28px 32px 32px;
	display:flex;
	flex-direction:column;
	justify-content:center;
	gap:14px;
	text-align: left;
	background:linear-gradient(180deg,#fff 0%,#f8fafc 100%);
}
.shop-join-step-page .sj-examine-badge{
	display:inline-block;
	align-self:flex-start;
	padding:6px 14px;
	border-radius:999px;
	font-size:12px;
	font-weight:800;
	letter-spacing:.06em;
	color:#fff;
	background:linear-gradient(135deg,var(--sj-primary-light),var(--sj-primary));
	border:1px solid rgba(255,255,255,.2);
	box-shadow:0 6px 20px rgba(6,56,122,.3);
}
.shop-join-step-page .sj-examine-pending-msg{
	margin:0;
	line-height:1.8;
	font-size:16px;
	color:var(--sj-ink);
	font-weight:600;
}
@keyframes sjRingSpinA{
	to{transform:rotate(360deg);}
}
@keyframes sjRingSpinB{
	to{transform:rotate(-360deg);}
}
@keyframes sjRocketOrbit{
	to{transform:rotate(360deg);}
}
@keyframes sjStarsDrift{
	to{transform:rotate(-360deg);}
}
@keyframes sjFlamePulse{
	from{opacity:.8;transform:scaleY(1);}
	to{opacity:1;transform:scaleY(1.18);}
}
@media (max-width:720px){
	.shop-join-step-page .sj-examine-pending{
		grid-template-columns:1fr;
	}
	.shop-join-step-page .sj-orbit-panel{
		border-right:none;
		border-bottom:1px solid rgba(255,255,255,.1);
		padding:24px 16px 18px;
	}
	.shop-join-step-page .sj-examine-copy{
		padding:24px 20px 28px;
	}
}
@media (prefers-reduced-motion:reduce){
	.shop-join-step-page .sj-orbit-stars,
	.shop-join-step-page .sj-orbit-ring-svg--a,
	.shop-join-step-page .sj-orbit-ring-svg--b,
	.shop-join-step-page .sj-orbit-arm,
	.shop-join-step-page .sj-rocket-flame{
		animation-duration:0.01ms !important;
		animation-iteration-count:1 !important;
	}
}

/* ========== 支付区块 ========== */
.shop-join-step-page .pay-sbox{
	border-radius:14px;
	border:1px solid var(--sj-line);
	background:var(--sj-card);
	box-shadow:0 8px 28px rgba(6,56,122,.05);
	padding:12px 14px;
}
.shop-join-step-page .pay-sbox .tips-box,
.shop-join-step-page .pay-sbox .pay-type{
	color:var(--sj-ink);
	border-bottom:1px solid var(--sj-surface);
}
.shop-join-step-page .pbox-tip{
	color:var(--sj-primary-light);
}
.shop-join-step-page .pay-btn{
	background:linear-gradient(145deg,var(--sj-primary-mid),var(--sj-primary));
	border:1px solid #042a52;
	border-radius:8px;
	padding:6px 16px;
	font-weight:600;
}
.shop-join-step-page .pay-btn:hover{
	filter:brightness(1.06);
}

/* ========== 底部操作 ========== */
.shop-join-step-page .agreement-bottom{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	justify-content:center;
	gap:14px;
	padding:22px 16px;
	margin-top:8px;
	background:var(--sj-card);
	border-radius:16px;
	border:1px solid rgba(6,56,122,.1);
	box-shadow:0 10px 32px rgba(6,56,122,.08);
}
.shop-join-step-page .agreement-bottom .btn-cancel,
.shop-join-step-page .agreement-bottom .btn-submit{
	min-width:120px;
	height:auto;
	line-height:1.2;
	padding:12px 22px;
	font-size:15px;
	font-weight:700;
	border-radius:999px;
	text-decoration:none;
	transition:transform .15s,box-shadow .2s,filter .15s;
}
.shop-join-step-page .agreement-bottom .btn-cancel{
	background:#f1f5f9;
	border:1px solid #cbd5e1;
	color:#475569;
}
.shop-join-step-page .agreement-bottom .btn-cancel:hover{
	background:#e2e8f0;
	color:var(--sj-primary);
	border-color:var(--sj-primary-soft);
}
.shop-join-step-page .agreement-bottom .btn-submit{
	background:linear-gradient(135deg,var(--sj-primary-light),var(--sj-primary));
	color:#fff;
	border:1px solid #042a52;
	box-shadow:0 8px 24px rgba(6,56,122,.35);
}
.shop-join-step-page .agreement-bottom .btn-submit::before{
	display:none;
}
.shop-join-step-page .agreement-bottom .btn-submit:hover{
	filter:brightness(1.05);
	transform:translateY(-1px);
	box-shadow:0 12px 28px rgba(6,56,122,.4);
}

@media (max-width:900px){
	.shop-join-step-page .shop-join-stepflex.stepflex{
		flex-wrap:wrap;
		justify-content:center;
		gap:16px 8px;
		padding:20px 12px;
	}
	.shop-join-step-page .shop-join-stepflex dl{
		flex:0 0 calc(33.333% - 8px);
		max-width:140px;
	}
	.shop-join-step-page .shop-join-stepflex dl:not(:last-child)::after{
		display:none;
	}
}
@media (max-width:520px){
	.shop-join-step-page .shop-join-stepflex dl{
		flex:0 0 100%;
		max-width:none;
		display:flex;
		align-items:center;
		gap:14px;
		text-align:left;
		padding:8px 12px;
		background:rgba(6,56,122,.04);
		border-radius:12px;
	}
	.shop-join-step-page .s-num,
	.shop-join-step-page .s-num1{
		margin:0;
		flex-shrink:0;
	}
}
