{{-- resources/views/pricing/index.blade.php --}}
@extends('layouts.app')
@section('title', 'Pricing')
@section('page_title', 'Pricing')
@section('page_subtitle', 'Manage rates, plans and promotions')

@section('content')

{{-- Stats --}}
<div class="row g-3 mb-3">
    <div class="col-sm-6 col-xl-3">
        <div class="stat-card">
            <div class="stat-icon si-clay">
                <i class="bi bi-tag"></i>
            </div>
            <div>
                <div class="stat-value">{{ $ratePlans }}</div>
                <div class="stat-label">Rate Plans</div>
            </div>
        </div>
    </div>
    <div class="col-sm-6 col-xl-3">
        <div class="stat-card">
            <div class="stat-icon si-success">
                <i class="bi bi-currency-dollar"></i>
            </div>
            <div>
                <div class="stat-value">{{ $rates }}</div>
                <div class="stat-label">Rates Set</div>
            </div>
        </div>
    </div>
    <div class="col-sm-6 col-xl-3">
        <div class="stat-card">
            <div class="stat-icon si-info">
                <i class="bi bi-calendar-range"></i>
            </div>
            <div>
                <div class="stat-value">{{ $seasonal }}</div>
                <div class="stat-label">Seasonal Rates</div>
            </div>
        </div>
    </div>
    <div class="col-sm-6 col-xl-3">
        <div class="stat-card">
            <div class="stat-icon si-warning">
                <i class="bi bi-percent"></i>
            </div>
            <div>
                <div class="stat-value">{{ $promotions }}</div>
                <div class="stat-label">Active Promos</div>
            </div>
        </div>
    </div>
</div>

{{-- Navigation cards --}}
<div class="row g-3 mb-3">
    @php
        $sections = [
            ['route' => 'pricing.rate-plans.index', 'icon' => 'bi-tag',           'color' => 'var(--clay)', 'title' => 'Rate Plans',      'desc' => 'Define plans like BAR, corporate, B&B, packages'],
            ['route' => 'pricing.rates.index',      'icon' => 'bi-currency-dollar','color' => '#10b981',    'title' => 'Base Rates',      'desc' => 'Set nightly rates per room category and plan'],
            ['route' => 'pricing.seasonal.index',   'icon' => 'bi-calendar-range', 'color' => '#3b82f6',    'title' => 'Seasonal Rates',  'desc' => 'Override rates during peak, high or low seasons'],
            ['route' => 'pricing.promotions.index', 'icon' => 'bi-percent',        'color' => '#f59e0b',    'title' => 'Promotions',      'desc' => 'Promo codes, discounts and special offers'],
        ];
    @endphp

    @foreach($sections as $section)
        <div class="col-sm-6 col-xl-3">
            <a href="{{ tenant_route($section['route']) }}"
               style="text-decoration:none;">
                <div class="card h-100"
                     style="transition:box-shadow .15s,transform .15s;"
                     onmouseover="this.style.boxShadow='0 4px 20px rgba(0,0,0,.08)';this.style.transform='translateY(-2px)'"
                     onmouseout="this.style.boxShadow='none';this.style.transform='none'">
                    <div class="card-body"
                         style="padding:18px;">
                        <div style="width:42px;height:42px;border-radius:10px;
                                    background:{{ $section['color'] }}18;
                                    display:flex;align-items:center;
                                    justify-content:center;margin-bottom:12px;">
                            <i class="bi {{ $section['icon'] }}"
                               style="font-size:1.1rem;color:{{ $section['color'] }};"></i>
                        </div>
                        <div class="fw-semibold" style="font-size:.9rem;margin-bottom:3px;">
                            {{ $section['title'] }}
                        </div>
                        <div style="font-size:.73rem;color:var(--muted);line-height:1.4;">
                            {{ $section['desc'] }}
                        </div>
                    </div>
                </div>
            </a>
        </div>
    @endforeach
</div>

{{-- Rate coverage per category --}}
<div class="card">
    <div class="card-header">
        <span class="card-title">
            <i class="bi bi-grid me-2" style="color:var(--clay)"></i>
            Rate Coverage by Room Category
        </span>
        <a href="{{ tenant_route('pricing.rates.index') }}"
           style="font-size:.75rem;color:var(--clay);text-decoration:none;">
            Manage Rates →
        </a>
    </div>

    @if($categories->isEmpty())
        <div class="card-body text-center py-4">
            <p class="text-muted mb-0" style="font-size:.8rem;">
                No room categories yet.
                <a href="{{ tenant_route('rooms.categories.create') }}"
                   style="color:var(--clay);">
                    Create room categories →
                </a>
            </p>
        </div>
    @else
        <div class="table-responsive">
            <table class="table">
                <thead>
                    <tr>
                        <th>Room Category</th>
                        <th>Rooms</th>
                        <th>Rates Set</th>
                        <th>Coverage</th>
                        <th></th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($categories as $cat)
                        @php
                            $ratePlansTotal = \App\Models\RatePlan::where('property_id', tenant_id())
                                ->where('is_active', true)->count();
                            $ratesSet = $cat->rates_count;
                            $pct = $ratePlansTotal > 0
                                ? min(100, round(($ratesSet / $ratePlansTotal) * 100))
                                : 0;
                        @endphp
                        <tr>
                            <td>
                                <div class="fw-semibold" style="font-size:.83rem;">
                                    {{ $cat->name }}
                                </div>
                                @if($cat->bed_type)
                                    <div style="font-size:.7rem;color:var(--muted);">
                                        {{ $cat->bed_type }}
                                    </div>
                                @endif
                            </td>
                            <td style="font-size:.8rem;color:var(--muted);">
                                {{ $cat->rooms_count ?? 0 }}
                            </td>
                            <td style="font-size:.82rem;">
                                {{ $ratesSet }}
                                @if($ratePlansTotal > 0)
                                    <span style="color:var(--muted);font-size:.72rem;">
                                        / {{ $ratePlansTotal }} plans
                                    </span>
                                @endif
                            </td>
                            <td style="width:180px;">
                                <div style="display:flex;align-items:center;gap:8px;">
                                    <div style="flex:1;background:var(--border);
                                                border-radius:3px;height:7px;
                                                overflow:hidden;">
                                        <div style="height:100%;
                                                    width:{{ $pct }}%;
                                                    background:{{ $pct === 100 ? 'var(--success)' : ($pct > 0 ? 'var(--warning)' : 'var(--danger)') }};
                                                    border-radius:3px;
                                                    transition:width .3s;">
                                        </div>
                                    </div>
                                    <span style="font-size:.75rem;font-weight:600;
                                                 width:32px;flex-shrink:0;
                                                 color:{{ $pct === 100 ? 'var(--success)' : 'var(--muted)' }};">
                                        {{ $pct }}%
                                    </span>
                                </div>
                            </td>
                            <td>
                                <a href="{{ tenant_route('pricing.rates.index') }}?category={{ $cat->id }}"
                                   class="btn btn-xs btn-outline-secondary">
                                    Set Rates →
                                </a>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    @endif
</div>

@endsection