<?= $this->extend('layout/default') ?>

<?= $this->section('content') ?>
<div class="breadcrumb-area pt-60 pb-60 bg-gray">
    <div class="container text-center">
        <h2 class="fw-bold">Struktur Organisasi</h2>
        <p>SMKN 1 Sukalarang (Negla)</p>
    </div>
</div>

<div class="struktur-area pt-80 pb-80 text-center">
    <div class="container">

        <?php if (session()->get('isLoggedIn')) : ?>
            <div class="row justify-content-center mb-5">
                <div class="col-md-8">
                    <div class="alert alert-warning d-flex justify-content-between align-items-center shadow-sm border-0">
                        <span class="text-dark"><i class="fa fa-user-shield me-2"></i> Mode Administrator: Anda dapat mengelola data struktur langsung.</span>
                        <a href="<?= base_url('admin/struktur') ?>" class="btn btn-dark btn-sm rounded-pill px-3">
    <i class="fa fa-cog me-1"></i> Kelola Struktur
</a>
                    </div>
                </div>
            </div>
        <?php endif; ?>
        
        <?php foreach ($pimpinan as $p) : if ($p['level'] == '1') : ?>
            <div class="row justify-content-center mb-5">
                <div class="col-md-5">
                    <div class="card shadow border-0 p-4 rounded-4 border-top border-success border-5">
                        <img src="<?= base_url('assets/img/team/' . $p['foto']) ?>" class="rounded-circle mx-auto mb-3 shadow" width="160" height="160" style="object-fit:cover; border: 4px solid #fff;">
                        <h4 class="fw-bold mb-1"><?= $p['nama'] ?></h4>
                        <span class="badge bg-success p-2"><?= $p['jabatan'] ?></span>
                    </div>
                </div>
            </div>
        <?php endif; endforeach; ?>

        <div class="row justify-content-center mb-5">
            <?php foreach ($pimpinan as $p2) : if ($p2['level'] == '2') : ?>
                <div class="col-md-4 mb-4">
                    <div class="card shadow-sm border-0 p-3 bg-light rounded-4">
                        <img src="<?= base_url('assets/img/team/' . $p2['foto']) ?>" class="rounded-circle mx-auto mb-2 shadow-sm" width="100" height="100" style="object-fit:cover">
                        <h6 class="fw-bold mb-1"><?= $p2['nama'] ?></h6>
                        <small class="text-muted"><?= $p2['jabatan'] ?></small>
                    </div>
                </div>
            <?php endif; endforeach; ?>
        </div>

        <hr class="my-5 opacity-25">

        <div class="row justify-content-center">
            <?php foreach ($pimpinan as $waka) : if ($waka['level'] == '3') : ?>
                <div class="col-lg-3 col-md-6 mb-4">
                    <div class="card shadow-sm border-0 p-3 h-100 rounded-4">
                        <img src="<?= base_url('assets/img/team/' . $waka['foto']) ?>" class="rounded-circle mx-auto mb-2 shadow-sm" width="90" height="90" style="object-fit:cover">
                        <h6 class="fw-bold mb-1" style="font-size: 14px;"><?= $waka['nama'] ?></h6>
                        <small class="text-success fw-bold d-block mb-3"><?= $waka['jabatan'] ?></small>

                        <div class="border-top mt-2 pt-3 text-start">
                            <p class="text-muted mb-2" style="font-size: 10px; font-weight: bold; letter-spacing: 1px;">STAF BIDANG:</p>
                            <?php foreach ($pimpinan as $staf) : 
                                if ($staf['level'] == '4' && $staf['parent_id'] == $waka['id_struktur']) : ?>
                                <div class="d-flex align-items-center mb-3 bg-light p-2 rounded-3">
                                    <img src="<?= base_url('assets/img/team/' . $staf['foto']) ?>" class="rounded-circle me-2 shadow-sm" width="45" height="45" style="object-fit:cover">
                                    <div style="line-height: 1.2;">
                                        <div class="fw-bold text-dark" style="font-size: 11px;"><?= $staf['nama'] ?></div>
                                        <small class="text-muted" style="font-size: 9px;"><?= $staf['jabatan'] ?></small>
                                    </div>
                                </div>
                            <?php endif; endforeach; ?>
                        </div>
                    </div>
                </div>
            <?php endif; endforeach; ?>
        </div>
    </div>
</div>

<style>
    .bg-gray { background-color: #f8f9fa; }
    .rounded-4 { border-radius: 1.2rem !important; }
    .card { transition: transform 0.3s ease, box-shadow 0.3s ease; }
    .card:hover { transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0,0,0,0.1) !important; }
    .badge { font-weight: 500; text-transform: uppercase; letter-spacing: 0.5px; }
</style>
<?= $this->endSection() ?>