export default function Loader({ message = 'Processing…', progress = null }) {
  return (
    <div className="loader-ov">
      <div className="loader-card">
        <div className="spinner" />
        <p style={{ fontSize: 11, color: 'var(--mt)', fontFamily: 'var(--fm)' }}>{message}</p>
        {progress !== null && (
          <div style={{ marginTop: 6 }}>
            <div style={{ display: 'flex', justifyContent: 'space-between', fontSize: 9.5, color: 'var(--mt)', fontFamily: 'var(--fm)' }}>
              <span>Reading…</span>
              <span style={{ color: 'var(--g)', fontWeight: 600 }}>{progress}%</span>
            </div>
            <div className="prog-bar"><div className="prog-fill" style={{ width: progress + '%' }} /></div>
          </div>
        )}
      </div>
    </div>
  );
}
