@extends('layouts.admin')

@section('title', $vendor->vendor_name)

@section('content')
<!-- Page Header -->
<div class="d-flex justify-content-between align-items-center mb-4">
    <div class="d-flex align-items-center">
        <a href="{{ route('admin.vendors.index') }}" class="btn btn-outline-secondary btn-sm me-3">
            <i class="bi bi-arrow-left me-1"></i>
            Back to Vendors
        </a>
        <div>
            <h1 class="h3 mb-1 text-gray-800 font-weight-bold">{{ $vendor->vendor_name }}</h1>
            <p class="text-muted mb-0">Vendor Details & Management</p>
        </div>
    </div>
    <div class="d-flex gap-2">
        <a href="{{ route('admin.vendors.edit', $vendor) }}" class="btn btn-primary btn-sm">
            <i class="bi bi-pencil me-1"></i>
            Edit Vendor
        </a>
        @if($vendor->bizspot_business_type_id == 1)
            <a href="{{ route('admin.vendors.menu.index', $vendor) }}" class="btn btn-success btn-sm">
                <i class="bi bi-cup-hot me-1"></i>
                Food Menu
            </a>
        @elseif($vendor->bizspot_business_type_id == 2)
            <a href="{{ route('admin.vendors.services.index', $vendor) }}" class="btn btn-info btn-sm">
                <i class="bi bi-concierge-bell me-1"></i>
                Services
            </a>
        @elseif($vendor->bizspot_business_type_id == 3)
            <a href="{{ route('admin.vendors.products.index', $vendor) }}" class="btn btn-warning btn-sm">
                <i class="bi bi-box-seam me-1"></i>
                Products
            </a>
        @else
            <span class="btn btn-outline-secondary btn-sm" disabled>
                <i class="bi bi-question-circle me-1"></i>
                Configure Business Type
            </span>
        @endif
        <div class="dropdown">
            <button class="btn btn-outline-secondary btn-sm dropdown-toggle" type="button" data-bs-toggle="dropdown">
                <i class="bi bi-three-dots"></i>
            </button>
            <ul class="dropdown-menu">
                <li>
                    <form method="POST" action="{{ route('admin.vendors.toggle-verification', $vendor) }}" class="d-inline">
                        @csrf
                        <button type="submit" class="dropdown-item">
                            <i class="bi bi-shield-{{ $vendor->is_verified ? 'x' : 'check' }} me-2"></i>
                            {{ $vendor->is_verified ? 'Unverify' : 'Verify' }} Vendor
                        </button>
                    </form>
                </li>
                <li>
                    <form method="POST" action="{{ route('admin.vendors.toggle-active', $vendor) }}" class="d-inline">
                        @csrf
                        <button type="submit" class="dropdown-item">
                            <i class="bi bi-{{ $vendor->is_active ? 'pause' : 'play' }}-circle me-2"></i>
                            {{ $vendor->is_active ? 'Deactivate' : 'Activate' }} Vendor
                        </button>
                    </form>
                </li>
                <li><hr class="dropdown-divider"></li>
                <li>
                    <form method="POST" action="{{ route('admin.vendors.destroy', $vendor) }}" class="d-inline" 
                          onsubmit="return confirm('Are you sure you want to delete this vendor?')">
                        @csrf
                        @method('DELETE')
                        <button type="submit" class="dropdown-item text-danger">
                            <i class="bi bi-trash me-2"></i>
                            Delete Vendor
                        </button>
                    </form>
                </li>
            </ul>
        </div>
    </div>
</div>

