/* Custom styles and overrides */

/* Smooth scroll offset for fixed nav */
section[id] {
  scroll-margin-top: 80px;
}

/* Selection color */
::selection {
  background: #d97706;
  color: #3b0419;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
}
::-webkit-scrollbar-track {
  background: #fdf2f8;
}
::-webkit-scrollbar-thumb {
  background: #be185d;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #9d174d;
}

/* Reduce motion for accessibility */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
  .reveal-hidden {
    opacity: 1 !important;
    transform: none !important;
  }
  html {
    scroll-behavior: auto;
  }
}

/* Focus visible styles */
*:focus-visible {
  outline: 2px solid #d97706;
  outline-offset: 2px;
}

/* Image lazy loading fade */
img[loading="lazy"] {
  transition: opacity 0.3s ease;
}
img[loading="lazy"]:not([src]) {
  opacity: 0;
}
</style>

<sm-file path="script.js">
(function () {
  'use strict';

  // Navbar scroll behavior
  const navbar = document.getElementById('navbar');
  let lastScroll = 0;

  function handleNavbarScroll() {
    const currentScroll = window.pageYOffset;
    if (currentScroll > 60) {
      navbar.classList.add('navbar-scrolled');
    } else {
      navbar.classList.remove('navbar-scrolled');
    }
    lastScroll = currentScroll;
  }

  window.addEventListener('scroll', handleNavbarScroll, { passive: true });

  // Mobile menu toggle
  const menuBtn = document.getElementById('menuBtn');
  const mobileMenu = document.getElementById('mobileMenu');
  const mobileLinks = mobileMenu.querySelectorAll('a');

  menuBtn.addEventListener('click', function () {
    const isOpen = mobileMenu.classList.contains('open');
    mobileMenu.classList.toggle('open');
    menuBtn.classList.toggle('hamburger-active');
  });

  // Close mobile menu on link click
  mobileLinks.forEach(function (link) {
    link.addEventListener('click', function () {
      mobileMenu.classList.remove('open');
      menuBtn.classList.remove('hamburger-active');
    });
  });

  // Scroll reveal (progressive enhancement — only when JS is enabled)
  const prefersReducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)').matches;

  if (!prefersReducedMotion) {
    const revealElements = document.querySelectorAll('.reveal');

    function revealOnScroll() {
      const windowHeight = window.innerHeight;
      revealElements.forEach(function (el) {
        const elementTop = el.getBoundingClientRect().top;
        const revealPoint = 100;
        if (elementTop < windowHeight - revealPoint) {
          el.classList.remove('reveal-hidden');
          el.classList.add('reveal');
        }
      });
    }

    // Initial check
    revealOnScroll();
    window.addEventListener('scroll', revealOnScroll, { passive: true });
  } else {
    // If reduced motion is preferred, ensure all elements are visible
    document.querySelectorAll('.reveal').forEach(function (el) {
      el.classList.remove('reveal-hidden');
      el.classList.add('reveal');
    });
  }

  // Contact form
  const contactForm = document.getElementById('contactForm');
  const formSuccess = document.getElementById('formSuccess');

  if (contactForm) {
    contactForm.addEventListener('submit', function (e) {
      e.preventDefault();

      // Simulate form submission
      const submitBtn = contactForm.querySelector('button[type="submit"]');
      const originalText = submitBtn.textContent;
      submitBtn.textContent = 'Sending...';
      submitBtn.disabled = true;

      setTimeout(function () {
        contactForm.querySelector('.space-y-5').style.display = 'none';
        formSuccess.classList.remove('hidden');
        submitBtn.textContent = originalText;
        submitBtn.disabled = false;
      }, 800);
    });
  }

  // Smooth scroll for anchor links
  document.querySelectorAll('a[href^="#"]').forEach(function (anchor) {
    anchor.addEventListener('click', function (e) {
      const targetId = this.getAttribute('href');
      if (targetId === '#') return;
      const target = document.querySelector(targetId);
      if (target) {
        e.preventDefault();
        target.scrollIntoView({
          behavior: window.matchMedia('(prefers-reduced-motion: reduce)').matches ? 'auto' : 'smooth',
          block: 'start'
        });
      }
    });
  });
})();
</script>