Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+ const sliders = document.querySelectorAll('input[type="range"]');
+ const calculateBtn = document.getElementById('calculate');
+ const result = document.getElementById('result');
+ const finalScore = document.getElementById('final-score');
+ const recommendation = document.getElementById('recommendation');
+
+ // Update slider values
+ sliders.forEach(slider => {
+ slider.addEventListener('input', (e) => {
+ e.target.nextElementSibling.textContent = e.target.value;
+ });
+ });
+
+ calculateBtn.addEventListener('click', () => {
+ const communicationScore = parseInt(document.getElementById('communication').value);
+ const culturalScore = parseInt(document.getElementById('cultural').value);
+ const redFlags = document.querySelectorAll('input[type="checkbox"]:checked').length;
+
+ // Calculate final score
+ let score = Math.round(((communicationScore + culturalScore) / 20 * 100) - (redFlags * 15));
+ score = Math.max(0, Math.min(score, 100));
+
+ // Update score circle
+ const scoreCircle = document.querySelector('.score-circle');
+ scoreCircle.style.background = `conic-gradient(var(--primary) ${score}%, var(--background) ${score}%)`;
+
+ // Show result with animation
+ result.classList.remove('hidden');
+ result.scrollIntoView({ behavior: 'smooth' });
+
+ // Animate score counter
+ let currentScore = 0;
+ const interval = setInterval(() => {
+ if (currentScore >= score) {
+ clearInterval(interval);
+ } else {
+ currentScore++;
+ finalScore.textContent = currentScore;
+ }
+ }, 20);
+
+ // Generate recommendation
+ let recommendationText = '';
+ if (score >= 80) {
+ recommendationText = "¡Muy bien! This relationship shows great potential. Keep nurturing it!";
+ } else if (score >= 60) {
+ recommendationText = "There are positive signs, but proceed with caution and keep communication open.";
+ } else if (score >= 40) {
+ recommendationText = "Consider having a serious discussion about your concerns before proceeding.";
+ } else {
+ recommendationText = "There are significant red flags. We recommend reconsidering this relationship.";
+ }
+
+ recommendation.textContent = recommendationText;
+ });
+ });
