Rocky_Mountain_Vending/artifacts/backups/formatting/components/footer.tsx

import Link from "next/link"
import Image from "next/image"
import { Facebook, Twitter, Linkedin, Youtube } from "lucide-react"
import { Button } from "./ui/button"

export function Footer() {
  const currentYear = new Date().getFullYear()

  return (
    <footer className="border-t border-border bg-[var(--footer-bg)] shadow-inner py-8">
      <div className="container mx-auto px-4 lg:px-6 py-16">
        <div className="grid gap-12 md:grid-cols-4">
          {/* Company Info */}
          <div className="md:col-span-2">
            <Image src="/rmv-logo.png" alt="Rocky Mountain Vending" width={200} height={50} className="mb-6" />
            <p className="text-sm text-muted-foreground mb-6 max-w-md leading-relaxed">
              Providing FREE vending machine services to businesses across Utah since 2019. Zero cost, hassle-free
              service, and dedicated support.
            </p>
            <div className="flex flex-col gap-3 text-sm text-muted-foreground mb-6">
              <a href="tel:+14352339668" className="hover:text-[#c4142c] transition-colors">
                📞 (435) 233-9668
              </a>
              <a
                href="mailto:info@rockymountainvending.com"
                className="hover:text-[#c4142c] transition-colors"
              >
                ✉️ info@rockymountainvending.com
              </a>
              <a
                href="http://rockymountainvending.com/"
                className="hover:text-[#c4142c] transition-colors"
                target="_blank"
                rel="noopener noreferrer"
              >
                🌐 rockymountainvending.com
              </a>
            </div>
            <div className="flex flex-wrap gap-6">
              <a
                href="https://www.facebook.com/RealRockyMountainVending"
                target="_blank"
                rel="noopener noreferrer"
                className="text-muted-foreground hover:text-[#c4142c] transition-colors flex items-center gap-2 text-sm"
                aria-label="Facebook"
              >
                <Facebook className="h-5 w-5" />
                <span>Facebook</span>
              </a>
              <a
                href="https://x.com/RMVVending/"
                target="_blank"
                rel="noopener noreferrer"
                className="text-muted-foreground hover:text-[#c4142c] transition-colors flex items-center gap-2 text-sm"
                aria-label="X (Twitter)"
              >
                <Twitter className="h-5 w-5" />
                <span>X</span>
              </a>
              <a
                href="https://www.linkedin.com/company/rocky-mountain-vending-llc"
                target="_blank"
                rel="noopener noreferrer"
                className="text-muted-foreground hover:text-[#c4142c] transition-colors flex items-center gap-2 text-sm"
                aria-label="LinkedIn"
              >
                <Linkedin className="h-5 w-5" />
                <span>LinkedIn</span>
              </a>
              <a
                href="https://www.youtube.com/channel/UCiaAxaeGBEezZd6BXNIKuYQ"
                target="_blank"
                rel="noopener noreferrer"
                className="text-muted-foreground hover:text-[#c4142c] transition-colors flex items-center gap-2 text-sm"
                aria-label="YouTube"
              >
                <Youtube className="h-5 w-5" />
                <span>YouTube</span>
              </a>
            </div>
          </div>

          {/* Services */}
          <div className="footer-section px-4 py-4">
            <h3 className="font-semibold mb-5 text-base">Services</h3>
            <ul className="space-y-3 text-sm text-muted-foreground">
              <li>
                <Link href="/services/repairs" className="hover:text-[#c4142c] transition-colors inline-block py-0.5">
                  Vending Machine Repairs
                </Link>
              </li>
              <li>
                <Link href="/services/moving" className="hover:text-[#c4142c] transition-colors inline-block py-0.5">
                  Vending Machine Moving
                </Link>
              </li>
              <li>
                <Link href="/services/parts" className="hover:text-[#c4142c] transition-colors inline-block py-0.5">
                  Vending Machine Parts
                </Link>
              </li>
              <li>
                <Link href="/vending-machines" className="hover:text-[#c4142c] transition-colors inline-block py-0.5">
                  Machine Sales
                </Link>
              </li>
              <li>
                <Link href="/services" className="hover:text-[#c4142c] transition-colors inline-block py-0.5">
                  All Services
                </Link>
              </li>
            </ul>
          </div>

          {/* Service Areas */}
          <div className="footer-section px-4 py-4">
            <h3 className="font-semibold mb-5 text-base">Service Areas</h3>
            <ul className="space-y-3 text-sm text-muted-foreground">
              <li>
                <Link href="/vending-machines-salt-lake-city-utah" className="hover:text-[#c4142c] transition-colors inline-block py-0.5">
                  Salt Lake City, UT
                </Link>
              </li>
              <li>
                <Link href="/vending-machines-ogden-utah" className="hover:text-[#c4142c] transition-colors inline-block py-0.5">
                  Ogden, UT
                </Link>
              </li>
              <li>
                <Link href="/vending-machines-provo-utah" className="hover:text-[#c4142c] transition-colors inline-block py-0.5">
                  Provo, UT
                </Link>
              </li>
              <li>
                <Link href="/vending-machines-sandy-utah" className="hover:text-[#c4142c] transition-colors inline-block py-0.5">
                  Sandy, UT
                </Link>
              </li>
              <li>
                <Link href="/vending-machines-west-valley-city-utah" className="hover:text-[#c4142c] transition-colors inline-block py-0.5">
                  West Valley City, UT
                </Link>
              </li>
              <li className="pt-2 border-t border-border/50">
                <Link href="/service-areas" className="text-secondary hover:text-[#c4142c] transition-colors font-medium inline-block py-0.5">
                  View all 20 cities →
                </Link>
              </li>
            </ul>
          </div>
        </div>

        <div className="border-t border-border mt-12 pt-8 text-center text-sm text-muted-foreground">
          <p className="mb-2">© {currentYear} Rocky Mountain Vending LLC. All rights reserved.</p>
          <p className="leading-relaxed">
            Free Vending Machines Utah | Vending Machine Supplier | Vending Machine Service & Repair
          </p>
        </div>
      </div>
    </footer>
  )
}