/* Custom scrollbar */
.custom-scrollbar::-webkit-scrollbar { width: 6px; }
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: rgba(147, 51, 234, 0.3); border-radius: 3px; }

/* Hover lift */
.hover-lift { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.hover-lift:hover { transform: translateY(-2px); box-shadow: 0 10px 30px rgba(0,0,0,0.1); }

/* Gradient header */
.gradient-header { background: linear-gradient(135deg, #ec4899, #9333ea); }

/* Progress bar */
.progress-bar { height: 8px; border-radius: 4px; background: #e5e7eb; overflow: hidden; }
.progress-bar-fill { height: 100%; border-radius: 4px; transition: width 0.5s ease; }

/* Modal animation */
.modal-enter { animation: modalIn 0.3s ease; }
@keyframes modalIn { from { opacity: 0; transform: scale(0.95) translateY(10px); } to { opacity: 1; transform: scale(1) translateY(0); } }

/* Safe area bottom */
.safe-area-bottom { padding-bottom: env(safe-area-inset-bottom, 0px); }

/* Transition effects */
.fade-in { animation: fadeIn 0.3s ease; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

/* Badge styles */
.badge { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 9999px; font-size: 0.75rem; font-weight: 600; }

/* Input styles */
input, select, textarea {
  border: 2px solid #e5e7eb;
  border-radius: 0.75rem;
  padding: 0.5rem 0.75rem;
  outline: none;
  transition: border-color 0.2s;
}
input:focus, select:focus, textarea:focus {
  border-color: #9333ea;
}

/* Button base */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  padding: 0.5rem 1rem;
  border-radius: 0.75rem;
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
  transition: all 0.2s;
  border: none;
  white-space: nowrap;
}
.btn:active { transform: scale(0.95); }
.btn-sm { padding: 0.25rem 0.5rem; font-size: 0.75rem; }
.btn-ghost { background: transparent; }
.btn-ghost:hover { background: rgba(0,0,0,0.05); }

/* Table */
table { width: 100%; border-collapse: collapse; }
th, td { padding: 0.75rem 1rem; text-align: right; }
th { font-weight: 700; font-size: 0.875rem; }