import { Component } from '@angular/core';
import { RouterLink } from '@angular/router';
import { TranslatePipe } from '@ngx-translate/core';

@Component({
  selector: 'app-not-found',
  standalone: true,
  imports: [RouterLink, TranslatePipe],
  template: `
    <div class="flex min-h-[60vh] flex-col items-center justify-center text-center">
      <p class="text-6xl font-black text-brand-600">404</p>
      <h1 class="mt-4 text-xl font-bold">{{ 'notFound.title' | translate }}</h1>
      <p class="mt-1 text-slate-500 dark:text-slate-400">{{ 'notFound.description' | translate }}</p>
      <a routerLink="/" class="btn-primary mt-6">{{ 'notFound.backToDashboard' | translate }}</a>
    </div>
  `,
})
export class NotFoundComponent {}
