
.mega-component.stepper{
	position:relative;
	width:100%
}
.mega-component.stepper .step{
	align-items:flex-start;
	display:flex;
	flex-direction:column;
	position:relative
}
.mega-component.stepper .step .step-content{
	align-items:center;
	display:flex;
	padding:4px 4px 32px;
	position:relative
}
.mega-component.stepper .step .secondary-step-content{
	padding:0 4px 32px
}
.mega-component.stepper .step .step-content>*{
	color:var(--mobile-text-disabled)
}
.mega-component.stepper .step .step-title{
	font:var(--mobile-font-caption-large-bold);
	line-height:16px;
	margin-inline-start:16px
}
.mega-component.stepper .step .secondary-step-title{
	font:var(--mobile-font-caption-small-semibold)
}
.mega-component.stepper .step .step-number{
	font:var(--mobile-font-caption-small-bold);
	left:50%;
	position:absolute;
	top:50%;
	transform:translateX(-50%) translateY(-50%)
}
.mega-component.stepper .step .step-icon{
	--icon-size:24px;
	position:relative
}
.mega-component.stepper .primary-step>.step-content:before,.mega-component.stepper .secondary-step .step-content:before{
	background-color:var(--mobile-text-disabled);
	border-radius:var(--mobile-border-radius-extra-small);
	bottom:0;
	content:"";
	height:28px;
	left:15px;
	position:absolute;
	width:3px
}
.rtl .mega-component.stepper .primary-step>.step-content:before,.rtl .mega-component.stepper .secondary-step .step-content:before{
	left:auto;
	right:15px
}
.mega-component.stepper .primary-step:last-child>.step-content:before{
	visibility:hidden
}
.mega-component.stepper .secondary-step .step-content:before{
	top:24px
}
.mega-component.stepper .step.active>.step-content .step-icon,.mega-component.stepper .step.completed>.step-content .step-icon{
	color:var(--mobile-button-brand)
}
.mega-component.stepper .step.sub-active>.step-content .step-number{
	color:var(--mobile-text-inverse-accent)
}
.mega-component.stepper .step.active>.step-content .step-title,.mega-component.stepper .step.completed>.step-content .step-title{
	color:var(--mobile-text-primary)
}
.mega-component.stepper .step.completed .step-number{
	display:none
}
.mega-component.stepper .primary-step.active:not(:last-child)>.step-content:before,.mega-component.stepper .primary-step.completed:not(:last-child) .step-content:before,.mega-component.stepper .secondary-step.completed .secondary-step-content:before{
	background-color:var(--mobile-button-brand)
}
.dark-direct-tooltip.simpletip-tooltip.small-stepper-tip,.dark-direct-tooltip.simpletip-tooltip.small-stepper-tip .tooltip-arrow{
	display:none
}
@media only screen and (max-width:1079px){
.mega-component.stepper .primary-step .secondary-step-title,.mega-component.stepper .primary-step .step-title{
	display:none
}
.dark-direct-tooltip.simpletip-tooltip.small-stepper-tip{
	background:var(--mobile-background-inverse);
	color:var(--mobile-text-inverse);
	display:block;
	font:var(--mobile-font-caption-large-regular);
	line-height:14px;
	padding:12px
}
}
