@extends('layouts.app')

@section('head')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.9.2/html2pdf.bundle.min.js"></script>
@endsection

@section('content')

    <div class="">
        <main>

            <header class="relative isolate bg-stone-50">
                <div class="absolute inset-0 overflow-hidden -z-10" aria-hidden="true">
                    <div class="absolute -mt-16 opacity-50 left-16 top-full transform-gpu blur-3xl xl:left-1/2 xl:-ml-80">
                        <div class="aspect-[1154/678] w-[72.125rem] bg-gradient-to-br {{ $offer->deleted_at == null ? 'from-[#10b981] to-[#a7f3d0]' : 'from-[#fb7185] to-[#e11d48]' }}"
                            style="clip-path: polygon(100% 38.5%, 82.6% 100%, 60.2% 37.7%, 52.4% 32.1%, 47.5% 41.8%, 45.2% 65.6%, 27.5% 23.4%, 0.1% 35.3%, 17.9% 0%, 27.7% 23.4%, 76.2% 2.5%, 74.2% 56%, 100% 38.5%)">
                        </div>
                    </div>
                    <div class="absolute inset-x-0 bottom-0 h-px bg-gray-900/5"></div>
                </div>

                <div class="px-4 py-10 mx-auto sm:px-6 lg:px-16">
                    <div class="flex items-center justify-between max-w-2xl mx-auto gap-x-8 lg:mx-0 lg:max-w-none">
                        <a href="#" class="flex items-center gap-x-6">
                            <span
                                class="inline-flex items-center justify-center w-20 h-20 rounded-full bg-stone-100 ring-1 ring-stone-200">
                                <span
                                    class="text-3xl font-medium leading-none text-stone-600">{{ $offer->company->shortname ?: substr($offer->company->name, 0, 3) }}</span>
                            </span>
                            <h1>
                                <div class="text-lg font-semibold leading-6 text-gray-500"><span
                                        class="text-gray-700">#OF-{{ $offer->number }}</span></div>
                                <div class="mt-1 text-base leading-6 text-gray-900 uppercase truncate">
                                    {{ $offer->company->name }}</div>
                            </h1>
                        </a>
                        <div class="flex items-center gap-x-2 sm:gap-x-3">

                            @if ($offer->type != 'accepted')
                                <x-a-black href="{{ route('offers.edit', $offer->id) }}" click="" type="button"
                                    ring="amber">
                                    BELGEYİ DÜZENLE
                                </x-a-black>
                            @endif
                            <button onclick="printSelectedContent()" type="button"
                                class="inline-flex items-center px-4 py-2 text-xs font-semibold tracking-widest text-white uppercase transition duration-150 ease-in-out bg-gray-800 border border-transparent rounded-md hover:bg-gray-700 hover:ring-2 hover:ring-amber-400 hover:ring-offset-2 focus:bg-gray-700 active:bg-gray-900 focus:outline-none focus:ring-2 focus:ring-amber-500 focus:ring-offset-2">
                                YAZDIR
                            </button>
                            {{--
                        <button onclick="toPdfSelectedContent()" type="button"
                            class="inline-flex items-center px-4 py-2 text-xs font-semibold tracking-widest text-white uppercase transition duration-150 ease-in-out bg-gray-800 border border-transparent rounded-md hover:bg-gray-700 hover:ring-2 hover:ring-amber-400 hover:ring-offset-2 focus:bg-gray-700 active:bg-gray-900 focus:outline-none focus:ring-2 focus:ring-amber-500 focus:ring-offset-2">
                            İNDİR
                        </button>
                        --}}

                            <div class="relative sm:hidden">
                                <button type="button" class="block p-3 -m-3" id="more-menu-button" aria-expanded="false"
                                    aria-haspopup="true">
                                    <span class="sr-only">More</span>
                                    <svg class="w-5 h-5 text-gray-500" viewBox="0 0 20 20" fill="currentColor"
                                        aria-hidden="true">
                                        <path
                                            d="M10 3a1.5 1.5 0 110 3 1.5 1.5 0 010-3zM10 8.5a1.5 1.5 0 110 3 1.5 1.5 0 010-3zM11.5 15.5a1.5 1.5 0 10-3 0 1.5 1.5 0 003 0z" />
                                    </svg>
                                </button>

                                <div class="absolute right-0 z-10 mt-0.5 w-32 origin-top-right rounded-md bg-white py-2 shadow-lg ring-1 ring-gray-900/5 focus:outline-none"
                                    role="menu" aria-orientation="vertical" aria-labelledby="more-menu-button"
                                    tabindex="-1">
                                    <!-- Active: "bg-gray-50", Not Active: "" -->
                                    <button type="button"
                                        class="block w-full px-3 py-1 text-sm leading-6 text-left text-gray-900"
                                        role="menuitem" tabindex="-1" id="more-menu-item-0">Copy URL
                                    </button>
                                    <a href="#" class="block px-3 py-1 text-sm leading-6 text-gray-900"
                                        role="menuitem" tabindex="-1" id="more-menu-item-1">Edit</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </header>

            <div class="px-4 py-4 mx-auto sm:px-6 lg:px-8">

                {{-- BREADCRUMB --}}
                <nav class="flex pb-4" aria-label="Breadcrumb">
                    <ol role="list" class="flex items-center space-x-4 uppercase">
                        <li>
                            <div>
                                <a href="{{ route('dashboard') }}" class="text-gray-400 hover:text-gray-500">
                                    <svg class="flex-shrink-0 w-5 h-5" viewBox="0 0 20 20" fill="currentColor"
                                        aria-hidden="true">
                                        <path fill-rule="evenodd"
                                            d="M9.293 2.293a1 1 0 011.414 0l7 7A1 1 0 0117 11h-1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-3a1 1 0 00-1-1H9a1 1 0 00-1 1v3a1 1 0 01-1 1H5a1 1 0 01-1-1v-6H3a1 1 0 01-.707-1.707l7-7z"
                                            clip-rule="evenodd" />
                                    </svg>
                                    <span class="sr-only">Home</span>
                                </a>
                            </div>
                        </li>
                        <li>
                            <div class="flex items-center">
                                <svg class="flex-shrink-0 w-5 h-5 text-gray-300" fill="currentColor" viewBox="0 0 20 20"
                                    aria-hidden="true">
                                    <path d="M5.555 17.776l8-16 .894.448-8 16-.894-.448z" />
                                </svg>
                                <a href="#"
                                    class="ml-4 text-sm font-medium text-gray-500 hover:text-gray-700">TEKLİFLER</a>
                            </div>
                        </li>
                        <li>
                            <div class="flex items-center">
                                <svg class="flex-shrink-0 w-5 h-5 text-gray-300" fill="currentColor" viewBox="0 0 20 20"
                                    aria-hidden="true">
                                    <path d="M5.555 17.776l8-16 .894.448-8 16-.894-.448z" />
                                </svg>
                                <a href="#" class="ml-4 text-sm font-medium text-gray-500 hover:text-gray-700"
                                    aria-current="page">{{ $offer->company->name }}</a>
                            </div>
                        </li>
                        <li>
                            <div class="flex items-center">
                                <svg class="flex-shrink-0 w-5 h-5 text-gray-300" fill="currentColor" viewBox="0 0 20 20"
                                    aria-hidden="true">
                                    <path d="M5.555 17.776l8-16 .894.448-8 16-.894-.448z" />
                                </svg>
                                <a href="" class="ml-4 text-sm font-medium text-gray-500 hover:text-gray-700"
                                    aria-current="page">OF-{{ $offer->number }}</a>
                            </div>
                        </li>
                    </ol>
                </nav>

                <div
                    class="grid items-start grid-cols-1 grid-rows-1 mx-auto gap-x-8 gap-y-8 lg:mx-0 lg:max-w-none lg:grid-cols-3">

                    <!--SIDEBAR-->
                    <div class="lg:col-start-3 lg:row-end-1">
                        <h2 class="sr-only">Özet</h2>
                        <div class="bg-white rounded-lg shadow-sm ring-1 ring-stone-300">
                            <dl class="flex flex-wrap">
                                <div class="flex-auto pt-6 pl-6">
                                    <dt class="text-lg font-semibold text-gray-900">TEKLİF ÖZETİ</dt>
                                    <dd class="grid gap-1 mt-2 text-left text-gray-500 justify-items-start">
                                        <div class="flex flex-wrap items-center font-medium text-gray-900 gap-x-3">
                                            @if ($offer->type == 'new' || $offer->type == 'edited')
                                                <span
                                                    class="items-center px-3 py-1 text-lg font-medium tracking-tighter uppercase rounded-md bg-amber-50 text-amber-500 ring-1 ring-inset ring-amber-300">
                                                    Taslak
                                                </span>
                                            @elseif($offer->type == 'send')
                                                <span
                                                    class="items-center px-3 py-1 text-lg font-medium tracking-tighter uppercase rounded-md bg-sky-50 text-sky-500 ring-1 ring-inset ring-sky-300">
                                                    Teklif gönderildi
                                                </span>
                                            @elseif($offer->type == 'accepted')
                                                <span
                                                    class="items-center px-3 py-1 text-lg font-medium tracking-tighter uppercase rounded-md bg-emerald-50 text-emerald-500 ring-1 ring-inset ring-emerald-300">
                                                    Kabul edildi
                                                </span>
                                            @elseif($offer->type == 'rejected')
                                                <span
                                                    class="items-center px-3 py-1 text-lg font-medium tracking-tighter uppercase rounded-md bg-rose-50 text-rose-500 ring-1 ring-inset ring-rose-300">
                                                    Reddedildi
                                                </span>
                                            @endif
                                        </div>
                                        <div class="flex flex-wrap items-center font-medium text-gray-900 gap-x-3">
                                            <label for="number"
                                                class="block text-sm font-medium leading-6 text-gray-500">TEKLİF
                                                NO:</label>
                                            <span>OF-{{ $offer->number }}</span>
                                        </div>
                                        <div class="flex flex-wrap items-center font-medium text-gray-900 gap-x-3">
                                            <label for="date"
                                                class="block text-sm font-medium leading-6 text-gray-500">OLUŞTURMA
                                                TARİHİ</label>
                                            <span>{{ date('d.m.Y', strtotime($offer->date)) }}</span>
                                        </div>
                                        @if ($offer->sending_at != null)
                                            <div class="flex flex-wrap items-center font-medium text-gray-900 gap-x-3">
                                                <label for="date"
                                                    class="block text-sm font-medium leading-6 text-gray-500">GÖNDERME
                                                    TARİHİ</label>
                                                <span>{{ date('d.m.Y', strtotime($offer->sending_at)) }}</span>
                                            </div>
                                        @endif
                                        <div class="flex flex-wrap items-center font-medium text-gray-900 gap-x-3">
                                            <label for="currency"
                                                class="block text-sm font-medium leading-6 text-gray-500">PARA
                                                BİRİMİ:</label>
                                            <span>{{ $offer->currency }}</span>
                                        </div>
                                        @if ($offer->currency != 'TRL')
                                            <div class="flex flex-wrap items-center font-medium text-gray-900 gap-x-3">
                                                <label for="currency"
                                                    class="block text-sm font-medium leading-6 text-gray-500">DÖVİZ
                                                    KURU:</label>
                                                <span>{{ number_format($offer->ex_rate, 4, ',', '.') }}<span
                                                        class="pl-1 text-sm text-stone-400">TRL</span></span>
                                            </div>
                                        @endif
                                        <div class="flex flex-wrap items-center font-medium text-gray-900 gap-x-3">
                                            <label for=""
                                                class="block text-sm font-medium leading-6 text-gray-500">TEKLİF
                                                TUTARI:</label>
                                            @if ($offer->currency != 'TRL')
                                                <span>{{ number_format($offer->ex_total, 2, ',', '.') }}<span
                                                        class="pl-1 text-sm text-stone-400">{{ $offer->currency }}</span></span>
                                            @else
                                                <span>{{ number_format($offer->trl_total, 2, ',', '.') }}<span
                                                        class="pl-1 text-sm text-stone-400">TRL</span></span>
                                            @endif
                                        </div>
                                    </dd>
                                </div>
                            </dl>
                            <div class="px-6 py-6 mt-6 border-t border-gray-900/5">
                                {{-- AKTİVİTELER --}}
                                <div>
                                    <h2 class="flex items-center text-lg leading-6 font-jbmono-bold text-stone-700">
                                        <span class="mr-1 material-symbols-outlined">
                                            history
                                        </span>
                                        Düzenleme Geçmişi
                                    </h2>
                                    <ul role="list" class="mt-6 space-y-6">
                                        <li class="relative flex gap-x-4">
                                            <div
                                                class="relative flex items-center justify-center flex-none w-6 h-6 bg-white">
                                                <div class="h-1.5 w-1.5 rounded-full bg-gray-100 ring-1 ring-gray-300">
                                                </div>
                                            </div>
                                            <p class="flex-auto py-0.5 text-xs leading-5 text-gray-500">
                                                <span class="font-medium text-gray-900">{{ $owner->name }}</span>
                                                <br>Belgeyi oluşturdu.
                                            </p>
                                            @if ($offer->created_at)
                                                <time datetime="{{ $offer->created_at->toDateTimeString() }}"
                                                    class="flex-none py-0.5 text-xs leading-5 text-gray-500">{{ $offer->created_at->diffForHumans() }}
                                                </time>
                                            @endif
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>

                    <!--OFFER-->
                    <div id="printableArea"
                        class="px-4 py-8 -mx-4 bg-white shadow-sm ring-1 ring-stone-300 sm:mx-0 sm:rounded-lg sm:px-8 sm:pb-14 lg:col-span-2 lg:row-span-2 lg:row-end-2 xl:px-16 xl:pb-20 xl:pt-16">

                        <!-- OFFER HEADER -->
                        <dl class="flex w-full text-sm leading-6">
                            <div class="flex justify-between w-full uppercase">
                                <div>
                                    <img class="h-auto mb-4 w-60"
                                        src="{{ file_exists(public_path('uploads/img/logos/' . $offer->current_team_id . '.svg'))
                                            ? asset('uploads/img/logos/' . $offer->current_team_id . '.svg')
                                            : asset('uploads/img/logos/' . $offer->current_team_id . '.png') }}"
                                        alt="logo">
                                    @if ($address)
                                        <p class="text-sm text-stone-500">{{ $address->title }}</p>
                                        <p class="text-xs text-stone-400">{{ $address->line_1 }} {{ $address->line_2 }}
                                        </p>
                                        <p class="text-xs text-stone-400">{{ $address->district }} {{ $address->city }}
                                            {{ $address->country }} PK.{{ $address->zip }}</p>
                                        <p class="text-xs text-stone-400">{{ $address->tax_office }}.VD
                                            {{ $address->vat_number }}</p>
                                        <p class="text-xs lowercase text-stone-400">{{ $address->phone }}
                                            {{ $address->email }}</p>
                                    @endif
                                </div>
                                <div class="text-4xl font-extrabold text-right text-stone-700">
                                    TEKLİF
                                    <p class="mt-2 text-xs font-medium text-right text-stone-800">Teklif numarası:
                                        OF-{{ $offer->number }}</p>
                                    <p class="text-xs font-medium text-right text-stone-800">Teklif tarihi:
                                        {{ date('d.m.Y', strtotime($offer->date)) }}</p>
                                    <p class="text-xs font-medium text-right text-stone-800">Son geçerlilik tarihi:
                                        {{ date('d.m.Y', strtotime($offer->due_date)) }}</p>
                                </div>
                            </div>
                        </dl>

                        <!-- OFFER TITLE -->
                        <dl
                            class="flex justify-center mx-auto text-xl leading-6 tracking-tighter text-center uppercase max-w-7xl">
                            <div class="flex-none min-w-60">
                                <div class="mt-12">
                                    <p class="block mb-2 text-2xl font-bold text-stone-700">{{ $offer->title }}</p>
                                    <p class="block mb-1 text-lg font-medium leading-6 text-stone-700">SAYIN,
                                        {{ $offer->person }} {{ ' - ' . $offer->company->name }}</p>
                                    @if ($offer->address || $offer->phone)
                                        <p class="block text-base font-medium leading-6 text-stone-500">
                                            {{ $offer->phone }}
                                            {{ ' - ' . $offer->address }}</p>
                                    @endif
                                </div>
                            </div>
                        </dl>

                        <table class="w-full mt-16 text-sm leading-6 text-left whitespace-nowrap">
                            <colgroup>
                                <col class="w-full">
                                <col>
                                <col>
                                <col>
                                <col>
                                <col>
                            </colgroup>
                            <thead class="text-gray-900 border-b border-gray-200">
                                <tr>
                                    <th scope="col" class="px-0 py-3 text-xs font-light uppercase">Ürün/Hizmet</th>
                                    <th scope="col"
                                        class="hidden py-3 pl-8 pr-0 text-xs font-light text-right uppercase sm:table-cell">
                                        Adet</th>
                                    <th scope="col"
                                        class="hidden py-3 pl-4 pr-0 text-xs font-light text-left uppercase sm:table-cell">
                                        Birim</th>
                                    <th scope="col"
                                        class="hidden py-3 pl-8 pr-0 text-xs font-light text-right uppercase sm:table-cell">
                                        B.Fiyat</th>
                                    <th scope="col"
                                        class="hidden py-3 pl-8 pr-0 text-xs font-light text-right uppercase sm:table-cell">
                                        İndirim</th>
                                    <th scope="col"
                                        class="hidden py-3 pl-8 pr-0 text-xs font-light text-right uppercase sm:table-cell">
                                        A.Toplam</th>
                                    <th scope="col"
                                        class="hidden py-3 pl-8 pr-0 text-xs font-light text-right uppercase sm:table-cell">
                                        Vergi</th>
                                    <th scope="col" class="py-3 pl-8 pr-0 text-xs font-light text-right uppercase">
                                        Toplam</th>
                                </tr>
                            </thead>
                            {{-- LINES --}}
                            <tbody>
                                @foreach ($offer_lines as $line)
                                    <tr class="border-b border-gray-100">
                                        <td class="px-0 py-3 align-top max-w-0 text-wrap">
                                            <div class="font-medium text-gray-900">{{ $line->product->name }}</div>
                                            <div class="text-gray-500">{{ $line->description }}</div>
                                        </td>
                                        <td
                                            class="hidden py-3 pl-3 pr-0 text-right text-gray-700 align-center tabular-nums sm:table-cell">
                                            {{ $line->quantity }}
                                        </td>
                                        <td
                                            class="hidden py-3 pl-3 pr-0 text-xs text-left text-gray-700 align-center tabular-nums sm:table-cell">
                                            @if ($line->unit == 'pcs')
                                                Adet
                                            @elseif($line->unit == 'hour')
                                                Saat
                                            @elseif($line->unit == 'day')
                                                Gün
                                            @elseif($line->unit == 'month')
                                                Ay
                                            @elseif($line->unit == 'year')
                                                Yıl
                                            @endif
                                        </td>
                                        <td
                                            class="hidden py-3 pl-3 pr-0 text-right text-gray-700 align-center tabular-nums sm:table-cell">
                                            {{ number_format($line->unit_price, 2, ',', '.') }}
                                        </td>
                                        <td
                                            class="hidden py-3 pl-3 pr-0 text-xs text-right text-gray-700 align-center tabular-nums sm:table-cell">
                                            <span class="text-gray-400">%{{ $line->discount_rate }}
                                            </span>{{ number_format($line->discount_amount, 2, ',', '.') }}
                                        </td>
                                        <td
                                            class="hidden py-3 pl-3 pr-0 text-right text-gray-700 align-center tabular-nums sm:table-cell">
                                            {{ number_format($line->unit_price * $line->quantity - $line->discount_amount, 2, ',', '.') }}
                                        </td>
                                        <td
                                            class="hidden py-3 pl-3 pr-0 text-xs text-right text-gray-700 align-center tabular-nums sm:table-cell">
                                            <span class="text-gray-400">%{{ $line->tax_rate }}
                                            </span>{{ number_format($line->tax_amount, 2, ',', '.') }}
                                        </td>
                                        <td
                                            class="py-3 pl-3 pr-0 font-bold text-right text-gray-700 align-center tabular-nums">
                                            {{ number_format($line->total_price, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs text-gray-400">{{ $offer->currency }}</span>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                            {{-- FOOTER --}}
                            <tfoot class="tracking-tight">
                                <tr>
                                    <th scope="row" class="px-0 pt-2 pb-0 font-normal text-gray-700 sm:hidden">
                                        Ara Toplam
                                    </th>
                                    <th scope="row" colspan="7"
                                        class="hidden px-0 pt-2 pb-0 font-normal text-right text-gray-700 sm:table-cell">
                                        Ara Toplam
                                    </th>
                                    @if ($offer->currency != 'TRL')
                                        <td class="pt-2 pb-0 pl-8 pr-0 text-right text-gray-500 tabular-nums">
                                            {{ number_format($offer->ex_sub, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">{{ $offer->currency }}</span>
                                        </td>
                                    @else
                                        <td class="pt-2 pb-0 pl-8 pr-0 text-right text-gray-900 tabular-nums">
                                            {{ number_format($offer->trl_sub, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">TRL</span>
                                        </td>
                                    @endif
                                </tr>
                                @if ($offer->trl_dicount > 0 || $offer->ex_discount > 0)
                                    <tr>
                                        <th scope="row" class="pt-2 font-normal text-gray-700 sm:hidden">İndirimler
                                        </th>
                                        <th scope="row" colspan="7"
                                            class="hidden pt-2 font-normal text-right text-gray-700 sm:table-cell">
                                            İndirimler
                                        </th>
                                        @if ($offer->currency != 'TRL')
                                            <td class="pt-2 pb-0 pl-8 pr-0 text-right text-gray-500 tabular-nums">
                                                {{ number_format($offer->ex_discount, 2, ',', '.') }}<span
                                                    class="pl-0.5 font-normal text-xs">{{ $offer->currency }}</span>
                                            </td>
                                        @else
                                            <td class="pt-2 pb-0 pl-8 pr-0 text-right text-gray-900 tabular-nums">
                                                {{ number_format($offer->trl_discount, 2, ',', '.') }}<span
                                                    class="pl-0.5 font-normal text-xs">TRL</span>
                                            </td>
                                        @endif
                                    </tr>
                                @endif
                                <tr>
                                    <th scope="row" class="pt-2 font-normal text-gray-700 sm:hidden">Vergiler</th>
                                    <th scope="row" colspan="7"
                                        class="hidden pt-2 font-normal text-right text-gray-700 sm:table-cell">Vergiler
                                    </th>
                                    @if ($offer->currency != 'TRL')
                                        <td class="pt-2 pb-0 pl-8 pr-0 text-right text-gray-500 tabular-nums">
                                            {{ number_format($offer->ex_tax, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">{{ $offer->currency }}</span>
                                        </td>
                                    @else
                                        <td class="pt-2 pb-0 pl-8 pr-0 text-right text-gray-900 tabular-nums">
                                            {{ number_format($offer->trl_tax, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">TRL</span>
                                        </td>
                                    @endif
                                </tr>
                                <tr>
                                    <th scope="row" class="pt-2 font-semibold text-gray-900 sm:hidden">Toplam Tutar
                                    </th>
                                    <th scope="row" colspan="7"
                                        class="hidden pt-2 font-semibold text-right text-gray-900 sm:table-cell">Toplam
                                        Tutar
                                    </th>
                                    @if ($offer->currency != 'TRL')
                                        <td class="pt-2 pb-0 pl-8 pr-0 text-lg text-right text-gray-500 tabular-nums">
                                            {{ number_format($offer->ex_total, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">{{ $offer->currency }}</span>
                                        </td>
                                    @else
                                        <td
                                            class="pt-2 pb-0 pl-8 pr-0 text-lg font-bold text-right text-gray-900 tabular-nums">
                                            {{ number_format($offer->trl_total, 2, ',', '.') }}<span
                                                class="pl-0.5 font-normal text-xs">TRL</span>
                                        </td>
                                    @endif
                                </tr>
                            </tfoot>
                        </table>

                        <!-- OFFER FOOTNOTES -->
                        <dl class="flex grid-cols-3 mx-auto text-sm leading-6 max-w-7xl">
                            <div class="flex-none max-w-full tracking-tighter uppercase min-w-60 sm:pr-4">
                                <div class="mt-12">
                                    <label for="content"
                                        class="block text-lg font-bold leading-6 underline text-stone-700">TEKLİFE AİT ALT
                                        BİLGİLER / DETAYLAR</label>
                                    <div class="mt-2">
                                        <label id="content"
                                            class="block w-full text-sm normal-case text-stone-700 placeholder:text-gray-400">
                                            {!! $offer->note !!}
                                        </label>
                                    </div>
                                </div>
                            </div>
                        </dl>
                        <!-- OFFER SIGNS -->
                        <dl class="flex justify-between mx-auto text-lg leading-6 text-right max-w-7xl">
                            <div class="flex-none max-w-xl tracking-tighter uppercase min-w-44 sm:pr-4">
                                <div class="mt-12">
                                    <div class="mt-2 text-center">
                                        <label for="content"
                                            class="block font-bold leading-6 text-stone-700">ONAY</label>
                                        <p class="text-sm uppercase">{{ $offer->company->name }}</p>
                                        <p class="text-sm lowercase">İMZA</p>
                                    </div>
                                </div>
                            </div>
                            <div class="flex-none max-w-xl tracking-tighter uppercase min-w-44 sm:pr-4">
                                <div class="mt-12">
                                    <div class="mt-2 text-center">
                                        <label for="content"
                                            class="block font-bold leading-6 text-stone-700">SAYGILARIMLA,
                                            {{ \Illuminate\Support\Facades\Auth::user()->name }}</label>
                                        <p class="text-sm lowercase">{{ \Illuminate\Support\Facades\Auth::user()->email }}
                                        </p>
                                        <img class="w-64 h-auto mx-auto -mt-5"
                                            src="{{ asset('uploads/img/signatures/' . $offer->current_team_id . '.svg') }}"
                                            alt="imza">
                                    </div>
                                </div>
                            </div>
                        </dl>

                    </div>
                </div>
            </div>
        </main>
    </div>

@endsection

@section('scripts')
    <script>
        // Add JavaScript Function
        function printSelectedContent() {
            var printContents = document.getElementById('printableArea').innerHTML;
            var originalContents = document.body.innerHTML;
            document.body.innerHTML = printContents;
            window.print();
            document.body.innerHTML = originalContents;
        }
    </script>
    <script>
        function toPdfSelectedContent() {
            var element = document.getElementById('printableArea');
            html2pdf(element, {
                margin: [0, 0, 0, 0],
                filename: '{{ $offer->company->name }}OF-{{ $offer->number }}.pdf',
                image: {
                    type: 'jpeg',
                    quality: 0.98
                },
                html2canvas: {
                    scale: 2,
                    useCORS: true,
                    allowTaint: false
                },
                jsPDF: {
                    unit: 'mm',
                    format: 'a4',
                    orientation: 'portrait'
                }
            });
        }
    </script>
@endsection

@section('outerScripts')
@endsection