<!-- Vendor Overview -->
<div class="row g-4 mb-4">
    <!-- Main Info Card -->
    <div class="col-lg-8">
        <div class="card border-0 shadow-sm h-100">
            <div class="card-body p-4">
                <div class="d-flex align-items-start">
                    <!-- Logo -->
                    <div class="me-4 flex-shrink-0">
                        @if($vendor->logo)
                            <img src="{{ Storage::url($vendor->logo) }}" alt="{{ $vendor->vendor_name }}" 
                                 class="rounded-3" style="width: 80px; height: 80px; object-fit: cover;">
                        @else
                            <div class="rounded-3 d-flex align-items-center justify-content-center" 
                                 style="width: 80px; height: 80px; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);">
                                <i class="bi bi-person-workspace text-white" style="font-size: 32px;"></i>
                            </div>
                        @endif
                    </div>
                    
                    <!-- Basic Info -->
                    <div class="flex-grow-1">
                        <div class="d-flex align-items-start justify-content-between mb-3">
                            <div>
                                <h4 class="fw-bold mb-1">{{ $vendor->vendor_name }}</h4>
                                <div class="d-flex align-items-center gap-2 mb-2">
                                    <span class="badge bg-light text-dark">{{ ucwords(str_replace('_', ' ', $vendor->vendor_type)) }}</span>
                                    <span class="badge" style="background: {{ $vendor->status_badge['color'] === 'green' ? '#dcfce7' : ($vendor->status_badge['color'] === 'yellow' ? '#fef3c7' : '#fee2e2') }}; color: {{ $vendor->status_badge['color'] === 'green' ? '#15803d' : ($vendor->status_badge['color'] === 'yellow' ? '#d97706' : '#dc2626') }};">
                                        {{ $vendor->status_badge['text'] }}
                                    </span>
                                    @if($vendor->is_featured)
                                        <span class="badge bg-warning text-dark">
                                            <i class="bi bi-star-fill me-1"></i>Featured
                                        </span>
                                    @endif
                                    @if($vendor->is_open_now)
                                        <span class="badge bg-success">Open Now</span>
                                    @endif
                                </div>
                            </div>
                            <div class="text-end">
                                <div class="d-flex align-items-center text-warning mb-1">
                                    @for($i = 1; $i <= 5; $i++)
                                        @if($i <= floor($vendor->vendor_rating))
                                            <i class="bi bi-star-fill"></i>
                                        @elseif($i - 0.5 <= $vendor->vendor_rating)
                                            <i class="bi bi-star-half"></i>
                                        @else
                                            <i class="bi bi-star"></i>
                                        @endif
                                    @endfor
                                </div>
                                <small class="text-muted">{{ $vendor->rating_display }}</small>
                            </div>
                        </div>
                        
                        @if($vendor->vendor_description)
                        <p class="text-muted mb-3">{{ $vendor->vendor_description }}</p>
                        @endif
                        
                        @if($vendor->category_path)
                        <div class="mb-3">
                            <small class="text-muted fw-medium">CATEGORY</small>
                            <div class="small">{{ $vendor->category_path }}</div>
                        </div>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <!-- Stats Card -->
    <div class="col-lg-4">
        <div class="card border-0 shadow-sm h-100">
            <div class="card-body p-4">
                <h6 class="fw-bold mb-3">Performance Stats</h6>
                <div class="row g-3">
                    <div class="col-6">
                        <div class="text-center">
                            <div class="h5 fw-bold text-primary mb-1">{{ $vendor->total_orders }}</div>
                            <small class="text-muted">Total Orders</small>
                        </div>
                    </div>
                    <div class="col-6">
                        <div class="text-center">
                            <div class="h5 fw-bold text-success mb-1">{{ $vendor->total_reviews }}</div>
                            <small class="text-muted">Reviews</small>
                        </div>
                    </div>
                    <div class="col-6">
                        <div class="text-center">
                            <div class="h5 fw-bold text-info mb-1">{{ $vendor->employee_count }}</div>
                            <small class="text-muted">Employees</small>
                        </div>
                    </div>
                    <div class="col-6">
                        <div class="text-center">
                            <div class="h5 fw-bold text-warning mb-1">{{ $vendor->years_in_business }}y</div>
                            <small class="text-muted">Experience</small>
                        </div>
                    </div>
                </div>
                
                @if($vendor->average_response_time_minutes > 0)
                <hr class="my-3">
                <div class="text-center">
                    <div class="h6 fw-bold text-secondary mb-1">{{ $vendor->average_response_time_minutes }}min</div>
                    <small class="text-muted">Avg Response Time</small>
                </div>
                @endif
            </div>
        </div>
    </div>
</div>

