// 1. Get all the necessary elements
const switchInput = document.getElementById('sectionstatus');
const corporateButtons = document.querySelector('.corporate-buttons');
const candidateButtonWrapper = document.querySelector('.candidate-button-wrapper');
const forCorporateSpan = document.getElementById('forcorporate');
const forCandidateSpan = document.getElementById('forcandidate');
// 2. Define the function that runs when the switch changes
function toggleSections() {
// 'checked' is TRUE when the switch is toggled to the 'For Candidate' side
const isCandidate = switchInput.checked;
if (isCandidate) {
// CANDIDATE VIEW: Show Candidate, Hide Corporate
candidateButtonWrapper.classList.remove('hidden');
corporateButtons.classList.add('hidden');
// Apply highlight styles
forCandidateSpan.classList.add('bold');
forCorporateSpan.classList.remove('bold');
} else {
// CORPORATE VIEW: Show Corporate, Hide Candidate
corporateButtons.classList.remove('hidden');
candidateButtonWrapper.classList.add('hidden');
// Apply highlight styles (Corporate is default)
forCorporateSpan.classList.add('bold');
forCandidateSpan.classList.remove('bold');
}
}
// 3. Attach the function to the switch's 'change' event
if (switchInput) {
switchInput.addEventListener('change', toggleSections);
// 4. Run once on page load to ensure the initial state is correct (Corporate is default)
toggleSections();
}
