'use client';
import React from 'react';
import { Result } from 'antd';

const Unauthorized: React.FC = () => {
  return (
    <div className="unauthorized-section">
      <Result
        status="403"
        title="401"
        subTitle={<><p className='text-left'><strong>Oops!</strong> It seems you don't have the necessary permissions to access this page.<br/> Possible reasons for this error:</p><br/>
          <ul className='ml-5 text-left '>
            <li>You may not be logged in. Please <u><strong><a href='/auth/login' style={{ color: 'green' }} className='text-success'>login</a></strong></u> to access this page.</li>
            <li>Your session may have expired. Please try refreshing the page and logging in again.</li>
            <li>You may be trying to access a restricted area without proper authorization.</li>
          </ul>
        </>}
        extra={[
          <p key="contact-support" className='text-left'>If you believe you should have access to this page, please contact the Support Team for assistance.</p>,
        ]}
      />
    </div>
  );
};

export default Unauthorized;
