@extends('layouts.aura-main')

@section('main-content')
<div class="max-w-6xl mx-auto pb-20">
    <div class="flex justify-between items-end mb-8 border-b border-slate-900 pb-4">
        <div>
            <h1 class="text-3xl font-black text-slate-900">Company Profile</h1>
            <p class="text-[10px] font-bold text-slate-400 mt-1 uppercase tracking-widest font-sans">Identity & Global Business Settings</p>
        </div>
        <div class="flex gap-3">
             <div class="px-4 py-2 bg-slate-900 text-white text-[10px] font-black uppercase rounded-sm">
                System ID: #{{ str_pad($company->id, 5, '0', STR_PAD_LEFT) }}
             </div>
        </div>
    </div>

    <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-8">
        <div class="bg-white border border-slate-200 p-5 rounded-sm shadow-sm flex items-center gap-4">
            <div class="w-10 h-10 rounded bg-emerald-50 flex items-center justify-center text-emerald-600">
                <i class="fa-solid fa-calendar-check text-sm"></i>
            </div>
            <div>
                <p class="text-[9px] font-black text-slate-400 uppercase tracking-widest leading-none mb-1">Active Financial Year</p>
                <p class="text-[13px] font-bold text-slate-900">
                    @php $activeYear = $financialYears->where('is_active', 1)->first(); @endphp
                    @if($activeYear)
                        {{ $activeYear->year }} <span class="text-[10px] text-slate-400 font-medium">({{ $activeYear->start_date->format('M Y') }} - {{ $activeYear->end_date->format('M Y') }})</span>
                    @else
                        <span class="text-rose-600">No active year set</span>
                    @endif
                </p>
            </div>
        </div>

        <div class="bg-white border border-slate-200 p-5 rounded-sm shadow-sm flex items-center gap-4">
            <div class="w-10 h-10 rounded bg-amber-50 flex items-center justify-center text-amber-600">
                <i class="fa-solid fa-chart-line text-sm"></i>
            </div>
            <div>
                <p class="text-[9px] font-black text-slate-400 uppercase tracking-widest leading-none mb-1">Market Rate (USD)</p>
                <p class="text-[13px] font-bold text-slate-900">
                    @if($usdRate)
                        1 {{ $company->currency }} = {{ number_format($usdRate->rate, 4) }} USD
                    @else
                        <span class="text-slate-400 italic">Rate not synced</span>
                    @endif
                </p>
            </div>
        </div>

        <div class="bg-white border border-slate-200 p-5 rounded-sm shadow-sm flex items-center gap-4">
            <div class="w-10 h-10 rounded bg-indigo-50 flex items-center justify-center text-indigo-600">
                <i class="fa-solid fa-coins text-sm"></i>
            </div>
            <div>
                <p class="text-[9px] font-black text-slate-400 uppercase tracking-widest leading-none mb-1">Reporting Currency</p>
                <p class="text-[13px] font-bold text-slate-900">{{ $company->currency }} <span class="text-[10px] text-slate-400 font-medium"> (ISO-4217)</span></p>
            </div>
        </div>
    </div>

    <div class="bg-white border border-slate-200 p-8 rounded-sm shadow-sm">
        <form action="{{ route('company.update') }}" method="POST">
            @csrf
            @method('PUT')

            <div class="space-y-10">
                <div>
                    <h3 class="text-xs font-black text-slate-900 uppercase tracking-widest mb-6 border-l-4 border-indigo-600 pl-3">Global Accounting Settings</h3>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6 bg-slate-50 p-6 border border-slate-200 rounded-sm">
                        
                        <div>
                            <label class="block text-[10px] font-black text-slate-500 mb-1 uppercase">Primary Reporting Currency</label>
                            <select name="currency" class="aura-input">
                                @foreach($currencies as $curr)
                                    <option value="{{ $curr->code }}" {{ $company->currency == $curr->code ? 'selected' : '' }}>
                                        {{ $curr->code }} - {{ $curr->name }}
                                    </option>
                                @endforeach
                            </select>
                            <p class="text-[9px] text-slate-400 mt-2 italic">Standard ISO code for financial reports.</p>
                        </div>

                        <div>
                            <label class="block text-[10px] font-black text-slate-500 mb-1 uppercase">Active Financial Year</label>
                            <select name="current_financial_year_id" class="aura-input">
                                <option value="">-- Select Year --</option>
                                @foreach($financialYears as $year)
                                    <option value="{{ $year->id }}" {{ $year->is_active ? 'selected' : '' }}>
                                        {{ $year->year }} ({{ $year->start_date->format('M Y') }} - {{ $year->end_date->format('M Y') }})
                                    </option>
                                @endforeach
                            </select>
                            <p class="text-[9px] text-slate-400 mt-2 italic">Determines the current open period for entries.</p>
                        </div>
                    </div>
                </div>

                <div>
                    <h3 class="text-xs font-black text-slate-900 uppercase tracking-widest mb-6 border-l-4 border-indigo-600 pl-3">General Information</h3>
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                        <div class="md:col-span-2">
                            <label class="block text-[10px] font-black text-slate-500 mb-1 uppercase">Official Business Name</label>
                            <input type="text" name="name" value="{{ $company->name }}" class="aura-input" required>
                        </div>
                        <div>
                            <label class="block text-[10px] font-black text-slate-500 mb-1 uppercase">Email Address</label>
                            <input type="email" name="email" value="{{ $company->email }}" class="aura-input">
                        </div>
                        <div>
                            <label class="block text-[10px] font-black text-slate-500 mb-1 uppercase">Phone Number</label>
                            <input type="text" name="phone" value="{{ $company->phone }}" class="aura-input">
                        </div>
                        <div>
                            <label class="block text-[10px] font-black text-slate-500 mb-1 uppercase">Tax Number (TPIN)</label>
                            <input type="text" name="tax_number" value="{{ $company->tax_number }}" class="aura-input" placeholder="e.g. 100XXXXXXX">
                        </div>
                        <div>
                            <label class="block text-[10px] font-black text-slate-500 mb-1 uppercase">Operational Timezone</label>
                            <select name="timezone" class="aura-input">
                                @foreach(DateTimeZone::listIdentifiers() as $tz)
                                    <option value="{{ $tz }}" {{ $company->timezone == $tz ? 'selected' : '' }}>{{ $tz }}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>

                <div>
                    <h3 class="text-xs font-black text-slate-900 uppercase tracking-widest mb-6 border-l-4 border-indigo-600 pl-3">Physical Address</h3>
                    <div class="grid grid-cols-1 gap-6">
                        <div>
                            <textarea name="address" rows="3" class="aura-input">{{ $company->address }}</textarea>
                        </div>
                    </div>
                </div>

                <div class="pt-6 border-t border-slate-100 flex justify-end">
                    <button type="submit" class="bg-slate-900 text-white px-12 py-3.5 text-[10px] font-black uppercase tracking-widest hover:bg-indigo-600 transition shadow-lg shadow-slate-200">
                        Save Profile & Settings
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>

<style>
    .aura-input { 
        width: 100%;
        background-color: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 2px;
        padding: 12px 14px;
        font-size: 13px;
        font-weight: 700;
        color: #0f172a;
        transition: all 0.2s;
        outline: none;
    }
    .aura-input:focus {
        border-color: #4f46e5;
        box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.05);
        background-color: #fff;
    }
    .aura-input::placeholder {
        color: #cbd5e1;
        font-weight: 500;
    }
</style>
@endsection