/* Card：悬停时边框加深、阴影浮现，不做位移；三套主题通过 CSS 变量适配 */

.card {
	--vc-card-hover-border: rgba(var(--tblr-primary-rgb, 32, 107, 196), .35);
	--vc-card-hover-shadow: 0 8px 24px rgba(0, 0, 0, .12);
	transition: border-color .25s ease, box-shadow .25s ease;
}

.card:hover {
	border-color: var(--vc-card-hover-border);
	box-shadow: var(--vc-card-hover-shadow);
}

/* 图片外框：div 提供边框，图片紧贴外框无间隙 */
.card-img-wrap {
	padding: 0;
	border: 1px solid var(--tblr-border-color);
	border-radius: var(--tblr-border-radius) var(--tblr-border-radius) 0 0;
	overflow: hidden;
}

.card-img-wrap .card-img-top {
	display: block;
	border-radius: 0;
	opacity: .7;
	transition: opacity .25s ease;
}

/* 悬停卡片时图片恢复不透明 */
.card:hover .card-img-wrap .card-img-top {
	opacity: 1;
}

/* 图标占位图片区域时，与图片保持相同的透明度与悬停效果 */
.card-img-wrap .card-icon {
	opacity: .7;
	transition: opacity .25s ease;
}

.card:hover .card-img-wrap .card-icon {
	opacity: 1;
}

/* Dark：阴影加深 */
html[data-bs-theme="dark"] .card {
	--vc-card-hover-shadow: 0 8px 24px rgba(0, 0, 0, .45);
}

@media (prefers-reduced-motion: reduce) {
	.card,
	.card-img-wrap .card-img-top,
	.card-img-wrap .card-icon {
		transition: none;
	}
}
