import type { CSSProperties, ReactNode } from 'react';

type CardProps = {
  children: ReactNode;
  /** Apply the scanline texture overlay (default true). */
  hoverScan?: boolean;
  style?: CSSProperties;
  className?: string;
};

/** Level-1 surface card (§5). bg-1 panel, border, scanline skin. */
export default function Card({ children, hoverScan = true, style = {}, className = '' }: CardProps) {
  return (
    <div
      className={(hoverScan ? 'scanlines ' : '') + className}
      style={{
        background: 'var(--bg-1)',
        border: '1px solid var(--border)',
        borderRadius: 10,
        position: 'relative',
        ...style,
      }}
    >
      {children}
    </div>
  );
}
