import React from 'react';

const LoginPage = () => {
  const handleLogin = () => {
    // TODO: Implement OIDC login logic here
    console.log('OIDC Login functionality to be implemented...');
  };

  return (
    <div className="flex flex-col items-center justify-center h-full min-h-screen bg-gray-100 dark:bg-gray-900 text-gray-900 dark:text-gray-100">
      <div className="bg-white dark:bg-gray-800 p-8 rounded-lg shadow-xl text-center max-w-sm w-full">
        <h2 className="text-3xl font-bold mb-4">Login</h2>
        <p className="mb-6 text-gray-600 dark:text-gray-400">
          Click the button below to log in using OpenID Connect (OIDC).
        </p>
        <button
          onClick={handleLogin}
          className="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-4 rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
        >
          Login with OIDC
        </button>
      </div>
    </div>
  );
};

export default LoginPage;