:root {
	--primary-color: #4f46e5;
	--primary-hover: #4338ca;
}

a {text-decoration: none; color: #777;}
a:hover {color: #000;}

.time-slots {padding: 0.75rem;}

.time-slot {
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 4px;
	padding: 0.75rem;
	margin-bottom: 0.5rem;
	cursor: pointer;
	transition: all 0.2s;
	text-align: center;
	font-weight: 500;
}

.time-slot:hover {border-color: var(--primary-color); background: #f0f4ff; transform: translateX(3px);}
.time-slot.occupied {background: #fee; border-color: #fcc; cursor: not-allowed; opacity: 0.6;}
.time-slot.occupied:hover {transform: none; border-color: #fcc; background: #fee;}
.time-slot.selected {background: var(--primary-color); color: white; border-color: var(--primary-color);}
.card.disabled {opacity: 0.5; pointer-events: none;}
.no-slots {text-align: center; padding: 1.25rem; color: #94a3b8;}