import React from 'react';

interface ListProps {
  children: React.ReactNode;
  className?: string;
}

export const UL: React.FC<ListProps> = ({ children, className = '' }) => (
  <ul className={`list-disc list-inside text-slate-700 leading-relaxed mb-4 ml-4 ${className}`}>
    {children}
  </ul>
);

export const OL: React.FC<ListProps> = ({ children, className = '' }) => (
  <ol className={`list-decimal list-inside text-slate-700 leading-relaxed mb-4 ml-4 ${className}`}>
    {children}
  </ol>
);

export const LI: React.FC<ListProps> = ({ children, className = '' }) => (
  <li className={`mb-1 ${className}`}>
    {children}
  </li>
);