.captcha-overlay {
	font-size:13px;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.6);
    justify-content: center;
    align-items: center;
    z-index: 100;
}
.captcha-card {
    background: white;
    border-radius: 10px;
    width: 90%;
    max-width: 400px;
    overflow: hidden;
    text-align: center;
}
.captcha-header {
    padding: 15px 20px;
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.captcha-body {
    padding: 20px;
}
.image-container {
    position: relative;
    width: 100%;
    height: 200px;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 15px;
    background-color: #f5f5f5;
}
.captcha-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.text-spot {
    position: absolute;
    padding: 5px 10px;
    background-color: rgba(255,255,255,0.8);
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
}
.text-spot:hover {
    background-color: rgba(255,255,255,1);
    transform: scale(1.05);
}
.text-spot.selected {
    background-color: rgba(59, 130, 246, 0.8);
    color: white;
    border-color: #3b82f6;
}
.text-spot.correct {
    background-color: rgba(16, 185, 129, 0.8);
    color: white;
    border-color: #10b981;
}
.text-spot.wrong {
    background-color: rgba(239, 68, 68, 0.8);
    color: white;
    border-color: #ef4444;
}
.captcha-footer {
    padding: 0 20px 20px;
}
.font-semibold{
	font-size: 17px;
	font-weight: 600; /* CSS 字体粗细值，600 对应“半粗体” */
}
.font-bold{
	font-size: 20px;
	font-weight: bold;
}
.font-semiboldy2{
	font-size: 15px;
	color: #6C727F;
	align-items: center; /* 垂直居中 */
}
.font-union-size{
	font-size: 15px;
	align-items: center; /* 垂直居中 */
}

 /* 叉号图标核心样式 */
.x-icon{
	display: inline-block;
	width: 18px;
    height: 18px;
	position: relative;
}
.x-icon::before, .x-icon::after {
    content: '';
    position: absolute;
    background: #6b7280; /* 图标字体颜色 */
    color: white;
}

/* 水平线旋转45度 */
.x-icon::before {
    width: 100%; /* 线宽等于图标宽度 */
  	height: 3px; /* 线的粗细 */
  	top: 50%; /* 垂直居中 */
  	left: 0;
    transform: translateY(-50%) rotate(45deg);
}

/* 垂直线旋转45度 */
.x-icon::after {
    width: 3px; /* 线的粗细 */
  	height: 100%; /* 线高等于图标高度 */
  	top: 0;
  	left: 50%; /* 水平居中 */
    transform: translateX(-50%) rotate(45deg);
}

/* 基础按钮样式 */
.btn {
    /* 基本样式 */
    padding: 12px 46px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    text-align: center; /* 使内部按钮内联行元素水平居中 */
    
    color: white;
    
    /* 过渡效果，使颜色变化更平滑 */
    transition: background-color 0.3s ease;
}

.text-green-600{
	color: #16a34a; /* 对应 Tailwind green-600 的颜色值 */
}
.text-red-600 {
	color: #dc2626; /* 对应Tailwind的red-600颜色值 */
}

.text-indigo-600 {
  	color: #4f46e5; /* 对应 Tailwind indigo-600 的颜色值 */
}

.text-gray-500{
	color: #6b7280; /* 对应 Tailwind gray-500 的颜色值 */
}
.text-gray-700:hover{
	color: #374151; /* gray-700 对应色值 */
}

.bg-green-600{
	background-color: #15A251;
}

.bg-indigo-600{
	background-color: #5B42DF;
}
.bg-indigo-600:hover{
	background-color: #4E34C5;/* 与基础色相同 */
}
.bg-indigo-700{
	background-color: #3730a3; /* 对应 Tailwind indigo-700 的颜色值 */
}

.bg-indigo-700:hover{
	background-color: #4E34C5;
}

.cursor-not-allowed{
    cursor: not-allowed;
}