@extends('layouts.master')
@section('title', 'Company Settings')
@section('content')

<div class="container-fluid py-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h4 class="fw-bold mb-0">
            <i class="fas fa-building me-2 text-primary"></i> Company Settings
        </h4>
        <a href="{{ route('home') }}" class="btn btn-outline-primary">
            <i class="fas fa-arrow-left me-2"></i> Back to Dashboard
        </a>
    </div>

    <div class="card shadow-sm border-0 overflow-hidden">
        <div class="card-header bg-primary text-white py-3">
            <h5 class="mb-0"><i class="fas fa-info-circle me-2"></i> Company Information</h5>
        </div>
        
        <div class="card-body">
            @if(session('success'))
                <div class="alert alert-success alert-dismissible fade show">
                    <i class="fas fa-check-circle me-2"></i> {{ session('success') }}
                    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                </div>
            @endif
            
            <div class="row align-items-center mb-5">
                <div class="col-md-3 text-center">
                    @if($companySettings->logo_url)
                        <img src="{{ $companySettings->logo_url }}" alt="Company Logo" class="img-fluid rounded shadow-sm" style="max-height: 180px;">
                    @else
                        <div class="bg-light rounded d-flex align-items-center justify-content-center p-5 shadow-sm">
                            <span class="text-muted"><i class="fas fa-building fa-3x"></i></span>
                        </div>
                    @endif
                </div>
                <div class="col-md-9">
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label text-muted small mb-1">Company Name</label>
                                <h4 class="fw-bold text-primary">{{ $companySettings->company_name }}</h4>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label text-muted small mb-1">Company Code</label>
                                <p class="fw-semibold">{{ $companySettings->company_code }}</p>
                            </div>
                        </div>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label text-muted small mb-1">Phone</label>
                                <p class="mb-0"><i class="fas fa-phone-alt me-2 text-muted"></i> {{ $companySettings->phone }}</p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label text-muted small mb-1">Email</label>
                                <p class="mb-0"><i class="fas fa-envelope me-2 text-muted"></i> {{ $companySettings->email ?? 'N/A' }}</p>
                            </div>
                        </div>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label text-muted small mb-1">Address</label>
                        <p class="mb-0"><i class="fas fa-map-marker-alt me-2 text-muted"></i> {{ $companySettings->address }}</p>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label text-muted small mb-1">Website</label>
                                <p class="mb-0">
                                    @if($companySettings->website)
                                        <i class="fas fa-globe me-2 text-muted"></i> 
                                        <a href="{{ $companySettings->website }}" target="_blank">{{ $companySettings->website }}</a>
                                    @else
                                        N/A
                                    @endif
                                </p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label class="form-label text-muted small mb-1">TIN No</label>
                                <p class="mb-0">{{ $companySettings->tax_id ?? 'N/A' }}</p>
                            </div>
                        </div>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label text-muted small mb-1">Currency</label>
                        <p class="mb-0">
                            @if($companySettings->currency)
                                <i class="fas fa-money-bill-wave me-2 text-muted"></i> 
                                {{ $companySettings->currency->name }} ({{ $companySettings->currency->symbol }})
                            @else
                                N/A
                            @endif
                        </p>
                    </div>
                </div>
            </div>
            
            <h5 class="mb-3 border-bottom pb-2"><i class="fas fa-university me-2 text-primary"></i> Bank Details</h5>
            <div class="table-responsive">
                <table class="table table-hover align-middle">
                    <thead class="table-light">
                        <tr>
                            <th>Bank Name</th>
                            <th>Account Name</th>
                            <th>Account Number</th>
                            <th>Branch</th>
                            <th>Swift Code</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($companySettings->bank_details as $bank)
                            <tr>
                                <td>{{ $bank['bank_name'] ?? 'N/A' }}</td>
                                <td>{{ $bank['account_name'] ?? 'N/A' }}</td>
                                <td>{{ $bank['account_number'] ?? 'N/A' }}</td>
                                <td>{{ $bank['branch'] ?? 'N/A' }}</td>
                                <td>{{ $bank['suffix_code'] ?? 'N/A' }}</td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="5" class="text-center py-4">No bank details available</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
            
            <div class="d-flex justify-content-end mt-4 pt-3 border-top">
                <a href="{{ route('company-settings.edit') }}" class="btn btn-primary me-2">
                    <i class="fas fa-edit me-1"></i> Edit Settings
                </a>
                <form action="{{ route('company-settings.destroy') }}" method="POST" class="d-inline">
                    @csrf
                    @method('DELETE')
                    <button type="submit" class="btn btn-outline-danger" onclick="return confirm('Are you sure you want to delete all company settings?')">
                        <i class="fas fa-trash me-1"></i> Delete Settings
                    </button>
                </form>
            </div>
        </div>
    </div>
    
    <div class="mt-4 text-center">
        <p class="text-muted">Copyright © {{ date('Y') }} Melsoft (Private) Limited</p>
    </div>
</div>

@endsection

@section('styles')
<style>
.card {
    border-radius: 12px;
    border: none;
}
.card-header {
    border-bottom: 1px solid rgba(255,255,255,0.2);
}
.form-label {
    font-weight: 500;
}
.table th {
    font-weight: 600;
    font-size: 0.9rem;
    text-transform: uppercase;
    color: #6c757d;
}
.btn {
    border-radius: 6px;
    padding: 8px 16px;
    font-weight: 500;
}
</style>
@endsection