/* 系统样式 */
body {
	background-color: #ffffff;
	background-attachment: fixed;
	background-image: radial-gradient(closest-side, rgba(255, 255, 127, 0.2), rgba(0, 0, 255, 0.0)),
		radial-gradient(closest-side, rgba(255, 255, 127, 0.1), rgba(0, 0, 255, 0.0)),
		radial-gradient(closest-side, rgba(255, 255, 255, 0.1), rgba(0, 0, 255, 0.0)),
		radial-gradient(closest-side, #aaffff, rgba(0, 0, 255, 0.0));
	background-size:
		100vmax 130vmax,
		80vmax 80vmax,
		90vmax 90vmax,
		110vmax 110vmax;
	background-position:
		30vmax -60vmax,
		-40vmax -30vmax,
		10vmax 10vmax,
		-30vmax -10vmax;
	background-repeat: no-repeat;
	margin: 0;
	padding: 0;

	/* height: 100vh; */
}


/* 定义滚动条整体样式 */
body::-webkit-scrollbar {
	width: 0px;
	/* 垂直滚动条宽度 */
	height: 0px;
	/* 水平滚动条高度 */
}

/* 定义滚动条轨道 */
body::-webkit-scrollbar-track {
	background: transparent;
	/* 轨道背景透明 */
}

/* 定义滚动条滑块 */
body::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.2);
	/* 滑块半透明 */
	border-radius: 4px;
	/* 滑块圆角 */
}

/* 鼠标悬停在滑块上时的样式 */
body::-webkit-scrollbar-thumb:hover {
	background: rgba(0, 0, 0, 0.3);
	/* 滑块颜色加深 */
}

a {
	cursor: pointer;
}

.wecome {
	display: inline-block;
	width: 100%;
	border: solid 0px #ff5500;
	font-size: 3vmin;
	text-align: center;
	color: rgba(255, 85, 127, 0.8);
}

/* 添加按钮 */
.addBut {
	margin-left: 20px;
}

/*标题*/
.sys-title {
	display: inline-block;
	margin: 10px;
	margin-bottom: 30px;
	font-size: 18px;
}


/* 搜索框 */
.search {
	position: relative;
	display: inline-flex;
	width: 220px;
	border: solid 1px rgba(0, 0, 0, 0.1);
	background-color: rgba(255, 255, 255, 1);
	padding: 0px;
	border-radius: 5px;
	margin: 0px 10px;
	color: #ff5500;
}

.search input {
	width: calc(100% - 40px);
	outline: none;
	border: none;
	margin: 2px;
	padding-left: 25px;
	height: 30px;
	user-select: auto;
	vertical-align: middle;
}

.search span {
	position: absolute;
	left: -0px;
	margin: 0px;
	padding: 0px;
}

.search button {
	border: none;
	font-size: 16px;
}

.mui-slider-indicator .mui-icon {
	width: 20px;
	border: none;
}

/* 加载动画 */
.sys-loadIco {
	border: solid 0px #0055ff;
	text-align: center;
	margin: 20px 20px;
	line-height: 40px;
}

.sys-loadIco span {
	vertical-align: middle;
	margin-right: 5px;
}

/*行样式*/
.sys-row {
	margin: 5px 10px;
	line-height: 40px;
	font-size: 16px;
}


/* 蒙层样式 */
.sys-mask {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background-color: rgba(0, 0, 0, 0.2);
	display: -webkit-box;
	/* 旧版 Safari, iOS, Android 浏览器 */
	display: -ms-flexbox;
	/* IE 10 */
	display: flex;
	-webkit-box-pack: center;
	/* 旧版 Safari, iOS, Android 浏览器 */
	-ms-flex-pack: center;
	/* IE 10 */
	justify-content: center;
	-webkit-box-align: center;
	/* 旧版 Safari, iOS, Android 浏览器 */
	-ms-flex-align: center;
	/* IE 10 */
	align-items: center;

}

/* 弹出菜单 */
.sys-mask .form {
	position: absolute;
	top: 50%;
	left: 50%;
	/* min-width: 300px; */
	max-height: 50%;
	background-color: white;
	padding: 10px;
	border-radius: 5px;
	overflow-y: auto;
	transform: translate(-50%, -50%) scale(0);
	animation: pop-up 0.3s forwards;
}

/*菜单项*/
.sys-mask .form .menuItem {
	min-width: 150px;
	display: block;
}

/* 内容区透明背景 */
.contbody {
	background-color: transparent;
}

/*输入组件区*/
.formBox .mui-input-group {
	max-width: 600px;
	margin: 0 auto;
	border: solid 0px #0055ff;
}

.formBox .mui-input-group .mui-input-row {
	height: 50px;
	padding-top: 5px;
}

.formBox .mui-input-group .mui-input-row .mui-btn-block {
	border: solid 1px #0055ff;
	text-align: left;
	float: left;
	min-width: 100px;
}

.formBox .mui-input-group .mui-input-row label {

	font-size: 16px;
	margin: auto;
}

.formBox .mui-input-group .mui-input-row label span {
	display: inline-block;
	margin: 0px 5px;
	color: #ff5500;


}


/* 定义弹出菜单动画 */
@keyframes pop-up {
	from {
		transform: translate(-50%, -50%) scale(0);
	}

	to {
		transform: translate(-50%, -50%) scale(1);
	}
}



/* 定义滚动条整体样式 */
.sys-mask .form::-webkit-scrollbar {
	width: 0px;
	/* 垂直滚动条宽度 */
	height: 0px;
	/* 水平滚动条高度 */
}

/* 定义滚动条轨道 */
.sys-mask .form::-webkit-scrollbar-track {
	background: transparent;
	/* 轨道背景透明 */
}

/* 定义滚动条滑块 */
.sys-mask .form::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, 0.2);
	/* 滑块半透明 */
	border-radius: 4px;
	/* 滑块圆角 */
}

/* 鼠标悬停在滑块上时的样式 */
.sys-mask .form::-webkit-scrollbar-thumb:hover {
	background: rgba(0, 0, 0, 0.3);
	/* 滑块颜色加深 */
}


.sys-mask .form li {
	line-height: 30px;
	cursor: pointer;
}

.sys-flex {
	display: flex;

}

/* 单选框样式 */
.sys-radio {
	flex: 1;
	display: inline-block;
	vertical-align: middle;
	/* cursor: pointer; */
	text-align: center;
	/* 文字居中，视觉上更均衡 */
	box-sizing: border-box;
	/* 避免边框/内边距影响宽度计算 */

}

.sys-radio::before {
	content: "";
	display: inline-block;
	border: solid 1px;
	width: 15px;
	height: 15px;
	vertical-align: middle;
	margin: 2px 5PX;
}

.active {}

.active::before {
	content: "✓";
	font-size: 30px;
	line-height: 8px;
}




/* 选项卡页 */
.sys-slider {
	position: relative;
	overflow: hidden;
}

.sys-slider .sys-slider-item {
	display: none;
}

.sys-slider .active {
	display: block;
	/* 改为块级元素，确保 transform 生效 */
	/* transform: scale(1); */
	animation: scaleShow 1s ease forwards;
}

.sys-slider .active:before {
	content: "";
}

@keyframes scaleShow {
	from {
		/* 正确拼写 from（表示动画开始状态） */
		transform: scale(0.8);
		opacity: 0;
		background-color: #a7a7a7;
	}

	to {
		/* 动画结束状态 */
		transform: scale(1);
		opacity: 1;
	}
}