/* Project Details Modal Styles */
.modal-overlay {
  animation: fadeIn 0.3s ease-out;
}

.modal-content {
  animation: slideIn 0.3s ease-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes slideIn {
  from {
    opacity: 0;
    transform: translateY(-20px) scale(0.95);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Progress bar animation */
.progress-bar {
  transition: width 0.5s ease-in-out;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .modal-content {
    margin: 1rem;
    max-width: calc(100vw - 2rem);
  }
  
  .modal-actions {
    flex-direction: column;
    gap: 0.5rem;
  }
  
  .modal-actions button {
    width: 100%;
  }

  /* Hide scrollbar on mobile while maintaining scroll functionality */
  .mobile-scroll-hidden {
    /* Firefox */
    scrollbar-width: none;
    /* Internet Explorer and Edge */
    -ms-overflow-style: none;
    /* Smooth scrolling on mobile */
    -webkit-overflow-scrolling: touch;
  }
  
  /* Safari and Chrome */
  .mobile-scroll-hidden::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }
  
  .mobile-scroll-hidden::-webkit-scrollbar-track {
    display: none;
  }
  
  .mobile-scroll-hidden::-webkit-scrollbar-thumb {
    display: none;
  }
}

/* General scrollbar hiding (applies on all screen sizes) */
.scroll-hidden {
  /* Firefox */
  scrollbar-width: none;
  /* Internet Explorer and Edge */
  -ms-overflow-style: none;
  /* Smooth scrolling */
  -webkit-overflow-scrolling: touch;
}

.scroll-hidden::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.scroll-hidden::-webkit-scrollbar-track {
  display: none;
}

.scroll-hidden::-webkit-scrollbar-thumb {
  display: none;
}

/* Dark mode adjustments */
.dark .modal-content {
  background: linear-gradient(135deg, #1f2937 0%, #374151 100%);
}

.dark .modal-header {
  background: linear-gradient(90deg, #4b5563 0%, #6b7280 100%);
}

.dark .modal-footer {
  background: #374151;
  border-top-color: #4b5563;
} 