<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="<?php echo $__env->yieldContent('meta_description', $siteName . ' - Digital Newspaper'); ?>">
    <meta property="og:title" content="<?php echo $__env->yieldContent('title', $siteName); ?>">
    <title><?php echo $__env->yieldContent('title', $siteName); ?> | E-Paper</title>
    <link rel="canonical" href="<?php echo e(url()->current()); ?>">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700;900&family=Source+Serif+4:wght@300;400;600&family=Inter:wght@300;400;500&display=swap" rel="stylesheet">
    <style>
        :root {
            --paper-cream: #fdf8f0;
            --ink-black:   #1a1a1a;
            --ink-dark:    #2c2c2c;
            --accent-red:  #c0392b;
            --sidebar-width: 210px;
            --container-max: 1100px;
            /* measured heights for calc */
            --h-header: 113px;
            --h-nav:    36px;
            --h-footer: 36px;
        }

        * { box-sizing: border-box; }

        /* page body */
        html, body {
            margin: 0; padding: 0;
            background: #3a3a3a;
            font-family: 'Source Serif 4', Georgia, serif;
            color: var(--ink-dark);
        }

        /* ── Central container ─────────────────────────── */
        .site-container {
            max-width: var(--container-max);
            margin: 0 auto;
            min-height: 100vh;
            background: var(--paper-cream);
            box-shadow: 0 0 40px rgba(0,0,0,.55);
            display: flex;
            flex-direction: column;
        }

        /* ── Header ─────────────────────────────────────── */
        .masthead {
            background: #fff;
            border-bottom: 2px solid var(--ink-black);
            flex-shrink: 0;
            height: var(--h-header);
            display: flex;
            align-items: stretch;
        }
        .masthead-inner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            width: 100%;
            height: 100%;
            padding: 0 18px;
            gap: 16px;
        }
        /* LEFT — logo */
        .masthead-logo {
            display: flex;
            align-items: center;
            flex-shrink: 0;
        }
        .masthead-logo img {
            height: 95px;
            object-fit: contain;
            display: block;
        }
        .site-name {
            font-family: 'Playfair Display', serif;
            font-size: 1.45rem;
            font-weight: 900;
            letter-spacing: -.5px;
            color: var(--ink-black);
            text-decoration: none;
            line-height: 1;
            white-space: nowrap;
        }
        /* RIGHT — header ad */
        .masthead-ad {
            display: flex;
            align-items: center;
            justify-content: flex-end;
            flex: 1;
            overflow: hidden;
        }
        .masthead-ad img {
            width: 666px;
            height: 96px;
            object-fit: fill;
            display: block;
        }
        .masthead-ad-placeholder {
            width: 666px;
            height: 96px;
            font-family: 'Inter', sans-serif;
            font-size: .7rem;
            color: #bbb;
            border: 1px dashed #ddd;
            border-radius: 4px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* banner (if set) sits above the masthead row — inside site-container */
        .site-banner {
            width: 100%;
            max-height: 70px;
            overflow: hidden;
            flex-shrink: 0;
        }
        .site-banner img { width: 100%; object-fit: cover; max-height: 70px; display: block; }

        /* ── Navbar (compact) ──────────────────────────── */
        .nav-section {
            background: var(--ink-black);
            flex-shrink: 0;
            height: var(--h-nav);
            min-height: var(--h-nav);
        }
        .nav-section .navbar {
            padding-top: 0; padding-bottom: 0;
            height: 100%;
            min-height: var(--h-nav);
        }
        .nav-section .nav-link {
            color: #e8e0d0 !important;
            font-family: 'Inter', sans-serif;
            font-size: .75rem;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: .5px;
            padding: 0 14px !important;
            height: var(--h-nav);
            line-height: var(--h-nav);
            border-right: 1px solid #333;
            transition: background .15s;
        }
        .nav-section .nav-link:hover,
        .nav-section .nav-link.active { background: var(--accent-red); color: #fff !important; }
        .nav-section .navbar-toggler { border-color: #555; padding: 2px 6px; }
        .nav-section .navbar-toggler-icon { filter: invert(1); width: 16px; height: 16px; }

        /* ── Main layout area ──────────────────────────── */
        .site-layout {
            display: flex;
            flex: 1;
        }
        .main-content {
            flex: 1;
            min-width: 0;
            padding: 18px;
        }

        /* ── Sidebar items ─────────────────────────────── */
        .sidebar-heading {
            font-family: 'Inter', sans-serif;
            font-size: .65rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            color: #888;
            padding: 10px 12px 5px;
            border-bottom: 1px solid #eee;
        }
        .page-thumb-item {
            display: block; padding: 8px 10px;
            border-bottom: 1px solid #f0ebe0;
            text-decoration: none; color: inherit;
            transition: background .15s;
        }
        .page-thumb-item:hover, .page-thumb-item.active { background: #fdf0e0; }
        .page-thumb-item img { width: 100%; aspect-ratio: 3/4; object-fit: cover; border: 1px solid #ddd; display: block; }
        .page-thumb-label { font-family: 'Inter', sans-serif; font-size: .65rem; font-weight: 600; text-align: center; color: #555; margin-top: 3px; text-transform: uppercase; letter-spacing: .5px; }

        /* ── Footer (centered, single column) ─────────── */
        .site-footer {
            background: var(--ink-black);
            color: #aaa;
            font-family: 'Inter', sans-serif;
            font-size: .7rem;
            padding: 10px 16px;
            border-top: 2px solid var(--accent-red);
            flex-shrink: 0;
            text-align: center;
        }
        .site-footer .footer-inner {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4px;
        }
        .site-footer a { color: #888; text-decoration: none; }
        .site-footer a:hover { color: #fff; }
        .footer-info { display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap; }
        .footer-info span { white-space: nowrap; }
        .footer-copy { color: #555; }

        /* ── Cards ─────────────────────────────────────── */
        .edition-card { border: 1px solid #ddd; border-radius: 4px; overflow: hidden; background: #fff; transition: box-shadow .2s, transform .15s; cursor: pointer; text-decoration: none; color: inherit; display: block; }
        .edition-card:hover { box-shadow: 0 4px 16px rgba(0,0,0,.12); transform: translateY(-2px); }
        .edition-card img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
        .edition-card-body { padding: 8px 10px; border-top: 1px solid #eee; }
        .edition-date-label { font-size: .75rem; font-weight: 700; font-family: 'Inter', sans-serif; color: var(--accent-red); }

        @media (max-width: 767px) {
            .sidebar-left { display: none; }
            .site-name { font-size: 1.1rem; }
            .footer-info { display: none; }
        }
    </style>
    <?php echo $__env->yieldPushContent('styles'); ?>
</head>
<body>

<div class="site-container">

    
    <?php if($headerBanner): ?>
        <div class="site-banner">
            <img src="<?php echo e(asset('storage/'.$headerBanner)); ?>" alt="Banner">
        </div>
    <?php endif; ?>

    
    <header class="masthead">
        <div class="masthead-inner">

            
            <div class="masthead-logo">
                <?php if($siteLogo): ?>
                    <a href="<?php echo e(route('home')); ?>">
                        <img src="<?php echo e(asset('storage/'.$siteLogo)); ?>" alt="<?php echo e($siteName); ?>">
                    </a>
                <?php else: ?>
                    <a href="<?php echo e(route('home')); ?>" class="site-name"><?php echo e($siteName); ?></a>
                <?php endif; ?>
            </div>

            
            <div class="masthead-ad">
                <?php if($headerAd): ?>
                    <?php echo $headerAd; ?>

                <?php else: ?>
                    <span class="masthead-ad-placeholder"><i class="bi bi-image me-1"></i>Header Ad</span>
                <?php endif; ?>
            </div>

        </div>
    </header>

    
    <nav class="nav-section">
        <div class="navbar px-0" style="height:100%;position:relative">
            <div class="navbar-collapse justify-content-center" id="mainNav"
                 style="height:100%;display:flex!important">
                <?php $__env->startSection('navbar-links'); ?>
                
                <ul class="navbar-nav" style="height:100%;flex-direction:row">
                    <?php $__currentLoopData = $menuItems; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $menuItem): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                    <li class="nav-item">
                        <a class="nav-link <?php echo e(request()->url() === url($menuItem->url) ? 'active' : ''); ?>"
                           href="<?php echo e(url($menuItem->url)); ?>"
                           target="<?php echo e($menuItem->target); ?>">
                            <?php echo e($menuItem->label); ?>

                        </a>
                    </li>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                    <?php if(auth()->guard()->check()): ?>
                        <?php if(auth()->user()->isAdmin()): ?>
                            <li class="nav-item">
                                <a class="nav-link" href="<?php echo e(route('admin.dashboard')); ?>">
                                    <i class="bi bi-gear me-1"></i>Admin
                                </a>
                            </li>
                        <?php endif; ?>
                        <li class="nav-item">
                            <a class="nav-link"
                               href="<?php echo e(route('logout')); ?>"
                               onclick="event.preventDefault();document.getElementById('lf').submit()">
                                <i class="bi bi-box-arrow-right me-1"></i>Logout
                            </a>
                            <form id="lf" action="<?php echo e(route('logout')); ?>" method="POST" class="d-none"><?php echo csrf_field(); ?></form>
                        </li>
                    <?php endif; ?>
                </ul>
                <?php echo $__env->yieldSection(); ?>
            </div>
        </div>
    </nav>

    
    <div class="site-layout">
        <?php if (! empty(trim($__env->yieldContent('sidebar')))): ?>
            <aside class="sidebar-left"><?php echo $__env->yieldContent('sidebar'); ?></aside>
        <?php endif; ?>
        <main class="main-content"><?php echo $__env->yieldContent('content'); ?></main>
    </div>

    
    <footer class="site-footer">
        <div class="footer-inner">
            <div class="footer-info">
                <?php if($footerEditor): ?>
                    <span><i class="bi bi-person-fill me-1"></i><?php echo e($footerEditor); ?></span>
                <?php endif; ?>
                <?php if($footerPhone): ?>
                    <span><i class="bi bi-telephone-fill me-1"></i><?php echo e($footerPhone); ?></span>
                <?php endif; ?>
                <?php if($footerAddress): ?>
                    <span><i class="bi bi-geo-alt-fill me-1"></i><?php echo e($footerAddress); ?></span>
                <?php endif; ?>
            </div>
            <div class="footer-copy">
                &copy; <?php echo e(date('Y')); ?> <?php echo e($siteName); ?>

                &nbsp;&middot;&nbsp;
                <a href="<?php echo e(route('sitemap')); ?>">Sitemap</a>
            </div>
        </div>
    </footer>

</div><!-- /.site-container -->

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<?php echo $__env->yieldPushContent('scripts'); ?>
</body>
</html>
<?php /**PATH /home/boguraj1/public_html/epaper/resources/views/layouts/app.blade.php ENDPATH**/ ?>