<?php defined('BASEPATH') OR exit('No direct script access allowed');
$terlambat = ($pinjam->status == 'dipinjam' && $pinjam->tanggal_rencana_kembali < date('Y-m-d'));
$sudah_kembali = ($pinjam->status == 'dikembalikan');
?>

<style>
.ar-page-header { display:flex; justify-content:space-between; align-items:flex-start; flex-wrap:wrap; gap:14px; margin-bottom:24px; }
.ar-header-left h4 { font-size:1.25rem; font-weight:800; color:#0b5a52; margin:0 0 5px; display:flex; align-items:center; gap:11px; }
.ar-header-left h4 .hi { width:40px; height:40px; border-radius:11px; background:linear-gradient(135deg,#7c3aed,#a78bfa); display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.05rem; box-shadow:0 4px 12px rgba(124,58,237,.32); flex-shrink:0; }
.ar-breadcrumb { display:flex; align-items:center; gap:6px; font-size:.77rem; color:#94a3b8; padding-left:51px; }
.ar-breadcrumb a { color:#7c3aed; text-decoration:none; font-weight:600; }
.detail-card { background:#fff; border-radius:14px; box-shadow:0 1px 8px rgba(0,0,0,.07); border:none; }
.info-row { display:flex; padding:10px 0; border-bottom:1px solid #f3f4f6; font-size:.875rem; }
.info-row:last-child { border-bottom:none; }
.info-label { color:#6b7280; font-weight:600; width:180px; flex-shrink:0; }
.info-value { color:#111827; flex:1; }
.timeline-dot { width:12px; height:12px; border-radius:50%; flex-shrink:0; margin-top:4px; }
.btn-kembali { padding:11px 32px; border-radius:50px; background:#198754; border:none; color:#fff; font-weight:700; font-size:.88rem; box-shadow:0 3px 12px rgba(25,135,84,.25); transition:all .2s; text-decoration:none; display:inline-flex; align-items:center; gap:7px; }
.btn-kembali:hover { background:#157347; transform:translateY(-1px); color:#fff; }
</style>

<!-- Header -->
<div class="ar-page-header">
    <div class="ar-header-left">
        <h4>
            <span class="hi"><i class="bi bi-file-text"></i></span>
            Detail Peminjaman
        </h4>
        <div class="ar-breadcrumb">
            <a href="<?php echo base_url('peminjaman-inventaris'); ?>">Peminjaman</a>
            <span>/</span>
            <span><?php echo $pinjam->kode_pinjam; ?></span>
        </div>
    </div>
    <div class="d-flex gap-2 flex-wrap">
        <a href="<?php echo base_url('peminjaman-inventaris'); ?>" class="btn btn-sm btn-outline-secondary rounded-pill px-3">
            <i class="bi bi-arrow-left me-1"></i>Kembali
        </a>
        <?php if($is_admin && !$sudah_kembali): ?>
        <a href="<?php echo base_url('peminjaman-inventaris/kembali/'.$pinjam->id); ?>" class="btn-kembali">
            <i class="bi bi-box-arrow-in-down"></i> Proses Pengembalian
        </a>
        <?php endif; ?>
    </div>
</div>

<?php if($this->session->flashdata('success')): ?>
<div class="alert alert-success alert-dismissible fade show rounded-3 border-0 shadow-sm mb-3">
    <i class="bi bi-check-circle-fill me-2"></i><?php echo $this->session->flashdata('success'); ?>
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<!-- Status Banner -->
<?php if($terlambat): ?>
<div class="alert border-0 rounded-3 mb-4 d-flex align-items-center gap-3" style="background:#fff5f5;border-left:4px solid #dc3545!important;">
    <i class="bi bi-exclamation-triangle-fill text-danger fs-4"></i>
    <div>
        <strong class="text-danger">Peminjaman Terlambat!</strong>
        <div style="font-size:.83rem;color:#991b1b;">Sudah melewati tanggal rencana kembali: <strong><?php echo date('d M Y', strtotime($pinjam->tanggal_rencana_kembali)); ?></strong></div>
    </div>
</div>
<?php elseif($sudah_kembali): ?>
<div class="alert border-0 rounded-3 mb-4 d-flex align-items-center gap-3" style="background:#f0fdf4;border-left:4px solid #198754!important;">
    <i class="bi bi-check-circle-fill text-success fs-4"></i>
    <div>
        <strong class="text-success">Barang Sudah Dikembalikan</strong>
        <div style="font-size:.83rem;color:#166534;">Dikembalikan pada: <strong><?php echo date('d M Y', strtotime($pinjam->tanggal_kembali)); ?></strong></div>
    </div>
</div>
<?php endif; ?>

<div class="row g-4">

    <!-- Detail Peminjaman -->
    <div class="col-lg-7">
        <div class="detail-card p-4 mb-4">
            <div class="d-flex align-items-center justify-content-between mb-3">
                <h6 class="fw-bold mb-0" style="color:#374151;">📋 Informasi Peminjaman</h6>
                <span class="badge rounded-pill px-3 py-2 fw-semibold"
                      style="background:<?php echo $sudah_kembali ? '#19875420' : ($terlambat ? '#dc354520' : '#7c3aed20'); ?>;
                             color:<?php echo $sudah_kembali ? '#198754' : ($terlambat ? '#dc3545' : '#7c3aed'); ?>;
                             border:1px solid <?php echo $sudah_kembali ? '#19875440' : ($terlambat ? '#dc354540' : '#7c3aed40'); ?>;">
                    <?php echo $sudah_kembali ? '✅ Dikembalikan' : ($terlambat ? '⏰ Terlambat' : '📦 Dipinjam'); ?>
                </span>
            </div>

            <div class="info-row"><span class="info-label">Kode Pinjam</span><span class="info-value fw-bold" style="color:#7c3aed;"><?php echo $pinjam->kode_pinjam; ?></span></div>
            <div class="info-row"><span class="info-label">Barang</span><span class="info-value fw-semibold"><?php echo htmlspecialchars($pinjam->nama_barang ?? 'Barang Dihapus'); ?> <small class="text-muted">(#<?php echo $pinjam->kode_barang; ?>)</small></span></div>
            <div class="info-row"><span class="info-label">Jumlah Dipinjam</span><span class="info-value fw-bold"><?php echo $pinjam->jumlah_pinjam . ' ' . $pinjam->satuan; ?></span></div>
            <div class="info-row"><span class="info-label">Kondisi Awal</span><span class="info-value"><?php
                $k = ['baik'=>'✅ Baik','rusak_ringan'=>'⚠️ Rusak Ringan','rusak_berat'=>'❌ Rusak Berat'];
                echo $k[$pinjam->kondisi_awal] ?? $pinjam->kondisi_awal; ?></span></div>
            <div class="info-row"><span class="info-label">Tanggal Pinjam</span><span class="info-value"><?php echo date('d M Y', strtotime($pinjam->tanggal_pinjam)); ?></span></div>
            <div class="info-row">
                <span class="info-label">Rencana Kembali</span>
                <span class="info-value <?php echo $terlambat ? 'text-danger fw-bold' : ''; ?>">
                    <?php echo date('d M Y', strtotime($pinjam->tanggal_rencana_kembali)); ?>
                    <?php if($terlambat): ?>
                    <span class="badge ms-1 text-bg-danger" style="font-size:.7em;">LEWAT</span>
                    <?php endif; ?>
                </span>
            </div>
            <?php if($pinjam->keperluan): ?>
            <div class="info-row"><span class="info-label">Keperluan</span><span class="info-value"><?php echo nl2br(htmlspecialchars($pinjam->keperluan ?? '')); ?></span></div>
            <?php endif; ?>
        </div>

        <!-- Data Pengembalian (jika sudah kembali) -->
        <?php if($sudah_kembali): ?>
        <div class="detail-card p-4" style="border-left:4px solid #198754!important;">
            <h6 class="fw-bold mb-3" style="color:#374151;">📥 Data Pengembalian</h6>
            <div class="info-row"><span class="info-label">Tanggal Kembali</span><span class="info-value fw-bold text-success"><?php echo date('d M Y', strtotime($pinjam->tanggal_kembali)); ?></span></div>
            <div class="info-row"><span class="info-label">Kondisi Kembali</span><span class="info-value"><?php echo $k[$pinjam->kondisi_kembali] ?? $pinjam->kondisi_kembali; ?></span></div>
            <?php if($pinjam->catatan_kembali): ?>
            <div class="info-row"><span class="info-label">Catatan</span><span class="info-value"><?php echo nl2br(htmlspecialchars($pinjam->catatan_kembali ?? '')); ?></span></div>
            <?php endif; ?>
        </div>
        <?php endif; ?>
    </div>

    <!-- Sidebar: Peminjam & Barang -->
    <div class="col-lg-5">

        <!-- Peminjam -->
        <div class="detail-card p-4 mb-4">
            <h6 class="fw-bold mb-3" style="color:#374151;">👤 Data Peminjam</h6>
            <div class="d-flex align-items-center gap-3 mb-3">
                <div class="rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
                     style="width:48px;height:48px;background:#f3f0ff;">
                    <i class="bi bi-person-fill fs-4" style="color:#7c3aed;"></i>
                </div>
                <div>
                    <div class="fw-bold" style="font-size:.95rem;"><?php echo htmlspecialchars($pinjam->nama_peminjam ?? 'Tidak Diketahui'); ?></div>
                    <?php if($pinjam->nama_warga && $pinjam->nama_warga != $pinjam->nama_peminjam): ?>
                    <div class="text-muted" style="font-size:.78rem;">Warga: <?php echo htmlspecialchars($pinjam->nama_warga ?? 'Bukan Warga Terdaftar'); ?></div>
                    <?php endif; ?>
                    <?php if($pinjam->no_hp_peminjam): ?>
                    <div style="font-size:.8rem;"><i class="bi bi-telephone me-1 text-muted"></i><?php echo $pinjam->no_hp_peminjam; ?></div>
                    <?php endif; ?>
                </div>
            </div>
        </div>

        <!-- Barang -->
        <div class="detail-card p-4">
            <h6 class="fw-bold mb-3" style="color:#374151;">📦 Barang</h6>
            <?php if($pinjam->foto_barang): ?>
            <img src="<?php echo base_url('uploads/inventaris/'.$pinjam->foto_barang); ?>"
                 class="w-100 rounded-3 mb-3" style="height:140px;object-fit:cover;" alt="">
            <?php endif; ?>
            <div class="fw-semibold"><?php echo htmlspecialchars($pinjam->nama_barang ?? 'Barang Dihapus'); ?></div>
            <div class="text-muted small mb-2">#<?php echo $pinjam->kode_barang; ?></div>
            <div class="text-muted small"><i class="bi bi-geo-alt me-1"></i><?php echo $pinjam->lokasi; ?></div>
            <a href="<?php echo base_url('inventaris/detail/'.$pinjam->inventaris_id); ?>"
               class="btn btn-sm btn-outline-secondary rounded-pill px-3 mt-3 w-100" style="font-size:.8rem;">
                <i class="bi bi-arrow-right me-1"></i>Lihat Detail Barang
            </a>
        </div>

        <!-- Admin actions -->
        <?php if($is_admin): ?>
        <div class="mt-3 d-flex gap-2">
            <?php if(!$sudah_kembali): ?>
            <a href="<?php echo base_url('peminjaman-inventaris/kembali/'.$pinjam->id); ?>"
               class="btn btn-success rounded-pill flex-fill fw-semibold" style="font-size:.85rem;">
                <i class="bi bi-box-arrow-in-down me-1"></i>Proses Kembali
            </a>
            <?php endif; ?>
            <button type="button" class="btn btn-outline-danger rounded-pill px-3" style="font-size:.85rem;"
                    onclick="confirmDelete(<?php echo $pinjam->id; ?>)" title="Hapus">
                <i class="bi bi-trash"></i>
            </button>
        </div>
        <?php endif; ?>
    </div>

</div>

<!-- Delete Modal -->
<div class="modal fade" id="deleteModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered modal-sm">
        <div class="modal-content border-0 shadow" style="border-radius:14px;overflow:hidden;">
            <div class="modal-header border-0 pt-4 px-4">
                <div class="d-flex align-items-center gap-2">
                    <div class="rounded-circle d-flex align-items-center justify-content-center" style="width:36px;height:36px;background:#dc354520;">
                        <i class="bi bi-trash text-danger"></i>
                    </div>
                    <h6 class="mb-0 fw-bold">Hapus Data?</h6>
                </div>
            </div>
            <div class="modal-body px-4 py-2">
                <p class="text-muted small mb-1">Yakin ingin menghapus catatan peminjaman ini?</p>
                <p class="text-danger mb-0" style="font-size:.78em;"><i class="bi bi-info-circle me-1"></i>Data tidak dapat dikembalikan.</p>
            </div>
            <div class="modal-footer border-0 px-4 pb-4 gap-2">
                <button type="button" class="btn btn-sm btn-outline-secondary flex-fill fw-semibold" data-bs-dismiss="modal">Batal</button>
                <a href="#" id="btnConfirmDelete" class="btn btn-sm btn-danger flex-fill fw-semibold text-white">Ya, Hapus</a>
            </div>
        </div>
    </div>
</div>

<script>
function confirmDelete(id) {
    document.getElementById('btnConfirmDelete').href = '<?php echo base_url('peminjaman-inventaris/hapus/'); ?>' + id;
    new bootstrap.Modal(document.getElementById('deleteModal')).show();
}
</script>