/* ==========================================================================
# Tabs style - begin
========================================================================== */
.edgtf-tabs {

	.edgtf-tabs-nav {
		display: block;
		position: relative;
		list-style: none outside none;
		margin: 0;
		padding: 0;
		overflow: hidden;
		vertical-align: middle;
		@include edgtfBoxSizing(border-box);

		li {
			margin: 0;
			a {
				position: relative;
				display: block;
				padding: 12px 32px;
				color: $default-heading-color;
				background-color: #fff;
				font-family: $default-heading-font;
				font-size: 18px;
				font-weight: 700;
				border-right: 2px solid $default-border-color;
				border-bottom: 2px solid $default-border-color;
				@include edgtfBoxSizing(border-box);
				@include edgtfTransition(color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out);

				i,
				span {
					@include edgtfTransition(initial);
				}

				.edgtf-icon-frame {
					display: inline-block;
					min-width: 20px;
					line-height: 1;
					vertical-align: middle;
				}

				.edgtf-tab-text-after-icon {
					@include edgtfTransition(initial);
					vertical-align: middle;
				}
			}

			&:last-child {
				a {
					border-right: 0;
				}

			}

		}
	}

	.edgtf-tab-container {
		position: relative;
		@include edgtfBoxSizing(border-box);
	}
}

/* Icon tabs styles
   ========================================================================== */
.edgtf-tabs.edgtf-horizontal-tab.edgtf-tab-with-icon ul li a {

	.edgtf-tab-text-after-icon {
		padding: 0 4px 0 0;
	}
}

.edgtf-tabs.edgtf-vertical-tab.edgtf-tab-with-icon ul li a {

	.edgtf-tab-text-after-icon {
		padding: 0 0 0 13px;
	}
}

.edgtf-tabs.edgtf-tab-with-icon ul li:hover .edgtf-icon-frame {
	@include edgtfAnimation(edgtf-appear .35s forwards ease);
}

@include keyframes(edgtf-appear) {
	0% {
		opacity: 0;
		@include edgtfTransform(translateX(25px));
	}
	30% {
		opacity: .1;
		@include edgtfTransform(translateX(15px));
	}
	100% {
		opacity: 1;
		@include edgtfTransform(translateX(0px));
	}
}

/* Horizontal tabs styles
   ========================================================================== */
.edgtf-tabs.edgtf-horizontal-tab {

	.edgtf-tabs-nav li {
		float: left;

		a {
			text-align: center;
		}

		&.ui-state-active,
		&.ui-state-hover {
			a {
				color: $first-main-color;
				border-bottom-color: $first-main-color;
			}
		}
	}

	.edgtf-tab-container {
		padding: 20px 10px 20px 0;
	}
}

/* Vertical tabs styles
   ========================================================================== */
.edgtf-tabs.edgtf-vertical-tab {

	.edgtf-tabs-nav {
		float: left;
		width: 18%;

		li {
			position: relative;
			display: block;
			width: 100%;

			a {
				color: #000;
				margin-right: 0;
				margin-bottom: 1px;
				border-right: none;
			}

			&.ui-state-active,
			&.ui-state-hover {
				a {
					color: $first-main-color;
					border-bottom-color: $first-main-color;
				}
			}

			&:last-child {
				margin: 0;
			}
		}
	}

	.edgtf-tab-container {
		float: left;
		width: 82%;
		padding: 10px 30px;
	}
}

.edgtf-tabs.edgtf-vertical-tab.edgtf-tab-only-icon {

	.edgtf-tabs-nav li a {
		text-align: center;
	}
}

/* ==========================================================================
# Tabs style - end
========================================================================== */