//全局样式

* {
    box-sizing: border-box;
}

html {
    height: 100%;
    cursor: default;
	line-height: 1.5;
}

body {
	font-family: Poppins, Poppins;
    height: 100%;
}

#__nuxt, #__layout{
    height: 100%;
}

.pointer {
    cursor: pointer;
}

// 自定义滚动条样式
::-webkit-scrollbar {
	width: 16px; // 滚动条宽度(背景槽宽度)
}

::-webkit-scrollbar-track {
	background: #f9fafc; // 滚动条背景槽颜色
	border-radius: 16px; // 背景槽圆角
}

::-webkit-scrollbar-thumb {
	background: #2563eb; // 滑块颜色
	border-radius: 12px; // 滑块圆角
	width: 8px; // 滑块宽度
}

// 为兼容Firefox浏览器的滚动条样式
* {
	scrollbar-width: thin;
	scrollbar-color: #2563eb #f9fafc;
}

a {
    text-decoration: none;
    -webkit-user-drag: none;

    &:hover {
        cursor: pointer;
        color: #fff; //鼠标悬浮
    }

    &:link {
        color: #fff; //未访问
    }

    &:active {
        color: #fff; //鼠标按下
    }

    &:visited {
        color: #fff; //已访问
    }
}
.flex{
	display: flex;
}
#sub-container {
		width: 100%;
		height: 100%;
}
.gradient-color {
			background: linear-gradient(0deg, #2563EB 22%, #7B61FF 73%);
			@include font-color-transprent;
		}

.input-container {
			position: relative;
			display: flex;
			justify-content: center;
			align-items: center;
			/* 浅灰色背景 */

			width: 600px;
			/* 添加轻微阴影效果 */
			.search-icon {
				position: absolute;
				right: 30px;
				font-size: $normal-font-size;
			}
		}

		/* 输入框 */
		.input-container input[type="text"] {
			flex: 1;
			height: 60px;
			padding: 15px 30px;
			font-size: 16px;
			border: none;
			border-radius: 12px;
			background-color: #ffffff;
			font-family: 'Poppins-Medium';
			/* 白色背景 */
			color: #666666;
			/* 文字颜色 */
			outline: none;
			box-shadow: 0 20px 30px 0 #0000000f;
			/* 添加轻微阴影效果 */
		}


		/* 例如，可以通过:focus伪类来处理聚焦状态 */
		.input-container input[type="text"]:focus {
			border-color: #ffffff;
			/* 设置聚焦时的边框颜色 */
		}

		.input-container input[type="text"]::placeholder {
			color: #DCE1E8;
			/* 设置占位符的颜色 */
		}

.line{
	width: 100%;
	height: 2px;
	background: #E2E8F0;
	margin:30px 0 ;
}
#normal-container {
	@include container-bg;
	flex: 1;
}


.wh-100 {
	width: 100%;
	height: 100%;
}
.wh-16 {
	width: 16px;
	height: 16px;
}
.wh-24 {
	width: 24px;
	height: 24px;
}
.wh-12 {
	width: 12px;
	height: 12px;
}
.wh-14 {
	width: 14px;
	height: 14px;
}
.gap-12 {
	gap: 12px;
}
.gap-16 {
	gap: 16px;
}
.gap-20 {
	gap: 20px;
}