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

<?= $this->section('content') ?>
<div class="breadcrumb-area pt-100 pb-100" style="background-image: url(<?= base_url('assets/img/lsp/' . $lsp['gambar_konstruksi']) ?>); background-size: cover; background-position: center; position: relative;">
    <div style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6);"></div>
    <div class="container" style="position: relative; z-index: 2;">
        <div class="row text-center">
            <div class="col-12">
                <h1 class="text-white fw-bold mb-3"><?= $lsp['judul'] ?></h1>
                <h4 class="text-light"><?= $lsp['sub_judul'] ?></h4>
            </div>
        </div>
    </div>
</div>

<div class="lsp-content-area pt-80 pb-80">
    <div class="container">
        <?php if (session()->get('isLoggedIn')) : ?>
            <div class="text-end mb-4">
                <a href="<?= base_url('admin/lsp') ?>" class="btn btn-warning">
                    <i class="fa fa-edit"></i> Edit Konten LSP
                </a>
            </div>
        <?php endif; ?>

        <div class="row justify-content-center">
            <div class="col-lg-10 shadow-sm p-4 rounded-4 bg-white border">
                <div class="entry-content">
                    <?= $lsp['konten'] ?>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
    .entry-content {
        line-height: 1.8;
        font-size: 16px;
        color: #444;
    }
    .entry-content img {
        max-width: 100%;
        height: auto;
        border-radius: 10px;
        margin: 20px 0;
    }
</style>
<?= $this->endSection() ?>