<div class="d-flex justify-content-between align-items-center tw-mb-8 flex-wrap tw-gap-4">
    <div>
        <h3 class="tw-font-black tw-text-2xl tw-text-gray-900 tw-mb-1 tw-tracking-tight">Portföy Yönetimi</h3>
        <p class="tw-text-gray-500 tw-text-sm tw-font-medium tw-mb-0">Sistemdeki tüm aktif portföy listesi.</p>
    </div>
    <a href="<?php echo BASE_URL; ?>/admin/property_add" class="btn tw-bg-blue-600 hover:tw-bg-blue-700 tw-text-white tw-rounded-xl tw-font-bold tw-shadow-lg tw-shadow-blue-500/30 tw-transition-all hover:tw--translate-y-0.5 tw-px-6 tw-py-2.5 d-flex align-items-center">
        <i class="fa-solid fa-plus tw-mr-2"></i> Yeni İlan Ekle
    </a>
</div>

<div class="tw-bg-white tw-border tw-border-gray-100 tw-rounded-[2rem] tw-shadow-sm tw-overflow-hidden">
    
    <div class="tw-p-6 tw-px-8 tw-border-b tw-border-gray-50 d-flex flex-wrap justify-content-between align-items-center tw-gap-4">
        <div class="d-flex align-items-center">
            <div class="tw-w-10 tw-h-10 tw-bg-blue-50 tw-text-blue-600 tw-rounded-xl d-flex align-items-center justify-content-center tw-mr-4">
                <i class="fa-solid fa-house"></i>
            </div>
            <div>
                <h6 class="tw-font-black tw-text-lg tw-text-gray-800 mb-0">Tüm İlanlar</h6>
                <p class="tw-text-[10px] tw-font-bold tw-text-gray-400 tw-uppercase tw-tracking-widest tw-mb-0">Toplam <?php echo count($properties); ?> Kayıt</p>
            </div>
        </div>
        
        <div class="tw-relative tw-w-full md:tw-w-72">
            <span class="tw-absolute tw-inset-y-0 tw-left-0 tw-flex tw-items-center tw-pl-4 tw-text-gray-400">
                <i class="fa-solid fa-magnifying-glass tw-text-sm"></i>
            </span>
            <input type="text" class="form-control tw-bg-gray-50 tw-border-0 tw-pl-11 tw-py-2.5 tw-rounded-xl tw-text-sm tw-font-medium focus:tw-bg-white focus:tw-ring-4 focus:tw-ring-blue-50 tw-transition-all shadow-none" placeholder="Başlık veya ID ile ara...">
        </div>
    </div>

    <div class="table-responsive">
        <table class="table table-hover align-middle mb-0 tw-border-transparent">
            <thead>
                <tr>
                    <th class="tw-bg-transparent tw-text-gray-400 tw-text-[10px] tw-font-black tw-uppercase tw-tracking-[0.2em] tw-py-5 tw-pl-8 tw-border-b-2 tw-border-gray-50">Gayrimenkul Bilgisi</th>
                    <th class="tw-bg-transparent tw-text-gray-400 tw-text-[10px] tw-font-black tw-uppercase tw-tracking-[0.2em] tw-py-5 tw-border-b-2 tw-border-gray-50">Kategori / Tip</th>
                    <th class="tw-bg-transparent tw-text-gray-400 tw-text-[10px] tw-font-black tw-uppercase tw-tracking-[0.2em] tw-py-5 tw-border-b-2 tw-border-gray-50">Fiyat</th>
                    <th class="tw-bg-transparent tw-text-gray-400 tw-text-[10px] tw-font-black tw-uppercase tw-tracking-[0.2em] tw-py-5 tw-border-b-2 tw-border-gray-50">Konum</th>
                    <th class="tw-bg-transparent tw-text-gray-400 tw-text-[10px] tw-font-black tw-uppercase tw-tracking-[0.2em] tw-py-5 tw-pr-8 tw-border-b-2 tw-border-gray-50 text-end">İşlemler</th>
                </tr>
            </thead>
            <tbody class="tw-divide-y tw-divide-gray-50">
                <?php if (!empty($properties)): ?>
                    <?php foreach ($properties as $prop): ?>
                        <tr class="hover:tw-bg-gray-50/50 tw-transition-colors">
                            <td class="tw-pl-8 tw-py-4">
                                <div class="d-flex align-items-center">
                                    <div class="tw-w-16 tw-h-12 tw-rounded-xl tw-overflow-hidden tw-flex-shrink-0 tw-mr-4 tw-shadow-sm tw-border tw-border-gray-100">
                                        <img src="<?php echo !empty($prop->image) ? BASE_URL . '/' . $prop->image : 'https://placehold.co/100?text=Yok'; ?>" 
                                             class="tw-w-full tw-h-full tw-object-cover" alt="İlan">
                                    </div>
                                    <div class="tw-overflow-hidden">
                                        <div class="tw-font-black tw-text-gray-900 tw-text-sm tw-mb-0.5 tw-truncate" style="max-width: 250px;" title="<?php echo htmlspecialchars($prop->title); ?>">
                                            <?php echo htmlspecialchars($prop->title); ?>
                                        </div>
                                        <div class="tw-text-[10px] tw-font-bold tw-text-gray-400 tw-uppercase tw-tracking-widest">
                                            ID: #<?php echo $prop->id; ?> • <?php echo date('d.m.Y', strtotime($prop->created_at)); ?>
                                        </div>
                                    </div>
                                </div>
                            </td>

                            <td>
                                <div class="d-flex flex-column tw-gap-1">
                                    <?php $isSale = (strtolower($prop->category) == 'sale' || strtolower($prop->category) == 'satilik'); ?>
                                    <span class="<?php echo $isSale ? 'tw-text-red-500' : 'tw-text-blue-500'; ?> tw-text-[10px] tw-font-black tw-uppercase tw-tracking-widest">
                                        <?php echo $isSale ? 'SATILIK' : 'KİRALIK'; ?>
                                    </span>
                                    <span class="tw-text-gray-500 tw-text-xs tw-font-bold">
                                        <?php 
                                            $types = ['apartment' => 'Daire', 'villa' => 'Villa', 'land' => 'Arsa', 'office' => 'Ofis'];
                                            echo $types[strtolower($prop->type)] ?? $prop->type; 
                                        ?>
                                    </span>
                                </div>
                            </td>

                            <td>
                                <span class="tw-font-black tw-text-gray-900 tw-text-sm">
                                    <?php echo number_format($prop->price, 0, ',', '.'); ?> ₺
                                </span>
                            </td>

                            <td>
                                <div class="tw-text-gray-500 tw-text-xs tw-font-bold d-flex align-items-center">
                                    <i class="fa-solid fa-location-dot tw-text-blue-500 tw-mr-1.5 tw-opacity-50"></i>
                                    <span class="tw-truncate" style="max-width: 180px;"><?php echo htmlspecialchars($prop->location); ?></span>
                                </div>
                            </td>

                            <td class="text-end tw-pr-8">
                                <div class="d-flex justify-content-end tw-gap-2">
                                    <a href="<?php echo BASE_URL; ?>/properties/detail?slug=<?php echo $prop->slug; ?>" target="_blank" class="tw-w-9 tw-h-9 tw-bg-blue-50 tw-text-blue-600 hover:tw-bg-blue-500 hover:tw-text-white tw-rounded-xl d-flex align-items-center justify-content-center tw-transition-all shadow-sm" title="Görüntüle">
                                        <i class="fa-solid fa-eye tw-text-xs"></i>
                                    </a>
                                    
                                    <a href="<?php echo BASE_URL; ?>/admin/property_edit/<?php echo $prop->id; ?>" class="tw-w-9 tw-h-9 tw-bg-indigo-50 tw-text-indigo-600 hover:tw-bg-indigo-500 hover:tw-text-white tw-rounded-xl d-flex align-items-center justify-content-center tw-transition-all shadow-sm" title="Düzenle">
                                        <i class="fa-solid fa-pen-to-square tw-text-xs"></i>
                                    </a>
                                    
                                    <a href="<?php echo BASE_URL; ?>/admin/property_delete/<?php echo $prop->id; ?>" 
                                       class="tw-w-9 tw-h-9 tw-bg-rose-50 tw-text-rose-600 hover:tw-bg-rose-500 hover:tw-text-white tw-rounded-xl d-flex align-items-center justify-content-center tw-transition-all shadow-sm" 
                                       onclick="return confirm('Bu ilanı silmek istediğinize emin misiniz?');"
                                       title="Sil">
                                        <i class="fa-solid fa-trash-can tw-text-xs"></i>
                                    </a>
                                </div>
                            </td>
                        </tr>
                    <?php endforeach; ?>
                <?php else: ?>
                    <tr>
                        <td colspan="5" class="text-center tw-py-20">
                            <div class="tw-w-20 tw-h-20 tw-bg-gray-50 tw-rounded-full d-flex align-items-center justify-content-center tw-mx-auto tw-mb-4">
                                <i class="fa-solid fa-house-chimney-crack tw-text-3xl tw-text-gray-300"></i>
                            </div>
                            <h6 class="tw-font-black tw-text-gray-800 tw-text-lg">Henüz ilan eklenmemiş.</h6>
                            <p class="tw-text-gray-400 tw-font-medium tw-text-sm">Yeni bir ilan ekleyerek portföyünüzü genişletmeye başlayın.</p>
                            <a href="<?php echo BASE_URL; ?>/admin/property_add" class="btn tw-bg-blue-50 tw-text-blue-600 hover:tw-bg-blue-600 hover:tw-text-white tw-rounded-xl tw-font-bold tw-px-6 tw-py-2.5 tw-mt-4 tw-transition-all">
                                İlk İlanı Ekle
                            </a>
                        </td>
                    </tr>
                <?php endif; ?>
            </tbody>
        </table>
    </div>
    
    <div class="tw-p-6 tw-px-8 tw-bg-gray-50/50 tw-border-t tw-border-gray-50 d-flex justify-content-between align-items-center">
        <div class="tw-text-[11px] tw-font-black tw-text-gray-400 tw-uppercase tw-tracking-widest">
            Toplam <span class="tw-text-gray-900"><?php echo count($properties); ?></span> Kayıt Listeleniyor
        </div>
        
        <nav>
            <ul class="pagination pagination-sm mb-0 tw-gap-1">
                <li class="page-item disabled"><a class="page-link tw-rounded-lg tw-border-0 tw-bg-transparent tw-text-gray-400" href="#"><i class="fa-solid fa-chevron-left"></i></a></li>
                <li class="page-item active"><a class="page-link tw-rounded-lg tw-border-0 tw-bg-blue-600 tw-font-black shadow-sm" href="#">1</a></li>
                <li class="page-item"><a class="page-link tw-rounded-lg tw-border-0 tw-bg-white tw-text-gray-600 hover:tw-bg-gray-100 tw-font-bold" href="#">Sonraki</a></li>
            </ul>
        </nav>
    </div>
</div>

<script>
    // Dinamik Arama (Filtreleme)
    document.querySelector('input[placeholder*="ara..."]').addEventListener('keyup', function(e) {
        let val = e.target.value.toLowerCase();
        let rows = document.querySelectorAll('tbody tr');
        rows.forEach(row => {
            let text = row.innerText.toLowerCase();
            row.style.display = text.includes(val) ? '' : 'none';
        });
    });
</script>