import React from 'react';
import { Shield, Lock, Truck, RefreshCw } from 'lucide-react';

export function MinimalFooter() {
  const storeName = (window as any).woonoowCustomer?.storeName || (window as any).woonoowCustomer?.siteTitle || 'Store';
  
  return (
    <footer className="minimal-footer bg-gray-50 border-t py-6">
      <div className="container mx-auto px-4">
        {/* Trust Badges */}
        <div className="flex flex-wrap justify-center gap-6 mb-4">
          <div className="flex items-center gap-2 text-sm text-gray-600">
            <Shield className="w-4 h-4" />
            <span>Secure Checkout</span>
          </div>
          <div className="flex items-center gap-2 text-sm text-gray-600">
            <Lock className="w-4 h-4" />
            <span>SSL Encrypted</span>
          </div>
          <div className="flex items-center gap-2 text-sm text-gray-600">
            <Truck className="w-4 h-4" />
            <span>Free Shipping</span>
          </div>
          <div className="flex items-center gap-2 text-sm text-gray-600">
            <RefreshCw className="w-4 h-4" />
            <span>Easy Returns</span>
          </div>
        </div>

        {/* Policy Links */}
        <div className="flex flex-wrap justify-center gap-4 mb-4">
          <a href="/privacy-policy" className="text-sm text-gray-600 hover:text-gray-900 no-underline">
            Privacy Policy
          </a>
          <a href="/terms-of-service" className="text-sm text-gray-600 hover:text-gray-900 no-underline">
            Terms of Service
          </a>
          <a href="/refund-policy" className="text-sm text-gray-600 hover:text-gray-900 no-underline">
            Refund Policy
          </a>
        </div>

        {/* Copyright */}
        <div className="text-center text-sm text-gray-500">
          © {new Date().getFullYear()} {storeName}. All rights reserved.
        </div>
      </div>
    </footer>
  );
}
