@php
    $isDefined = !empty($perangkat) && !empty($perangkat->nama);
    $nama = $isDefined ? $perangkat->nama : '-';
    $foto = $isDefined ? $perangkat->foto : null;
    $jabatan = $isDefined ? $perangkat->jabatan : $defaultTitle;

    // Define card color themes based on type
    $headerBg = '';
    $headerColor = '#ffffff';
    
    if ($type === 'kades') {
        $headerBg = '#DC3545'; // Red
    } elseif ($type === 'sekdes') {
        $headerBg = '#FFC107'; // Gold
        $headerColor = '#212529'; // Dark text for gold background
    } elseif ($type === 'kasi_kaur') {
        $headerBg = '#1E3A8A'; // Navy Blue
    } elseif ($type === 'dusun') {
        $headerBg = '#15803D'; // Green
    }
@endphp

<div class="org-card-item">
    <!-- Card Header -->
    <div class="org-card-header" style="background-color: {{ $headerBg }}; color: {{ $headerColor }};">
        {{ strtoupper($jabatan) }}
    </div>
    
    <!-- Card Body -->
    <div class="org-card-body">
        <!-- Photo/Avatar Area -->
        @if($foto)
            <img src="{{ asset('storage/' . $foto) }}" alt="{{ $nama }}" class="org-card-img">
        @else
            <div class="org-card-placeholder-img">
                <i class="fas fa-user"></i>
            </div>
        @endif
        
        <!-- Name Badge -->
        <div class="org-card-name-badge">
            <span class="org-card-name-text" title="{{ $nama }}">{{ $nama }}</span>
        </div>
    </div>
</div>