<script setup>
const Refresh = () => {
  window.location.reload()
}
</script>

<template>
  <div class="bg-[#E7EAEE] h-100vh flex items-center justify-center">
    <div class="flex flex-col justify-center items-center">
      <img src="@/assets/images/sorry.png" alt="" />
      <h1 class="text-28px leading-40px mt-16px">Sorry!</h1>
      <div class="w-360px leading-20px text-13px mt-16px flex flex-col items-center">
        <p>You don't have any admin permission.</p>
        <p>Please change your account or contact your super admin.</p>
      </div>
      <div class="flex justify-between mt-16px text-14px">
        <button class="h-32px w-180px bg-[#fff] rounded-4px" @click="Refresh">Reload Page</button>
        <button type="button" class="h-32px w-180px ml-8px  rounded-4px bg-[#1460F3] text-[#fff]" @click="$router.push('/login')">Sign in with Another Account</button>
      </div>
    </div>
  </div>
</template>
