@extends('client.layouts.main')

@section('title', 'Service Details')

@section('content')
<div class="row">
    <div class="col-md-6">
        <div class="portlet light">
            <div class="portlet-title">
                <div class="caption"><span class="caption-subject theme-font bold uppercase">Service Information</span></div>
            </div>
            <div class="portlet-body">
                <div class="row">
                    <div class="col-md-6">
                        <strong>Product</strong>
                        <p>{{ $service->product?->name ?? 'N/A' }}</p>
                    </div>
                    <div class="col-md-6">
                        <strong>Status</strong>
                        <p>
                            @php
                                $statusColors = [
                                    'active' => 'success', 'pending' => 'warning', 'suspended' => 'danger',
                                    'terminated' => 'default', 'cancelled' => 'default',
                                ];
                            @endphp
                            <span class="label label-sm label-{{ $statusColors[$service->status] ?? 'info' }}">{{ ucfirst($service->status) }}</span>
                        </p>
                    </div>
                </div>
                @if($service->domain)
                <div class="row">
                    <div class="col-md-12">
                        <strong>Domain</strong>
                        <p>{{ $service->domain }}</p>
                    </div>
                </div>
                @endif
                <div class="row" style="margin-top:10px;">
                    <div class="col-md-3">
                        <strong>Billing Cycle</strong>
                        <p>{{ $service->billingCycle?->name ?? '-' }}</p>
                    </div>
                    <div class="col-md-3">
                        <strong>Renewal Price</strong>
                        <p>{{ $service->renewal_price ? number_format($service->renewal_price, 2) : '-' }}</p>
                    </div>
                    <div class="col-md-3">
                        <strong>Registration Date</strong>
                        <p>{{ $service->registration_date?->format('M d, Y') ?? '-' }}</p>
                    </div>
                    <div class="col-md-3">
                        <strong>Next Due Date</strong>
                        <p>{{ $service->next_due_date?->format('M d, Y') ?? '-' }}</p>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-md-6">
        @if($service->cancel_requested)
        <div class="portlet light">
            <div class="portlet-title">
                <div class="caption"><span class="caption-subject theme-font bold uppercase font-red">Cancellation Requested</span></div>
            </div>
            <div class="portlet-body">
                <p><strong>Type:</strong> {{ ucfirst(str_replace('_', ' ', $service->cancel_type ?? 'N/A')) }}</p>
                <p><strong>Requested:</strong> {{ $service->cancel_request_date?->format('M d, Y H:i') ?? 'N/A' }}</p>
                @if($service->suspension_reason)
                    <p><strong>Reason:</strong> {{ $service->suspension_reason }}</p>
                @endif
            </div>
        </div>
        @elseif(in_array($service->status, ['active', 'suspended']))
        <div class="portlet light">
            <div class="portlet-title">
                <div class="caption"><span class="caption-subject theme-font bold uppercase">Request Cancellation</span></div>
            </div>
            <form action="{{ route('client.services.cancel', $service) }}" method="POST">
                @csrf
                <div class="portlet-body">
                    <div class="form-group">
                        <label>Cancellation Type</label>
                        <select name="cancel_type" class="form-control" required>
                            <option value="end_of_billing">End of Billing Period</option>
                            <option value="immediate">Immediate</option>
                        </select>
                    </div>
                    <div class="form-group">
                        <label>Reason (optional)</label>
                        <textarea name="reason" class="form-control" rows="3" placeholder="Tell us why you want to cancel..."></textarea>
                    </div>
                </div>
                <div class="panel-footer">
                    <button type="submit" class="btn btn-danger" onclick="return confirm('Are you sure you want to request cancellation?')">
                        <i class="fa fa-times"></i> Submit Cancellation Request
                    </button>
                </div>
            </form>
        </div>
        @endif
    </div>
</div>
@endsection