<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
    <meta name="theme-color" content="#102542">
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
    <meta name="apple-mobile-web-app-title" content="Just Exam League">
    <title>{{ $pagedetails->pagename }} | Just Exam League</title>
    <meta name="description" content="{{ \Illuminate\Support\Str::limit(strip_tags((string) $pagedetails->pagecontent), 150) }}">

    <link rel="icon" href="{{ asset('public/frontend/images/logo.png') }}">
    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('public/frontend/images/apple-touch-icon.png') }}">
    <link rel="manifest" href="{{ asset('public/site.webmanifest') }}">
    <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=Outfit:wght@400;500;600;700;800&family=Manrope:wght@400;500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="{{ asset('public/frontend/css/portal.css') }}">
    <style>
        body {
            margin: 0;
            background:
                radial-gradient(circle at top right, rgba(10, 163, 149, 0.14), transparent 30%),
                linear-gradient(180deg, #f5fbfd 0%, #ecf4f8 100%);
            font-family: "Manrope", sans-serif;
            color: #12263f;
        }

        .jel-public-shell {
            width: min(1120px, calc(100% - 32px));
            margin: 0 auto;
            padding: 28px 0 48px;
        }

        .jel-public-header {
            display: flex;
            flex-wrap: wrap;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            margin-bottom: 26px;
        }

        .jel-public-brand {
            display: inline-flex;
            align-items: center;
            gap: 14px;
            color: #12263f;
            text-decoration: none;
            font-family: "Outfit", sans-serif;
            font-weight: 800;
        }

        .jel-public-brand img {
            width: 54px;
            height: 54px;
            border-radius: 18px;
        }

        .jel-public-actions {
            display: flex;
            flex-wrap: wrap;
            gap: 12px;
        }

        .jel-public-actions a {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            min-height: 46px;
            padding: 0 18px;
            border-radius: 999px;
            text-decoration: none;
            font-weight: 700;
        }

        .jel-public-link-primary {
            background: linear-gradient(135deg, #0aa395 0%, #1ec5b5 100%);
            color: #fff;
            box-shadow: 0 18px 32px rgba(10, 163, 149, 0.22);
        }

        .jel-public-link-muted {
            background: rgba(255, 255, 255, 0.88);
            color: #21374f;
            border: 1px solid rgba(18, 38, 63, 0.08);
        }
    </style>
</head>
<body>
    <div class="jel-public-shell">
        <header class="jel-public-header">
            <a class="jel-public-brand" href="{{ route('welcome') }}">
                <img src="{{ asset('public/frontend/images/logo.png') }}" alt="Just Exam League">
                <span>Just Exam League</span>
            </a>

            <div class="jel-public-actions">
                <a class="jel-public-link-muted" href="{{ route('welcome') }}">Back to Home</a>
                <a class="jel-public-link-primary" href="{{ route('student.entry') }}">Student Login</a>
            </div>
        </header>

        <div class="jel-portal-page">
            <section class="jel-static-page">
                <div class="jel-history-intro">
                    <span class="jel-portal-kicker">Information Page</span>
                    <h1>{{ $pagedetails->pagename }}</h1>
                    <p>Portal ke important rules, details aur policy content yahan publicly available hain.</p>
                </div>

                <section class="jel-table-card">
                    <div class="jel-static-content">
                        {!! $pagedetails->pagecontent !!}
                    </div>
                </section>
            </section>
        </div>
    </div>

    @include('include.pwa-register')
</body>
</html>
