<!DOCTYPE html>
<html lang="bn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>@yield('title', 'আমবাগান যুব কল্যাণ সমিতি')</title>
    
    <!-- বাংলা ফন্ট -->
    <link href="https://fonts.maateen.me/solaiman-lipi/font.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    
    <!-- Bootstrap 5 CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    
    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    
    <!-- DataTables -->
    <link rel="stylesheet" href="https://cdn.datatables.net/1.13.6/css/dataTables.bootstrap5.min.css">
    
    <!-- Select2 -->
    <link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
    
    <!-- Toast Notification -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css">
    
    <!-- কাস্টম CSS -->
    <style>
        :root {
            --primary-color: #1a5f7a;
            --secondary-color: #57cc99;
            --accent-color: #ffd166;
            --dark-color: #2d3047;
            --light-color: #f8f9fa;
        }
        
        body {
            font-family: 'Hind Siliguri', 'SolaimanLipi', sans-serif;
            background-color: #f5f7fa;
            direction: ltr;
            overflow-x: hidden;
        }
        
        .logo-font {
            font-family: 'SolaimanLipi', sans-serif;
            font-size: 1.8rem;
            font-weight: bold;
            color: var(--primary-color);
            text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
        }
        
        .bangla-text {
            font-family: 'Hind Siliguri', sans-serif;
            line-height: 1.6;
        }
        
        .card-header {
            background: linear-gradient(135deg, var(--primary-color), #2a9d8f);
            color: white;
            font-weight: 600;
            padding: 12px 20px;
        }
        
        .btn-primary {
            background-color: var(--primary-color);
            border-color: var(--primary-color);
        }
        
        .btn-primary:hover {
            background-color: #154c63;
            border-color: #154c63;
        }
        
        .btn-success {
            background-color: var(--secondary-color);
            border-color: var(--secondary-color);
        }
        
        /* সাইডবার স্টাইল - স্ক্রলেবল সাইডবার */
        .sidebar {
            background-color: var(--dark-color);
            height: calc(100vh - 56px); /* নেভবারের উচ্চতা বাদ */
            position: fixed;
            top: 56px; /* নেভবারের নিচ থেকে শুরু */
            left: 0;
            width: 250px;
            z-index: 1000;
            box-shadow: 3px 0 10px rgba(0,0,0,0.1);
            transition: all 0.3s ease;
            display: flex;
            flex-direction: column;
            overflow: hidden; /* মূল সাইডবারে স্ক্রলবার লুকান */
        }
        
        /* সাইডবারের কন্টেন্ট এলাকা যেটি স্ক্রল হবে */
        .sidebar-content {
            flex: 1;
            overflow-y: auto;
            overflow-x: hidden;
            padding: 0;
            scrollbar-width: thin;
            scrollbar-color: var(--primary-color) rgba(255, 255, 255, 0.1);
            position: relative; /* অবস্থান নির্দেশকের জন্য */
        }
        
        /* সাইডবার হেডার (যা স্ক্রল হবে না) */
        .sidebar-header {
            padding: 20px 15px;
            text-align: center;
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
            background-color: rgba(0, 0, 0, 0.2);
            flex-shrink: 0;
        }
        
        /* সাইডবার ফুটার (যা স্ক্রল হবে না) */
        .sidebar-footer {
            padding: 10px 15px;
            border-top: 1px solid rgba(255, 255, 255, 0.1);
            background-color: rgba(0, 0, 0, 0.2);
            flex-shrink: 0;
            text-align: center;
        }
        
        /* সাইডবার স্ক্রলবার কাস্টমাইজ */
        .sidebar-content::-webkit-scrollbar {
            width: 6px;
        }
        
        .sidebar-content::-webkit-scrollbar-track {
            background: rgba(255, 255, 255, 0.05);
            border-radius: 3px;
        }
        
        .sidebar-content::-webkit-scrollbar-thumb {
            background-color: var(--primary-color);
            border-radius: 3px;
        }
        
        .sidebar-content::-webkit-scrollbar-thumb:hover {
            background-color: #154c63;
        }
        
        .main-content {
            margin-left: 250px;
            padding-top: 56px;
            transition: all 0.3s ease;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
        }
        
        /* সাইডবার কোলাপ্স হলে */
        .sidebar-collapsed .sidebar {
            left: -250px;
        }
        
        .sidebar-collapsed .main-content {
            margin-left: 0;
        }
        
        /* সাইডবার নেভ লিঙ্ক */
        .sidebar .nav-link {
            color: #ddd;
            padding: 12px 20px;
            border-left: 4px solid transparent;
            transition: all 0.3s;
            font-size: 0.95rem;
            display: flex;
            align-items: center;
            margin: 2px 10px;
            border-radius: 4px;
        }
        
        .sidebar .nav-link:hover {
            color: white;
            background-color: rgba(255,255,255,0.1);
            border-left: 4px solid var(--accent-color);
        }
        
        .sidebar .nav-link.active {
            color: white;
            background-color: rgba(255,255,255,0.15);
            border-left: 4px solid var(--secondary-color);
        }
        
        .sidebar .nav-link i {
            width: 20px;
            text-align: center;
            margin-right: 10px;
        }
        
        /* নেস্টেড মেনু আইটেম */
        .sidebar .nav-link.collapsed .fa-chevron-down {
            transform: rotate(0deg);
            transition: transform 0.3s;
        }
        
        .sidebar .nav-link:not(.collapsed) .fa-chevron-down {
            transform: rotate(180deg);
            transition: transform 0.3s;
        }
        
        .sidebar .sub-menu {
            padding-left: 35px;
        }
        
        .sidebar .sub-menu .nav-link {
            padding: 8px 15px;
            font-size: 0.9rem;
            margin: 0;
            border-left: 2px solid transparent;
        }
        
        /* সাইডবারে অবস্থান নির্দেশক */
        .sidebar-position-indicator {
            position: absolute;
            right: 2px;
            width: 4px;
            height: 40px;
            background-color: var(--accent-color);
            border-radius: 2px;
            opacity: 0;
            transition: opacity 0.3s, top 0.1s;
            pointer-events: none;
            z-index: 10;
        }
        
        .sidebar-position-indicator.show {
            opacity: 0.7;
        }
        
        /* স্ট্যাটিস্টিক কার্ড */
        .stat-card {
            border-radius: 10px;
            overflow: hidden;
            transition: transform 0.3s;
            border: none;
            box-shadow: 0 4px 6px rgba(0,0,0,0.1);
        }
        
        .stat-card:hover {
            transform: translateY(-5px);
        }
        
        .dashboard-icon {
            font-size: 2.5rem;
            opacity: 0.8;
        }
        
        /* ফুটার */
        .footer {
            background-color: var(--dark-color);
            color: white;
            padding: 20px 0;
            margin-top: auto;
        }
        
        /* টেবিল */
        .table th {
            background-color: var(--primary-color);
            color: white;
            font-weight: 600;
        }
        
        /* ব্যাজ */
        .badge-custom {
            font-size: 0.8em;
            padding: 5px 10px;
        }
        
        /* নেভবার */
        .navbar {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            z-index: 1030;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
            height: 56px;
        }
        
        /* লোডিং স্পিনার */
        .loading-spinner {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(255,255,255,0.8);
            z-index: 9999;
            align-items: center;
            justify-content: center;
        }
        
        .loading-spinner.active {
            display: flex;
        }
        
        /* কাস্টম স্ক্রলবার (পৃষ্ঠার জন্য) */
        ::-webkit-scrollbar {
            width: 10px;
        }
        
        ::-webkit-scrollbar-track {
            background: #f1f1f1;
        }
        
        ::-webkit-scrollbar-thumb {
            background: var(--primary-color);
            border-radius: 5px;
        }
        
        ::-webkit-scrollbar-thumb:hover {
            background: #154c63;
        }
        
        /* প্রিন্ট স্টাইল */
        @media print {
            .sidebar, .navbar, .footer, .d-print-none {
                display: none !important;
            }
            
            .main-content {
                margin-left: 0 !important;
                padding-top: 0 !important;
            }
            
            body {
                background: white !important;
            }
        }
        
        /* ফর্ম কন্ট্রোল */
        .form-control:focus, .form-select:focus {
            border-color: var(--primary-color);
            box-shadow: 0 0 0 0.25rem rgba(26, 95, 122, 0.25);
        }
        
        /* মডাল */
        .modal-header {
            background-color: var(--primary-color);
            color: white;
        }
        
        /* এলার্ট */
        .alert {
            border-radius: 8px;
            border: none;
            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
        }
        
        /* মোবাইল রেস্পন্সিভ */
        @media (max-width: 991.98px) {
            .sidebar {
                left: -250px;
                top: 56px;
                width: 250px;
            }
            
            .sidebar.show {
                left: 0;
            }
            
            .main-content {
                margin-left: 0;
            }
            
            /* মোবাইলের জন্য ওভারলে */
            .overlay {
                display: none;
                position: fixed;
                top: 56px;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0,0,0,0.5);
                z-index: 999;
            }
            
            .overlay.show {
                display: block;
            }
            
            .logo-font {
                font-size: 1.4rem;
            }
        }
        
        @media (max-width: 768px) {
            .logo-font {
                font-size: 1.2rem;
            }
        }
        
        /* সাইডবার টগল বাটন */
        .sidebar-toggle {
            background: transparent;
            border: 1px solid rgba(255,255,255,0.2);
            color: white;
            padding: 5px 10px;
            border-radius: 4px;
            cursor: pointer;
            transition: all 0.3s;
        }
        
        .sidebar-toggle:hover {
            background: rgba(255,255,255,0.1);
        }
        
        /* স্ক্রল টু টপ বাটন */
        .scroll-to-top {
            position: fixed;
            bottom: 20px;
            right: 20px;
            background-color: var(--primary-color);
            color: white;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            display: none;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            z-index: 1000;
            box-shadow: 0 2px 5px rgba(0,0,0,0.2);
            transition: all 0.3s;
        }
        
        .scroll-to-top:hover {
            background-color: #154c63;
            transform: translateY(-3px);
        }
    </style>
    
    @yield('styles')
