/* Existing styles */
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.module-card { transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
.module-card:hover { transform: translateY(-4px); border-color: var(--module-color, var(--border-active)); box-shadow: 0 10px 25px -5px rgba(0,0,0,0.5), 0 0 15px -3px var(--module-color, rgba(245, 158, 11, 0.2)); }
.module-icon-bg { background: linear-gradient(135deg, rgba(255,255,255,0.1), rgba(255,255,255,0)); backdrop-filter: blur(10px); }

/* NEW: Registration flow */
.stepper-step { transition: all 0.3s ease; }
.stepper-step.active .stepper-circle { background: linear-gradient(135deg, #f59e0b, #d97706); color: #111722; }
.stepper-step.completed .stepper-circle { background: #10b981; color: white; }
.stepper-step.pending .stepper-circle { background: #1e293b; color: #64748b; }
.stepper-line { height: 2px; transition: background-color 0.3s ease; }
.stepper-line.active { background: linear-gradient(90deg, #10b981, #f59e0b); }
.stepper-line.pending { background: #1e293b; }

/* Module selection cards */
.module-select-card { transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); cursor: pointer; }
.module-select-card:hover:not(.locked) { transform: translateY(-2px); }
.module-select-card.selected { border-width: 2px; }
.module-select-card.locked { opacity: 0.5; cursor: not-allowed; }
.module-select-card .check-overlay { opacity: 0; transition: opacity 0.2s ease; }
.module-select-card.selected .check-overlay { opacity: 1; }

/* Success animation */
@keyframes success-check { 0% { transform: scale(0); opacity: 0; } 50% { transform: scale(1.2); } 100% { transform: scale(1); opacity: 1; } }
@keyframes confetti-fall { 0% { transform: translateY(-100px) rotate(0deg); opacity: 1; } 100% { transform: translateY(100vh) rotate(720deg); opacity: 0; } }
.success-check-animate { animation: success-check 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards; }
.confetti-particle { position: absolute; width: 10px; height: 10px; border-radius: 2px; animation: confetti-fall 3s ease-out forwards; pointer-events: none; z-index: 100; }

/* Form transitions */
.view-transition { animation: fadeSlideIn 0.4s ease-out; }
@keyframes fadeSlideIn { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: translateY(0); } }

/* Input error state */
.input-error { border-color: #ef4444 !important; }
.field-error-text { color: #f87171; font-size: 0.75rem; margin-top: 0.25rem; }