@import '../../styles/theme.less';

.myTabs {
	padding: 12px 0;
	color: @text-color-secondary;

	&-border {
		position: relative;

		&::after {
			content: '';
			position: absolute;
      left: 0;
      right: 0;
			bottom: 10px;
			height: 1px;
      background-color: @divider-color;
		}
	}

	&-tab {
		cursor: pointer;
    display: flex;
    align-items: center;
		&:hover {
			color: @main-color;
		}
	}

	&-active {
		position: relative;
		color: @main-color;

		&::after {
			content: '';
			height: 2px;
			width: 22px;
			background-color: @main-color;
			position: absolute;
			left: 50%;
			margin-left: -11px;
			bottom: -2px;
		}
	}
}