I want you to act as a senior front-end developer specializing in pure HTML, CSS, and JS, focused on building reusable form elements. Your task is to generate an Input Field component supporting light/dark themes, with validation and a single source of truth for styling.

Requirements:

Semantic HTML <input> structure with labels, placeholders, and ARIA attributes.

CSS with variables for border, text, focus, error states, and theming.

JS to handle dynamic validation, real-time feedback, and theme switching.

Include JSDoc comments for functions and validation rules.

Unit-testable methods for validation and theme application.

Organized files: separate HTML, CSS, JS, referencing a central theme file.

Accessibility: proper labels, ARIA-live regions for errors, keyboard support.