import { Link } from 'react-router-dom';

function PageLayout({ title, children, wide = false, className = '' }) {
  const widthClass = wide ? 'max-w-3xl' : 'max-w-2xl';

  return (
    <div className={`min-h-screen bg-slate-900 text-slate-100 print:bg-white print:text-black ${className}`}>
      <div className={`${widthClass} mx-auto px-4 py-8 print:max-w-none`}>
        <div className="print:hidden">
          <Link to="/dashboard" className="lms-btn-secondary mb-6 inline-block text-sm">
            ← Dashboard
          </Link>
          {title && <h1 className="mb-6 text-2xl font-semibold text-white print:text-black">{title}</h1>}
        </div>
        {children}
      </div>
    </div>
  );
}

export default PageLayout;
