/* Efectivo Fácil - Custom Styles */

/* Base styles */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Custom animations */
@keyframes slideInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.slide-in-up {
  animation: slideInUp 0.5s ease-out;
}

/* Custom shadows */
.shadow-custom {
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Hover effects */
.hover-scale:hover {
  transform: scale(1.05);
  transition: transform 0.2s ease-in-out;
}

/* Custom gradients */
.gradient-primary {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.gradient-success {
  background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}

/* Button styles */
.btn-primary {
  @apply bg-indigo-600 text-white px-4 py-2 rounded-md font-medium hover:bg-indigo-700 transition-all duration-200 shadow-md hover:shadow-lg;
}

.btn-success {
  @apply bg-green-600 text-white px-4 py-2 rounded-md font-medium hover:bg-green-700 transition-all duration-200 shadow-md hover:shadow-lg;
}

/* Card styles */
.card {
  @apply bg-white rounded-lg shadow-md hover:shadow-lg transition-shadow duration-200;
}

/* Form styles */
.form-input {
  @apply block w-full border-gray-300 rounded-md shadow-sm focus:ring-indigo-500 focus:border-indigo-500 px-3 py-2 border transition-colors duration-200;
}

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

/* Status badges */
.badge-success {
  @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800;
}

.badge-warning {
  @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800;
}

.badge-info {
  @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800;
}

/* Mobile menu */
@media (max-width: 768px) {
  .mobile-menu {
    display: none;
  }
  
  .mobile-menu.active {
    display: block;
  }
}

/* Loading states */
.loading {
  @apply opacity-50 cursor-not-allowed;
}

/* Print styles */
@media print {
  .no-print {
    display: none !important;
  }
}