/* css for Cards */
.card {
	border: none;
	border-radius: var(--border-radius);
	box-shadow: var(--shadow);
	transition: var(--transition);
	background: var(--surface-card);
	overflow: hidden;
}

.card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-lg);
}

.card-header {
	background: linear-gradient(135deg, var(--primary) 0%, var(--primary-dark) 100%);
	color: white;
	border: none;
	padding: 1.25rem 1.5rem;
	font-weight: 600;
	font-size: 1.1rem;
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.card-header i {
	font-size: 1.2rem;
}