</head>
<body class="@if(request()->cookie('sidebar_collapsed') === 'true') sidebar-collapsed @endif">
    <!-- লোডিং স্পিনার -->
    <div class="loading-spinner" id="loadingSpinner">
        <div class="spinner-border text-primary" role="status" style="width: 3rem; height: 3rem;">
            <span class="visually-hidden">লোড হচ্ছে...</span>
        </div>
    </div>
    
    <!-- স্ক্রল টু টপ বাটন -->
    <div class="scroll-to-top" id="scrollToTop">
        <i class="fas fa-chevron-up"></i>
    </div>
    
    <!-- নেভিগেশন বার -->
    <nav class="navbar navbar-expand-lg navbar-dark" style="background-color: var(--primary-color);">
        <div class="container-fluid">
            @auth
            <button class="btn btn-outline-light me-2 d-lg-none" onclick="toggleSidebar()">
                <i class="fas fa-bars"></i>
            </button>
            @endauth
            
            <a class="navbar-brand logo-font" href="{{ auth()->check() ? route('dashboard') : url('/') }}">
                আমবাগান যুব কল্যাণ সমিতি
            </a>
            
            @auth
            <button class="btn btn-outline-light d-none d-lg-block me-2" onclick="toggleSidebarCollapse()">
                <i class="fas fa-bars"></i>
            </button>
            @endauth
            
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
                <span class="navbar-toggler-icon"></span>
            </button>
            
            <div class="collapse navbar-collapse" id="navbarNav">
                <ul class="navbar-nav ms-auto">
                    @auth
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-bs-toggle="dropdown">
                            <i class="fas fa-user-circle me-1"></i>
                            {{ Auth::user()->name }}
                            @php
                                $hasFormFeePending = false;
                                if(Auth::user()->member) {
                                    $hasFormFeePending = !Auth::user()->member->form_fee_paid;
                                }
                            @endphp
                            @if($hasFormFeePending)
                            <span class="badge bg-danger">ফি বকেয়া</span>
                            @endif
                        </a>
                        <ul class="dropdown-menu dropdown-menu-end">
                            <li>
                                <a class="dropdown-item" href="{{ route('profile') }}">
                                    <i class="fas fa-user me-2"></i>প্রোফাইল
                                </a>
                            </li>
                            @if(Auth::user()->member)
                            <li>
                                <a class="dropdown-item" href="{{ route('members.show', Auth::user()->member->id) }}">
                                    <i class="fas fa-id-card me-2"></i>সদস্য কার্ড
                                </a>
                            </li>
                            @endif
                            <li><hr class="dropdown-divider"></li>
                            <li>
                                <a class="dropdown-item" href="{{ route('logout') }}"
                                   onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
                                    <i class="fas fa-sign-out-alt me-2"></i>লগআউট
                                </a>
                            </li>
                        </ul>
                    </li>
                    @else
                    <li class="nav-item">
                        <a class="nav-link" href="{{ route('login') }}">
                            <i class="fas fa-sign-in-alt me-1"></i>লগইন
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ route('members.register.form') }}">
                            <i class="fas fa-user-plus me-1"></i>সদস্য হন
                        </a>
                    </li>
                    @endauth
                </ul>
            </div>
        </div>
    </nav>

    <!-- মোবাইল সাইডবার ওভারলে -->
    <div class="overlay" onclick="toggleSidebar()"></div>

    @auth
    <!-- সাইডবার -->
    <div class="sidebar" id="sidebar">
        <!-- সাইডবার হেডার (স্ক্রল হবে না) -->
        <div class="sidebar-header">
            <div class="mb-2">
                @php
                    $logoPath = public_path('images/logo/logo.png');
                    $logoExists = file_exists($logoPath);
                @endphp
                @if($logoExists)
                    <img src="{{ asset('images/logo/logo.png') }}" alt="Logo" class="img-fluid rounded-circle" 
                         style="width: 60px; height: 60px; object-fit: cover; border: 2px solid var(--accent-color);">
                @else
                    <div class="rounded-circle bg-primary d-flex align-items-center justify-content-center mx-auto" 
                         style="width: 60px; height: 60px;">
                        <i class="fas fa-users fa-2x text-white"></i>
                    </div>
                @endif
            </div>
            <h6 class="text-white mb-0">{{ Auth::user()->name }}</h6>
            <small class="text-muted">
                @if(Auth::user()->user_type == 'member')
                    সদস্য
                @elseif(Auth::user()->user_type == 'committee')
                    কমিটি সদস্য
                @else
                    অ্যাডমিন
                @endif
            </small>
        </div>
        
        <!-- সাইডবার কন্টেন্ট (স্ক্রল হবে) -->
        <div class="sidebar-content" id="sidebarContent">
            <!-- সাইডবার অবস্থান নির্দেশক (স্ক্রল ইন্ডিকেটর) -->
            <div class="sidebar-position-indicator" id="sidebarPositionIndicator"></div>
            
            <div class="p-2">
                <ul class="nav flex-column">
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('dashboard') ? 'active' : '' }}" href="{{ route('dashboard') }}">
                            <i class="fas fa-tachometer-alt me-2"></i>ড্যাশবোর্ড
                        </a>
                    </li>
                    
                    @if(Auth::user()->user_type == 'member')
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('profile*') ? 'active' : '' }}" href="{{ route('profile') }}">
                            <i class="fas fa-user me-2"></i>আমার প্রোফাইল
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('savings.history') ? 'active' : '' }}" href="{{ route('savings.history') }}">
                            <i class="fas fa-piggy-bank me-2"></i>আমার সঞ্চয়
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('loans.my-loans') ? 'active' : '' }}" href="{{ route('loans.my-loans') }}">
                            <i class="fas fa-hand-holding-usd me-2"></i>আমার ঋণ
                        </a>
                    </li>
                    @endif
                    
                    @if(in_array(Auth::user()->user_type, ['committee', 'admin']))
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('members.*') ? 'active' : '' }}" href="{{ route('members.index') }}">
                            <i class="fas fa-users me-2"></i>সদস্য ব্যবস্থাপনা
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('loans.*') ? 'active' : '' }}" href="{{ route('loans.index') }}">
                            <i class="fas fa-money-check-alt me-2"></i>ঋণ ব্যবস্থাপনা
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('savings.*') && !request()->routeIs('savings.history') ? 'active' : '' }}" href="{{ route('savings.index') }}">
                            <i class="fas fa-cash-register me-2"></i>সঞ্চয় ব্যবস্থাপনা
                        </a>
                    </li>
                    @endif
                    
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('meetings.*') ? 'active' : '' }}" href="{{ route('meetings.index') }}">
                            <i class="fas fa-calendar-alt me-2"></i>মিটিং
                        </a>
                    </li>
                    
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('notices.*') ? 'active' : '' }}" href="{{ route('notices.index') }}">
                            <i class="fas fa-bullhorn me-2"></i>নোটিশ
                        </a>
                    </li>
                    
                    @if(in_array(Auth::user()->user_type, ['committee', 'admin']))
                    <li class="nav-item">
                        <a class="nav-link collapsed" data-bs-toggle="collapse" href="#financeMenu">
                            <i class="fas fa-chart-line me-2"></i>আর্থিক ব্যবস্থাপনা
                            <i class="fas fa-chevron-down float-end mt-1"></i>
                        </a>
                        <div class="collapse {{ request()->routeIs('incomes.*') || request()->routeIs('expenses.*') ? 'show' : '' }}" id="financeMenu">
                            <ul class="nav flex-column sub-menu">
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('incomes.*') ? 'active' : '' }}" href="{{ route('incomes.index') }}">
                                        <i class="fas fa-money-bill-wave me-2"></i>আয় নিবন্ধন
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('expenses.*') ? 'active' : '' }}" href="{{ route('expenses.index') }}">
                                        <i class="fas fa-receipt me-2"></i>ব্যয় নিবন্ধন
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('committees.*') ? 'active' : '' }}" href="{{ route('committees.index') }}">
                            <i class="fas fa-user-tie me-2"></i>কমিটি
                        </a>
                    </li>
                    
                    <!-- একাউন্টিং মেনু -->
                    <li class="nav-item">
                        <a class="nav-link collapsed" data-bs-toggle="collapse" href="#accountingMenu">
                            <i class="fas fa-calculator me-2"></i>একাউন্টিং
                            <i class="fas fa-chevron-down float-end mt-1"></i>
                        </a>
                        <div class="collapse {{ request()->routeIs('accounting.*') ? 'show' : '' }}" id="accountingMenu">
                            <ul class="nav flex-column sub-menu">
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('accounting.index') ? 'active' : '' }}" href="{{ route('accounting.index') }}">
                                        <i class="fas fa-tachometer-alt me-2"></i>ড্যাশবোর্ড
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('accounting.coa.*') ? 'active' : '' }}" href="{{ route('accounting.coa.index') }}">
                                        <i class="fas fa-chart-pie me-2"></i>চার্ট অফ একাউন্টস
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('accounting.journal.*') ? 'active' : '' }}" href="{{ route('accounting.journal.index') }}">
                                        <i class="fas fa-book me-2"></i>জার্নাল এন্ট্রি
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('accounting.financial.*') ? 'active' : '' }}" href="{{ route('accounting.financial.balance-sheet') }}">
                                        <i class="fas fa-balance-scale me-2"></i>ব্যালেন্স শীট
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('accounting.reports.*') ? 'active' : '' }}" href="{{ route('accounting.reports.trial-balance') }}">
                                        <i class="fas fa-scale-balanced me-2"></i>ট্রায়াল ব্যালেন্স
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    
                    <!-- রিপোর্টস মেনু -->
                    <li class="nav-item">
                        <a class="nav-link collapsed" data-bs-toggle="collapse" href="#reportsMenu">
                            <i class="fas fa-file-alt me-2"></i>রিপোর্টস
                            <i class="fas fa-chevron-down float-end mt-1"></i>
                        </a>
                        <div class="collapse {{ request()->routeIs('reports.*') || request()->routeIs('member-ledger.*') ? 'show' : '' }}" id="reportsMenu">
                            <ul class="nav flex-column sub-menu">
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('reports.summary') ? 'active' : '' }}" href="{{ route('reports.summary') }}">
                                        <i class="fas fa-chart-bar me-2"></i>সামারি রিপোর্ট
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('member-ledger.*') ? 'active' : '' }}" href="{{ route('member-ledger.index') }}">
                                        <i class="fas fa-book me-2"></i>মেম্বার একাউন্ট লেজার
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('reports.monthly') ? 'active' : '' }}" href="{{ route('reports.monthly') }}">
                                        <i class="fas fa-calendar-alt me-2"></i>মাসিক রিপোর্ট
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('reports.loan') ? 'active' : '' }}" href="{{ route('reports.loan') }}">
                                        <i class="fas fa-hand-holding-usd me-2"></i>ঋণ রিপোর্ট
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('reports.income-expense') ? 'active' : '' }}" href="{{ route('reports.income-expense') }}">
                                        <i class="fas fa-balance-scale me-2"></i>আয়-ব্যয় রিপোর্ট
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a class="nav-link {{ request()->routeIs('reports.balance-sheet') ? 'active' : '' }}" href="{{ route('reports.balance-sheet') }}">
                                        <i class="fas fa-file-invoice-dollar me-2"></i>ব্যালেন্স শীট
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    @endif
                    
                    @if(Auth::user()->user_type == 'admin')
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('users.*') ? 'active' : '' }}" href="{{ route('users.index') }}">
                            <i class="fas fa-user-cog me-2"></i>ব্যবহারকারী
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link {{ request()->routeIs('settings.*') ? 'active' : '' }}" href="{{ route('settings.index') }}">
                            <i class="fas fa-cogs me-2"></i>সেটিংস
                        </a>
                    </li>
                    @endif
                </ul>
            </div>
        </div>
        
        <!-- সাইডবার ফুটার (স্ক্রল হবে না) -->
        <div class="sidebar-footer">
            <small class="text-muted">সিস্টেম ভি: 2.0.1</small>
        </div>
    </div>
    @endauth

    <!-- মূল কন্টেন্ট -->
    <div class="main-content" id="mainContent">
        <!-- ব্রেডক্রাম্ব -->
        @if(isset($breadcrumbs) && count($breadcrumbs) > 1)
        <nav aria-label="breadcrumb" class="px-3 py-2 bg-light border-bottom">
            <ol class="breadcrumb mb-0">
                @foreach($breadcrumbs as $breadcrumb)
                <li class="breadcrumb-item {{ $loop->last ? 'active' : '' }}">
                    @if(!$loop->last && isset($breadcrumb['url']))
                    <a href="{{ $breadcrumb['url'] }}" class="text-decoration-none">{{ $breadcrumb['name'] }}</a>
                    @else
                    {{ $breadcrumb['name'] }}
                    @endif
                </li>
                @endforeach
            </ol>
        </nav>
        @endif

        <!-- সেশন মেসেজ -->
        <div class="container-fluid mt-2">
            @if(session('success'))
            <div class="alert alert-success alert-dismissible fade show mx-2" role="alert">
                <i class="fas fa-check-circle me-2"></i>
                {{ session('success') }}
                <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
            </div>
            @endif
            
            @if(session('error'))
            <div class="alert alert-danger alert-dismissible fade show mx-2" role="alert">
                <i class="fas fa-exclamation-circle me-2"></i>
                {{ session('error') }}
                <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
            </div>
            @endif
            
            @if(session('warning'))
            <div class="alert alert-warning alert-dismissible fade show mx-2" role="alert">
                <i class="fas fa-exclamation-triangle me-2"></i>
                {{ session('warning') }}
                <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
            </div>
            @endif
            
            @if(session('info'))
            <div class="alert alert-info alert-dismissible fade show mx-2" role="alert">
                <i class="fas fa-info-circle me-2"></i>
                {{ session('info') }}
                <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
            </div>
            @endif
        </div>

        <!-- পেজ কন্টেন্ট -->
        <main class="container-fluid px-3 py-3">
            @yield('content')
        </main>

        <!-- ফুটার -->
        <footer class="footer d-print-none mt-5">
            <div class="container">
                <div class="row">
                    <div class="col-md-4 mb-3">
                        <h5 class="mb-3">আমবাগান যুব কল্যাণ সমিতি</h5>
                        <p class="bangla-text mb-2">
                            <i class="fas fa-map-marker-alt me-2"></i>ফাজিলপুর, মহাদেবপুর, নওগাঁ
                        </p>
                        <p class="bangla-text mb-2">
                            <i class="fas fa-envelope me-2"></i>info@ambagan.com
                        </p>
                        <p class="bangla-text">
                            <i class="fas fa-phone me-2"></i>০১৭১৩-৭৩০৪১০
                        </p>
                    </div>
                    <div class="col-md-4 mb-3">
                        <h5 class="mb-3">দ্রুত লিংক</h5>
                        <ul class="list-unstyled">
                            <li class="mb-1">
                                <a href="{{ route('dashboard') }}" class="text-light text-decoration-none">
                                    <i class="fas fa-home me-1"></i>হোম
                                </a>
                            </li>
                            <li class="mb-1">
                                <a href="{{ route('notices.index') }}" class="text-light text-decoration-none">
                                    <i class="fas fa-bullhorn me-1"></i>নোটিশ
                                </a>
                            </li>
                            <li class="mb-1">
                                <a href="{{ route('meetings.index') }}" class="text-light text-decoration-none">
                                    <i class="fas fa-calendar-alt me-1"></i>মিটিং
                                </a>
                            </li>
                            @guest
                            <li class="mb-1">
                                <a href="{{ route('login') }}" class="text-light text-decoration-none">
                                    <i class="fas fa-sign-in-alt me-1"></i>লগইন
                                </a>
                            </li>
                            @endguest
                        </ul>
                    </div>
                    <div class="col-md-4 mb-3">
                        <h5 class="mb-3">সমিতি তথ্য</h5>
                        <p class="bangla-text mb-2">
                            <i class="fas fa-calendar me-2"></i>প্রতিষ্ঠা: ২০২৪
                        </p>
                        <p class="bangla-text mb-2">
                            <i class="fas fa-users me-2"></i>
                            মোট সদস্য: 
                            @php
                                $totalMembers = \App\Models\Member::where('status', 'active')->count();
                            @endphp
                            {{ $totalMembers }}
                        </p>
                        <p class="bangla-text">
                            <i class="fas fa-piggy-bank me-2"></i>
                            মোট সঞ্চয়: 
                            @php
                                $totalSavings = \App\Models\MonthlySaving::where('status', 'paid')->sum('amount');
                            @endphp
                            {{ number_format($totalSavings, 2) }} টাকা
                        </p>
                    </div>
                </div>
                <hr class="bg-light">
                <div class="text-center">
                    <p class="mb-0">© {{ date('Y') }} আমবাগান যুব কল্যাণ সমিতি। সকল স্বত্ব সংরক্ষিত।</p>
                    <small>ডিজাইন ও ডেভেলপমেন্ট: নাওয়ার ইন্টারন্যাশনাল</small>
                </div>
            </div>
        </footer>
    </div>

    <!-- লগআউট ফর্ম -->
    @auth
    <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
        @csrf
    </form>
    @endauth

    <!-- JavaScript লাইব্রেরি -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    
    <script>
        // গ্লোবাল জাভাস্ক্রিপ্ট ফাংশন
        window.appConfig = {
            baseUrl: '{{ url("/") }}',
            csrfToken: '{{ csrf_token() }}',
            userId: '{{ Auth::id() ?? "" }}',
            userType: '{{ Auth::user()->user_type ?? "" }}'
        };
        
        // সাইডবার টগল (মোবাইল)
        function toggleSidebar() {
            const sidebar = document.getElementById('sidebar');
            const overlay = document.querySelector('.overlay');
            
            if (!sidebar || !overlay) return;
            
            sidebar.classList.toggle('show');
            overlay.classList.toggle('show');
            
            // Prevent body scroll when sidebar is open
            if (sidebar.classList.contains('show')) {
                document.body.style.overflow = 'hidden';
            } else {
                document.body.style.overflow = '';
            }
        }
        
        // সাইডবার কলাপস (ডেস্কটপ)
        function toggleSidebarCollapse() {
            document.body.classList.toggle('sidebar-collapsed');
            
            // Save preference in cookie
            const isCollapsed = document.body.classList.contains('sidebar-collapsed');
            document.cookie = `sidebar_collapsed=${isCollapsed}; path=/; max-age=${60*60*24*30}`; // 30 days
        }
        
        // সাইডবারে অবস্থান নির্দেশক আপডেট
        function updateSidebarPositionIndicator() {
            const sidebarContent = document.getElementById('sidebarContent');
            const indicator = document.getElementById('sidebarPositionIndicator');
            
            if (!sidebarContent || !indicator) return;
            
            sidebarContent.addEventListener('scroll', function() {
                const scrollHeight = sidebarContent.scrollHeight - sidebarContent.clientHeight;
                if (scrollHeight <= 0) {
                    indicator.classList.remove('show');
                    return;
                }
                
                const scrollPercent = (sidebarContent.scrollTop / scrollHeight) * 100;
                
                // Calculate position for indicator (40px is indicator height)
                const maxTop = sidebarContent.clientHeight - 40;
                const indicatorTop = (maxTop * scrollPercent) / 100;
                
                indicator.style.top = indicatorTop + 'px';
                
                // Show indicator when scrolling
                indicator.classList.add('show');
                
                // Hide indicator after a delay
                clearTimeout(window.sidebarIndicatorTimeout);
                window.sidebarIndicatorTimeout = setTimeout(() => {
                    indicator.classList.remove('show');
                }, 1500);
            });
        }
        
        // সাইডবারে সক্রিয় লিঙ্কের অবস্থান নিশ্চিত করা
        function ensureActiveLinkVisible() {
            const sidebarContent = document.getElementById('sidebarContent');
            const activeLink = sidebarContent?.querySelector('.nav-link.active');
            
            if (activeLink && sidebarContent) {
                // Scroll to active link with offset
                setTimeout(() => {
                    const linkRect = activeLink.getBoundingClientRect();
                    const sidebarRect = sidebarContent.getBoundingClientRect();
                    
                    // Check if link is not fully visible
                    if (linkRect.top < sidebarRect.top || linkRect.bottom > sidebarRect.bottom) {
                        activeLink.scrollIntoView({ behavior: 'smooth', block: 'center' });
                    }
                }, 200);
            }
        }
        
        // সাইডবার মেনু ক্লোজ (মোবাইলে)
        function setupSidebarLinks() {
            const sidebarLinks = document.querySelectorAll('.sidebar .nav-link');
            sidebarLinks.forEach(link => {
                // Check if link is not a collapse toggle
                if (!link.hasAttribute('data-bs-toggle')) {
                    link.addEventListener('click', () => {
                        if (window.innerWidth < 992) {
                            toggleSidebar();
                        }
                    });
                }
            });
            
            // Handle collapse menus
            const collapseMenus = document.querySelectorAll('.sidebar .nav-link[data-bs-toggle="collapse"]');
            collapseMenus.forEach(menu => {
                menu.addEventListener('click', function(e) {
                    if (window.innerWidth < 992) {
                        const target = document.querySelector(this.getAttribute('href'));
                        if (target) {
                            e.preventDefault();
                            const bsCollapse = new bootstrap.Collapse(target, {
                                toggle: true
                            });
                        }
                    }
                });
            });
        }
        
        // স্ক্রল টু টপ ফাংশন
        function setupScrollToTop() {
            const scrollToTopBtn = document.getElementById('scrollToTop');
            const mainContent = document.getElementById('mainContent');
            
            if (!scrollToTopBtn || !mainContent) return;
            
            // Show/hide button based on scroll position
            mainContent.addEventListener('scroll', function() {
                if (mainContent.scrollTop > 300) {
                    scrollToTopBtn.style.display = 'flex';
                } else {
                    scrollToTopBtn.style.display = 'none';
                }
            });
            
            // Scroll to top when clicked
            scrollToTopBtn.addEventListener('click', function() {
                mainContent.scrollTo({
                    top: 0,
                    behavior: 'smooth'
                });
            });
        }
        
        // গ্লোবাল লোডিং স্পিনার
        window.showLoading = function() {
            document.getElementById('loadingSpinner').classList.add('active');
        };
        
        window.hideLoading = function() {
            document.getElementById('loadingSpinner').classList.remove('active');
        };
        
        // AJAX রিকোয়েস্টে লোডিং স্পিনার
        $(document).ajaxStart(function() {
            showLoading();
        }).ajaxStop(function() {
            hideLoading();
        });
        
        // টোস্ট নোটিফিকেশন
        window.showToast = function(type, message) {
            toastr.options = {
                "closeButton": true,
                "progressBar": true,
                "positionClass": "toast-top-right",
                "timeOut": "5000",
                "extendedTimeOut": "1000"
            };
            
            switch(type) {
                case 'success':
                    toastr.success(message);
                    break;
                case 'error':
                    toastr.error(message);
                    break;
                case 'warning':
                    toastr.warning(message);
                    break;
                case 'info':
                    toastr.info(message);
                    break;
            }
        };
        
        // সিলেক্ট ২ ইনিশিয়ালাইজ
        $(document).ready(function() {
            $('.select2').select2({
                placeholder: "একটি নির্বাচন করুন",
                allowClear: true,
                language: {
                    noResults: function() {
                        return "কোন ফলাফল পাওয়া যায়নি";
                    }
                }
            });
            
            // ডেটা টেবিল
            $('.data-table').DataTable({
                language: {
                    url: '//cdn.datatables.net/plug-ins/1.13.6/i18n/bn.json'
                },
                pageLength: 25,
                responsive: true,
                order: [],
                dom: '<"row"<"col-md-6"l><"col-md-6"f>>rt<"row"<"col-md-6"i><"col-md-6"p>>'
            });
            
            // টুলটিপ ইনিশিয়ালাইজ
            const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
            tooltipTriggerList.map(function (tooltipTriggerEl) {
                return new bootstrap.Tooltip(tooltipTriggerEl);
            });
            
            // পপওভার ইনিশিয়ালাইজ
            const popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]'));
            popoverTriggerList.map(function (popoverTriggerEl) {
                return new bootstrap.Popover(popoverTriggerEl);
            });
            
            // সাইডবার ফাংশন ইনিশিয়ালাইজ
            setupSidebarLinks();
            setupScrollToTop();
            updateSidebarPositionIndicator();
            ensureActiveLinkVisible();
        });
        
        // অটো-লগআউট টাইমার
        @auth
        var idleTime = 0;
        var idleInterval = setInterval(timerIncrement, 60000); // প্রতি মিনিটে
        var logoutTime = 30; // ৩০ মিনিট
        var warningTime = 25; // ২৫ মিনিটে ওয়ার্নিং
        
        $(document).on('mousemove keypress scroll click', function() {
            idleTime = 0;
        });
        
        function timerIncrement() {
            idleTime++;
            
            if (idleTime === warningTime) {
                showToast('warning', 'আপনি কিছুক্ষন নিষ্ক্রিয় আছেন। আপনি স্বয়ংক্রিয়ভাবে লগআউট হয়ে যাবেন।');
            }
            
            if(idleTime > logoutTime) {
                // অটো লগআউট
                clearInterval(idleInterval);
                document.getElementById('logout-form').submit();
            }
        }
        @endauth
        
        // ফর্ম সাবমিশন কনফার্মেশন
        document.addEventListener('DOMContentLoaded', function() {
            const deleteForms = document.querySelectorAll('form.delete-form');
            deleteForms.forEach(form => {
                form.addEventListener('submit', function(e) {
                    if (!confirm('আপনি কি নিশ্চিত যে আপনি এই আইটেমটি মুছে ফেলতে চান?')) {
                        e.preventDefault();
                    }
                });
            });
        });
        
        // প্রিন্ট ফাংশন
        window.printContent = function(elementId) {
            showLoading();
            
            const printContent = document.getElementById(elementId);
            if (!printContent) {
                hideLoading();
                showToast('error', 'প্রিন্ট কন্টেন্ট পাওয়া যায়নি');
                return;
            }
            
            const originalContent = document.body.innerHTML;
            const printWindow = window.open('', '_blank');
            
            printWindow.document.write(`
                <!DOCTYPE html>
                <html lang="bn">
                <head>
                    <meta charset="UTF-8">
                    <meta name="viewport" content="width=device-width, initial-scale=1.0">
                    <title>প্রিন্ট</title>
                    <style>
                        body {
                            font-family: 'SolaimanLipi', 'Hind Siliguri', sans-serif;
                            direction: ltr;
                            margin: 20px;
                        }
                        .print-header {
                            text-align: center;
                            border-bottom: 2px solid #000;
                            padding-bottom: 10px;
                            margin-bottom: 20px;
                        }
                        .print-header h2 {
                            color: #1a5f7a;
                            margin: 0;
                        }
                        .print-footer {
                            text-align: center;
                            margin-top: 30px;
                            padding-top: 10px;
                            border-top: 1px solid #ccc;
                            font-size: 12px;
                            color: #666;
                        }
                        @media print {
                            body { margin: 0; }
                            .no-print { display: none !important; }
                        }
                    </style>
                </head>
                <body>
                    <div class="print-header">
                        <h2>আমবাগান যুব কল্যাণ সমিতি</h2>
                        <p>ফাজিলপুর, মহাদেবপুর, নওগাঁ</p>
                    </div>
                    ${printContent.innerHTML}
                    <div class="print-footer">
                        <p>প্রিন্ট তারিখ: ${new Date().toLocaleDateString('bn-BD')} | সময়: ${new Date().toLocaleTimeString('bn-BD')}</p>
                        <p>© ${new Date().getFullYear()} আমবাগান যুব কল্যাণ সমিতি</p>
                    </div>
                </body>
                </html>
            `);
            
            printWindow.document.close();
            printWindow.focus();
            
            setTimeout(() => {
                printWindow.print();
                printWindow.close();
                hideLoading();
            }, 500);
        };
        
        // তারিখ পিকার ইনিশিয়ালাইজ
        $(document).ready(function() {
            $('input[type="date"]').each(function() {
                if (!this.value) {
                    const today = new Date().toISOString().split('T')[0];
                    this.value = today;
                }
            });
        });
        
        // ফরম ভ্যালিডেশন
        window.validateForm = function(formId) {
            const form = document.getElementById(formId);
            if (!form) return true;
            
            let isValid = true;
            const requiredFields = form.querySelectorAll('[required]');
            
            requiredFields.forEach(field => {
                if (!field.value.trim()) {
                    field.classList.add('is-invalid');
                    isValid = false;
                    
                    // Add error message
                    if (!field.nextElementSibling || !field.nextElementSibling.classList.contains('invalid-feedback')) {
                        const errorDiv = document.createElement('div');
                        errorDiv.className = 'invalid-feedback';
                        errorDiv.textContent = 'এই ফিল্ডটি পূরণ করা আবশ্যক';
                        field.parentNode.appendChild(errorDiv);
                    }
                } else {
                    field.classList.remove('is-invalid');
                    const errorDiv = field.nextElementSibling;
                    if (errorDiv && errorDiv.classList.contains('invalid-feedback')) {
                        errorDiv.remove();
                    }
                }
            });
            
            return isValid;
        };
        
        // Number format function
        window.formatNumber = function(number, decimals = 2) {
            return parseFloat(number).toLocaleString('bn-BD', {
                minimumFractionDigits: decimals,
                maximumFractionDigits: decimals
            });
        };
        
        // Date format function
        window.formatDate = function(dateString, format = 'dd/mm/yyyy') {
            if (!dateString) return '';
            
            const date = new Date(dateString);
            if (isNaN(date.getTime())) return dateString;
            
            const day = date.getDate().toString().padStart(2, '0');
            const month = (date.getMonth() + 1).toString().padStart(2, '0');
            const year = date.getFullYear();
            
            if (format === 'dd/mm/yyyy') {
                return `${day}/${month}/${year}`;
            } else if (format === 'yyyy-mm-dd') {
                return `${year}-${month}-${day}`;
            }
            
            return dateString;
        };
    </script>
    
    @yield('scripts')
</body>
</html>