@import "../styles/base/fn.wxss";

.@{wuxClassNamePrefix}-cascader {
	&__hd {
        position: relative;
		width: 100%;
		font-size: 17px;
		line-height: 1.5;
		color: #444;
		/*background-color: #f7f7f8;*/
		
        &:after {
			.setBottomLine(#D9D9D9);
		}
    }

    &__title {
    	position: relative;
    	height: 44px;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		box-sizing: border-box;

		&:after {
			.setBottomLine(#D9D9D9);
		}
    }

    &__menus {
    	display: flex;
    	height: 44px;
    	padding: 0 10px;
    	align-items: center;
    	box-sizing: border-box;
    }

    &__menu {
    	font-size: 13px;
    	padding: 0 10px;
    	max-width: 40%;
    	.ellipsis();

    	&--active {
			color: @assertive;
		}
    }

    &__bd {
    	width: 100%;
    	display: flex;
    	transition: transform .3s;
    	background-color: #f5f5f5;
    }
		
	&__inner {
		display: block;
		height: inherit;
		width: 50%;
		flex: 0 0 50%;
		background-color: #fff;

		&:nth-child(2n) {
			background-color: #f5f5f5;
		}
	}

    &__scroll-view {
    	max-height: 270px;
    }

	&__option {
		width: 100%;
		height: inherit;
		display: block;
		padding: 0 20px;
		box-sizing: border-box;
	}

	&__item {
		position: relative;
		z-index: 10;
		display: block;
		color: #333;
		font-size: 13px;
		height: 40px;
		line-height: 40px;
		text-align: left;
		padding-right: 18px;
		.ellipsis();

		&:after {
			.setBottomLine(#D9D9D9);
		}

		&--active {
			color: @assertive;
		}

		&--disabled {
			opacity: .3;
		}
	}

	&__icon {
		position: absolute;
		top: 12px;
		right: 0;
		z-index: 20;
		font-size: 0;
		line-height: 1;
	}
}