"use client";

import classnames from 'classnames';
import Button from '@/components/Button';

import { Schibsted_Grotesk } from 'next/font/google'
const font = Schibsted_Grotesk({ subsets: ['latin'] })

interface RecentClaimsWidgetProps {
}

const RecentClaimsWidget = () => {
    
  return (
    <div className="2xl:min-w-[48vw] xl:min-w-[45vw] flex z-1">
        <div className="w-full flex flex-col px-4 py-3 border border-6 border-bronze rounded-4xl space-y-2">
            <div className="w-full flex justify-center text-2xl text-atmosphere font-semibold">
                <p>Recent Claims</p>
            </div>
            <div className={classnames("w-full flex flex-col px-2 text-lg", font.className)}>
                <div className="flex">
                    <div className="w-1/6">
                        <Button className="hover:text-bronze text-bluemana">
                            2907457
                        </Button>
                    </div>
                    <div className="w-2/6">
                        LA'BLAH, ROBERT 
                    </div>
                    <div className="w-2/6">
                        HOUSE, GREGORY
                    </div>
                    <div className="w-1/6">
                        07/21/2025
                    </div>
                </div>
                <div className="flex">
                    <div className="w-1/6">
                        <Button className="hover:text-bronze text-bluemana">
                            2907201
                        </Button>
                    </div>
                    <div className="w-2/6">
                        LA'BLAH, ROBERT 
                    </div>
                    <div className="w-2/6">
                        QUINN, MICHAELA
                    </div>
                    <div className="w-1/6">
                        07/02/2025
                    </div>
                </div>
                <div className="flex">
                    <div className="w-1/6">
                        <Button className="hover:text-bronze text-bluemana">
                            2905891
                        </Button>
                    </div>
                    <div className="w-2/6">
                        LA'BLAH, JENNY
                    </div>
                    <div className="w-2/6">
                        HOWSER, DOGGIE
                    </div>
                    <div className="w-1/6">
                        05/15/2025
                    </div>
                </div>
                <div className="flex">
                    <div className="w-1/6">
                        <Button className="hover:text-bronze text-bluemana">
                            2905547
                        </Button>
                    </div>
                    <div className="w-2/6">
                        LA'BLAH, ROBERT 
                    </div>
                    <div className="w-2/6">
                        HOUSE, GREGORY
                    </div>
                    <div className="w-1/6">
                        04/29/2025
                    </div>
                </div>
            </div>
            <div className="w-full flex justify-end text-platinum font-semibold">
                <Button className="mr-2 underline hover:text-bronze">
                    View All Claims
                </Button>
            </div>
        </div>
    </div>
  );
};

export default RecentClaimsWidget;