const browser = require('../browser');

module.exports = async ({ selector, color = '#ff6b6b', duration = 500 }) => {
  if (!selector) throw new Error('Selector é obrigatório');
  await browser.start();
  
  const p = await browser.ensurePage();
  
  const result = await p.evaluate(({ sel, clr, dur }) => {
    const el = document.querySelector(sel);
    if (!el) return { success: false, error: 'Element not found' };
    
    const rect = el.getBoundingClientRect();
    const highlight = document.createElement('div');
    highlight.id = 'mcp-highlight-' + Date.now();
    highlight.style.cssText = `
      position: fixed;
      left: ${rect.left}px;
      top: ${rect.top}px;
      width: ${rect.width}px;
      height: ${rect.height}px;
      border: 3px solid ${clr};
      border-radius: 4px;
      pointer-events: none;
      z-index: 999999;
      box-shadow: 0 0 10px ${clr};
      animation: mcp-pulse ${dur}ms ease-out;
    `;
    
    const style = document.createElement('style');
    style.textContent = '@keyframes mcp-pulse { 0% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(1.1); } }';
    document.head.appendChild(style);
    document.body.appendChild(highlight);
    
    setTimeout(() => highlight.remove(), dur);
    return { success: true };
  }, { sel: selector, clr: color, dur: duration });
  
  if (!result.success) throw new Error(result.error);
  return { success: true, action: 'highlight_element', selector, color };
};