'use client';

import type { RobotSpec } from '@/data/robots';

export function ProductSpecTable({ specs }: { specs: RobotSpec[] }) {
  return (
    <table style={{ width: '100%', borderCollapse: 'collapse', color: '#e7e7e7' }}>
      <tbody>
        {specs.map((s) => (
          <tr key={s.label} style={{ borderBottom: '1px solid rgba(94, 94, 94, 0.1)' }}>
            <td
              style={{
                padding: '0.65rem 0',
                fontSize: '0.74rem',
                letterSpacing: '0.14em',
                textTransform: 'uppercase',
                color: '#a8a8a8',
                width: '46%',
                verticalAlign: 'top',
              }}
            >
              {s.label}
            </td>
            <td style={{ padding: '0.65rem 0', color: '#fcfcfc', fontSize: '0.92rem' }}>{s.value}</td>
          </tr>
        ))}
      </tbody>
    </table>
  );
}