.btn-primary {
    @apply px-4 py-2 bg-primary-600 text-white rounded-md hover:bg-primary-700 transition-colors;
}

.btn-secondary {
    @apply px-4 py-2 border border-gray-300 text-gray-700 rounded-md hover:bg-gray-50 transition-colors;
}

.card {
    @apply bg-white rounded-xl border border-gray-200 p-6;
}

.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.alert {
    @apply rounded-md p-4 text-sm;
}

.alert-success {
    @apply bg-green-50 text-green-800 border border-green-200;
}

.alert-error {
    @apply bg-red-50 text-red-800 border border-red-200;
}

.alert-warning {
    @apply bg-yellow-50 text-yellow-800 border border-yellow-200;
}

.alert-info {
    @apply bg-blue-50 text-blue-800 border border-blue-200;
}

.form-input {
    @apply w-full px-3 py-2 border border-gray-300 rounded-md text-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500;
}

.form-label {
    @apply block text-sm font-medium text-gray-700 mb-1;
}

.table-container {
    @apply bg-white rounded-xl border border-gray-200 overflow-hidden;
}

.status-badge {
    @apply inline-flex items-center px-2 py-0.5 rounded text-xs font-medium;
}

.progress-bar {
    @apply w-full bg-gray-200 rounded-full h-2;
}

.progress-bar-fill {
    @apply bg-primary-600 rounded-full h-2 transition-all;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.fade-in {
    animation: fadeIn 0.3s ease-out;
}

.file-upload-area {
    @apply border-2 border-dashed border-gray-300 rounded-lg p-6 text-center hover:border-primary-400 transition-colors cursor-pointer;
}

.file-upload-area:hover {
    background-color: #f0f7ff;
}

.loading-spinner {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border: 2px solid #e5e7eb;
    border-top-color: #2563eb;
    border-radius: 50%;
    animation: spin 0.6s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}