script.js

const passwordEl = document.getElementById('password');
const copyBtn = document.getElementById('copyBtn');
const lengthEl = document.getElementById('length');
const lengthValue = document.getElementById('lengthValue');
const uppercaseEl = document.getElementById('uppercase');
const lowercaseEl = document.getElementById('lowercase');
const numbersEl = document.getElementById('numbers');
const symbolsEl = document.getElementById('symbols');
const generateBtn = document.getElementById('generateBtn');
const strengthFill = document.getElementById('strengthFill');
const strengthLabel = document.getElementById('strengthLabel');
const copied = document.getElementById('copied');

const charSets = {
  uppercase: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ',
  lowercase: 'abcdefghijklmnopqrstuvwxyz',
  numbers: '0123456789',
  symbols: '!@#$%^&*()_+-=[]{}|;:,.<>?',
};

lengthEl.addEventListener('input', () => { lengthValue.textContent = lengthEl.value; });

function generatePassword() {
  const length = parseInt(lengthEl.value);
  let pool = '';
  if (uppercaseEl.checked) pool += charSets.uppercase;
  if (lowercaseEl.checked) pool += charSets.lowercase;
  if (numbersEl.checked) pool += charSets.numbers;
  if (symbolsEl.checked) pool += charSets.symbols;
  if (!pool) { passwordEl.value = 'Select at least one option'; return; }

  let password = '';
  const array = new Uint32Array(length);
  crypto.getRandomValues(array);
  for (let i = 0; i < length; i++) {
    password += pool[array[i] % pool.length];
  }
  passwordEl.value = password;
  updateStrength(password);
}

function updateStrength(pwd) {
  let score = 0;
  if (pwd.length >= 8) score++;
  if (pwd.length >= 16) score++;
  if (/[A-Z]/.test(pwd) && /[a-z]/.test(pwd)) score++;
  if (/[0-9]/.test(pwd)) score++;
  if (/[^A-Za-z0-9]/.test(pwd)) score++;

  const levels = [
    { width: '20%', color: '#ef4444', label: 'Very Weak' },
    { width: '40%', color: '#f59e0b', label: 'Weak' },
    { width: '60%', color: '#eab308', label: 'Fair' },
    { width: '80%', color: '#84cc16', label: 'Strong' },
    { width: '100%', color: '#10b981', label: 'Very Strong' },
  ];
  const level = levels[Math.min(score, 4)];
  strengthFill.style.width = level.width;
  strengthFill.style.background = level.color;
  strengthLabel.textContent = `Strength: ${level.label}`;
}

copyBtn.addEventListener('click', () => {
  if (!passwordEl.value) return;
  navigator.clipboard.writeText(passwordEl.value).then(() => {
    copied.classList.add('show');
    setTimeout(() => copied.classList.remove('show'), 2000);
  });
});

generateBtn.addEventListener('click', generatePassword);
generatePassword();