<!DOCTYPE html>
<html lang="{{ app()->getLocale() }}" dir="{{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }}">
<head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>{{ __('contract.title') }} - {{ __('contract.company_name') }}</title>
    <style>
        /* خطوط Amiri للعربية و DejaVu Sans للإنجليزية */
        @font-face {
            font-family: 'Amiri';
            src: url('{{ base_path("public/fonts/Amiri-Regular.ttf") }}') format('truetype');
            font-weight: normal;
            font-style: normal;
        }
        @font-face {
            font-family: 'Amiri';
            src: url('{{ base_path("public/fonts/Amiri-Bold.ttf") }}') format('truetype');
            font-weight: bold;
            font-style: normal;
        }
        @font-face {
            font-family: 'DejaVu Sans';
            src: url('{{ base_path("public/fonts/DejaVuSans.ttf") }}') format('truetype');
            font-weight: normal;
            font-style: normal;
        }
        @font-face {
            font-family: 'DejaVu Sans';
            src: url('{{ base_path("public/fonts/DejaVuSans-Bold.ttf") }}') format('truetype');
            font-weight: bold;
            font-style: normal;
        }

        * { margin: 0; padding: 0; box-sizing: border-box; }

        body {
            font-family: '{{ app()->getLocale() === "ar" ? "Amiri" : "DejaVu Sans" }}', sans-serif;
            direction: {{ app()->getLocale() === 'ar' ? 'rtl' : 'ltr' }};
            text-align: {{ app()->getLocale() === 'ar' ? 'right' : 'left' }};
            background: #ffffff;
            color: #1e293b;
            line-height: 1.8;
            padding: 20px;
        }

        .container {
            max-width: 1100px;
            margin: 0 auto;
            background: #ffffff;
            border-radius: 15px;
            box-shadow: 0 5px 20px rgba(0,0,0,0.1);
            overflow: hidden;
            position: relative;
            border: 1px solid #e2e8f0;
        }

        /* Header */
        .header {
            background: #0f172a;
            color: #ffffff;
            padding: 30px 20px;
            text-align: center;
            position: relative;
            border-bottom: 3px solid #fbbf24;
        }
        .header h2 {
            margin: 0;
            font-size: 28px;
            font-weight: 700;
            color: #ffffff;
        }
        .header h2 span.symbol {
            font-style: normal;
            color: #fbbf24;
            display: inline-block;
            margin: 0 5px;
        }
        .header .subtitle {
            font-size: 14px;
            opacity: 0.9;
            margin: 5px 0;
            color: #cbd5e1;
        }
        .header .company-details {
            background: #1e293b;
            padding: 10px;
            border-radius: 30px;
            margin: 15px auto;
            max-width: 500px;
        }
        .header .company-details p {
            margin: 0;
            font-size: 12px;
            display: inline-block;
            padding: 0 10px;
            color: #ffffff;
        }
        .header .telegram-channel {
            background: #0088cc;
            display: inline-block;
            padding: 5px 20px;
            border-radius: 30px;
            font-weight: 600;
            margin: 10px 0;
            color: white;
            font-size: 13px;
        }
        .header .contract-info {
            margin-top: 15px;
            display: flex;
            justify-content: center;
            gap: 20px;
            font-size: 13px;
            background: #1e293b;
            padding: 10px 20px;
            border-radius: 30px;
            max-width: 500px;
            margin-left: auto;
            margin-right: auto;
        }
        .header .contract-info span {
            color: #fbbf24;
            font-weight: 700;
        }

        /* Contract Badge */
        .contract-badge {
            text-align: center;
            margin: 20px 0;
        }
        .contract-badge .badge {
            background: #0f172a;
            color: white;
            display: inline-block;
            padding: 8px 30px;
            border-radius: 30px;
            font-size: 20px;
            font-weight: 700;
            border: 2px solid #fbbf24;
        }

        /* Content */
        .content { padding: 20px 30px; }
        .section-title {
            margin: 20px 0 15px;
            font-weight: 700;
            font-size: 18px;
            color: #0f172a;
            border-bottom: 2px solid #0f172a;
            padding-bottom: 5px;
        }

        /* Tables */
        .investment-table {
            width: 100%;
            border-collapse: collapse;
            margin: 10px 0;
            border: 1px solid #e2e8f0;
        }
        .investment-table td {
            padding: 10px 15px;
            font-size: 14px;
            border: 1px solid #e2e8f0;
        }
        .investment-table td:first-child {
            background: #f1f5f9;
            font-weight: 700;
            width: 35%;
        }
        .investment-table td:last-child {
            font-weight: 500;
        }

        /* Conditions */
        .conditions-container {
            background: #f8fafc;
            border-radius: 10px;
            padding: 15px;
            margin: 15px 0;
            border: 1px solid #e2e8f0;
        }
        .condition-item {
            margin-bottom: 10px;
            padding: 8px 12px;
            background: white;
            border-radius: 8px;
            border-{{ app()->getLocale() === 'ar' ? 'right' : 'left' }}: 3px solid #0f172a;
        }
        .condition-number {
            background: #0f172a;
            color: white;
            width: 25px;
            height: 25px;
            border-radius: 50%;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-weight: 700;
            font-size: 12px;
            margin-{{ app()->getLocale() === 'ar' ? 'left' : 'right' }}: 10px;
        }
        .condition-text {
            color: #334155;
            font-size: 14px;
            display: inline;
        }
        .condition-text strong {
            color: #0f172a;
        }

        /* Signatures */
        .signatures {
            margin: 30px 0 20px;
            display: table;
            width: 100%;
        }
        .sign-box {
            display: table-cell;
            width: 48%;
            background: white;
            border: 1px solid #e2e8f0;
            border-radius: 10px;
            padding: 15px;
            text-align: center;
        }
        .sign-box.party1 {
            border-top: 3px solid #0f172a;
            margin-{{ app()->getLocale() === 'ar' ? 'left' : 'right' }}: 2%;
        }
        .sign-box.party2 {
            border-top: 3px solid #059669;
            margin-{{ app()->getLocale() === 'ar' ? 'right' : 'left' }}: 2%;
        }
        .sign-title {
            font-size: 12px;
            color: #64748b;
            margin-bottom: 10px;
        }
        .sign-name {
            font-size: 18px;
            font-weight: 700;
            color: #0f172a;
            margin: 10px 0;
            padding: 5px 0;
            border-top: 1px dashed #cbd5e1;
            border-bottom: 1px dashed #cbd5e1;
        }
        .sign-box.party2 .sign-name {
            color: #059669;
        }
        .sign-stamp {
            margin-top: 10px;
            font-size: 11px;
            color: #94a3b8;
        }

        /* Footer */
        .footer {
            background: #0f172a;
            color: white;
            padding: 15px;
            text-align: center;
            font-size: 11px;
        }
        .footer p {
            margin: 3px 0;
            color: #cbd5e1;
        }

        /* Print */
        @media print {
            body { padding: 0; background: white; }
            .container { box-shadow: none; border: 1px solid #ddd; }
        }
    </style>
</head>
<body>

<div class="container">
    <!-- Header -->
    <div class="header">
        <h2>
            {{ __('contract.company_name') }}
            <span class="symbol">✦</span>
            {{ __('contract.investment') }}
            <span class="symbol">✦</span>
        </h2>
        <div class="subtitle">{{ __('contract.company_name_en') }}</div>

        <div class="company-details">
            <p>🇰🇼 {{ __('contract.location') }}</p>
            <p>📋 {{ __('contract.cr_number') }}: 1072628878</p>
        </div>

        <div class="telegram-channel">
            📱 {{ __('contract.telegram') }}: @essaaledawaani
        </div>

        <div class="contract-info">
            <div>📄 <span>{{ __('contract.contract_number') }}:</span> {{ $contract->contract_number }}</div>
            <div>📅 <span>{{ __('contract.issue_date') }}:</span> {{ \Carbon\Carbon::parse($contract->start_date)->format('Y/m/d') }}</div>
        </div>
    </div>

    <!-- Contract Badge -->
    <div class="contract-badge">
        <div class="badge">{{ __('contract.electronic_contract') }}</div>
    </div>

    <div class="content">
        <!-- Party 1 -->
        <div class="section-title">{{ __('contract.party1_title') }}</div>
        <table class="investment-table">
            <tr><td>{{ __('contract.name') }}</td><td>{{ __('contract.manager_name') }}</td></tr>
            <tr><td>{{ __('contract.company') }}</td><td>{{ __('contract.company_name') }}</td></tr>
            <tr><td>{{ __('contract.address') }}</td><td>{{ __('contract.location') }}</td></tr>
            <tr><td>{{ __('contract.cr_number') }}</td><td>1072628878</td></tr>
            <tr><td>{{ __('contract.telegram') }}</td><td>@essaaledawaani</td></tr>
        </table>

        <!-- Party 2 -->
        <div class="section-title">{{ __('contract.party2_title') }}</div>
        <table class="investment-table">
            <tr><td>{{ __('contract.full_name') }}</td><td>{{ $contract->investor->name }}</td></tr>
            <tr><td>{{ __('contract.country') }}</td><td>{{ $contract->investor->country }}</td></tr>
            <tr><td>{{ __('contract.phone') }}</td><td>{{ $contract->investor->phone }}</td></tr>
            <tr><td>{{ __('contract.email') }}</td><td>{{ $contract->investor->email }}</td></tr>
            <tr><td>{{ __('contract.payment_method') }}</td><td>{{ $contract->investor->payment_method }}</td></tr>
            <tr><td>{{ __('contract.account_iban') }}</td><td style="font-family: monospace;">{{ $contract->investor->iban }}</td></tr>
        </table>

        <!-- Investment Details -->
        <div class="section-title">{{ __('contract.investment_details') }}</div>
        <table class="investment-table">
            <tr><td>{{ __('contract.capital') }}</td><td>{{ number_format($contract->capital) }} {{ __('contract.kwd') }}</td></tr>
            <tr><td>{{ __('contract.daily_profit') }}</td><td>{{ number_format($contract->daily_profit) }} {{ __('contract.kwd') }}</td></tr>
            <tr><td>{{ __('contract.total_profit') }}</td><td>{{ number_format($contract->total_profit) }} {{ __('contract.kwd') }}</td></tr>
            <tr><td>{{ __('contract.duration') }}</td><td>{{ $contract->package->duration }} {{ __('contract.days') }}</td></tr>
            <tr><td>{{ __('contract.start_date') }}</td><td>{{ \Carbon\Carbon::parse($contract->start_date)->format('Y/m/d') }}</td></tr>
            <tr><td>{{ __('contract.end_date') }}</td><td>{{ \Carbon\Carbon::parse($contract->end_date)->format('Y/m/d') }}</td></tr>
            <tr><td>{{ __('contract.profit_source') }}</td><td>⚡ {{ __('contract.bitcoin_mining') }}</td></tr>
            <tr><td>{{ __('contract.deposit_time') }}</td><td>🕘 9:00 {{ __('contract.am_makkah') }}</td></tr>
        </table>

        <!-- Terms & Conditions -->
        <div class="section-title">{{ __('contract.terms_title') }}</div>
        <div class="conditions-container">
            <div class="condition-item">
                <span class="condition-number">1</span>
                <span class="condition-text"><strong>{{ __('contract.term1_title') }}</strong> {{ $contract->package->duration }} {{ __('contract.days') }} {{ __('contract.from_contract_date') }}.</span>
            </div>
            <div class="condition-item">
                <span class="condition-number">2</span>
                <span class="condition-text"><strong>{{ __('contract.term2_title') }}</strong> {{ __('contract.deposited_daily') }} 9:00 {{ __('contract.am_makkah') }}.</span>
            </div>
            <div class="condition-item">
                <span class="condition-number">3</span>
                <span class="condition-text"><strong>{{ __('contract.term3_title') }}</strong> {{ __('contract.daily_followup') }} 5:00 {{ __('contract.pm_makkah') }}.</span>
            </div>
            <div class="condition-item">
                <span class="condition-number">4</span>
                <span class="condition-text"><strong>{{ __('contract.term4_title') }}</strong> {{ __('contract.capital_withdrawal') }}.</span>
            </div>
            <div class="condition-item">
                <span class="condition-number">5</span>
                <span class="condition-text"><strong>{{ __('contract.term5_title') }}</strong> {{ __('contract.no_increase') }}.</span>
            </div>
            <div class="condition-item">
                <span class="condition-number">6</span>
                <span class="condition-text"><strong>{{ __('contract.term6_title') }}</strong> {{ __('contract.fixed_profits') }}.</span>
            </div>
        </div>

        <!-- Signatures -->
        <div class="signatures">
            <div class="sign-box party1">
                <div class="sign-title">{{ __('contract.party1_title') }}</div>
                <div class="sign-name">{{ __('contract.manager_name') }}</div>
                <div class="sign-stamp">
                    {{ __('contract.date') }}: {{ \Carbon\Carbon::parse($contract->start_date)->format('Y/m/d') }}
                </div>
            </div>

            <div style="width: 4%; display: table-cell;"></div>

            <div class="sign-box party2">
                <div class="sign-title">{{ __('contract.party2_title') }}</div>
                <div class="sign-name">{{ $contract->investor->name }}</div>
                <div class="sign-stamp">
                    {{ __('contract.date') }}: {{ \Carbon\Carbon::parse($contract->start_date)->format('Y/m/d') }}
                </div>
            </div>
        </div>
    </div>

    <!-- Footer -->
    <div class="footer">
        <p>{{ __('contract.company_name') }} - {{ __('contract.all_rights_reserved') }} © {{ date('Y') }}</p>
        <p>{{ __('contract.electronic_contract_note') }}</p>
    </div>
</div>

</body>
</html>
