{{-- Nested Units Partial --}}
@foreach($units as $unit)
    <div class="nested-unit border-{{ $level === 1 ? 'primary' : 'secondary' }}" style="margin-left: {{ ($level - 1) * 1.5 }}rem;">
        <div class="d-flex justify-content-between align-items-start">
            <div class="flex-grow-1">
                <div class="d-flex align-items-center mb-1">
                    <i class="mdi mdi-folder-outline me-2 text-{{ $level === 1 ? 'primary' : 'secondary' }}"></i>
                    <h6 class="mb-0 fw-semibold">{{ $unit->title }}</h6>
                </div>
                @if($unit->description)
                    <p class="text-muted small mb-2 ms-4">{{ $unit->description }}</p>
                @endif
                <div class="d-flex gap-2 align-items-center flex-wrap ms-4">
                    <span class="badge bg-primary">
                        {{ $unit->materials_count }} Material(s)
                    </span>
                    @if($unit->nested_children && $unit->nested_children->count() > 0)
                        <span class="badge bg-secondary">
                            {{ $unit->nested_children->count() }} Sub-unit(s)
                        </span>
                    @endif
                </div>
            </div>
        </div>
        
        {{-- Recursively display nested children --}}
        @if($unit->nested_children && $unit->nested_children->count() > 0)
            <div class="mt-3">
                @include('admin.courses.partials.nested-units', ['units' => $unit->nested_children, 'level' => $level + 1])
            </div>
        @endif
    </div>
@endforeach