/* OzoShip step tabs shortcode styles */

.ozoship-step-tabs,
.ozoship-step-tabs * {
	box-sizing: border-box;
	font-family: var(--ozoship-font-family);
}

.ozoship-step-tabs {
	width: 100%;
	background: var(--ozoship-step-tabs-panel-bg, #EAF3FF);
	border-radius: var(--ozoship-step-tabs-panel-radius, 28px);
	padding: var(--ozoship-step-tabs-panel-padding-top, 40px) var(--ozoship-step-tabs-panel-padding-right, 77px) var(--ozoship-step-tabs-panel-padding-bottom, 40px) var(--ozoship-step-tabs-panel-padding-left, 77px);
}

.ozoship-step-tabs__wrap {
	display: flex;
	align-items: center;
	gap: var(--ozoship-step-tabs-gap, 48px);
	flex-wrap: wrap;
}

.ozoship-step-tabs__media {
	flex: 0 0 var(--ozoship-step-tabs-image-width, 174px);
	max-width: var(--ozoship-step-tabs-image-width, 174px);
}

.ozoship-step-tabs__image {
	display: block;
	width: var(--ozoship-step-tabs-image-width, 174px);
	height: var(--ozoship-step-tabs-image-height, 360px);
	object-fit: var(--ozoship-step-tabs-image-object-fit, contain);
}

.ozoship-step-tabs__content {
	flex: 1 1 520px;
	min-width: 320px;
}

.ozoship-step-tabs__title {
	margin: 0 0 21px;
	color: var(--ozoship-step-tabs-title-color, #0079BC);
	font-size: var(--ozoship-step-tabs-title-size, 32px);
	font-weight: var(--ozoship-step-tabs-title-weight, 700);
	line-height: 1.15;
	text-transform: none;
}

.ozoship-step-tabs__items {
	display: flex;
	align-items: center;
	flex-direction: column;
	gap: 0;
}

.ozoship-step-tabs__item {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 28px;
	padding: 0;
	border: 0;
	background: transparent;
	text-align: left;
	cursor: pointer;
	margin-bottom: 28px;
	color: inherit;
}

.ozoship-step-tabs__item:last-child {
	margin-bottom: 0;
}

.ozoship-step-tabs__num {
	position: relative;
	width: var(--ozoship-step-tabs-circle-size, 36px);
	flex: 0 0 var(--ozoship-step-tabs-circle-size, 36px);
}

.ozoship-step-tabs__num img {
	display: block;
	width: var(--ozoship-step-tabs-circle-size, 36px);
	height: var(--ozoship-step-tabs-circle-size, 36px);
}

.ozoship-step-tabs__num-text {
	position: absolute;
	left: 0;
	right: 0;
	top: 22%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: var(--ozoship-step-tabs-circle-text-size, 20px);
	font-weight: var(--ozoship-step-tabs-circle-text-weight, 600);
	line-height: 1;
}

.ozoship-step-tabs__line {
	position: absolute;
	left: 50%;
	top: 62%;
	transform: translateX(-50%);
	width: 0;
	height: 60px;
	border-left: 2px dashed var(--ozoship-step-tabs-line-color, #FF9A2F);
}

.ozoship-step-tabs__body {
	display: block;
	padding-top: 4px;
}

.ozoship-step-tabs__item-title {
	display: block;
	color: black;
	font-size: var(--ozoship-step-tabs-item-title-size, 20px);
	font-weight: var(--ozoship-step-tabs-item-title-weight, 500);
	line-height: 1;
	font-family: 'Afacad Flux', sans-serif;
	text-transform: none;
}


@media (max-width: 768px) {
	.ozoship-step-tabs {
		padding: 24px 18px;
	}

	.ozoship-step-tabs__wrap {
		gap: 24px;
	}

	.ozoship-step-tabs__media {
		flex: 1 1 100%;
		max-width: 100%;
	}

	.ozoship-step-tabs__image {
		width: 100%;
		max-width: 280px;
		height: auto;
	}

	.ozoship-step-tabs__content {
		flex: 1 1 100%;
		min-width: 0;
	}

	.ozoship-step-tabs__title {
		font-size: clamp(24px, 6vw, 32px);
	}

	.ozoship-step-tabs__item {
		gap: 18px;
		margin-bottom: 22px;
	}

	.ozoship-step-tabs__item-title {
		font-size: 18px;
	}
}