<script setup>
import { useRouter } from "vue-router";
import { GnButton, GnStatusCard } from "gnexus-ui-kit/vue";
import { clearToken } from "../api.js";

const router = useRouter();

function backToLogin() {
  clearToken();
  router.push("/login");
}
</script>

<template>
  <div class="denied-page">
    <GnStatusCard
      variant="error"
      icon="ph-shield-warning"
      title="Доступ запрещён"
      text="Админ-панель Synapse доступна только пользователям gnexus-auth с ролью admin и выше."
    />
    <GnButton variant="secondary" icon="ph-arrow-left" @click="backToLogin">На страницу входа</GnButton>
  </div>
</template>

<style scoped>
.denied-page {
  min-height: 100vh;
  display: grid;
  place-content: center;
  gap: var(--gn-space-4);
  padding: var(--gn-space-4);
  max-width: 460px;
  margin-inline: auto;
}
</style>