const SettingToggle = ({ label, description, checked, onChange, disabled = false }) => {
    return (
        <div className={`iron-security-setting-toggle ${disabled ? 'disabled' : ''}`}>
            <div className="setting-toggle-header">
                <span className="setting-label">{label}</span>
                <label className={`toggle-switch ${disabled ? 'disabled' : ''}`}>
                    <input 
                        type="checkbox"
                        checked={checked}
                        onChange={(e) => onChange(e.target.checked)}
                        disabled={disabled}
                    />
                    <span className="slider round"></span>
                </label>
            </div>
            <p className="setting-description">{description}</p>
        </div>
    );
};

export default SettingToggle;