import React from 'react';
import { X } from 'lucide-react';

const CookieConsent = ({ onClose }) => {
  const handleAccept = () => {
    onClose();
  };

  const handleDeny = () => {
    onClose();
  };

  return (
    <div className="cookie-consent">
      <button 
        onClick={onClose}
        className="absolute top-4 right-4 text-gray-400 hover:text-gray-600"
      >
        <X className="w-5 h-5" />
      </button>
      
      <h3 className="text-lg font-semibold text-gray-900 mb-3">
        This site uses cookies
      </h3>
      
      <p className="text-sm text-gray-600 mb-4">
        We and selected third parties use cookies (or similar technologies) for technical purposes, to enhance and analyze site usage, to support our marketing efforts, and for other purposes described below.
      </p>
      
      <p className="text-sm text-gray-600 mb-6">
        By clicking "Accept all", you agree to the storing of cookies on your device for these purposes.
      </p>
      
      <div className="flex space-x-3">
        <button 
          onClick={handleDeny}
          className="flex-1 px-4 py-2 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 font-medium"
        >
          Deny
        </button>
        <button 
          onClick={handleAccept}
          className="flex-1 btn-secondary"
        >
          Accept all
        </button>
      </div>
    </div>
  );
};

export default CookieConsent;