// app/components/admin/sidebar-widgets/ContactCtaWidget.tsx
'use client';
import { ContactCtaWidgetProps } from '@/lib/page-builder/container-types';

export default function ContactCtaWidget({
  title = 'Get In Touch',
  description,
  phone,
  email,
  buttonText = 'Contact Us',
  buttonLink = '/contact',
}: ContactCtaWidgetProps) {
  return (
    <div className="sidebar-widget bg-blue-50 border border-blue-100 rounded-xl p-4">
      {title && <h3 className="text-base font-semibold text-blue-900 mb-2">{title}</h3>}
      {description && <p className="text-sm text-blue-700 mb-3">{description}</p>}
      <div className="space-y-2 mb-3">
        {phone && (
          <a href={`tel:${phone}`} className="flex items-center gap-2 text-sm text-blue-800 hover:underline">
            <span>📞</span> {phone}
          </a>
        )}
        {email && (
          <a href={`mailto:${email}`} className="flex items-center gap-2 text-sm text-blue-800 hover:underline">
            <span>✉️</span> {email}
          </a>
        )}
      </div>
      {buttonText && (
        <a
          href={buttonLink}
          className="block w-full text-center bg-blue-600 text-white text-sm font-medium py-2 rounded-lg hover:bg-blue-700 transition-colors"
        >
          {buttonText}
        </a>
      )}
    </div>
  );
}