<?php
http_response_code(403);
require_once __DIR__ . '/website/config.php';
session_start();
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>403 - Access Forbidden | JUSTSALE</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
    <style>
        :root { --primary: #4f46e5; --dark: #0f172a; --slate: #64748b; --light: #f8fafc; }
        body { font-family: 'Inter', sans-serif; background-color: var(--light); color: var(--dark); min-height: 100vh; display: flex; align-items: center; justify-content: center; }
        .error-card { background: white; border-radius: 40px; padding: 60px; box-shadow: 0 40px 100px rgba(0,0,0,0.05); text-align: center; max-width: 600px; border: 1px solid rgba(0,0,0,0.02); }
        .error-code { font-family: 'Outfit', sans-serif; font-weight: 900; font-size: 8rem; line-height: 1; background: linear-gradient(135deg, #ef4444, #dc2626); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 20px; }
        .lock-icon { font-size: 3rem; color: #ef4444; margin-bottom: 1rem; opacity: 0.8; }
        h1 { font-family: 'Outfit', sans-serif; font-weight: 800; margin-bottom: 20px; color: var(--dark); }
        p { color: var(--slate); font-size: 1.1rem; margin-bottom: 40px; }
        .btn-home { background: var(--primary); color: white; padding: 18px 40px; border-radius: 20px; font-weight: 700; transition: all 0.3s; text-decoration: none; display: inline-block; box-shadow: 0 20px 40px rgba(79, 70, 229, 0.2); margin: 0 6px; }
        .btn-home:hover { transform: translateY(-3px); box-shadow: 0 25px 50px rgba(79, 70, 229, 0.3); color: white; }
        .btn-back { background: transparent; color: var(--slate); padding: 18px 40px; border-radius: 20px; font-weight: 700; transition: all 0.3s; text-decoration: none; display: inline-block; border: 2px solid #e2e8f0; margin: 0 6px; }
        .btn-back:hover { background: #f1f5f9; color: var(--dark); transform: translateY(-3px); }
    </style>
</head>
<body>
    <div class="error-card shadow-2xl">
        <div class="lock-icon"><i class="fa-solid fa-lock"></i></div>
        <div class="error-code">403</div>
        <h1>Access Denied</h1>
        <p>You don't have permission to view this page. If you believe this is a mistake, please contact your system administrator.</p>
        <a href="javascript:history.back()" class="btn-back"><i class="fa-solid fa-arrow-left me-2"></i>Go Back</a>
        <a href="<?= BASE_URL ?>" class="btn-home"><i class="fa-solid fa-house me-2"></i>Return Home</a>
    </div>
</body>
</html>
