@extends('layouts.app')

@section('title', 'ড্যাশবোর্ড - আমবাগান যুব কল্যাণ সমিতি')

@section('styles')
<style>
    .stat-card {
        border: none;
        border-radius: 10px;
        box-shadow: 0 2px 6px rgba(0,0,0,0.1);
        transition: all 0.3s;
        height: 100%;
    }
    
    .stat-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    }
    
    .stat-card .card-body {
        padding: 1.5rem;
    }
    
    .stat-card .stat-icon {
        font-size: 2.5rem;
        opacity: 0.8;
    }
    
    .stat-card .stat-value {
        font-size: 1.8rem;
        font-weight: 700;
        margin-bottom: 0;
    }
    
    .stat-card .stat-label {
        color: #6c757d;
        font-size: 0.9rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
    
    .quick-link-card {
        border: none;
        border-radius: 8px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        transition: all 0.3s;
        text-decoration: none;
        color: inherit;
        display: block;
        height: 100%;
    }
    
    .quick-link-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 5px 12px rgba(0,0,0,0.15);
        text-decoration: none;
        color: inherit;
    }
    
    .quick-link-card .card-body {
        padding: 1.2rem;
        text-align: center;
    }
    
    .quick-link-icon {
        font-size: 2rem;
        margin-bottom: 0.5rem;
        color: var(--primary-color);
    }
    
    .quick-link-title {
        font-size: 1rem;
        font-weight: 600;
        margin-bottom: 0;
    }
    
    .activity-item {
        padding: 0.8rem 1rem;
        border-bottom: 1px solid #eee;
        transition: all 0.3s;
    }
    
    .activity-item:hover {
        background-color: #f8f9fa;
    }
    
    .activity-item:last-child {
        border-bottom: none;
    }
    
    .activity-icon {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
    }
    
    .user-badge {
        display: inline-block;
        padding: 5px 12px;
        border-radius: 20px;
        font-size: 0.9rem;
        font-weight: 600;
    }
    
    .badge-admin {
        background-color: #dc3545;
        color: white;
    }
    
    .badge-committee {
        background-color: #ffc107;
        color: #212529;
    }
    
    .badge-member {
        background-color: #28a745;
        color: white;
    }
</style>
@endsection

