@extends('Layout.mainlayout')

@section('content')
<div class="policy-detail-container">
    <!-- Header -->
    <div class="policy-detail-header">
        <div class="policy-header-left">
            <button class="back-button">←</button>
            <span class="policy-id">158896656</span>
            <span class="policy-divider">|</span>
            <span class="policy-type">Group Health Insurance</span>
            <span class="status-badge-header">Active</span>
        </div>
        <div class="policy-header-right">
            <div class="premium-due-box">
                <div class="premium-due-label">Premium Due Date</div>
                <div class="premium-due-date">Feb 04 2025</div>
            </div>
            <button class="header-btn pay-now-btn">NIID REPUSH</button>
            <button class="header-btn ebook-btn">
                <span>NAICOM REPUSH</span>
                <span>⬇</span>
            </button>
            <button class="header-btn more-options-btn">⋮</button>
        </div>
    </div>


    <!-- Policy Overview Card -->
    <div class="policy-section-card">
        <div class="section-header-row">
            <div class="section-title-row">
                <input type="checkbox" class="section-checkbox" checked>
                <h3 class="section-title-text">Policy Overview</h3>
            </div>
        </div>

        <div class="info-grid">
            <div class="info-item">
                <div class="info-label">Policy Holder</div>
                <div class="info-value">Ram Prasad</div>
            </div>

            <div class="info-item">
                <div class="info-label">state</div>
                <div class="info-value">Lagos</div>
            </div>
            <div class="info-item">
                <div class="info-label">Email ID</div>
                <div class="info-value">Ramkumar@gmail.com</div>
            </div>
            <div class="info-item">
                <div class="info-label">Phone Number</div>
                <div class="info-value">+ 95686 98588</div>
            </div>
            <div class="info-item">
                <div class="info-label">Address</div>
                <div class="info-value">No 19, Veen Nagar, Bangalore</div>
            </div>

            <div class="info-item">
                <div class="info-label">sex</div>
                <div class="info-value">Male</div>
            </div>

            <div class="info-item">
                <div class="info-label">Date of Birth</div>
                <div class="info-value">12 june 1999</div>
            </div>

            <div class="info-item">
                <div class="info-label">Identificatin Type</div>
                <div class="info-value">NIN</div>
            </div>

            <div class="info-item">
                <div class="info-label">Identificatin N.</div>
                <div class="info-value">2386748956</div>
            </div>

            <div class="info-item">
                <div class="info-label">Occupatin</div>
                <div class="info-value">Developer</div>
            </div>

            <div class="info-item">
                <div class="info-label">customer type</div>
                <div class="info-value">Guest</div>
            </div>

            <div class="info-item">
                <div class="info-label">Transaction Id</div>
                <div class="info-value">ET085JGHSA</div>
            </div>

            <div class="info-item">
                <div class="info-label">Effective Date</div>
                <div class="info-value">02/30/2024</div>
            </div>
            <div class="info-item">
                <div class="info-label">Renewal Date</div>
                <div class="info-value">02/30/2025</div>
            </div>
            <div class="info-item">
                <div class="info-label">Premium Amount</div>
                <div class="info-value">₹ 12000 / per year</div>
            </div>
            <div class="info-item">
                <div class="info-label">Certificate No</div>
                <div class="info-value">68633</div>
            </div>

            <div class="info-item">
                <div class="info-label">Naicom Unique Id</div>
                <div class="info-value">2386748956</div>
            </div>

            <div class="info-item">
                <div class="info-label">Policy No</div>
                <div class="info-value">234567</div>
            </div>

            <div class="info-item">
                <div class="info-label">Sale type</div>
                <div class="info-value">Guest</div>
            </div>
            
        </div>
    </div>

    <!-- vichle Overview Card -->
    <div class="policy-section-card">
        <div class="section-header-row">
            <div class="section-title-row">
                <h3 class="section-title-text">Vechle Details</h3>
            </div>
        </div>


        

        <div class="info-grid">

            <div class="info-item">
                <div class="info-label">Policy Type</div>
                <div class="info-value">Comprehensive Insurance</div>
            </div>
            <div class="info-item">
                <div class="info-label">Vehicle Value</div>
                <div class="info-value">23,000</div>
            </div>
            <div class="info-item">
                <div class="info-label">Vehicle Model</div>
                <div class="info-value">Cigno 202</div>
            </div>

            <div class="info-item">
                <div class="info-label">Car Make</div>
                <div class="info-value">Toyota</div>
            </div>

            <div class="info-item">
                <div class="info-label">Year Make</div>
                <div class="info-value">22024</div>
            </div>

            <div class="info-item">
                <div class="info-label">Registratin No</div>
                <div class="info-value">3478708965</div>
            </div>
            <div class="info-item">
                <div class="info-label">Engine No</div>
                <div class="info-value">95686y98588</div>
            </div>

            <div class="info-item">
                <div class="info-label">Chasis</div>
                <div class="info-value">19Bangalore</div>
            </div>

            <div class="info-item">
                <div class="info-label">color</div>
                <div class="info-value">Black</div>
            </div>

            <div class="info-item">
                <div class="info-label">Vehicle Type</div>
                <div class="info-value">Bus</div>
            </div>

            <div class="info-item">
                <div class="info-label">Vehicle Usage</div>
                <div class="info-value">Private</div>
            </div>   
        </div>
    </div>

    <!-- Premium Details Card -->
    <div class="policy-section-card">
        <div class="section-header-row">
            <div class="section-title-row">
                <input type="checkbox" class="section-checkbox" checked>
                <h3 class="section-title-text">Payment Details</h3>
            </div>
        </div>

        <div class="premium-main-section">
            <div class="premium-amount-box">
                <div class="premium-amount-label">Total Amount Paid</div>
                <div class="premium-amount-value">₦ 12000</div>
                <div class="premium-due-alert-text">Create At: Feb 04 2025</div>
            </div>
        </div>

        <div class="premium-info-grid">

            <div class="info-item">
                <div class="info-label">Payment Type</div>
                <div class="info-value">Guest</div>
            </div>

            <div class="info-item">
                <div class="info-label">serialNo</div>
                <div class="info-value">12000</div>
            </div>
            <div class="info-item">
                <div class="info-label">NIID Status</div>
                <div class="info-value">success</div>
            </div>
            <div class="info-item">
                <div class="info-label">Referral Code</div>
                <div class="info-value">452026</div>
            </div>
            <div class="info-item">
                <div class="info-label">ReferreD By</div>
                <div class="info-value">JOHNE</div>
                <div class="info-label">Earn: ₦3500</div>
            </div>
        </div>
    </div>
</div>

@endsection