/* Custom Performance and UX Enhancements */

/* Smooth scrolling for anchor links */
html {
  scroll-behavior: smooth;
}

/* Mobile touch optimizations */
@media (hover: none) and (pointer: coarse) {
  .btn, .nav-link, .card {
    touch-action: manipulation;
  }
}

/* Improve button tap targets on mobile */
@media (max-width: 768px) {
  .btn {
    min-height: 44px;
    padding: 12px 20px;
  }
}

/* Custom scrollbar for webkit browsers */
::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: #c1c1c1;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}

/* Dark mode scrollbar */
@media (prefers-color-scheme: dark) {
  ::-webkit-scrollbar-track {
    background: #2d3748;
  }
  
  ::-webkit-scrollbar-thumb {
    background: #4a5568;
  }
  
  ::-webkit-scrollbar-thumb:hover {
    background: #718096;
  }
}

/* Image loading optimization */
img {
  transition: opacity 0.3s ease-in-out;
}

/* Focus styles for better accessibility */
.btn:focus,
.nav-link:focus,
input:focus,
textarea:focus {
  outline: 2px solid #3182ce;
  outline-offset: 2px;
}

/* Enhanced mobile menu */
@media (max-width: 991px) {
  .navbar-toggler {
    border: none;
    padding: 8px 12px;
  }
  
  .navbar-nav .nav-link {
    padding: 12px 16px;
  }
}