import { Star, MapPin } from "lucide-react";

export function Highlights() {
    return (
        <div className="space-y-6 pb-8 border-b-2 border-gray-100">
            <div className="flex gap-4 items-start">
                <div className="p-2 border-2 border-black bg-[#E7FE78]">
                    <Star className="w-6 h-6" />
                </div>
                <div>
                    <h3 className="font-medium text-lg">Top rated host</h3>
                    <p className="text-gray-600 text-sm">John has received 5-star ratings from 95% of recent guests.</p>
                </div>
            </div>
            <div className="flex gap-4 items-start">
                <div className="p-2 border-2 border-black bg-white">
                    <MapPin className="w-6 h-6" />
                </div>
                <div>
                    <h3 className="font-medium text-lg">Great location</h3>
                    <p className="text-gray-600 text-sm">100% of recent guests gave the location a 5-star rating.</p>
                </div>
            </div>
        </div>
    );
}