@use "../variables/default" as vd;
@use "../functions/helper" as fh;
@use "../functions/theme" as ft;

#{vd.$computed-prefix}h-full {
	height: 100%;
}

#{vd.$computed-prefix}w-full {
	width: 100%;
}

#{vd.$computed-prefix}size-full {
	width: 100%;
	height: 100%;
}

// 可操作的，如光标移入
#{vd.$computed-prefix}operable {
	font-size: fh.unitfix(14);
	color: ft.themefix(color-highlight) !important;
	cursor: pointer;
}

// 禁用
#{vd.$computed-prefix}disabled {
	pointer-events: none;
}

/**
 * 禁用动画
 */
#{vd.$computed-prefix}unanimated {
	animation: 0 !important;
}

// 滚动条
#{vd.$computed-prefix}scroller {
	// scrollbar width
	&::-webkit-scrollbar {
		width: fh.unitfix(4);
		/* stylelint-disable */
		&:horizontal {
			height: fh.unitfix(2);
		}
		/* stylelint-enable */
	}
	
	// scrollbar bg
	&::-webkit-scrollbar-track {
		background: ft.themefix(scrollbar-track-bg-color);
		border-radius: fh.unitfix(5);
		box-shadow: ft.themefix(scrollbar-track-box-shadow);
	}

	// Handle
	&::-webkit-scrollbar-thumb {
		background: ft.themefix(scrollbar-thumb-bg-color);
		border-radius: fh.unitfix(5);
	}
}

// display
#{vd.$computed-prefix}none, #{vd.$computed-prefix}hide {
	display: none !important;
}
#{vd.$computed-prefix}show, #{vd.$computed-prefix}block {
	display: block !important;
}
#{vd.$computed-prefix}inline {
	display: inline !important;
}
#{vd.$computed-prefix}inline-block {
	display: inline-block !important;
}

#{vd.$computed-prefix}d-n {
	display: none !important;
}

#{vd.$computed-prefix}d-b {
	display: block !important;
}

#{vd.$computed-prefix}d-i {
	display: inline !important;
}

#{vd.$computed-prefix}d-ib {
	display: inline-block !important;
}

// cursor
#{vd.$computed-prefix}pointer {
	cursor: pointer !important;
}

// divider 划分
#{vd.$computed-prefix}divider {
	position: relative;
	display: inline-block;
	width: fh.unitfix(1);
	height: fh.unitfix(12);
	margin: 0 fh.unitfix(8);
	vertical-align: middle;
	background: #ccc;
	box-sizing: border-box;
}

// dot 圆点
#{vd.$computed-prefix}dot {
	display: block;
	width: fh.unitfix(5);
	height: fh.unitfix(5);
	border-radius: 50%;
}

#{vd.$computed-prefix}of-h {
	overflow: hidden !important;
}

#{vd.$computed-prefix}bsz-bb {
	box-sizing: border-box;
}
