@extends('signatures.base')

@section('signature')
<table cellpadding="0" cellspacing="0" border="0" style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; line-height: 1.5; color: #333333;">
    <tr>
        {{-- Info Section (Left) --}}
        <td valign="top" style="padding-right: 20px;">
            {{-- Name --}}
            <table cellpadding="0" cellspacing="0" border="0">
                <tr>
                    <td>
                        <p style="font-size: 16px; font-weight: bold; color: #1a3a5c; margin: 0; padding: 0;">
                            {{ $name }}
                        </p>
                    </td>
                </tr>
                @if(!empty($title))
                <tr>
                    <td>
                        <p style="font-size: 13px; color: #666666; margin: 2px 0 0 0; padding: 0;">
                            {{ $title }}
                        </p>
                    </td>
                </tr>
                @endif
            </table>

            {{-- Colored Divider (gradient effect with multiple colors) --}}
            <table cellpadding="0" cellspacing="0" border="0" style="margin: 10px 0;">
                <tr>
                    <td style="background-color: #683C90; width: 50px; height: 3px;"></td>
                    <td style="background-color: #3566AC; width: 50px; height: 3px;"></td>
                    <td style="background-color: #003C59; width: 50px; height: 3px;"></td>
                </tr>
            </table>

            {{-- Contact Info --}}
            <table cellpadding="0" cellspacing="0" border="0">
                @if(!empty($email))
                <tr>
                    <td style="font-size: 13px; padding: 1px 0;">
                        <a href="mailto:{{ $email }}" style="color: #1a3a5c; text-decoration: none;">{{ $email }}</a>
                    </td>
                </tr>
                @endif
                @if(!empty($phone))
                <tr>
                    <td style="font-size: 13px; padding: 1px 0;">
                        <a href="tel:{{ preg_replace('/\s+/', '', $phone) }}" style="color: #1a3a5c; text-decoration: none;">{{ $phone }}</a>
                    </td>
                </tr>
                @endif
                @if(!empty($addressLines))
                @foreach($addressLines as $line)
                <tr>
                    <td style="font-size: 12px; color: #666666; padding: 1px 0;">
                        @if(!empty($addressUrl))
                        <a href="{{ $addressUrl }}" target="_blank" style="color: #666666; text-decoration: none;">{{ $line }}</a>
                        @else
                        {{ $line }}
                        @endif
                    </td>
                </tr>
                @endforeach
                @elseif(!empty($address))
                <tr>
                    <td style="font-size: 12px; color: #666666; padding: 1px 0;">
                        @if(!empty($addressUrl))
                        <a href="{{ $addressUrl }}" target="_blank" style="color: #666666; text-decoration: none;">{{ $address }}</a>
                        @else
                        {{ $address }}
                        @endif
                    </td>
                </tr>
                @endif
            </table>
        </td>

        {{-- Logo Section (Right) --}}
        @if(!empty($logo))
        <td valign="top" style="padding-left: {{ $logoMarginLeft ?? 15 }}px; padding-top: {{ $logoMarginTop ?? 0 }}px;">
            <img src="{{ $logo }}" alt="{{ $logoAlt ?? $company ?? 'Logo' }}" width="{{ $logoWidth ?? 100 }}" style="display: block;" />
        </td>
        @endif
    </tr>

    {{-- Banner Section (Bottom) --}}
    @if(!empty($banner))
    <tr>
        <td colspan="2" style="padding-top: {{ $bannerMarginTop ?? 15 }}px;">
            @if(!empty($bannerUrl))
            <a href="{{ $bannerUrl }}" target="_blank" style="text-decoration: none;">
                @endif
                <img src="{{ $banner }}" alt="{{ $bannerAlt ?? '' }}" style="display: block; max-width: {{ $bannerMaxWidth ?? 600 }}px; max-height: {{ $bannerMaxHeight ?? 300 }}px; width: 100%; height: auto;" />
                @if(!empty($bannerUrl))
            </a>
            @endif
        </td>
    </tr>
    @endif
</table>
@endsection