import type { Metadata } from 'next'
import { getTranslations } from 'next-intl/server'

export async function generateMetadata({ params }: { params: Promise<{ locale: string }> }): Promise<Metadata> {
  const { locale } = await params
  const t = await getTranslations({ locale, namespace: 'Legal' })
  return { title: t('refund.title') }
}

export default async function RefundPolicyPage() {
  const t = await getTranslations('Legal')
  return (
    <div className="main-page">
      <div className="middle-content">
        <div className="body-content">
          <div className="title-content">
            <h1>{t('refund.title')}</h1>
          </div>
          <div className="box-content">
            <div className="body-box-content justified">
              <p className="second-brown">{t('refund.h1')}</p>
              <p>{t('refund.p1')}</p>
              <br />
              <hr />
              <br />
              <p className="second-brown">{t('refund.h2')}</p>
              <p>{t('refund.p2')}</p>
              <p>{t('refund.p3')}</p>
              <p>{t('refund.p4')}</p>
              <p>{t('refund.p5')}</p>
              <br />
              <hr />
              <br />
              <p className="second-brown">{t('refund.h3')}</p>
              <p>{t('refund.p6')}</p>
              <p>{t('refund.p7')}</p>
              <p>{t.rich('refund.p8', { link: (c) => <a href="mailto:consultas@nightspire.gg">{c}</a> })}</p>
              <br />
              <hr />
              <br />
              <p className="second-brown">{t('refund.h4')}</p>
              <p>{t('refund.p9')}</p>
              <p>{t('refund.p10')}</p>
              <p>{t('refund.p11')}</p>
              <p>{t('refund.p12')}</p>
              <br />
              <p>{t('refund.p13')}</p>
              <p>{t('refund.p14')}</p>
              <p>{t('refund.p15')}</p>
              <p>{t('refund.p16')}</p>
              <p>{t('refund.p17')}</p>
              <p>{t('refund.p18')}</p>
              <br />
              <p className="second-brown">{t('refund.h5')}</p>
              <p>{t('refund.p19')}</p>
              <br />
              <p>{t('refund.p20')}</p>
              <p>{t('refund.p21')}</p>
              <p>{t('refund.p22')}</p>
              <p>{t('refund.p23')}</p>
              <p>{t('refund.p24')}</p>
              <br />
              <hr />
              <br />
              <p className="second-brown">{t('refund.h6')}</p>
              <p>{t('refund.p25')}</p>
              <br />
              <hr />
              <br />
              <p className="second-brown">{t('refund.h7')}</p>
              <p>{t('refund.p26')}</p>
              <p>{t('refund.p27')}</p>
              <p>{t('refund.p28')}</p>
              <br />
              <hr />
              <br />
              <p className="second-brown">{t('refund.h8')}</p>
              <p>{t('refund.p29')}</p>
              <br />
              <hr />
              <br />
              <p className="second-brown">{t('refund.h9')}</p>
              <p>{t('refund.p30')}</p>
              <br />
              <hr />
              <br />
              <p className="second-brown">{t('refund.h10')}</p>
              <p>{t('refund.p31')}</p>
              <p>{t('refund.p32')}</p>
              <p>{t('refund.p33')}</p>
              <br />
              <hr />
              <br />
              <p className="second-brown">{t('refund.h11')}</p>
              <p>{t('refund.p34')}</p>
              <br />
              <hr />
              <br />
              <p className="second-brown">{t('refund.h12')}</p>
              <p>{t('refund.p35')}</p>
              <p>NightSpire</p>
              <p>www.nightspire.gg</p>
              <p>consultas@nightspire.gg</p>
              <br />
              <p className="grey-info2">{t('refund.updated')}</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  )
}
