<!DOCTYPE html>
<html lang="id">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>SMKN 7 Palembang</title>

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">

    <style>
        :root{
            --navy-950:#050B1A;
            --navy-900:#0A1730;
            --navy-800:#0F2247;
            --navy-700:#15316B;
            --navy-600:#1D4090;
            --accent:#3D6FE0;
            --accent-light:#6E93F2;
            --gold:#E3B341;
            --ink:#0A1730;
            --muted:#5C6B8A;
            --line:#E1E7F5;
            --paper:#F7F9FE;
            --font-display:'Plus Jakarta Sans',sans-serif;
            --font-body:'Inter',sans-serif;
        }

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: var(--font-body);
        }

        body {
            background: var(--paper);
            min-height: 100vh;
            color: var(--ink);
        }


        /* NAVBAR */
        nav {
            position: relative;
            background:
                radial-gradient(500px 260px at 95% 0%, rgba(110,147,242,.24), transparent 60%),
                linear-gradient(150deg,var(--navy-950) 0%,var(--navy-900) 45%,var(--navy-700) 100%);
            padding: 20px 60px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            box-shadow: 0 12px 30px rgba(5,11,26,.18);
            overflow: hidden;
        }

        nav::before{
            content:"";
            position:absolute;
            inset:0;
            background-image:
                linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
            background-size:32px 32px;
            mask-image:radial-gradient(circle at 15% 30%, black, transparent 70%);
            pointer-events:none;
        }

        nav > *{ position:relative; z-index:1; }

        .logo {
            color: white;
            font-family: var(--font-display);
            font-size: 22px;
            font-weight: 800;
            letter-spacing: -.01em;
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .logo img{
            width: 38px;
            height: 38px;
            border-radius: 11px;
            background: #fff;
            object-fit: contain;
            padding: 5px;
            box-shadow: 0 8px 18px rgba(0,0,0,.25);
            flex-shrink: 0;
        }

        .menu {
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .menu a {
            color: rgba(255,255,255,.82);
            text-decoration: none;
            font-size: 14px;
            font-weight: 600;
            padding: 10px 18px;
            border-radius: 10px;
            transition: .2s;
        }

        .menu a:hover {
            opacity: 1;
            background: rgba(255,255,255,.08);
            color: #fff;
        }

        .menu a[href="/login"]{
            background: linear-gradient(135deg, var(--accent) 0%, var(--navy-600) 100%);
            color: #fff;
            box-shadow: 0 10px 22px rgba(29,64,144,.3);
            margin-left: 6px;
        }

        .menu a[href="/login"]:hover{
            transform: translateY(-2px);
            box-shadow: 0 14px 28px rgba(29,64,144,.4);
        }

        .menu .logout-link {
            color: rgba(255,255,255,.82);
            background: rgba(255,255,255,.06);
            border: 1px solid rgba(255,255,255,.14);
            padding: 10px 20px;
            border-radius: 10px;
            font-weight: 600;
            font-size: 14px;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            gap: 8px;
            cursor: pointer;
            transition: .2s;
        }

        .logout-link:hover {
            background: rgba(255,255,255,.12);
            color: #fff;
        }

        /* ISI HALAMAN */
        .content {
            padding: 0;
            min-height: calc(100vh - 148px);
        }


        /* FOOTER */
        footer {
            background: var(--navy-950);
            color: rgba(255,255,255,.55);
            text-align: center;
            padding: 22px;
            font-size: 12.5px;
            border-top: 1px solid rgba(255,255,255,.08);
        }

        footer p{
            font-family: var(--font-body);
        }

    </style>

</head>


<body>


    <!-- NAVBAR -->
    <nav>

        <div class="logo">
            <img src="<?php echo e(asset('images/logo-smkn7.png')); ?>" alt="Logo SMKN 7 Palembang">
            SMKN 7 Palembang
        </div>


        <div class="menu">
            <?php if(request()->is('dashboard')): ?>
                <form action="<?php echo e(route('logout')); ?>" method="POST" style="display:inline;">
                    <?php echo csrf_field(); ?>
                    <button type="submit" class="logout-link">Logout</button>
                </form>
            <?php elseif(!request()->is('login')): ?>
                <a href="/">Beranda</a>
                <a href="/#tentang">Tentang</a>
                <a href="/#kontak">Kontak</a>
                <a href="/login">Login</a>
            <?php endif; ?>
        </div>

    </nav>



    <!-- TEMPAT ISI HALAMAN -->
    <div class="content">

        <?php echo $__env->yieldContent('content'); ?>

    </div>



    <!-- FOOTER -->
    <footer>

        <p>
            © <?php echo e(date('Y')); ?> SMKN 7 Palembang
        </p>

    </footer>


</body>

</html><?php /**PATH C:\Tamu_Track\resources\views/layouts/app.blade.php ENDPATH**/ ?>