@extends('layouts.layout-2')

@section('content')
<div class="container-fluid">
    @if(isset($error))
        <div class="alert alert-danger">
            <i class="fas fa-exclamation-triangle"></i> {{ $error }}
        </div>
    @endif

    <!-- Header Section -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="card bg-primary text-white">
                <div class="card-body text-center py-3">
                    <h1 class="card-title mb-3">
                        <i class="fas fa-chart-line mr-3"></i>
                        {{ __('marketingplan.title') }}
                    </h1>
                    <p class="card-text lead mb-0">
                        {{ __('marketingplan.subtitle') }}
                    </p>
                    @if($currentUser && $currentLevel)
                        <div class="mt-3">
                            <span class="badge badge-light badge-lg">
                                <i class="fas fa-user mr-2"></i>
                                {{ __('marketingplan.current_level') }} {{ $currentLevel->name }}
                            </span>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>

    @if($userLevels->count() > 0)
        <!-- Marketing Plan Levels -->
        <div class="row">
            @foreach($userLevels as $index => $level)
                <div class="col-lg-6 col-xl-4 mb-4">
                    <div class="card h-100 shadow-sm 
                        @if($currentUser && $currentLevel && $currentLevel->id == $level->id) 
                            border-secondary current-level
                        @elseif($currentUser && $currentLevel && $currentLevel->pos < $level->pos)
                            border-primary next-level
                        @else
                            border-light
                        @endif">
                        
                        <!-- Level Header -->
                        <div class="card-header 
                            @if($currentUser && $currentLevel && $currentLevel->id == $level->id) 
                                bg-secondary 
                            @elseif($currentUser && $currentLevel && $currentLevel->pos < $level->pos)
                                bg-primary text-white
                            @else
                                bg-light
                            @endif">
                            <div class="d-flex justify-content-between align-items-center">
                                <h5 class="mb-0">
                                    <span class="badge 
                                        @if($currentUser && $currentLevel && $currentLevel->id == $level->id) 
                                            badge-primary text-white
                                        @elseif($currentUser && $currentLevel && $currentLevel->pos < $level->pos)
                                            badge-secondary
                                        @else
                                            badge-secondary
                                        @endif mr-2">{{ $level->pos }}</span>
                                    {{ $level->name }}
                                </h5>
                                @if($currentUser && $currentLevel && $currentLevel->id == $level->id)
                                    <i class="fas fa-star text-warning-dark"></i>
                                @elseif($currentUser && $currentLevel && $level->pos == $currentLevel->pos + 1)
                                    <i class="fas fa-arrow-up text-warning-dark"></i>
                                @endif
                            </div>
                        </div>

                        <!-- Level Details -->
                        <div class="card-body">
                            <!-- Qualifikation Section -->
                            <div class="mb-3">
                                <h6 class="text-muted mb-2">
                                    <i class="fas fa-certificate mr-2"></i>{{ __('marketingplan.qualification') }}
                                </h6>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="text-center p-2 bg-light rounded">
                                            <div class="font-weight-bold text-primary">{{ formatNumber($level->qual_kp, 0) }}</div>
                                            <small class="text-muted">{{ __('marketingplan.kp_points') }}</small>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="text-center p-2 bg-light rounded">
                                            <div class="font-weight-bold text-info">{{ formatNumber($level->qual_pp, 0) }}</div>
                                            <small class="text-muted">{{ __('marketingplan.tp_points') }}</small>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Provision Section -->
                            <div class="mb-3">
                                <h6 class="text-muted mb-2">
                                    <i class="fas fa-percentage mr-2"></i>{{ __('marketingplan.provisions') }}
                                </h6>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="text-center p-2 bg-light rounded">
                                            <div class="font-weight-bold text-success">{{ $level->margin }}%</div>
                                            <small class="text-muted">{{ __('marketingplan.standard') }}</small>
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="text-center p-2 bg-light rounded">
                                            <div class="font-weight-bold text-success">{{ $level->margin_shop }}%</div>
                                            <small class="text-muted">{{ __('marketingplan.shop') }}</small>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <!-- Paylines Section -->
                            @if($level->paylines > 0)
                                <div class="mb-3">
                                                                    <h6 class="text-muted mb-2">
                                    <i class="fas fa-sitemap mr-2"></i>{{ __('marketingplan.team_provisions') }}
                                </h6>
                                    <div class="row">
                                        @for($i = 1; $i <= min($level->paylines, 4); $i++)
                                            @php $lineValue = $level->{'pr_line_' . $i}; @endphp
                                            @if($lineValue > 0)
                                                <div class="col-3">
                                                    <div class="text-center p-1 bg-light rounded">
                                                        <div class="font-weight-bold text-warning-dark">{{ $lineValue }}%</div>
                                                        <small class="text-muted">L{{ $i }}</small>
                                                    </div>
                                                </div>
                                            @endif
                                        @endfor
                                    </div>
                                    @if($level->paylines > 4)
                                        <div class="row mt-2">
                                            @for($i = 5; $i <= min($level->paylines, 8); $i++)
                                                @php $lineValue = $level->{'pr_line_' . $i}; @endphp
                                                @if($lineValue > 0)
                                                    <div class="col-3">
                                                        <div class="text-center p-1 bg-light rounded">
                                                            <div class="font-weight-bold text-warning-dark">{{ $lineValue }}%</div>
                                                            <small class="text-muted">L{{ $i }}</small>
                                                        </div>
                                                    </div>
                                                @endif
                                            @endfor
                                        </div>
                                    @endif
                                </div>
                            @endif

                            <!-- Tiefenbonus -->
                            @if($level->getFormattedGrowthBonus())
                                <div class="mb-3">
                                                                    <h6 class="text-muted mb-2">
                                    <i class="fas fa-trophy mr-2"></i>{{ __('marketingplan.growth_bonus') }}
                                </h6>
                                    <div class="text-center p-2 bg-light rounded">
                                        <div class="font-weight-bold text-warning-dark">{{ $level->getFormattedGrowthBonus() }}</div>
                                    </div>
                                </div>
                            @endif

                            <!-- Next Level Info -->
                            @if($level->next_user_level)
                                <div class="border-top pt-3 mt-3">
                                    <small class="text-muted">
                                        <i class="fas fa-arrow-right mr-1"></i>
                                        {{ __('marketingplan.next_level') }} 
                                        <strong>{{ $level->next_user_level->name }}</strong>
                                    </small>
                                </div>
                            @endif
                        </div>

                        <!-- Card Footer for Current Level -->
                        @if($currentUser && $currentLevel && $currentLevel->id == $level->id)
                            <div class="card-footer bg-secondary  text-center">
                                <small>
                                    <i class="fas fa-check-circle mr-1"></i>
                                    {{ __('marketingplan.your_current_level') }}
                                </small>
                            </div>
                        @elseif($currentUser && $currentLevel && $level->pos == $currentLevel->pos + 1)
                            <div class="card-footer bg-primary text-white">
                                <small>
                                    <i class="fas fa-arrow-right mr-1"></i>
                                    {{ __('marketingplan.your_next_goal') }}
                                </small>
                            </div>
                        @endif
                    </div>
                </div>
            @endforeach
        </div>

        <!-- Info Section -->
        <div class="row mt-4">
            <div class="col-12">
                <div class="card border-info">
                    <div class="card-header bg-info text-white">
                        <h5 class="mb-0">
                            <i class="fas fa-info-circle mr-2"></i>
                            {{ __('marketingplan.legend') }}
                        </h5>
                    </div>
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-6">
                                <ul class="list-unstyled">
                                    <li class="mb-2">
                                        <span class="badge badge-primary mr-2">KU</span>
                                        {{ __('marketingplan.customer_points_full') }}
                                    </li>
                                    <li class="mb-2">
                                        <span class="badge badge-info mr-2">TP</span>
                                        {{ __('marketingplan.team_points_full') }}
                                    </li>
                                </ul>
                            </div>
                            <div class="col-md-6">
                                <ul class="list-unstyled">
                                    <li class="mb-2">
                                        <span class="badge badge-warning mr-2">L1-L8</span>
                                        {{ __('marketingplan.team_provisions_by_lines') }}
                                    </li>
                                    <li class="mb-2">
                                        <span class="badge badge-success mr-2">%</span>
                                        {{ __('marketingplan.provision_rates') }}
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    @else
        <!-- No Levels Available -->
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-body text-center py-5">
                        <i class="fas fa-exclamation-circle fa-3x text-muted mb-3"></i>
                        <h4 class="text-muted">{{ __('marketingplan.no_levels_available') }}</h4>
                        <p class="text-muted">{{ __('marketingplan.no_levels_configured') }}</p>
                    </div>
                </div>
            </div>
        </div>
    @endif

    @if(isset($performance))
        <!-- Performance Info (nur im Debug-Modus anzeigen) -->
        @if(config('app.debug'))
            <div class="row mt-3">
                <div class="col-12">
                    <div class="alert alert-info">
                        <small>
                            <i class="fas fa-clock mr-1"></i>
                            {{ __('marketingplan.loading_time') }} {{ $performance['execution_time'] }}ms
                        </small>
                    </div>
                </div>
            </div>
        @endif
    @endif
</div>

<style>
.current-level {
    box-shadow: 0 4px 8px rgba(0, 123, 255, 0.3) !important;
}

.next-level {
    box-shadow: 0 4px 8px rgba(40, 167, 69, 0.3) !important;
}

.card {
    transition: transform 0.2s;
}

.card:hover {
    transform: translateY(-2px);
}

.bg-gradient-primary {
    background: linear-gradient(45deg, #007bff, #0056b3);
}

.badge-lg {
    font-size: 1rem;
    padding: 0.5rem 1rem;
}
.text-warning-dark {
    color: #bf9500 !important;
}
</style>
@endsection