import React from 'react';

const ApplyMaintProgram = () => {
    return (
        <div className="widget-container">
            <div className="widget-header">
                <h3>Apply Maintenance Program</h3>
            </div>
            <div className="widget-content">
                <div style={{ background: 'var(--bg-secondary)', padding: '2rem', borderRadius: '8px', maxWidth: '600px', margin: '0 auto' }}>
                    <h4>Assign Program to Aircraft</h4>
                    <div style={{ marginTop: '1rem', display: 'flex', flexDirection: 'column', gap: '1rem' }}>
                        <select style={{ padding: '0.75rem', borderRadius: '4px', background: 'var(--bg-primary)', color: 'var(--text-primary)', border: '1px solid var(--border-color)' }}>
                            <option>Select Program Template...</option>
                            <option>MP-AW139-01 (Commercial)</option>
                        </select>
                        <select style={{ padding: '0.75rem', borderRadius: '4px', background: 'var(--bg-primary)', color: 'var(--text-primary)', border: '1px solid var(--border-color)' }}>
                            <option>Select Target Aircraft...</option>
                            <option>9M-WSA</option>
                            <option>9M-WSB</option>
                        </select>
                        <button className="btn-primary">Apply Program Details</button>
                    </div>
                </div>
            </div>
        </div>
    );
};

export default ApplyMaintProgram;
