.forminator-ui[data-design="none"] {
	
	.forminator-pagination-steps {
		counter-reset: pagination-steps;
		margin-bottom: 30px;

		@media (min-width: 783px) {
			display: flex;
			align-items: center;

			.forminator-break {
				width: auto;
				min-width: 20px;
				height: 1px;
				flex: 1;
				margin: 0 15px;
			}

			.forminator-step {
				height: auto;
				flex: 0 1 auto;
			}
		}
	}

	.forminator-break {
		width: 1px;
		height: 20px;
		margin: 0 11px;
	}

	.forminator-step {
		display: flex;
		flex-direction: row-reverse;
		align-items: center;
		justify-content: flex-end;

		&.forminator-current ~ .forminator-step {

			.forminator-step-label {
				color: var(--theme-text-color);
			}

			.forminator-step-dot {
				color: var(--theme-text-color);
				background: var(--theme-form-field-border-initial-color);
			}
		}
	}

	.forminator-step-label {
		flex: 1;
		display: block;
		font-size: 13px;
		font-weight: 500;
		color: var(--theme-palette-color-1);
	}

	.forminator-step-dot {
		width: 22px;
		height: 22px;
		margin-right: 8px;
		border-radius: 100%;
		font-size: 12px;
		font-weight: 500;
		color: #fff;
		background: var(--theme-palette-color-1);

		&:before {
			display: block;
			content: counter(pagination-steps);
			counter-increment: pagination-steps;
			line-height: 22px;
			text-align: center;
		}
	}

	.forminator-break {
		background: var(--theme-form-field-border-initial-color);

		&:first-child,
		&:last-child {
			display: none;
		}
	}
}