@import '~@/uni_modules/lime-style/index.scss';
// @import './icon';
@import '../../../lime-icon/components/l-icon/icon.scss';
// @import '~@/uni_modules/lime-icon/components/l-icon/icon.scss';
// @import '~@/uni_modules/lime-style/mixins/hairline.scss';

/* #ifdef  uniVersion >= 4.75 */ 
$use-css-var: true;
/* #endif */
$cascader: #{$prefix}-cascader;

$cascader-title-color: create-var(cascader-title-color, $text-color-1);
$cascader-icon-color: create-var(cascader-icon-color, $primary-color);
$cascader-icon-size: create-var(cascader-icon-size, 24px);
$cascader-bg-color: create-var(cascader-bg-color, $bg-color-container);
$cascader-border-radius: create-var(cascader-border-radius, $border-radius-lg);
$cascader-height: create-var(cascader-height, 320px);
$cascader-cell-height: create-var(cascader-cell-height, 50px);
$cascader-cell-padding-x: create-var(cascader-cell-cell-padding, $spacer);
$cascader-cell-padding-y: create-var(cascader-cell-cell-padding, $spacer-sm);
$cascader-cell-title-color: create-var(cascader-cell-title-color, $text-color-1);
$cascader-cell-title-font-size: create-var(cascader-cell-title-font-size, $font-size-md);

$cascader-disabled-color: create-var(cascader-disabled-color, $text-color-3);
$cascader-title-height: create-var(cascader-title-height, 48px);
$cascader-title-padding-top: create-var(cascader-title-padding-top, $spacer);
$cascader-title-padding-bottom: create-var(cascader-title-padding-bottom, $spacer-xs);
$cascader-title-font-size: create-var(cascader-title-font-size, 18px);
$cascader-options-title-color: create-var(cascader-options-title-color, $text-color-3);
$cascader-close-icon-color: create-var(cascader-close-icon-color, $text-color-2);


.#{$cascader} {
	background-color: $cascader-bg-color;
	/* #ifndef APP-ANDROID || APP-IOS || APP-HARMONY */
	color: $cascader-title-color;
	/* #endif */
	// border-radius: 12px 12px 0 0;
	@include border-radius($cascader-border-radius $cascader-border-radius 0 0);
	&__title {
		/* #ifndef UNI-APP-X */
		display: flex;
		// width: 100%;
		align-items: center;
		justify-content: center;
		/* #endif */
	    position: relative;
	    font-weight: 700;
	    text-align: center;
		color: $cascader-title-color;
	    // line-height: $cascader-title-height;
		// height: $cascader-title-height;
		// padding: 14px 0;
		@include padding($cascader-title-padding-top 0 $cascader-title-padding-bottom);
	    font-size: $cascader-title-font-size;
	}
	&__close {
		&-btn {
		    right: $cascader-cell-padding-x;
		    top: 12px;
		    position: absolute;
			/* #ifndef APP-ANDROID || APP-IOS || APP-HARMONY */
			color: $cascader-close-icon-color !important;
			/* #endif */
		}
		&-icon {
			font-family: $prefix;
		    font-size: $cascader-icon-size;
			color: $cascader-close-icon-color !important;
		}
	}
	&__content {
		// height: $cascader-content-height;
	}
	&__options {
		// flex: 1;
		/* #ifndef APP-ANDROID || APP-IOS || APP-HARMONY */
		width: 100vw;
		/* #endif */
		/* #ifdef APP-ANDROID || APP-IOS || APP-HARMONY */
		width: 750rpx;
		/* #endif */
		height: $cascader-height;
		&-container {
			/* #ifndef UNI-APP-X */
			display: flex;
			/* #endif */
			flex-direction: row;
			transition-property: transform;
			transition-timing-function: ease;
			transition-duration: 300ms;
		}
		&-title {
		    color: $cascader-options-title-color;
		    font-size: $font-size;
		    line-height: 22px;
		    padding-top: 16px;
		    padding-left: 16px;
		    box-sizing: border-box;
		}
	}
	&__cell {
		/* #ifndef UNI-APP-X */
		display: flex;
		box-sizing: border-box;
		/* #endif */
		// padding: $cascader-cell-padding;
		@include padding($cascader-cell-padding-y $cascader-cell-padding-x);
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		height: $cascader-cell-height;
		&--disabled {
			color: $cascader-disabled-color;
		}
		&-title {
			font-size: $cascader-cell-title-font-size;
			color: $cascader-cell-title-color;
		}
		&-icon {
			font-size: $cascader-icon-size;
			color: $cascader-icon-color;
		}
	}
	
	// 多选模式下的checkbox样式
	&__checkbox {
		width: 100%;
		/* #ifndef UNI-APP-X */
		display: flex;
		/* #endif */
		align-items: center;
		// justify-content: space-between;
		
		.l-checkbox {
			width: 100%;
			
			.l-checkbox__label {
				flex: 1;
				margin-left: 8px;
			}
		}
	}
	&__footer {
	    padding: 16px;
	}
	
}