/* Custom Styles for BSR FAB - Light Mode */

:root {
  --nav-height: 80px;
}

html {
  scroll-behavior: smooth;
}

body {
  overflow-x: hidden;
}

/* Custom Scrollbar - Light Theme */
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: hsl(0, 0%, 98%);
}
::-webkit-scrollbar-thumb {
  background: hsl(215.4, 16.3%, 65%);
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: hsl(200, 98%, 39%);
}

/* Form Styles Override for Light Theme */
select option {
  background-color: hsl(0, 0%, 100%);
  color: hsl(222.2, 84%, 4.9%);
}

/* Focus styles for accessibility */
*:focus-visible {
  outline: 2px solid hsl(200, 98%, 39%);
  outline-offset: 2px;
}

/* Custom Selection */
::selection {
  background-color: hsl(200, 98%, 39%);
  color: white;
}

/* Animations that are purely CSS (some are handled by GSAP) */
.float-animation {
  animation: float 6s ease-in-out infinite;
}

.float-animation-delayed {
  animation: float 6s ease-in-out infinite;
  animation-delay: 3s;
}

@keyframes float {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-15px); }
  100% { transform: translateY(0px); }
}

/* Input Group Focus Effects */
.input-group:focus-within label {
  color: hsl(200, 98%, 39%);
}

/* Utility to hide elements before GSAP reveals them */
.gs-reveal, .gs-reveal-right, .gs-fade-up, .gs-fade-left, .gs-fade-right, .gs-scale-up {
  opacity: 0;
  visibility: hidden;
}