@import '../less/variables/colors.less';
@import '../less/variables/typography.less';

.o-tabs__header {
	border-bottom: 1px solid @color-gray-medium;
	display: block;

	// Override default UL styling from mediafly-bootstrap.css
	margin-bottom: 0;
	padding: 0;
}

.o-tabs__header__tab {
	border-bottom: 3px solid transparent;
	color: @color-gray-medium;
	cursor: pointer;
	display: inline-block;
	list-style-type: none; // Override default LI styling
	margin-right: 2px;
	padding: 10px 15px;
	transition: all 0.25s;

	&.is-active {
		border-bottom-color: @color-gray-dark;
		color: @color-gray-x-dark;
	}

	@media (hover) {
		&:hover:not(.is-disabled) {
			border-bottom-color: @color-gray-x-light;
			color: @color-gray-dark;
		}

		&:hover.is-active {
			border-bottom-color: @color-gray-dark;
			color: @color-gray-x-dark;
		}
	}

	&.is-disabled {
		color: @color-gray-x-light;
		cursor: not-allowed;
	}
}