@section('content')
<div class="container-fluid">
    <!-- ব্রেডক্রাম্ব -->
    <nav aria-label="breadcrumb" class="mb-4">
        <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}" class="text-decoration-none">হোম</a></li>
            <li class="breadcrumb-item active" aria-current="page">ড্যাশবোর্ড</li>
        </ol>
    </nav>
    
    <!-- স্বাগতম কার্ড -->
    <div class="card shadow mb-4">
        <div class="card-header bg-primary text-white py-3">
            <h5 class="m-0 font-weight-bold">
                <i class="fas fa-hand-peace me-2"></i>
                স্বাগতম, {{ $user->name }}!
            </h5>
        </div>
        <div class="card-body">
            <div class="row align-items-center">
                <div class="col-md-8">
                    <p class="lead mb-2">
                        <i class="fas fa-calendar-alt me-2 text-primary"></i>
                        আজ {{ now()->format('d F, Y') }}, {{ now()->format('l') }}
                    </p>
                    <p class="mb-0">
                        <i class="fas fa-clock me-2 text-success"></i>
                        শেষ লগইন: {{ $user->last_login_at ? $user->last_login_at->format('d/m/Y h:i A') : 'প্রথমবার' }}
                    </p>
                </div>
                <div class="col-md-4 text-md-end">
                    <span class="user-badge 
                        @if($user->user_type == 'admin') badge-admin
                        @elseif($user->user_type == 'committee') badge-committee
                        @else badge-member @endif">
                        <i class="fas 
                            @if($user->user_type == 'admin') fa-crown
                            @elseif($user->user_type == 'committee') fa-users-cog
                            @else fa-user @endif me-1">
                        </i>
                        @if($user->user_type == 'admin')
                            অ্যাডমিন
                        @elseif($user->user_type == 'committee')
                            কমিটি সদস্য
                        @else
                            সাধারণ সদস্য
                        @endif
                    </span>
                </div>
            </div>
        </div>
    </div>
    
    <!-- ইউজার ইনফো কার্ড -->
    <div class="row mb-4">
        <div class="col-md-4 mb-3">
            <div class="card stat-card border-primary">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="stat-label">ইউজার টাইপ</p>
                            <h5 class="stat-value">
                                @if($user->user_type == 'admin')
                                    অ্যাডমিন
                                @elseif($user->user_type == 'committee')
                                    কমিটি
                                @else
                                    সদস্য
                                @endif
                            </h5>
                            <small class="text-muted">আপনার অ্যাক্সেস লেভেল</small>
                        </div>
                        <div class="stat-icon text-primary">
                            <i class="fas 
                                @if($user->user_type == 'admin') fa-user-shield
                                @elseif($user->user_type == 'committee') fa-user-tie
                                @else fa-user @endif">
                            </i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="col-md-4 mb-3">
            <div class="card stat-card border-success">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="stat-label">ইমেইল</p>
                            <h5 class="stat-value text-truncate" style="max-width: 200px;">{{ $user->email ?? 'N/A' }}</h5>
                            <small class="text-muted">{{ $user->email_verified_at ? 'ভেরিফাইড' : 'ভেরিফাইড নয়' }}</small>
                        </div>
                        <div class="stat-icon text-success">
                            <i class="fas fa-envelope"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
        <div class="col-md-4 mb-3">
            <div class="card stat-card border-info">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="stat-label">ফোন</p>
                            <h5 class="stat-value">{{ $user->phone }}</h5>
                            <small class="text-muted">প্রাথমিক যোগাযোগ</small>
                        </div>
                        <div class="stat-icon text-info">
                            <i class="fas fa-phone-alt"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    
    <!-- দ্রুত লিংকস -->
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h6 class="m-0 font-weight-bold">
                <i class="fas fa-link me-2"></i>
                দ্রুত লিংক
            </h6>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('profile') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-user-circle"></i>
                                </div>
                                <h6 class="quick-link-title">প্রোফাইল</h6>
                                <small class="text-muted">আপনার তথ্য দেখুন</small>
                            </div>
                        </div>
                    </a>
                </div>
                
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('notices.index') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-bullhorn"></i>
                                </div>
                                <h6 class="quick-link-title">নোটিশ</h6>
                                <small class="text-muted">সর্বশেষ নোটিশ দেখুন</small>
                            </div>
                        </div>
                    </a>
                </div>
                
                @if(in_array($user->user_type, ['committee', 'admin']))
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('members.index') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-users"></i>
                                </div>
                                <h6 class="quick-link-title">সদস্য</h6>
                                <small class="text-muted">সদস্য ব্যবস্থাপনা</small>
                            </div>
                        </div>
                    </a>
                </div>
                
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('loans.index') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-hand-holding-usd"></i>
                                </div>
                                <h6 class="quick-link-title">ঋণ</h6>
                                <small class="text-muted">ঋণ ব্যবস্থাপনা</small>
                            </div>
                        </div>
                    </a>
                </div>
                
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('savings.index') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-piggy-bank"></i>
                                </div>
                                <h6 class="quick-link-title">সঞ্চয়</h6>
                                <small class="text-muted">সঞ্চয় ব্যবস্থাপনা</small>
                            </div>
                        </div>
                    </a>
                </div>
                
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('incomes.index') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-money-bill-wave"></i>
                                </div>
                                <h6 class="quick-link-title">আয়</h6>
                                <small class="text-muted">আয় নিবন্ধন</small>
                            </div>
                        </div>
                    </a>
                </div>
                
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('expenses.index') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-receipt"></i>
                                </div>
                                <h6 class="quick-link-title">ব্যয়</h6>
                                <small class="text-muted">ব্যয় নিবন্ধন</small>
                            </div>
                        </div>
                    </a>
                </div>
                
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('meetings.index') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-calendar-alt"></i>
                                </div>
                                <h6 class="quick-link-title">মিটিং</h6>
                                <small class="text-muted">মিটিং ব্যবস্থাপনা</small>
                            </div>
                        </div>
                    </a>
                </div>
                
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('reports.summary') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-chart-bar"></i>
                                </div>
                                <h6 class="quick-link-title">রিপোর্ট</h6>
                                <small class="text-muted">বিভিন্ন রিপোর্ট</small>
                            </div>
                        </div>
                    </a>
                </div>
                @endif
                
                @if($user->user_type == 'member')
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('savings.history') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-history"></i>
                                </div>
                                <h6 class="quick-link-title">আমার সঞ্চয়</h6>
                                <small class="text-muted">সঞ্চয়ের ইতিহাস</small>
                            </div>
                        </div>
                    </a>
                </div>
                
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('loans.my-loans') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-hand-holding-usd"></i>
                                </div>
                                <h6 class="quick-link-title">আমার ঋণ</h6>
                                <small class="text-muted">ঋণের তথ্য</small>
                            </div>
                        </div>
                    </a>
                </div>
                @endif
                
                @if($user->user_type == 'admin')
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('users.index') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-user-cog"></i>
                                </div>
                                <h6 class="quick-link-title">ব্যবহারকারী</h6>
                                <small class="text-muted">ব্যবহারকারী ব্যবস্থাপনা</small>
                            </div>
                        </div>
                    </a>
                </div>
                
                <div class="col-md-3 col-sm-6 mb-3">
                    <a href="{{ route('settings.index') }}" class="quick-link-card">
                        <div class="card">
                            <div class="card-body">
                                <div class="quick-link-icon">
                                    <i class="fas fa-cogs"></i>
                                </div>
                                <h6 class="quick-link-title">সেটিংস</h6>
                                <small class="text-muted">সিস্টেম কনফিগারেশন</small>
                            </div>
                        </div>
                    </a>
                </div>
                @endif
            </div>
        </div>
    </div>
    
    <!-- রোল ভিত্তিক ড্যাশবোর্ড লিংক -->
    <div class="card shadow mb-4">
        <div class="card-header py-3">
            <h6 class="m-0 font-weight-bold">
                <i class="fas fa-arrow-right me-2"></i>
                বিশেষ ড্যাশবোর্ড
            </h6>
        </div>
        <div class="card-body">
            <div class="row">
                @if($user->user_type == 'admin')
                <div class="col-md-6 mb-3">
                    <a href="{{ route('dashboard.admin') }}" class="btn btn-danger btn-lg w-100 py-3">
                        <i class="fas fa-crown me-2"></i>
                        অ্যাডমিন ড্যাশবোর্ড
                    </a>
                </div>
                @endif
                
                @if(in_array($user->user_type, ['committee', 'admin']))
                <div class="col-md-6 mb-3">
                    <a href="{{ route('dashboard.committee') }}" class="btn btn-warning btn-lg w-100 py-3">
                        <i class="fas fa-users-cog me-2"></i>
                        কমিটি ড্যাশবোর্ড
                    </a>
                </div>
                @endif
            </div>
        </div>
    </div>
    
    <!-- লগআউট বাটন -->
    <div class="card shadow">
        <div class="card-body text-center">
            <form action="{{ route('logout') }}" method="POST">
                @csrf
                <button type="submit" class="btn btn-outline-danger btn-lg px-5">
                    <i class="fas fa-sign-out-alt me-2"></i>
                    লগআউট
                </button>
            </form>
        </div>
    </div>
</div>
@endsection

@section('scripts')
<script>
    $(document).ready(function() {
        // টুলটিপ ইনিশিয়ালাইজ
        var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
        tooltipTriggerList.map(function(tooltipTriggerEl) {
            return new bootstrap.Tooltip(tooltipTriggerEl);
        });
    });
</script>
@endsection