@props(['title','date', 'document', 'note'])

<div class="row mt-4">
    <h5 class="text-primary"> Counter Offer </h5>
    <div class="col-md-3">
        <x-input-label for="Title" :value="__('Title')" />
        <x-text-input name="{{ $title }}" placeholder="Enter Title" />
    </div>
    <div class="col-md-3">
        <x-input-label for="Date" :value="__('Date')" />
        <x-text-input type="date" name="{{ $date }}" />
    </div>
    <div class="col-md-2">
        <x-input-label for="Document" :value="__('Document')" />
        <x-text-input type="file" name="{{ $document }}" />
    </div>
    <div class="col-md-4 pe-5">
        <x-text-area name="{{ $note }}" rows="2" placeholder="Write your notes here" />
    </div>
    <span class="position-absolute px-1 w-auto mt-4 pt-4" style="right: 2.5% !important ;">
        <i
            class="border border-1 border-light fa-plus fa-solid p-1 py-2 rounded-5 text-primary mb-2 add-counter-offer-btn"></i>
    </span>
</div>