1

src/features/shared/components/MethodUnavailableNotice.vue

@@ -0,0 +1,24 @@
+<script setup lang="ts">
+import { useI18n } from 'vue-i18n'
+const { t } = useI18n()
+const props = withDefaults(
+  defineProps<{
+    title?: string
+    message: string
+  }>(),
+  {
+    title: undefined
+  }
+)
+</script>
+
+<template>
+  <div
+    class="flex h-full min-h-0 w-full flex-1 items-center justify-center bg-[radial-gradient(circle_at_top,_rgba(220,38,38,0.18),rgba(0,0,0,0.03)_46%,transparent_72%)] p-6"
+  >
+    <div class="w-full max-w-xl rounded-2xl border border-red-300/85 bg-white/90 px-8 py-10 text-center shadow-[0_18px_38px_-22px_rgba(153,27,27,0.6)] backdrop-blur">
+      <p class="text-lg font-semibold tracking-wide text-neutral-900">{{ props.title || t('methodUnavailable.defaultTitle') }}</p>
+      <p class="mt-2 text-sm leading-6 text-red-700">{{ props.message }}</p>
+    </div>
+  </div>
+</template>