/*!
 * stepper-letsgo.css — bs-stepper v1.7.0 視覺的 letsgo 保真複製（M3-T2，OQ-5 決議：獨立檔）
 *
 * 數字圈 + 連接線 + label，active 圈品牌 teal（--brand-teal #009AB3），無 progress bar。
 * 規則移植自 plugins/bs-stepper/css/bs-stepper.css，class 改 stepper-letsgo 命名空間
 * （刻意避開 bs-stepper-* 字串：verify-bs5-migration.sh Check 5 殘留掃描 + M3-T6 整包移除）。
 * 底層 BS5 Tab 引擎（data-bs-toggle="pill" + .tab-pane），ul 用純 .nav（不掛 .nav-pills，避免藥丸底色）。
 * 決策：docs/superpowers/letsgo/reports/m3/stepper-poc-decision.md
 */

/* header（tablist）：取代 .bs-stepper-header */
.stepper-letsgo .stepper-header {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
}

/* 每個 step（包 .step-trigger 的 nav-item） */
.stepper-letsgo .step {
	display: flex;
}

/* 觸發鈕：取代 .step-trigger（移植 bs-stepper.css） */
.stepper-letsgo .step-trigger {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	padding: 20px;
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.5;
	color: #6c757d;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
	vertical-align: middle;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	background-color: transparent;
	border: none;
	border-radius: .25rem;
	transition: background-color .15s ease-out, color .15s ease-out;
}

.stepper-letsgo .step-trigger:not(:disabled):not(.disabled) {
	cursor: pointer;
}

.stepper-letsgo .step-trigger:disabled,
.stepper-letsgo .step-trigger.disabled {
	pointer-events: none;
	opacity: .65;
}

.stepper-letsgo .step-trigger:hover {
	text-decoration: none;
	background-color: rgba(0, 0, 0, .06);
}

/* bs-stepper 原 :focus 為 #007bff，本專案改品牌 teal 對齊 active 色系 */
.stepper-letsgo .step-trigger:focus {
	color: var(--brand-teal, #009AB3);
	outline: none;
	box-shadow: none;
}

/* 數字圈：取代 .bs-stepper-circle */
.stepper-letsgo .step-circle {
	display: inline-flex;
	align-content: center;
	justify-content: center;
	width: 2em;
	height: 2em;
	padding: .5em 0;
	margin: .25rem;
	line-height: 1em;
	color: #fff;
	background-color: #6c757d;
	border-radius: 1em;
}

/* active 圈品牌 teal — BS5 Tab 把 .active 加在 .step-trigger（=.nav-link）上 */
.stepper-letsgo .step-trigger.active .step-circle {
	background-color: var(--brand-teal, #009AB3);
}

/* label：取代 .bs-stepper-label */
.stepper-letsgo .step-label {
	display: inline-block;
	margin: .25rem;
}

/* 連接線：取代 .line / .bs-stepper-line */
.stepper-letsgo .step-line {
	flex: 1 0 32px;
	min-width: 1px;
	min-height: 1px;
	margin: auto;
	background-color: rgba(0, 0, 0, .12);
	list-style: none;
}

/* 內容區：取代 .bs-stepper-content */
.stepper-letsgo .stepper-content {
	padding: 0 20px 20px;
}

/* wizard step 內 daterangepicker / selectpicker 下拉不被裁切（register step2 有生日選擇器）。
   BS5 .tab-pane 隱藏靠 display:none 非 overflow，故 overflow:visible 不影響切換。 */
.stepper-letsgo .tab-pane {
	overflow: visible;
}

/* responsive：忠實移植 bs-stepper.css @media（≤520 直排 trigger、≤400 線縮短） */
@media (max-width: 520px) {
	.stepper-letsgo .step-trigger {
		flex-direction: column;
		padding: 10px;
	}
	.stepper-letsgo .stepper-header {
		margin: 0 -10px;
		text-align: center;
	}
	.stepper-letsgo .stepper-content {
		padding: 0;
	}
}

@media (max-width: 400px) {
	.stepper-letsgo .step-line {
		flex-basis: 20px;
	}
}

/* --mobile-compact modifier：5 圈 wizard（register）窄螢幕縮圈 + 隱藏 label，只留數字圈 + 線。
   5 圈完整 label 需 ~688px，≤768 容器不足（768 仍溢出 32px），≥992（lg container 960）才放得下，
   故 breakpoint 取 991.98（含平板）。≥992 顯示完整 label。當前步驟靠內容區標題辨識。
   只命中帶此 modifier 的容器（register 唯一 5 圈頁）；reset/change ≤3 圈頁不受影響。
   置於既有 @media 之後：≤520 的 .step-trigger padding 由本規則覆蓋，flex-direction column 對純圈無視覺影響。 */
@media (max-width: 991.98px) {
	.stepper-letsgo--mobile-compact .step-label {
		display: none;
	}
	.stepper-letsgo--mobile-compact .step-trigger {
		padding: 8px 4px;
	}
	.stepper-letsgo--mobile-compact .step-circle {
		width: 1.75em;
		height: 1.75em;
		font-size: 15px;
		padding: 0;
		align-items: center;
	}
}