<!-- Detailed Information -->
<div class="row g-4">
    <!-- Contact & Location -->
    <div class="col-lg-6">
        <div class="card border-0 shadow-sm h-100">
            <div class="card-header bg-white border-0 pt-4 pb-3">
                <h6 class="card-title mb-0 fw-bold">Contact Information</h6>
            </div>
            <div class="card-body pt-0">
                <div class="row g-3">
                    <div class="col-12">
                        <div class="d-flex align-items-center">
                            <i class="bi bi-envelope text-muted me-3" style="width: 20px;"></i>
                            <div>
                                <small class="text-muted d-block">Email</small>
                                <a href="mailto:{{ $vendor->vendor_email }}" class="text-decoration-none">{{ $vendor->vendor_email }}</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-12">
                        <div class="d-flex align-items-center">
                            <i class="bi bi-phone text-muted me-3" style="width: 20px;"></i>
                            <div>
                                <small class="text-muted d-block">Phone</small>
                                <a href="tel:{{ $vendor->vendor_phone }}" class="text-decoration-none">{{ $vendor->vendor_phone }}</a>
                            </div>
                        </div>
                    </div>
                    @if($vendor->website)
                    <div class="col-12">
                        <div class="d-flex align-items-center">
                            <i class="bi bi-globe text-muted me-3" style="width: 20px;"></i>
                            <div>
                                <small class="text-muted d-block">Website</small>
                                <a href="{{ $vendor->website }}" target="_blank" class="text-decoration-none">{{ $vendor->website }}</a>
                            </div>
                        </div>
                    </div>
                    @endif
                    <div class="col-12">
                        <div class="d-flex align-items-start">
                            <i class="bi bi-geo-alt text-muted me-3 mt-1" style="width: 20px;"></i>
                            <div>
                                <small class="text-muted d-block">Address</small>
                                <div>{{ $vendor->vendor_address }}</div>
                                @if($vendor->latitude && $vendor->longitude)
                                <small class="text-muted">{{ $vendor->latitude }}, {{ $vendor->longitude }}</small>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <!-- Business Details -->
    <div class="col-lg-6">
        <div class="card border-0 shadow-sm h-100">
            <div class="card-header bg-white border-0 pt-4 pb-3">
                <h6 class="card-title mb-0 fw-bold">Business Details</h6>
            </div>
            <div class="card-body pt-0">
                <div class="row g-3">
                    @if($vendor->business_license_number)
                    <div class="col-12">
                        <small class="text-muted d-block">Business License</small>
                        <div>{{ $vendor->business_license_number }}</div>
                    </div>
                    @endif
                    @if($vendor->tax_id_number)
                    <div class="col-12">
                        <small class="text-muted d-block">Tax ID</small>
                        <div>{{ $vendor->tax_id_number }}</div>
                    </div>
                    @endif
                    @if($vendor->health_permit_number)
                    <div class="col-12">
                        <small class="text-muted d-block">Health Permit</small>
                        <div class="d-flex align-items-center">
                            <span>{{ $vendor->health_permit_number }}</span>
                            @if($vendor->health_permit_expiry)
                                <span class="badge {{ $vendor->hasValidHealthPermit() ? 'bg-success' : 'bg-danger' }} ms-2">
                                    {{ $vendor->hasValidHealthPermit() ? 'Valid' : 'Expired' }}
                                </span>
                            @endif
                        </div>
                        @if($vendor->health_permit_expiry)
                        <small class="text-muted">Expires: {{ $vendor->health_permit_expiry->format('M d, Y') }}</small>
                        @endif
                    </div>
                    @endif
                    <div class="col-6">
                        <small class="text-muted d-block">Verification Status</small>
                        <span class="badge bg-{{ $vendor->is_verified ? 'success' : 'warning' }}">
                            {{ $vendor->verification_status }}
                        </span>
                    </div>
                    <div class="col-6">
                        <small class="text-muted d-block">Account Status</small>
                        <span class="badge bg-{{ $vendor->is_active ? 'success' : 'secondary' }}">
                            {{ $vendor->is_active ? 'Active' : 'Inactive' }}
                        </span>
                    </div>
                    <div class="col-12">
                        <small class="text-muted d-block">Member Since</small>
                        <div>{{ $vendor->created_at->format('F d, Y') }}</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <!-- Delivery & Services -->
    @if($vendor->has_delivery || $vendor->services_offered)
    <div class="col-lg-6">
        <div class="card border-0 shadow-sm h-100">
            <div class="card-header bg-white border-0 pt-4 pb-3">
                <h6 class="card-title mb-0 fw-bold">Services & Delivery</h6>
            </div>
            <div class="card-body pt-0">
                @if($vendor->has_delivery)
                <div class="mb-3">
                    <div class="d-flex align-items-center mb-2">
                        <i class="bi bi-truck text-success me-2"></i>
                        <span class="fw-medium">Delivery Available</span>
                    </div>
                    @if($vendor->delivery_radius_km)
                    <small class="text-muted d-block">Radius: {{ $vendor->delivery_radius_km }}km</small>
                    @endif
                    @if($vendor->delivery_fee)
                    <small class="text-muted d-block">Fee: ${{ $vendor->delivery_fee }}</small>
                    @endif
                    @if($vendor->minimum_order_amount)
                    <small class="text-muted d-block">Min Order: ${{ $vendor->minimum_order_amount }}</small>
                    @endif
                </div>
                @endif
                
                @if($vendor->has_pickup)
                <div class="mb-3">
                    <div class="d-flex align-items-center">
                        <i class="bi bi-basket text-primary me-2"></i>
                        <span class="fw-medium">Pickup Available</span>
                    </div>
                </div>
                @endif
                
                @if($vendor->services_offered && count($vendor->services_offered) > 0)
                <div>
                    <small class="text-muted d-block mb-2">Services Offered</small>
                    <div class="d-flex flex-wrap gap-1">
                        @foreach($vendor->services_offered as $service)
                        <span class="badge bg-light text-dark">{{ $service }}</span>
                        @endforeach
                    </div>
                </div>
                @endif
            </div>
        </div>
    </div>
    @endif
    
    <!-- Operating Hours -->
    @if($vendor->operating_hours)
    <div class="col-lg-6">
        <div class="card border-0 shadow-sm h-100">
            <div class="card-header bg-white border-0 pt-4 pb-3">
                <h6 class="card-title mb-0 fw-bold">Operating Hours</h6>
            </div>
            <div class="card-body pt-0">
                <div class="row g-2">
                    @foreach(['monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday', 'sunday'] as $day)
                        @if(isset($vendor->operating_hours[$day]))
                        <div class="col-12">
                            <div class="d-flex justify-content-between align-items-center">
                                <span class="fw-medium">{{ ucfirst($day) }}</span>
                                @if($vendor->operating_hours[$day]['closed'] ?? false)
                                    <span class="text-muted">Closed</span>
                                @else
                                    <span class="text-muted">
                                        {{ $vendor->operating_hours[$day]['open'] ?? 'N/A' }} - 
                                        {{ $vendor->operating_hours[$day]['close'] ?? 'N/A' }}
                                    </span>
                                @endif
                            </div>
                        </div>
                        @endif
                    @endforeach
                </div>
            </div>
        </div>
    </div>
    @endif
    
    <!-- Payment Methods -->
    @if($vendor->payment_methods_accepted && count($vendor->payment_methods_accepted) > 0)
    <div class="col-lg-6">
        <div class="card border-0 shadow-sm h-100">
            <div class="card-header bg-white border-0 pt-4 pb-3">
                <h6 class="card-title mb-0 fw-bold">Payment Methods</h6>
            </div>
            <div class="card-body pt-0">
                <div class="d-flex flex-wrap gap-2">
                    @foreach($vendor->payment_methods_accepted as $method)
                    <span class="badge bg-light text-dark">{{ ucwords(str_replace('_', ' ', $method)) }}</span>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
    @endif
    
    <!-- Cover Image -->
    @if($vendor->cover_image)
    <div class="col-12">
        <div class="card border-0 shadow-sm">
            <div class="card-header bg-white border-0 pt-4 pb-3">
                <h6 class="card-title mb-0 fw-bold">Cover Image</h6>
            </div>
            <div class="card-body p-0">
                <img src="{{ Storage::url($vendor->cover_image) }}" alt="{{ $vendor->vendor_name }} Cover" 
                     class="w-100" style="height: 300px; object-fit: cover;">
            </div>
        </div>
    </div>
    @endif
    
    <!-- Special Instructions -->
    @if($vendor->special_instructions)
    <div class="col-12">
        <div class="card border-0 shadow-sm">
            <div class="card-header bg-white border-0 pt-4 pb-3">
                <h6 class="card-title mb-0 fw-bold">Special Instructions</h6>
            </div>
            <div class="card-body">
                <p class="mb-0">{{ $vendor->special_instructions }}</p>
            </div>
        </div>
    </div>
    @endif
</div>

@endsection