@extends('layouts.admin')

@section('title', 'Analytics - MentoraMind Admin')
@section('description', 'Analyse détaillée des performances de la plateforme')

@section('content')
<div class="page-header">
    <div>
        <h1>{{ __('admin.analytics.title') }}</h1>
        <p>{{ __('admin.analytics.subtitle') }}</p>
    </div>
</div>

@livewire('admin.analytics.analytics-management')

@endsection

@push('styles')
<style>
.stat-card {
    height: 120px;
    display: flex;
    align-items: center;
}

.stat-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 20px;
}

.stat-value {
    min-height: 40px;
    display: flex;
    align-items: center;
}

.stat-change {
    min-height: 18px;
}

.progress {
    height: 10px;
    border-radius: 6px;
    background: var(--gray-200);
}

.progress-bar {
    background: linear-gradient(90deg, var(--primary-orange), var(--secondary-orange-light));
    border-radius: 6px;
}
</style>
@endpush