/* === Base / Global Styles === */

/* Smooth Scrolling */
html {
  scroll-behavior: smooth;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: #f8f8f8;
}
::-webkit-scrollbar-thumb {
  background: #00b964;
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: #02a95c;
}

/* Input Focus States */
input:focus, textarea:focus {
  border-color: #00b964 !important;
  box-shadow: 0 0 0 3px rgba(0, 185, 100, 0.1);
}

/* Selection Color */
::selection {
  background-color: #00b964;
  color: white;
}

/* Focus Visible for Accessibility */
button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 2px solid #00b964;
  outline-offset: 2px;
}

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  html {
    scroll-behavior: auto;
  }
}

/* Print Styles */
@media print {
  nav, footer, #mobile-donate-bar, .floating-element {
    display: none !important;
  }
}

/* Mobile Layout Fixes */
html, body {
  overflow-x: hidden;
  max-width: 100vw;
}

/* Prevent horizontal overflow */
.max-w-7xl {
  max-width: 100%;
}

@media (min-width: 1280px) {
  .max-w-7xl {
    max-width: 80rem;
  }
}

/* Fix mobile images */
img {
  max-width: 100%;
  height: auto;
}

/* Mobile text truncation */
@media (max-width: 640px) {
  .truncate-mobile {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* Hide scrollbar for tabs */
.scrollbar-hide {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
.scrollbar-hide::-webkit-scrollbar {
  display: none;
}