/* ========================================
 * Global Styles - Dispo Genius
 * ======================================== */

/* ========================================
 * THIN SCROLLBAR: For WebKit browsers
 *
 * Applies thin scrollbar styling to elements with scrollbar-width: thin.
 * This provides consistent thin scrollbars across all browsers.
 * ======================================== */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: var(--color-border-default);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--color-border-strong);
}

/* ========================================
 * ACCESSIBILITY: Reduced Motion Support
 *
 * Respects user's system preference for reduced motion.
 * When enabled, all transitions and animations are effectively instant.
 * This follows the pattern established in AnimatedHeadline.tsx.
 * ======================================== */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}